@mohasinac/appkit 2.1.3 → 2.3.0

package/src/features/admin/components/DashboardStats.tsx

@@ -1,95 +0,0 @@
-import type { DashboardStats } from "../types";
-import { Div, Text, Grid } from "../../../ui";
-import { formatCurrency } from "../../../utils/number.formatter";
-
-interface StatCardProps {
-  label: string;
-  value: string | number;
-  sub?: string;
-  color?: "default" | "blue" | "green" | "amber" | "red";
-}
-
-function StatCard({ label, value, sub, color = "default" }: StatCardProps) {
-  const colorClass = {
-    default: "bg-white",
-    blue: "bg-blue-50",
-    green: "bg-green-50",
-    amber: "bg-amber-50",
-    red: "bg-red-50",
-  }[color];
-  return (
-    <Div className={`rounded-xl border border-neutral-200 p-5 ${colorClass}`}>
-      <Text className="text-xs font-medium uppercase tracking-wide text-neutral-500">
-        {label}
-      </Text>
-      <Text className="mt-2 text-2xl font-bold text-neutral-900">{value}</Text>
-      {sub && <Text className="mt-1 text-xs text-neutral-500">{sub}</Text>}
-    </Div>
-  );
-}
-
-interface DashboardStatsGridProps {
-  stats: DashboardStats;
-  isLoading?: boolean;
-  labels?: Partial<Record<keyof DashboardStats | string, string>>;
-}
-
-export function DashboardStatsGrid({
-  stats,
-  isLoading,
-  labels = {},
-}: DashboardStatsGridProps) {
-  if (isLoading) {
-    return (
-      <Grid cols="statTiles">
-        {Array.from({ length: 4 }).map((_, i) => (
-          <Div
-            key={i}
-            className="animate-pulse rounded-xl border border-neutral-200 p-5"
-          >
-            <Div className="h-3 w-20 rounded bg-neutral-200" />
-            <Div className="mt-2 h-8 w-24 rounded bg-neutral-200" />
-          </Div>
-        ))}
-      </Grid>
-    );
-  }
-
-  const currency = stats.currency ?? "INR";
-  return (
-    <Grid cols="statTiles">
-      <StatCard
-        label={labels.totalOrders ?? "Total Orders"}
-        value={stats.totalOrders ?? 0}
-      />
-      <StatCard
-        label={labels.totalRevenue ?? "Total Revenue"}
-        value={formatCurrency(stats.totalRevenue ?? 0, currency)}
-        color="green"
-      />
-      <StatCard
-        label={labels.totalUsers ?? "Total Users"}
-        value={stats.totalUsers ?? 0}
-        color="blue"
-      />
-      <StatCard
-        label={labels.totalProducts ?? "Total Products"}
-        value={stats.totalProducts ?? 0}
-      />
-      {stats.pendingOrders !== undefined && (
-        <StatCard
-          label={labels.pendingOrders ?? "Pending Orders"}
-          value={stats.pendingOrders}
-          color="amber"
-        />
-      )}
-      {stats.pendingReviews !== undefined && (
-        <StatCard
-          label={labels.pendingReviews ?? "Pending Reviews"}
-          value={stats.pendingReviews}
-          color="amber"
-        />
-      )}
-    </Grid>
-  );
-}

package/src/features/admin/components/DataTable.tsx

