@mohasinac/appkit 2.1.3 → 2.3.0

package/src/features/seller/components/SellerStorefrontView.tsx

@@ -1,49 +0,0 @@
-"use client";
-
-import React from "react";
-import { Div, Heading, Text } from "../../../ui";
-
-export interface SellerStorefrontViewProps {
-  labels?: {
-    title?: string;
-    subtitle?: string;
-  };
-  renderBanner?: () => React.ReactNode;
-  renderHeader?: () => React.ReactNode;
-  renderProducts?: () => React.ReactNode;
-  renderReviews?: () => React.ReactNode;
-  renderFooter?: () => React.ReactNode;
-  className?: string;
-}
-
-export function SellerStorefrontView({
-  labels = {},
-  renderBanner,
-  renderHeader,
-  renderProducts,
-  renderReviews,
-  renderFooter,
-  className = "",
-}: SellerStorefrontViewProps) {
-  return (
-    <Div className={className}>
-      {renderBanner?.()}
-      {!renderHeader && (labels.title || labels.subtitle) ? (
-        <Div className="mb-6">
-          {labels.title ? (
-            <Heading level={1} className="text-2xl font-bold">
-              {labels.title}
-            </Heading>
-          ) : null}
-          {labels.subtitle ? (
-            <Text className="text-sm opacity-80 mt-1">{labels.subtitle}</Text>
-          ) : null}
-        </Div>
-      ) : null}
-      {renderHeader?.()}
-      {renderProducts?.()}
-      {renderReviews?.()}
-      {renderFooter?.()}
-    </Div>
-  );
-}

package/src/features/seller/components/SellersListView.tsx

@@ -1,43 +0,0 @@
-"use client";
-
-import React from "react";
-import { Div, Heading } from "../../../ui";
-
-export interface SellersListViewProps {
-  labels?: { title?: string; emptyText?: string };
-  renderSearch?: (value: string, onChange: (v: string) => void) => React.ReactNode;
-  renderFilters?: () => React.ReactNode;
-  renderActiveFilters?: () => React.ReactNode;
-  renderTable: (selectedIds: string[], onSelectionChange: (ids: string[]) => void, isLoading: boolean) => React.ReactNode;
-  renderPagination?: (total: number) => React.ReactNode;
-  total?: number;
-  isLoading?: boolean;
-  className?: string;
-}
-
-export function SellersListView({
-  labels = {},
-  renderSearch,
-  renderFilters,
-  renderActiveFilters,
-  renderTable,
-  renderPagination,
-  total = 0,
-  isLoading = false,
-  className = "",
-}: SellersListViewProps) {
-  const [search, setSearch] = React.useState("");
-  const [selectedIds, setSelectedIds] = React.useState<string[]>([]);
-  return (
-    <Div className={className}>
-      {labels.title && (
-        <Heading level={1} className="text-2xl font-bold mb-6">{labels.title}</Heading>
-      )}
-      {renderSearch?.(search, setSearch)}
-      {renderFilters?.()}
-      {renderActiveFilters?.()}
-      {renderTable(selectedIds, setSelectedIds, isLoading)}
-      {renderPagination?.(total)}
-    </Div>
-  );
-}

package/src/features/seller/components/analytics/SellerAnalyticsStats.tsx

