Admin — def-exsport-frontend-admin

Admin / CMS internal untuk toko.

Cara halaman ini diverifikasi

Dibaca pada 2026-09-15 dari package.json, next.config.ts, src/middleware.ts, App Router tree, setup Apollo/axios/NextAuth, dan hook RBAC. Checkout lokal: /Volumes/xpro/erisristemena/nextjs/def-exsport-frontend-admin.

Stack

Framework	Next.js 15.5.9 (App Router), React 19.0, TypeScript 5
Data	Apollo Client 3.12 + @apollo/experimental-nextjs-app-support; axios untuk create/update dengan file upload
Auth	NextAuth 4 (Credentials + Google), jwt-decode
Forms	react-hook-form + zod
Rich text	TinyMCE (hanya Journals)
UI	Tailwind CSS v3 + template Metronic yang di-vendor (tanpa React component library)

Script: dev = next dev --turbopack, build = tsc --project tsconfig.build.json && next build (type-check dulu), start = next start. Jalankan di lokal dengan PORT=3012. tsconfig punya strict: false; next.config.ts menyetel eslint.ignoreDuringBuilds: true.

Struktur

• src/app/admin/<area>/ — semuanya di bawah /admin; / → /admin/dashboard. Tiap area punya list page.tsx plus halaman add-* / edit-* / [slug].
• src/lib/<domain>/ — index.ts (GraphQL), *.rest.ts (axios multipart), *.type.ts.
• src/modules/<area>/ — form dan list. src/components/ — building block bersama di atas Metronic; src/metronic/ adalah kode template vendor.

Area: products (+ variants), heads-types, categories, sub-categories, brands, tags, series, collaborations, members, orders, stores, homepage, discounts, vouchers, flash-sales, journals (+ categories/tags), admins, roles.

Cara kerjanya

• Akses data hybrid. Read dan write tanpa file lewat Apollo GraphQL (cache: "no-store"). Create/update dengan file upload lewat axios REST (src/lib/http.ts) sebagai multipart, ke path REST seperti catalogs/products.
• URL backend adalah ${NEXT_PUBLIC_API_URL}/graphql; client axios memakai base URL yang sama.
• Auth adalah NextAuth (src/app/auth.ts), Credentials + Google. Token ikut di session dan dikirim sebagai Bearer. Auto-logout saat backend mengirim pesan "no activity" dan "Access token expired".
• RBAC berbasis data dan di sisi client: src/middleware.ts hanya gate "sudah login?"; hak rinci datang dari useAccess(slug, action) (src/hooks/useAccess.tsx), yang membaca session.user.me.role.menus[], menyembunyikan item sidebar, dan mengalihkan halaman yang ditolak ke /404. Backend menegakkan hak yang sama per resolver. Lihat Admin users and RBAC.

Dua hal yang mengejutkan orang

• Dashboard masih stub — src/app/admin/dashboard/page.tsx hanya menampilkan heading kosong. Belum ada analytics.
• Orders view-only — src/lib/orders punya query, tanpa mutation.
• Middleware menyebut /profile dan /settings, tapi route itu tidak ada.

Config dan keanehan

• next.config.ts: output: "standalone", X-Robots-Tag: noindex global (DEF07-2467), image domain dari NEXT_PUBLIC_ASSETS_URL + S3.
• Env mencakup NEXT_PUBLIC_TINY_EDITOR_API_KEY (ada di .env, hilang dari env.example) dan NEXT_PUBLIC_BITESHIP_ENV.
• Domain vouchers dieja vourchers (src/lib/vourchers, vourcer.rest.ts); komponen list products adalah Poducts. Kutip apa adanya.

Model branch

Environment branches: main, staging, development. Auto-deploy saat push.