@@ -1,115 +0,0 @@
-import type { AdminTableColumn } from "../types";
-import { Button, Div, Span } from "../../../ui";
-
-interface DataTableProps<T extends { id: string }> {
-  columns: AdminTableColumn<T>[];
-  rows: T[];
-  isLoading?: boolean;
-  sortKey?: string;
-  sortDir?: "asc" | "desc";
-  onSort?: (key: string) => void;
-  totalPages?: number;
-  currentPage?: number;
-  onPageChange?: (page: number) => void;
-  emptyLabel?: string;
-}
-
-export function DataTable<T extends { id: string }>({
-  columns,
-  rows,
-  isLoading,
-  sortKey,
-  sortDir,
-  onSort,
-  totalPages = 1,
-  currentPage = 1,
-  onPageChange,
-  emptyLabel = "No records found",
-}: DataTableProps<T>) {
-  return (
-    <Div className="overflow-hidden rounded-xl border border-neutral-200 bg-white">
-      <Div className="overflow-x-auto">
-        <table className="w-full text-sm">
-          <thead>
-            <tr className="border-b border-neutral-200 bg-neutral-50">
-              {columns.map((col) => (
-                <th
-                  key={col.key}
-                  scope="col"
-                  onClick={
-                    col.sortable && onSort ? () => onSort(col.key) : undefined
-                  }
-                  className={`px-4 py-3 text-left font-semibold text-neutral-900 ${col.sortable && onSort ? "cursor-pointer select-none hover:text-primary" : ""} ${col.className ?? ""}`}
-                >
-                  {col.header}
-                  {col.sortable && sortKey === col.key && (
-                    <Span className="ml-1">
-                      {sortDir === "asc" ? "↑" : "↓"}
-                    </Span>
-                  )}
-                </th>
-              ))}
-            </tr>
-          </thead>
-          <tbody>
-            {isLoading ? (
-              Array.from({ length: 5 }).map((_, i) => (
-                <tr key={i} className="border-b border-neutral-100">
-                  {columns.map((col) => (
-                    <td key={col.key} className="px-4 py-3">
-                      <Div className="h-4 w-full animate-pulse rounded bg-neutral-200" />
-                    </td>
-                  ))}
-                </tr>
-              ))
-            ) : rows.length === 0 ? (
-              <tr>
-                <td
-                  colSpan={columns.length}
-                  className="px-4 py-12 text-center text-neutral-500"
-                >
-                  {emptyLabel}
-                </td>
-              </tr>
-            ) : (
-              rows.map((row) => (
-                <tr
-                  key={row.id}
-                  className="border-b border-neutral-100 hover:bg-neutral-50"
-                >
-                  {columns.map((col) => (
-                    <td
-                      key={col.key}
-                      className={`px-4 py-3 text-neutral-700 ${col.className ?? ""}`}
-                    >
-                      {col.render
-                        ? col.render(row)
-                        : String(
-                            (row as Record<string, unknown>)[col.key] ?? "",
-                          )}
-                    </td>
-                  ))}
-                </tr>
-              ))
-            )}
-          </tbody>
-        </table>
-      </Div>
-      {totalPages > 1 && onPageChange && (
-        <Div className="flex items-center justify-end gap-2 border-t border-neutral-200 px-4 py-3">
-          {Array.from({ length: totalPages }, (_, i) => i + 1).map((p) => (
-            <Button
-              key={p}
-              onClick={() => onPageChange(p)}
-              variant={p === currentPage ? "primary" : "ghost"}
-              size="sm"
-              className={`h-8 w-8 rounded text-xs font-medium transition ${p === currentPage ? "bg-neutral-900 text-white" : "text-neutral-600 hover:bg-neutral-100"}`}
-            >
-              {p}
-            </Button>
-          ))}
-        </Div>
-      )}
-    </Div>
-  );
-}

package/src/features/admin/components/DemoSeedView.tsx

@@ -1,22 +0,0 @@
-"use client";
-
-import React from "react";
-import { Div, Heading } from "../../../ui";
-
-export interface DemoSeedViewProps {
-  labels?: { title?: string; };
-  renderActions?: (isLoading: boolean) => React.ReactNode;
-  renderLog?: () => React.ReactNode;
-  isLoading?: boolean;
-  className?: string;
-}
-
-export function DemoSeedView({ labels = {}, renderActions, renderLog, isLoading = false, className = "" }: DemoSeedViewProps) {
-  return (
-    <Div className={className}>
-      {labels.title && <Heading level={1} className="text-2xl font-bold mb-6">{labels.title}</Heading>}
-      {renderActions?.(isLoading)}
-      {renderLog?.()}
-    </Div>
-  );
-}

package/src/features/admin/components/QuickActionsPanel.tsx