@@ -1,87 +0,0 @@
-"use client";
-
-import React from "react";
-import { Div, Heading, Span, Text } from "../../../../ui";
-import type { SellerAnalyticsSummary } from "../../types";
-
-export interface SellerAnalyticsStatsLabels {
-  totalRevenue?: string;
-  totalOrders?: string;
-  totalProducts?: string;
-  publishedProducts?: string;
-}
-
-export interface SellerAnalyticsStatsProps {
-  summary: SellerAnalyticsSummary;
-  labels?: SellerAnalyticsStatsLabels;
-  formatRevenue?: (amount: number) => string;
-  className?: string;
-}
-
-interface SellerAnalyticsStatCardProps {
-  label: string;
-  value: string;
-  icon: React.ReactNode;
-  colorClassName: string;
-}
-
-function SellerAnalyticsStatCard({
-  label,
-  value,
-  icon,
-  colorClassName,
-}: SellerAnalyticsStatCardProps) {
-  return (
-    <Div className="bg-white dark:bg-neutral-900 rounded-xl border border-neutral-200 dark:border-neutral-800 p-4 sm:p-5">
-      <Div className="flex items-start justify-between gap-3">
-        <Div>
-          <Text className="text-xs sm:text-sm text-neutral-600 dark:text-neutral-400 font-medium uppercase tracking-wide">
-            {label}
-          </Text>
-          <Heading level={3} className={`mt-1 text-2xl font-bold ${colorClassName}`}>
-            {value}
-          </Heading>
-        </Div>
-        <Span className="text-2xl sm:text-3xl" aria-hidden>
-          {icon}
-        </Span>
-      </Div>
-    </Div>
-  );
-}
-
-export function SellerAnalyticsStats({
-  summary,
-  labels = {},
-  formatRevenue = (amount) => String(amount),
-  className = "",
-}: SellerAnalyticsStatsProps) {
-  return (
-    <Div className={`grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 2xl:grid-cols-4 gap-4 ${className}`}>
-      <SellerAnalyticsStatCard
-        label={labels.totalRevenue ?? "Total Revenue"}
-        value={formatRevenue(summary.totalRevenue)}
-        icon="💰"
-        colorClassName="text-emerald-600 dark:text-emerald-400"
-      />
-      <SellerAnalyticsStatCard
-        label={labels.totalOrders ?? "Total Orders"}
-        value={String(summary.totalOrders)}
-        icon="📦"
-        colorClassName="text-blue-600 dark:text-blue-400"
-      />
-      <SellerAnalyticsStatCard
-        label={labels.totalProducts ?? "Total Products"}
-        value={String(summary.totalProducts)}
-        icon="🛍️"
-        colorClassName="text-violet-600 dark:text-violet-400"
-      />
-      <SellerAnalyticsStatCard
-        label={labels.publishedProducts ?? "Published Products"}
-        value={String(summary.publishedProducts)}
-        icon="✅"
-        colorClassName="text-amber-600 dark:text-amber-400"
-      />
-    </Div>
-  );
-}

package/src/features/seller/components/analytics/SellerRevenueChart.tsx

@@ -1,99 +0,0 @@
-"use client";
-
-import React from "react";
-import dynamic from "next/dynamic";
-import { Div, Heading, Text } from "../../../../ui";
-import type { SellerAnalyticsMonthEntry } from "../../types";
-
-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,
-});
-const ResponsiveContainer = dynamic(
-  () => import("recharts").then((m) => m.ResponsiveContainer),
-  { ssr: false },
-);
-
-export interface SellerRevenueChartLabels {
-  title?: string;
-  noData?: string;
-  revenueLabel?: string;
-}
-
-export interface SellerRevenueChartProps {
-  data: SellerAnalyticsMonthEntry[];
-  labels?: SellerRevenueChartLabels;
-  formatRevenue?: (amount: number) => string;
-  className?: string;
-}
-
-export function SellerRevenueChart({
-  data,
-  labels = {},
-  formatRevenue = (amount) => String(amount),
-  className = "",
-}: SellerRevenueChartProps) {
-  const hasRevenue = data.some((item) => item.revenue > 0);
-
-  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>
-      )}
-
-      {hasRevenue ? (
-        <Div className="h-[300px]">
-          <ResponsiveContainer width="100%" height="100%">
-            <BarChart data={data}>
-              <CartesianGrid strokeDasharray="3 3" strokeOpacity={0.3} />
-              <XAxis
-                dataKey="month"
-                tick={{ fontSize: 11, fill: "#6b7280" }}
-                tickLine={false}
-                axisLine={false}
-              />
-              <YAxis
-                tick={{ fontSize: 11, fill: "#6b7280" }}
-                tickLine={false}
-                axisLine={false}
-                tickFormatter={(value: number | string) =>
-                  formatRevenue(Number(value))
-                }
-              />
-              <Tooltip
-                formatter={(value: any) => [
-                  formatRevenue(Number(value)),
-                  labels.revenueLabel ?? "Revenue",
-                ]}
-              />
-              <Bar dataKey="revenue" fill="#6366f1" radius={[4, 4, 0, 0]} />
-            </BarChart>
-          </ResponsiveContainer>
-        </Div>
-      ) : (
-        <Text className="text-sm text-neutral-600 dark:text-neutral-400 text-center py-8">
-          {labels.noData ?? "No data available"}
-        </Text>
-      )}
-    </Div>
-  );
-}

