style: clean up code with prettier and eslint
This commit is contained in:
openhands committed
1 parent
60278b9e71
commit
fb8e77bb68
378 files changed
+22407
-20689
No files matched your search
@@ -1,18 +1,18 @@
|
||||
'use client'
|
||||
"use client";
|
||||
|
||||
import { Crown, Image as ImageIcon, Package, Sparkles } from 'lucide-react'
|
||||
import type { CatalogItemData } from '@/app/admin/catalog/[id]/catalog-items-table/types'
|
||||
import { getPointsLabel } from '@/app/admin/catalog/[id]/catalog-items-table/types'
|
||||
import { Badge } from '@/components/ui/badge'
|
||||
import { getHabboCdnIconUrl, getLocalIconUrl } from '@/lib/furni/classname'
|
||||
import { cn } from '@/lib/utils'
|
||||
import { Crown, Image as ImageIcon, Package, Sparkles } from "lucide-react";
|
||||
import type { CatalogItemData } from "@/app/admin/catalog/[id]/catalog-items-table/types";
|
||||
import { getPointsLabel } from "@/app/admin/catalog/[id]/catalog-items-table/types";
|
||||
import { Badge } from "@/components/ui/badge";
|
||||
import { getHabboCdnIconUrl, getLocalIconUrl } from "@/lib/furni/classname";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
interface ItemsShopPreviewProps {
|
||||
items: CatalogItemData[]
|
||||
furniRevisionMap: Record<number, { classname: string; revision: number }>
|
||||
layout: string
|
||||
canEdit: boolean
|
||||
onItemClick?: (item: CatalogItemData) => void
|
||||
items: CatalogItemData[];
|
||||
furniRevisionMap: Record<number, { classname: string; revision: number }>;
|
||||
layout: string;
|
||||
canEdit: boolean;
|
||||
onItemClick?: (item: CatalogItemData) => void;
|
||||
}
|
||||
|
||||
export function ItemsShopPreview({
|
||||
@@ -28,11 +28,11 @@ export function ItemsShopPreview({
|
||||
<Package className="h-10 w-10 text-muted-foreground/40" />
|
||||
<p className="mt-2 text-sm text-muted-foreground">No items in this page yet</p>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
const gridClass = getGridClass(layout)
|
||||
const tileSize = getTileSize(layout)
|
||||
const gridClass = getGridClass(layout);
|
||||
const tileSize = getTileSize(layout);
|
||||
|
||||
return (
|
||||
<div className="rounded-lg border bg-gradient-to-b from-sky-50 to-sky-100 dark:from-slate-900 dark:to-slate-950 p-4">
|
||||
@@ -40,13 +40,13 @@ export function ItemsShopPreview({
|
||||
<span className="font-medium">Shop preview · {layout}</span>
|
||||
<span>{items.length} items</span>
|
||||
</div>
|
||||
<div className={cn('grid gap-2', gridClass)}>
|
||||
<div className={cn("grid gap-2", gridClass)}>
|
||||
{items.map((item) => {
|
||||
const firstId = parseFirstItemId(item.itemIds)
|
||||
const furni = firstId != null ? furniRevisionMap[firstId] : undefined
|
||||
const points = getPointsLabel(item.pointsType)
|
||||
const isClub = item.clubOnly === '1'
|
||||
const isOffer = item.haveOffer === '1' && item.offerId > 0
|
||||
const firstId = parseFirstItemId(item.itemIds);
|
||||
const furni = firstId != null ? furniRevisionMap[firstId] : undefined;
|
||||
const points = getPointsLabel(item.pointsType);
|
||||
const isClub = item.clubOnly === "1";
|
||||
const isOffer = item.haveOffer === "1" && item.offerId > 0;
|
||||
|
||||
return (
|
||||
<button
|
||||
@@ -55,9 +55,9 @@ export function ItemsShopPreview({
|
||||
onClick={() => onItemClick?.(item)}
|
||||
disabled={!canEdit && !onItemClick}
|
||||
className={cn(
|
||||
'group relative flex flex-col overflow-hidden rounded-md border bg-card shadow-sm transition-all',
|
||||
canEdit && 'hover:border-primary hover:shadow-md hover:scale-[1.02] cursor-pointer',
|
||||
!canEdit && 'cursor-default',
|
||||
"group relative flex flex-col overflow-hidden rounded-md border bg-card shadow-sm transition-all",
|
||||
canEdit && "hover:border-primary hover:shadow-md hover:scale-[1.02] cursor-pointer",
|
||||
!canEdit && "cursor-default",
|
||||
)}
|
||||
title={item.catalogName || item.baseName}
|
||||
>
|
||||
@@ -67,7 +67,7 @@ export function ItemsShopPreview({
|
||||
style={{ height: tileSize }}
|
||||
>
|
||||
<ShopFurniIcon
|
||||
classname={furni?.classname ?? ''}
|
||||
classname={furni?.classname ?? ""}
|
||||
revision={furni?.revision ?? 0}
|
||||
size={Math.floor(tileSize * 0.7)}
|
||||
/>
|
||||
@@ -125,82 +125,71 @@ export function ItemsShopPreview({
|
||||
</div>
|
||||
</div>
|
||||
</button>
|
||||
)
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
// ── Helpers ─────────────────────────────────────────────────────
|
||||
|
||||
function parseFirstItemId(itemIds: string): number | null {
|
||||
if (!itemIds) return null
|
||||
const first = itemIds.split(';')[0]?.trim()
|
||||
const n = parseInt(first, 10)
|
||||
return Number.isNaN(n) ? null : n
|
||||
if (!itemIds) return null;
|
||||
const first = itemIds.split(";")[0]?.trim();
|
||||
const n = parseInt(first, 10);
|
||||
return Number.isNaN(n) ? null : n;
|
||||
}
|
||||
|
||||
function getGridClass(layout: string): string {
|
||||
switch (layout) {
|
||||
case 'spaces_new':
|
||||
return 'grid-cols-2 sm:grid-cols-3 md:grid-cols-4'
|
||||
case 'frontpage':
|
||||
return 'grid-cols-1 sm:grid-cols-2 md:grid-cols-3'
|
||||
case 'single_bundle':
|
||||
case 'room_bundle':
|
||||
return 'grid-cols-1 sm:grid-cols-2'
|
||||
case 'pets':
|
||||
case 'pets2':
|
||||
case 'pets3':
|
||||
return 'grid-cols-2 sm:grid-cols-3 md:grid-cols-4'
|
||||
case "spaces_new":
|
||||
return "grid-cols-2 sm:grid-cols-3 md:grid-cols-4";
|
||||
case "frontpage":
|
||||
return "grid-cols-1 sm:grid-cols-2 md:grid-cols-3";
|
||||
case "single_bundle":
|
||||
case "room_bundle":
|
||||
return "grid-cols-1 sm:grid-cols-2";
|
||||
case "pets":
|
||||
case "pets2":
|
||||
case "pets3":
|
||||
return "grid-cols-2 sm:grid-cols-3 md:grid-cols-4";
|
||||
default:
|
||||
return 'grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5'
|
||||
return "grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5";
|
||||
}
|
||||
}
|
||||
|
||||
function getTileSize(layout: string): number {
|
||||
switch (layout) {
|
||||
case 'frontpage':
|
||||
case 'single_bundle':
|
||||
case 'room_bundle':
|
||||
return 140
|
||||
case 'spaces_new':
|
||||
return 110
|
||||
case "frontpage":
|
||||
case "single_bundle":
|
||||
case "room_bundle":
|
||||
return 140;
|
||||
case "spaces_new":
|
||||
return 110;
|
||||
default:
|
||||
return 96
|
||||
return 96;
|
||||
}
|
||||
}
|
||||
|
||||
// ── Shop tile furni icon (resizable) ────────────────────────────
|
||||
|
||||
function ShopFurniIcon({
|
||||
classname,
|
||||
revision,
|
||||
size,
|
||||
}: {
|
||||
classname: string
|
||||
revision: number
|
||||
size: number
|
||||
}) {
|
||||
function ShopFurniIcon({ classname, revision, size }: { classname: string; revision: number; size: number }) {
|
||||
if (!classname) {
|
||||
return (
|
||||
<ImageIcon
|
||||
className="text-muted-foreground/40"
|
||||
style={{ width: size * 0.5, height: size * 0.5 }}
|
||||
/>
|
||||
)
|
||||
<ImageIcon className="text-muted-foreground/40" style={{ width: size * 0.5, height: size * 0.5 }} />
|
||||
);
|
||||
}
|
||||
|
||||
const primary = getLocalIconUrl(classname)
|
||||
const primary = getLocalIconUrl(classname);
|
||||
|
||||
function handleError(e: React.SyntheticEvent<HTMLImageElement>) {
|
||||
const img = e.target as HTMLImageElement
|
||||
const img = e.target as HTMLImageElement;
|
||||
if (!img.dataset.fallback && revision > 0) {
|
||||
img.dataset.fallback = 'cdn'
|
||||
img.src = getHabboCdnIconUrl(classname, revision)
|
||||
img.dataset.fallback = "cdn";
|
||||
img.src = getHabboCdnIconUrl(classname, revision);
|
||||
} else {
|
||||
img.style.opacity = '0'
|
||||
img.style.opacity = "0";
|
||||
}
|
||||
}
|
||||
|
||||
@@ -210,9 +199,9 @@ function ShopFurniIcon({
|
||||
src={primary}
|
||||
alt={classname}
|
||||
className="object-contain"
|
||||
style={{ imageRendering: 'pixelated', maxWidth: size, maxHeight: size }}
|
||||
style={{ imageRendering: "pixelated", maxWidth: size, maxHeight: size }}
|
||||
onError={handleError}
|
||||
loading="lazy"
|
||||
/>
|
||||
)
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user