@@ -1,62 +0,0 @@
-"use client";
-
-import React from "react";
-import { Div, Heading } from "../../../ui";
-
-export interface QuickActionItem {
-  id: string;
-  label: string;
-  href?: string;
-  icon?: React.ReactNode;
-  onClick?: () => void;
-}
-
-export interface QuickActionsPanelProps {
-  title?: string;
-  actions: QuickActionItem[];
-  renderAction?: (action: QuickActionItem) => React.ReactNode;
-  className?: string;
-}
-
-export function QuickActionsPanel({
-  title,
-  actions,
-  renderAction,
-  className = "",
-}: QuickActionsPanelProps) {
-  return (
-    <Div className={className}>
-      {title && (
-        <Heading level={3} className="mb-4">
-          {title}
-        </Heading>
-      )}
-      <Div className="grid grid-cols-1 md:grid-cols-3 gap-4">
-        {actions.map((action) => (
-          <Div key={action.id}>
-            {renderAction ? (
-              renderAction(action)
-            ) : action.onClick ? (
-              <button
-                type="button"
-                onClick={action.onClick}
-                className="w-full inline-flex items-center justify-start gap-2 rounded-lg border border-neutral-200 px-3 py-2 text-sm"
-              >
-                {action.icon}
-                {action.label}
-              </button>
-            ) : (
-              <a
-                href={action.href ?? "#"}
-                className="w-full inline-flex items-center justify-start gap-2 rounded-lg border border-neutral-200 px-3 py-2 text-sm"
-              >
-                {action.icon}
-                {action.label}
-              </a>
-            )}
-          </Div>
-        ))}
-      </Div>
-    </Div>
-  );
-}

package/src/features/admin/components/analytics/AdminAnalyticsCharts.tsx

@@ -1,114 +0,0 @@
-"use client";
-
-import React from "react";
-import dynamic from "next/dynamic";
-import { Div, Heading } from "../../../../ui";
-import type { AnalyticsMonthEntry } from "../../types";
-
-const ResponsiveContainer = dynamic(
-  () => import("recharts").then((m) => m.ResponsiveContainer),
-  { ssr: false },
-);
-const AreaChart = dynamic(() => import("recharts").then((m) => m.AreaChart), {
-  ssr: false,
-});
-const Area = dynamic(() => import("recharts").then((m) => m.Area), {
-  ssr: false,
-});
-const BarChart = dynamic(() => import("recharts").then((m) => m.BarChart), {
-  ssr: false,
-});
-const Bar = dynamic(() => import("recharts").then((m) => m.Bar), {
-  ssr: false,
-});
-const XAxis = dynamic(() => import("recharts").then((m) => m.XAxis), {
-  ssr: false,
-});
-const YAxis = dynamic(() => import("recharts").then((m) => m.YAxis), {
-  ssr: false,
-});
-const CartesianGrid = dynamic(
-  () => import("recharts").then((m) => m.CartesianGrid),
-  { ssr: false },
-);
-const Tooltip = dynamic(() => import("recharts").then((m) => m.Tooltip), {
-  ssr: false,
-});
-
-export interface AdminRevenueChartProps {
-  data: AnalyticsMonthEntry[];
-  labels?: { title?: string };
-  className?: string;
-}
-
-export function AdminRevenueChart({
-  data,
-  labels = {},
-  className = "",
-}: AdminRevenueChartProps) {
-  return (
-    <Div
-      className={`bg-white dark:bg-neutral-900 rounded-xl border border-neutral-200 dark:border-neutral-800 p-4 sm:p-6 ${className}`}
-    >
-      {labels.title && (
-        <Heading level={3} className="text-base font-semibold mb-4">
-          {labels.title}
-        </Heading>
-      )}
-      <ResponsiveContainer width="100%" height={300}>
-        <AreaChart data={data}>
-          <defs>
-            <linearGradient id="colorRevenue" x1="0" y1="0" x2="0" y2="1">
-              <stop offset="5%" stopColor="#3b82f6" stopOpacity={0.8} />
-              <stop offset="95%" stopColor="#3b82f6" stopOpacity={0} />
-            </linearGradient>
-          </defs>
-          <CartesianGrid strokeDasharray="3 3" />
-          <XAxis dataKey="month" />
-          <YAxis />
-          <Tooltip />
-          <Area
-            type="monotone"
-            dataKey="revenue"
-            stroke="#3b82f6"
-            fillOpacity={1}
-            fill="url(#colorRevenue)"
-          />
-        </AreaChart>
-      </ResponsiveContainer>
-    </Div>
-  );
-}
-
-export interface AdminOrdersChartProps {
-  data: AnalyticsMonthEntry[];
-  labels?: { title?: string };
-  className?: string;
-}
-
-export function AdminOrdersChart({
-  data,
-  labels = {},
-  className = "",
-}: AdminOrdersChartProps) {
-  return (
-    <Div
-      className={`bg-white dark:bg-neutral-900 rounded-xl border border-neutral-200 dark:border-neutral-800 p-4 sm:p-6 ${className}`}
-    >
-      {labels.title && (
-        <Heading level={3} className="text-base font-semibold mb-4">
-          {labels.title}
-        </Heading>
-      )}
-      <ResponsiveContainer width="100%" height={300}>
-        <BarChart data={data}>
-          <CartesianGrid strokeDasharray="3 3" />
-          <XAxis dataKey="month" />
-          <YAxis />
-          <Tooltip />
-          <Bar dataKey="orders" fill="#10b981" />
-        </BarChart>
-      </ResponsiveContainer>
-    </Div>
-  );
-}