package/src/features/seller/components/analytics/SellerTopProducts.tsx

@@ -1,76 +0,0 @@
-"use client";
-
-import React from "react";
-import { Div, Heading, Span, Text } from "../../../../ui";
-import type { SellerAnalyticsTopProduct } from "../../types";
-
-export interface SellerTopProductsLabels {
-  title?: string;
-  ordersLabel?: string;
-  noData?: string;
-  noDataDescription?: string;
-}
-
-export interface SellerTopProductsProps {
-  products: SellerAnalyticsTopProduct[];
-  labels?: SellerTopProductsLabels;
-  formatRevenue?: (amount: number) => string;
-  renderProductLink?: (product: SellerAnalyticsTopProduct) => React.ReactNode;
-  renderEmptyAction?: () => React.ReactNode;
-  className?: string;
-}
-
-export function SellerTopProducts({
-  products,
-  labels = {},
-  formatRevenue = (amount) => String(amount),
-  renderProductLink,
-  renderEmptyAction,
-  className = "",
-}: SellerTopProductsProps) {
-  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>
-      )}
-
-      {products.length > 0 ? (
-        <Div className="divide-y divide-neutral-100 dark:divide-neutral-800">
-          {products.map((product, index) => (
-            <Div key={product.productId} className="flex items-center gap-4 py-3">
-              <Span className="w-6 text-sm font-bold text-neutral-500 dark:text-neutral-400">
-                {index + 1}.
-              </Span>
-              <Div className="flex-1 min-w-0">
-                <Text className="text-sm font-medium truncate">{product.title}</Text>
-                <Text className="text-xs text-neutral-500 dark:text-neutral-400">
-                  {product.orders} {labels.ordersLabel ?? "orders"}
-                </Text>
-              </Div>
-              <Div className="text-right ml-2">
-                <Span className="text-sm font-semibold text-emerald-600 dark:text-emerald-400">
-                  {formatRevenue(product.revenue)}
-                </Span>
-                {renderProductLink?.(product)}
-              </Div>
-            </Div>
-          ))}
-        </Div>
-      ) : (
-        <Div className="text-center py-8">
-          <Text className="text-sm font-medium">{labels.noData ?? "No data available"}</Text>
-          {labels.noDataDescription && (
-            <Text className="text-xs text-neutral-500 dark:text-neutral-400 mt-1">
-              {labels.noDataDescription}
-            </Text>
-          )}
-          {renderEmptyAction?.()}
-        </Div>
-      )}
-    </Div>
-  );
-}

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

@@ -1,3 +0,0 @@
-export * from "./SellerAnalyticsStats";
-export * from "./SellerRevenueChart";
-export * from "./SellerTopProducts";

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

