am dumb
This commit is contained in:
@ -18,9 +18,8 @@ export const columns: ColumnDef<chunithm>[] = [
|
|||||||
header: "Title",
|
header: "Title",
|
||||||
|
|
||||||
cell: ({ row }) => {
|
cell: ({ row }) => {
|
||||||
const jacketPath = row.original.jacketPath?.replace(".dds", ".png");
|
|
||||||
const [isLoading, setIsLoading] = useState(true);
|
const [isLoading, setIsLoading] = useState(true);
|
||||||
|
const jacketPath = row.original.jacketPath?.replace(".dds", ".png");
|
||||||
const handleImageLoad = () => {
|
const handleImageLoad = () => {
|
||||||
setIsLoading(false);
|
setIsLoading(false);
|
||||||
};
|
};
|
||||||
@ -30,10 +29,9 @@ export const columns: ColumnDef<chunithm>[] = [
|
|||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<div className="flex w-[300px] items-center truncate font-medium">
|
<div className="flex w-[300px] items-center truncate font-medium">
|
||||||
{jacketPath && (
|
{jacketPath ? (
|
||||||
<>
|
|
||||||
<img
|
<img
|
||||||
src={`/jacketArts/${jacketPath}`}
|
src={`/JacketArts/${jacketPath}`}
|
||||||
alt="Jacket"
|
alt="Jacket"
|
||||||
className={`mr-2 inline-block h-[70px] w-[70px] ${
|
className={`mr-2 inline-block h-[70px] w-[70px] ${
|
||||||
isLoading ? "hidden" : ""
|
isLoading ? "hidden" : ""
|
||||||
@ -41,13 +39,8 @@ export const columns: ColumnDef<chunithm>[] = [
|
|||||||
onLoad={handleImageLoad}
|
onLoad={handleImageLoad}
|
||||||
onError={handleImageError}
|
onError={handleImageError}
|
||||||
/>
|
/>
|
||||||
{isLoading && (
|
) : (
|
||||||
<Skeleton className="mr-2 inline-block h-[70px] w-[70px]" />
|
<Skeleton className="mr-2 inline-block h-8 w-8" />
|
||||||
)}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{!jacketPath && (
|
|
||||||
<Skeleton className="mr-2 inline-block h-[70px] w-[70px]" />
|
|
||||||
)}
|
)}
|
||||||
<span className="truncate">{row.original.title}</span>
|
<span className="truncate">{row.original.title}</span>
|
||||||
</div>
|
</div>
|
||||||
|
@ -47,24 +47,14 @@ export const ChunithmHotPlays: FC<ChunithmProfileHotPlays> = ({
|
|||||||
return (
|
return (
|
||||||
<div key={index} className="flex flex-col items-center p-2">
|
<div key={index} className="flex flex-col items-center p-2">
|
||||||
<div className="font-bold"></div>
|
<div className="font-bold"></div>
|
||||||
{jacketPath && (
|
{!jacketPath ? (
|
||||||
<>
|
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
||||||
|
) : (
|
||||||
<img
|
<img
|
||||||
src={`/jacketArts/${jacketPath}`}
|
src={`/jacketArts/${jacketPath}`}
|
||||||
alt="Jacket"
|
alt="Jacket"
|
||||||
className={`mr-2 inline-block h-[100px] w-[100px] ${
|
className="mr-2 inline-block h-[100px] w-[100px]"
|
||||||
isLoading ? "hidden" : ""
|
|
||||||
}`}
|
|
||||||
onLoad={handleImageLoad}
|
|
||||||
onError={handleImageError}
|
|
||||||
/>
|
/>
|
||||||
{isLoading && (
|
|
||||||
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{!jacketPath && (
|
|
||||||
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
|
||||||
)}
|
)}
|
||||||
<div>
|
<div>
|
||||||
<ul className="mt-2 text-center">
|
<ul className="mt-2 text-center">
|
||||||
|
@ -31,12 +31,11 @@ export const ChunithmTopPlays: FC<chunithmTopPlays> = ({
|
|||||||
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8">
|
<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8">
|
||||||
{" "}
|
{" "}
|
||||||
{chuniProfileTopPlays.topPlays.map((chuniProfileTopPlays, index) => {
|
{chuniProfileTopPlays.topPlays.map((chuniProfileTopPlays, index) => {
|
||||||
const [isLoading, setIsLoading] = useState(true);
|
|
||||||
|
|
||||||
const jacketPath = chuniProfileTopPlays.jacketPath?.replace(
|
const jacketPath = chuniProfileTopPlays.jacketPath?.replace(
|
||||||
".dds",
|
".dds",
|
||||||
".png",
|
".png",
|
||||||
);
|
);
|
||||||
|
const [isLoading, setIsLoading] = useState(true);
|
||||||
|
|
||||||
const handleImageLoad = () => {
|
const handleImageLoad = () => {
|
||||||
setIsLoading(false);
|
setIsLoading(false);
|
||||||
@ -45,12 +44,10 @@ export const ChunithmTopPlays: FC<chunithmTopPlays> = ({
|
|||||||
const handleImageError = () => {
|
const handleImageError = () => {
|
||||||
setIsLoading(false);
|
setIsLoading(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div key={index} className="flex flex-col items-center p-2">
|
<div key={index} className="flex flex-col items-center p-2">
|
||||||
<div className="font-bold"></div>
|
<div className="font-bold"></div>
|
||||||
{jacketPath && (
|
{jacketPath ? (
|
||||||
<>
|
|
||||||
<img
|
<img
|
||||||
src={`/jacketArts/${jacketPath}`}
|
src={`/jacketArts/${jacketPath}`}
|
||||||
alt="Jacket"
|
alt="Jacket"
|
||||||
@ -60,12 +57,7 @@ export const ChunithmTopPlays: FC<chunithmTopPlays> = ({
|
|||||||
onLoad={handleImageLoad}
|
onLoad={handleImageLoad}
|
||||||
onError={handleImageError}
|
onError={handleImageError}
|
||||||
/>
|
/>
|
||||||
{isLoading && (
|
) : (
|
||||||
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{!jacketPath && (
|
|
||||||
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
||||||
)}
|
)}
|
||||||
<ul className="mt-2 text-center">
|
<ul className="mt-2 text-center">
|
||||||
|
@ -46,8 +46,7 @@ export const ChunithmNextPlays: FC<ChunithmProfileHotPlays> = ({
|
|||||||
return (
|
return (
|
||||||
<div key={index} className="flex flex-col items-center p-2">
|
<div key={index} className="flex flex-col items-center p-2">
|
||||||
<div className="font-bold"></div>
|
<div className="font-bold"></div>
|
||||||
{jacketPath && (
|
{jacketPath ? (
|
||||||
<>
|
|
||||||
<img
|
<img
|
||||||
src={`/jacketArts/${jacketPath}`}
|
src={`/jacketArts/${jacketPath}`}
|
||||||
alt="Jacket"
|
alt="Jacket"
|
||||||
@ -57,12 +56,7 @@ export const ChunithmNextPlays: FC<ChunithmProfileHotPlays> = ({
|
|||||||
onLoad={handleImageLoad}
|
onLoad={handleImageLoad}
|
||||||
onError={handleImageError}
|
onError={handleImageError}
|
||||||
/>
|
/>
|
||||||
{isLoading && (
|
) : (
|
||||||
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
{!jacketPath && (
|
|
||||||
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
<Skeleton className="mr-2 inline-block h-[100px] w-[100px]" />
|
||||||
)}
|
)}
|
||||||
<div>
|
<div>
|
||||||
|
Reference in New Issue
Block a user