package/src/features/admin/components/analytics/AdminStatCard.tsx

@@ -1,36 +0,0 @@
-"use client";
-
-import React from "react";
-import { Div, Text, Heading } from "../../../../ui";
-
-export interface AdminStatCardProps {
-  label: string;
-  value: string;
-  icon?: React.ReactNode | string;
-  className?: string;
-}
-
-export function AdminStatCard({
-  label,
-  value,
-  icon,
-  className = "",
-}: AdminStatCardProps) {
-  return (
-    <Div
-      className={`bg-white dark:bg-neutral-900 rounded-xl border border-neutral-200 dark:border-neutral-800 p-4 sm:p-6 ${className}`}
-    >
-      <Div className="flex items-start justify-between">
-        <Div>
-          <Text className="text-sm text-neutral-600 dark:text-neutral-400 mb-1">
-            {label}
-          </Text>
-          <Heading level={3} className="text-2xl font-bold">
-            {value}
-          </Heading>
-        </Div>
-        {icon && <Div className="text-2xl">{icon}</Div>}
-      </Div>
-    </Div>
-  );
-}

package/src/features/admin/components/analytics/AdminTopProductsTable.tsx

@@ -1,61 +0,0 @@
-"use client";
-
-import React from "react";
-import { Div, Heading, Text } from "../../../../ui";
-import type { AnalyticsTopProduct } from "../../types";
-
-export interface AdminTopProductsTableLabels {
-  title?: string;
-  orders?: string;
-  view?: string;
-  revenue?: string;
-}
-
-export interface AdminTopProductsTableProps {
-  products: AnalyticsTopProduct[];
-  labels?: AdminTopProductsTableLabels;
-  formatRevenue?: (amount: number) => string;
-  renderProductLink?: (product: AnalyticsTopProduct) => React.ReactNode;
-  className?: string;
-}
-
-export function AdminTopProductsTable({
-  products,
-  labels = {},
-  formatRevenue = (n) => String(n),
-  renderProductLink,
-  className = "",
-}: AdminTopProductsTableProps) {
-  return (
-    <Div
-      className={`bg-white dark:bg-neutral-900 rounded-xl border border-neutral-200 dark:border-neutral-800 p-4 sm:p-6 ${className}`}
-    >
-      {labels.title && (
-        <Heading level={3} className="text-base font-semibold mb-4">
-          {labels.title}
-        </Heading>
-      )}
-      <Div>
-        {products.map((product) => (
-          <Div
-            key={product.productId}
-            className="flex items-center justify-between py-3 border-b last:border-b-0 border-neutral-100 dark:border-neutral-800"
-          >
-            <Div className="flex-1 min-w-0">
-              <Text className="font-medium truncate">{product.title}</Text>
-              <Text className="text-sm text-neutral-500">
-                {product.orders} {labels.orders ?? "orders"}
-              </Text>
-            </Div>
-            <Div className="text-right ml-4">
-              <Text className="font-semibold">
-                {formatRevenue(product.revenue)}
-              </Text>
-              {renderProductLink?.(product)}
-            </Div>
-          </Div>
-        ))}
-      </Div>
-    </Div>
-  );
-}