@@ -1,47 +0,0 @@
-export { SellerStatCard } from "./SellerStatCard";
-export { SellerSidebar } from "./SellerSidebar";
-export type { SellerNavItem } from "./SellerSidebar";
-export { SellerDashboardView } from "./SellerDashboardView";
-export type { SellerDashboardViewProps } from "./SellerDashboardView";
-export { SellerProductsView } from "./SellerProductsView";
-export type { SellerProductsViewProps } from "./SellerProductsView";
-export { SellerAuctionsView } from "./SellerAuctionsView";
-export type { SellerAuctionsViewProps } from "./SellerAuctionsView";
-export { SellerOrdersView } from "./SellerOrdersView";
-export type { SellerOrdersViewProps } from "./SellerOrdersView";
-export { SellerOffersView } from "./SellerOffersView";
-export type { SellerOffersViewProps } from "./SellerOffersView";
-export { SellerCouponsView } from "./SellerCouponsView";
-export type { SellerCouponsViewProps } from "./SellerCouponsView";
-export { SellersListView } from "./SellersListView";
-export type { SellersListViewProps } from "./SellersListView";
-export { SellerPayoutsView } from "./SellerPayoutsView";
-export type { SellerPayoutsViewProps } from "./SellerPayoutsView";
-export { SellerPayoutStats } from "./SellerPayoutStats";
-export type { SellerPayoutStatsProps } from "./SellerPayoutStats";
-export { SellerPayoutHistoryTable } from "./SellerPayoutHistoryTable";
-export type {
-  SellerPayoutHistoryTableProps,
-  SellerPayoutHistoryTableLabels,
-} from "./SellerPayoutHistoryTable";
-export { SellerPayoutSettingsView } from "./SellerPayoutSettingsView";
-export type { SellerPayoutSettingsViewProps } from "./SellerPayoutSettingsView";
-export { SellerAnalyticsView } from "./SellerAnalyticsView";
-export type { SellerAnalyticsViewProps } from "./SellerAnalyticsView";
-export { SellerCreateProductView } from "./SellerCreateProductView";
-export type { SellerCreateProductViewProps } from "./SellerCreateProductView";
-export { SellerEditProductView } from "./SellerEditProductView";
-export type { SellerEditProductViewProps } from "./SellerEditProductView";
-export { SellerStoreSetupView } from "./SellerStoreSetupView";
-export type { SellerStoreSetupViewProps } from "./SellerStoreSetupView";
-export { SellerStoreView } from "./SellerStoreView";
-export type { SellerStoreViewProps } from "./SellerStoreView";
-export { SellerStorefrontView } from "./SellerStorefrontView";
-export type { SellerStorefrontViewProps } from "./SellerStorefrontView";
-export { SellerShippingView } from "./SellerShippingView";
-export type { SellerShippingViewProps } from "./SellerShippingView";
-export { SellerAddressesView } from "./SellerAddressesView";
-export type { SellerAddressesViewProps } from "./SellerAddressesView";
-export { SellerGuideView } from "./SellerGuideView";
-export type { SellerGuideViewProps } from "./SellerGuideView";
-export * from "./analytics";

package/src/features/seller/hooks/useSellerPayouts.ts

@@ -1,51 +0,0 @@
-"use client";
-
-import { useQuery } from "@tanstack/react-query";
-import { apiClient } from "../../../http";
-import type { PayoutListResponse, SellerPayoutSettings } from "../types";
-
-export function useSellerPayouts(
-  params: { page?: number; pageSize?: number; status?: string } = {},
-  opts?: { enabled?: boolean },
-) {
-  const sp = new URLSearchParams();
-  if (params.page) sp.set("page", String(params.page));
-  if (params.pageSize) sp.set("pageSize", String(params.pageSize));
-  if (params.status) sp.set("status", params.status);
-  const qs = sp.toString();
-
-  const { data, isLoading, error, refetch } = useQuery<PayoutListResponse>({
-    queryKey: ["seller-payouts", qs],
-    queryFn: () =>
-      apiClient.get<PayoutListResponse>(
-        `/api/seller/payouts${qs ? `?${qs}` : ""}`,
-      ),
-    enabled: opts?.enabled ?? true,
-  });
-
-  return {
-    payouts: data?.items ?? [],
-    total: data?.total ?? 0,
-    totalPages: data?.totalPages ?? 0,
-    isLoading,
-    error: error instanceof Error ? error.message : null,
-    refetch,
-  };
-}
-
-export function useSellerPayoutSettings(opts?: { enabled?: boolean }) {
-  const { data, isLoading, error, refetch } =
-    useQuery<SellerPayoutSettings | null>({
-      queryKey: ["seller-payout-settings"],
-      queryFn: () =>
-        apiClient.get<SellerPayoutSettings>("/api/seller/payout-settings"),
-      enabled: opts?.enabled ?? true,
-    });
-
-  return {
-    settings: data ?? null,
-    isLoading,
-    error: error instanceof Error ? error.message : null,
-    refetch,
-  };
-}

