EpicNext-Cms/src/app/admin/shop/[id]/page.tsx

import Link from "next/link";
import { getTranslations } from "next-intl/server";
import { notFound } from "next/navigation";
import { deleteShopArticle, updateShopArticle } from "@/actions/admin-shop";
import { prisma } from "@/lib/prisma";
import { Package } from "lucide-react";

export const dynamic = "force-dynamic";

export default async function EditShopArticle({ params }: { params: Promise<{ id: string }> }) {
  const t = await getTranslations("pages.admin.shop");

  const { id } = await params;
  let pkg: Awaited<ReturnType<typeof prisma.websiteShopArticles.findUnique>> = null;
  try {
    pkg = await prisma.websiteShopArticles.findUnique({ where: { id: BigInt(id) } });
  } catch {
    notFound();
  }
  if (!pkg) notFound();

  return (
    <main>
      <div className="flex items-center gap-3 mb-6">
        <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[var(--color-primary)]/20 to-[var(--color-primary)]/5 grid place-items-center">
          <Package size={20} className="text-[var(--color-primary)]" />
        </div>
        <div>
          <h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">{t("editPackageTitle")}</h1>
          <Link
            href="/admin/shop"
            className="text-xs text-[var(--color-text-muted)] hover:text-[var(--color-primary)]"
          >
            ← {t("backToShop")}
          </Link>
        </div>
      </div>

      <form action={updateShopArticle} className="admin-card">
        <div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
          <input type="hidden" name="id" value={String(pkg.id)} />
          <input
            name="name"
            defaultValue={pkg.name}
            placeholder={t("form.namePlaceholder")}
            required
            maxLength={255}
            className="w-full"
          />
          <input
            name="info"
            defaultValue={pkg.info}
            placeholder={t("form.infoPlaceholder")}
            maxLength={255}
            className="w-full"
          />
          <input
            name="icon"
            defaultValue={pkg.iconUrl}
            placeholder={t("form.iconPlaceholder")}
            maxLength={255}
            className="w-full"
          />
          <input
            name="color"
            defaultValue={pkg.color}
            placeholder={t("form.colorPlaceholder")}
            maxLength={255}
            className="w-full"
          />
          <input
            name="costs"
            type="number"
            min={0}
            defaultValue={pkg.costs}
            placeholder={t("form.costsPlaceholder")}
            required
            className="w-full"
          />
          <input
            name="credits"
            type="number"
            min={0}
            defaultValue={pkg.credits ?? undefined}
            placeholder={t("form.creditsPlaceholder")}
            className="w-full"
          />
          <input
            name="duckets"
            type="number"
            min={0}
            defaultValue={pkg.duckets ?? undefined}
            placeholder={t("form.ducketsPlaceholder")}
            className="w-full"
          />
          <input
            name="diamonds"
            type="number"
            min={0}
            defaultValue={pkg.diamonds ?? undefined}
            placeholder={t("form.diamondsPlaceholder")}
            className="w-full"
          />
          <input
            name="giveRank"
            type="number"
            min={0}
            defaultValue={pkg.giveRank ?? undefined}
            placeholder={t("form.giveRankPlaceholder")}
            className="w-full"
          />
          <input
            name="badges"
            defaultValue={pkg.badges ?? ""}
            placeholder={t("form.badgesPlaceholder")}
            maxLength={255}
            className="w-full"
          />
          <input
            name="position"
            type="number"
            min={0}
            defaultValue={pkg.position}
            placeholder={t("form.positionPlaceholder")}
            className="w-full"
          />
        </div>
        <div className="mt-6 flex gap-2">
          <button type="submit" className="btn btn-primary">
            {t("form.save")}
          </button>
          <form action={deleteShopArticle}>
            <input type="hidden" name="id" value={String(pkg.id)} />
            <button type="submit" className="btn btn-danger">
              {t("form.deletePackage")}
            </button>
          </form>
        </div>
      </form>
    </main>
  );
}