package/src/features/admin/components/analytics/index.ts

@@ -1,3 +0,0 @@
-export * from "./AdminStatCard";
-export * from "./AdminAnalyticsCharts";
-export * from "./AdminTopProductsTable";

package/src/features/admin/components/index.ts

@@ -1,71 +0,0 @@
-export { DataTable } from "./DataTable";
-export { DashboardStatsGrid } from "./DashboardStats";
-export { AdminUsersView } from "./AdminUsersView";
-export type { AdminUsersViewProps } from "./AdminUsersView";
-export { AdminProductsView } from "./AdminProductsView";
-export type { AdminProductsViewProps } from "./AdminProductsView";
-export { AdminOrdersView } from "./AdminOrdersView";
-export type { AdminOrdersViewProps } from "./AdminOrdersView";
-export { AdminBidsView } from "./AdminBidsView";
-export type { AdminBidsViewProps } from "./AdminBidsView";
-export { AdminCouponsView } from "./AdminCouponsView";
-export type { AdminCouponsViewProps } from "./AdminCouponsView";
-export { AdminCategoriesView } from "./AdminCategoriesView";
-export type { AdminCategoriesViewProps } from "./AdminCategoriesView";
-export { AdminBlogView } from "./AdminBlogView";
-export type { AdminBlogViewProps } from "./AdminBlogView";
-export { AdminFaqsView } from "./AdminFaqsView";
-export type { AdminFaqsViewProps } from "./AdminFaqsView";
-export { AdminMediaView } from "./AdminMediaView";
-export type { AdminMediaViewProps } from "./AdminMediaView";
-export { AdminStoresView } from "./AdminStoresView";
-export type { AdminStoresViewProps } from "./AdminStoresView";
-export { AdminPayoutsView } from "./AdminPayoutsView";
-export type { AdminPayoutsViewProps } from "./AdminPayoutsView";
-export { AdminReviewsView } from "./AdminReviewsView";
-export type { AdminReviewsViewProps } from "./AdminReviewsView";
-export { AdminSectionsView } from "./AdminSectionsView";
-export type { AdminSectionsViewProps } from "./AdminSectionsView";
-export { AdminSessionsManager } from "./AdminSessionsManager";
-export type { AdminSessionsManagerProps } from "./AdminSessionsManager";
-export { AdminNavigationView } from "./AdminNavigationView";
-export type { AdminNavigationViewProps } from "./AdminNavigationView";
-export { AdminCarouselView } from "./AdminCarouselView";
-export type { AdminCarouselViewProps } from "./AdminCarouselView";
-export { AdminDashboardView } from "./AdminDashboardView";
-export type { AdminDashboardViewProps } from "./AdminDashboardView";
-export { QuickActionsPanel } from "./QuickActionsPanel";
-export type {
-  QuickActionItem,
-  QuickActionsPanelProps,
-} from "./QuickActionsPanel";
-export { AdminSiteView } from "./AdminSiteView";
-export type { AdminSiteViewProps } from "./AdminSiteView";
-export { AdminAnalyticsView } from "./AdminAnalyticsView";
-export type {
-  AdminAnalyticsViewProps,
-  AdminAnalyticsViewLabels,
-} from "./AdminAnalyticsView";
-export { AdminStatCard } from "./analytics/AdminStatCard";
-export type { AdminStatCardProps } from "./analytics/AdminStatCard";
-export {
-  AdminRevenueChart,
-  AdminOrdersChart,
-} from "./analytics/AdminAnalyticsCharts";
-export type {
-  AdminRevenueChartProps,
-  AdminOrdersChartProps,
-} from "./analytics/AdminAnalyticsCharts";
-export { AdminTopProductsTable } from "./analytics/AdminTopProductsTable";
-export type {
-  AdminTopProductsTableProps,
-  AdminTopProductsTableLabels,
-} from "./analytics/AdminTopProductsTable";
-export { AdminFeatureFlagsView } from "./AdminFeatureFlagsView";
-export type { AdminFeatureFlagsViewProps } from "./AdminFeatureFlagsView";
-export { AdminSidebar } from "./AdminSidebar";
-export type { AdminSidebarProps } from "./AdminSidebar";
-export { AdminTopBar } from "./AdminTopBar";
-export type { AdminTopBarProps } from "./AdminTopBar";
-export { DemoSeedView } from "./DemoSeedView";
-export type { DemoSeedViewProps } from "./DemoSeedView";