package/src/features/seller/hooks/useSellerStore.ts

@@ -1,60 +0,0 @@
-"use client";
-
-import { useQuery } from "@tanstack/react-query";
-import { apiClient } from "../../../http";
-import type {
-  SellerStore,
-  SellerDashboardStats,
-  SellerAnalytics,
-} from "../types";
-
-export function useSellerStore(opts?: { enabled?: boolean }) {
-  const { data, isLoading, error, refetch } = useQuery<SellerStore | null>({
-    queryKey: ["seller-store"],
-    queryFn: () => apiClient.get<SellerStore>("/api/seller/store"),
-    enabled: opts?.enabled ?? true,
-  });
-
-  return {
-    store: data ?? null,
-    isLoading,
-    error: error instanceof Error ? error.message : null,
-    refetch,
-  };
-}
-
-export function useSellerDashboard(opts?: { enabled?: boolean }) {
-  const { data, isLoading, error, refetch } = useQuery<SellerDashboardStats>({
-    queryKey: ["seller-dashboard"],
-    queryFn: () => apiClient.get<SellerDashboardStats>("/api/seller/dashboard"),
-    enabled: opts?.enabled ?? true,
-    staleTime: 60_000,
-  });
-
-  return {
-    stats: data ?? null,
-    isLoading,
-    error: error instanceof Error ? error.message : null,
-    refetch,
-  };
-}
-
-export function useSellerAnalytics(
-  period = "30d",
-  opts?: { enabled?: boolean },
-) {
-  const { data, isLoading, error, refetch } = useQuery<SellerAnalytics>({
-    queryKey: ["seller-analytics", period],
-    queryFn: () =>
-      apiClient.get<SellerAnalytics>(`/api/seller/analytics?period=${period}`),
-    enabled: opts?.enabled ?? true,
-    staleTime: 5 * 60_000,
-  });
-
-  return {
-    analytics: data ?? null,
-    isLoading,
-    error: error instanceof Error ? error.message : null,
-    refetch,
-  };
-}

package/src/features/seller/index.ts

@@ -1,12 +0,0 @@
-export * from "./types";
-export * from "./hooks/useSellerStore";
-export * from "./hooks/useSellerPayouts";
-export * from "./components";
-export * from "./schemas";
-export * from "./columns";
-export {
-  SellerRepository,
-  PayoutsRepository,
-} from "./repository/seller.repository";
-export { manifest } from "./manifest";
-export { SELLER_PAGE_PERMISSIONS } from "./permission-map";

package/src/features/seller/manifest.ts