package/src/features/admin/hooks/useAdmin.ts

@@ -1,19 +0,0 @@
-"use client";
-import { useQuery } from "@tanstack/react-query";
-import { apiClient } from "../../../http";
-import type { DashboardStats } from "../types";
-
-export function useDashboardStats(opts?: {
-  initialData?: DashboardStats;
-  enabled?: boolean;
-}) {
-  const query = useQuery<DashboardStats>({
-    queryKey: ["admin", "dashboard-stats"],
-    queryFn: () => apiClient.get<DashboardStats>("/api/admin/stats"),
-    initialData: opts?.initialData,
-    enabled: opts?.enabled,
-    staleTime: 60 * 1000,
-  });
-
-  return { stats: query.data, isLoading: query.isLoading, error: query.error };
-}

package/src/features/admin/index.ts

@@ -1,5 +0,0 @@
-export * from "./types";
-export * from "./hooks/useAdmin";
-export * from "./components";
-export { manifest } from "./manifest";
-export { ADMIN_PAGE_PERMISSIONS } from "./permission-map";

package/src/features/admin/manifest.ts

@@ -1,15 +0,0 @@
-import type { FeatureManifest } from "../../contracts";
-
-export const manifest: FeatureManifest = {
-  name: "admin",
-  i18nNamespace: "admin",
-  envKeys: [],
-  routes: [
-    {
-      segment: "[locale]/admin",
-      exports: { default: "AdminDashboardView" },
-      adminOnly: true,
-    },
-  ],
-  apiRoutes: [{ segment: "api/admin/stats", methods: ["GET"] }],
-};

package/src/features/admin/messages/en.json

@@ -1,13 +0,0 @@
-{
-  "title": "Admin",
-  "dashboard": "Dashboard",
-  "noRecords": "No records found",
-  "stats": {
-    "totalOrders": "Total Orders",
-    "totalRevenue": "Total Revenue",
-    "totalUsers": "Total Users",
-    "totalProducts": "Total Products",
-    "pendingOrders": "Pending Orders",
-    "pendingReviews": "Pending Reviews"
-  }
-}

package/src/features/admin/permission-map.ts

@@ -1,27 +0,0 @@
-// appkit/src/features/admin/permission-map.ts
-import type { Permission } from "../../security";
-
-/** Required permission for each admin route path */
-export const ADMIN_PAGE_PERMISSIONS: Record<string, Permission> = {
-  "/admin": "admin:access",
-  "/admin/dashboard": "admin:analytics",
-  "/admin/users": "admin:users",
-  "/admin/orders": "admin:orders",
-  "/admin/products": "admin:products",
-  "/admin/reviews": "admin:reviews",
-  "/admin/payouts": "admin:payouts",
-  "/admin/kyc": "admin:kyc",
-  "/admin/analytics": "admin:analytics",
-  "/admin/activity": "admin:activity",
-  "/admin/sessions": "admin:sessions",
-  "/admin/newsletter": "admin:newsletter",
-  "/admin/search": "admin:search",
-  "/admin/feature-flags": "admin:feature-flags",
-  "/admin/site-settings": "admin:settings",
-  "/admin/navigation": "admin:cms:navigation",
-  "/admin/cms": "admin:cms",
-  "/admin/carousel": "admin:cms",
-  "/admin/homepage-sections": "admin:cms",
-  "/admin/copilot": "admin:settings",
-  "/admin/reports": "admin:analytics",
-};

package/src/features/admin/server.ts

@@ -1,10 +0,0 @@
-/**
- * @mohasinac/appkit/features/admin/server
- *
- * Server-only entry point for admin API route handlers.
- */
-
-export { GET as adminProductsGET } from "./api/products/route";
-export { GET as adminCouponsGET } from "./api/coupons/route";
-export { GET as adminReviewsGET } from "./api/reviews/route";
-export { GET as adminBidsGET } from "./api/bids/route";