@@ -1,76 +0,0 @@
-import type { FeatureManifest } from "../../contracts";
-
-export const manifest: FeatureManifest = {
-  name: "seller",
-  i18nNamespace: "seller",
-  envKeys: [],
-  routes: [
-    { segment: "[locale]/seller", exports: { default: "SellerDashboardView" } },
-    {
-      segment: "[locale]/seller/products",
-      exports: { default: "SellerProductsView" },
-    },
-    {
-      segment: "[locale]/seller/products/new",
-      exports: { default: "SellerCreateProductView" },
-    },
-    {
-      segment: "[locale]/seller/products/[id]",
-      exports: { default: "SellerEditProductView" },
-    },
-    {
-      segment: "[locale]/seller/orders",
-      exports: { default: "SellerOrdersView" },
-    },
-    {
-      segment: "[locale]/seller/payouts",
-      exports: { default: "SellerPayoutsView" },
-    },
-    {
-      segment: "[locale]/seller/store",
-      exports: { default: "SellerStoreSetupView" },
-    },
-    {
-      segment: "[locale]/seller/analytics",
-      exports: { default: "SellerAnalyticsView" },
-    },
-    {
-      segment: "[locale]/seller/coupons",
-      exports: { default: "SellerCouponsView" },
-    },
-    {
-      segment: "[locale]/seller/shipping",
-      exports: { default: "SellerShippingView" },
-    },
-    {
-      segment: "[locale]/seller/addresses",
-      exports: { default: "SellerAddressesView" },
-    },
-    {
-      segment: "[locale]/become-a-seller",
-      exports: { default: "SellerGuideView" },
-    },
-    { segment: "[locale]/sellers", exports: { default: "SellersListView" } },
-  ],
-  apiRoutes: [
-    { segment: "api/seller/dashboard", methods: ["GET"] },
-    { segment: "api/seller/products", methods: ["GET", "POST"] },
-    {
-      segment: "api/seller/products/[id]",
-      methods: ["GET", "PATCH", "DELETE"],
-    },
-    { segment: "api/seller/orders", methods: ["GET"] },
-    { segment: "api/seller/payouts", methods: ["GET", "POST"] },
-    { segment: "api/seller/store", methods: ["GET", "PATCH"] },
-    { segment: "api/seller/analytics", methods: ["GET"] },
-    { segment: "api/seller/coupons", methods: ["GET", "POST"] },
-    { segment: "api/seller/coupons/[id]", methods: ["PATCH", "DELETE"] },
-    { segment: "api/seller/shipping", methods: ["GET", "PATCH"] },
-    {
-      segment: "api/seller/addresses",
-      methods: ["GET", "POST", "PATCH", "DELETE"],
-    },
-    { segment: "api/sellers", methods: ["GET"] },
-    { segment: "api/sellers/[storeSlug]", methods: ["GET"] },
-  ],
-};

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

@@ -1,32 +0,0 @@
-{
-  "storeStatus": {
-    "pending": "Pending",
-    "active": "Active",
-    "suspended": "Suspended",
-    "rejected": "Rejected"
-  },
-  "payoutStatus": {
-    "pending": "Pending",
-    "processing": "Processing",
-    "completed": "Completed",
-    "failed": "Failed"
-  },
-  "dashboard": {
-    "totalRevenue": "Total Revenue",
-    "pendingPayouts": "Pending Payouts",
-    "activeListings": "Active Listings",
-    "totalOrders": "Total Orders",
-    "pendingOrders": "Pending Orders"
-  },
-  "sidebar": {
-    "dashboard": "Dashboard",
-    "products": "Products",
-    "orders": "Orders",
-    "payouts": "Payouts",
-    "store": "My Store",
-    "analytics": "Analytics",
-    "coupons": "Coupons",
-    "shipping": "Shipping",
-    "addresses": "Addresses"
-  }
-}

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

@@ -1,18 +0,0 @@
-// appkit/src/features/seller/permission-map.ts
-import type { Permission } from "../../security";
-
-/** Required permission for each seller route path */
-export const SELLER_PAGE_PERMISSIONS: Record<string, Permission> = {
-  "/seller": "seller:access",
-  "/seller/dashboard": "seller:analytics",
-  "/seller/products": "seller:products:read",
-  "/seller/products/new": "seller:products:write",
-  "/seller/products/[id]": "seller:products:write",
-  "/seller/orders": "seller:orders:read",
-  "/seller/orders/[id]": "seller:orders:read",
-  "/seller/analytics": "seller:analytics",
-  "/seller/coupons": "seller:coupons",
-  "/seller/store": "seller:store",
-  "/seller/payouts": "seller:payouts:read",
-  "/seller/shipping": "seller:shipping",
-};