+
+ {/* Background gradient mesh */}
+
+ );
+}
+
+export default LoginPage;
\ No newline at end of file
diff --git a/admin-next/src/app/page.tsx b/admin-next/src/app/page.tsx
new file mode 100755
index 0000000..e7374f9
--- /dev/null
+++ b/admin-next/src/app/page.tsx
@@ -0,0 +1,145 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { useAuthStore } from "@/stores/auth-store";
+import { AdminSidebar } from "@/components/layout/admin-sidebar";
+import { AdminHeader } from "@/components/layout/admin-header";
+import { SidebarProvider, SidebarInset } from "@/components/ui/sidebar";
+import { LoginPage } from "@/app/login/page";
+import { DashboardPage } from "@/components/dashboard/dashboard-page";
+import { CatalogHub } from "@/components/catalog/catalog-hub";
+import { UsersPage } from "@/components/users/users-page";
+import { UserDetailPage } from "@/components/users/user-detail-page";
+import { WalletsPage } from "@/components/wallets/wallets-page";
+import { PurchasesPage } from "@/components/purchases/purchases-page";
+import { AuditPage } from "@/components/audit/audit-page";
+
+import { SettingsPage } from "@/components/settings/settings-page";
+import { LocalesPage } from "@/components/locales/locales-page";
+import { SeedPage } from "@/components/seed/seed-page";
+import { ChatbotSettingsPage } from "@/components/chatbot/chatbot-settings-page";
+import { LeadsPage } from "@/components/leads/leads-page";
+import { LeadDetailPage } from "@/components/leads/lead-detail-page";
+import { ErrorBoundary } from "@/components/shared/error-boundary";
+import { AdminFooter } from "@/components/layout/admin-footer";
+import { useKeyboardShortcuts } from "@/hooks/use-keyboard-shortcuts";
+import { Search } from "lucide-react";
+import { Button } from "@/components/ui/button";
+
+export default function AppPage() {
+ const { isAuthenticated, checkSession } = useAuthStore();
+ const [ready, setReady] = useState(false);
+ const [page, setPage] = useState
+
+
+
+
+ {/* Subtle grid pattern */}
+
+
+
+ {/* Logo area */}
+
+
+ Sign In
+
+ Use your admin secret token to authenticate
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ TG Shop Admin
++ Enter your admin token to continue +
+
+
+
+ {/* Background gradient orbs */}
+
+
+
+
+ );
+ }
+
+ if (!isAuthenticated) {
+ return
+
+
+ TS
+
+
+
+ {/* Progress bar */}
+ TG Shop Admin
+Loading your workspace...
+
+
+
+
+
+ );
+ };
+
+ return (
+
+
+ Page not found
+The page you're looking for doesn't exist.
+ +
+
+
+ {renderPage()}
+
+
+ {Array.from({ length: 10 }).map((_, i) => (
+
+ );
+}
+
+export function AuditPage() {
+ const [logs, setLogs] = useState
+
+ ))}
+
+
+ );
+}
diff --git a/admin-next/src/components/catalog/catalog-hub.tsx b/admin-next/src/components/catalog/catalog-hub.tsx
new file mode 100755
index 0000000..332884d
--- /dev/null
+++ b/admin-next/src/components/catalog/catalog-hub.tsx
@@ -0,0 +1,97 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { Package, Tag, MapPin, FolderTree } from "lucide-react";
+import { CatalogPage } from "./catalog-page";
+import { CategoriesPage } from "../categories/categories-page";
+import { LocationsPage } from "../locations/locations-page";
+
+const TABS = [
+ { value: "products", label: "Товары", icon: Package, hash: "products" },
+ { value: "categories", label: "Категории", icon: Tag, hash: "categories" },
+ { value: "locations", label: "Локации", icon: MapPin, hash: "locations" },
+] as const;
+
+type TabValue = (typeof TABS)[number]["value"];
+
+function resolveInitialTab(): TabValue {
+ const hash = window.location.hash.slice(1);
+ const params = hash.split("?")[1] || "";
+ const match = params.match(/tab=(\w+)/);
+ if (match) {
+ const v = match[1];
+ if (TABS.some((t) => t.value === v)) return v as TabValue;
+ }
+ const path = hash.split("?")[0];
+ if (path === "/catalog/categories") return "categories";
+ if (path === "/catalog/locations") return "locations";
+ return "products";
+}
+
+export function CatalogHub() {
+ const [activeTab, setActiveTab] = useState
+
+
+
+
+ Audit Log
++ {total} entr{total !== 1 ? "ies" : "y"} total · Track admin actions and system events +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ From
+ { setDateFrom(e.target.value); setPage(1); }}
+ className="h-8 w-40 text-sm"
+ />
+
+
+ To
+ { setDateTo(e.target.value); setPage(1); }}
+ className="h-8 w-40 text-sm"
+ />
+
+
+ {loading ? (
+
+
+ )}
+
+
+ {!loading && total > 0 && (
+
+
+ ) : logs.length === 0 ? (
+
+
+ ) : (
+ No audit entries
+Audit log is empty or no entries match the current filter.
+
+
+
+ {TABS.map((tab) => (
+
+
+ ))}
+
+
+
+
+
+
+
+
+
+
+ );
+}
diff --git a/admin-next/src/components/catalog/catalog-page.tsx b/admin-next/src/components/catalog/catalog-page.tsx
new file mode 100755
index 0000000..97ee317
--- /dev/null
+++ b/admin-next/src/components/catalog/catalog-page.tsx
@@ -0,0 +1,1513 @@
+"use client";
+
+import { useState, useEffect, useCallback, useRef } from "react";
+import {
+ ResizablePanelGroup,
+ ResizablePanel,
+ ResizableHandle,
+} from "@/components/ui/resizable";
+import {
+ Accordion,
+ AccordionContent,
+ AccordionItem,
+ AccordionTrigger,
+} from "@/components/ui/accordion";
+import {
+ Table,
+ TableBody,
+ TableCell,
+ TableHead,
+ TableHeader,
+ TableRow,
+} from "@/components/ui/table";
+import {
+ Dialog,
+ DialogContent,
+ DialogHeader,
+ DialogTitle,
+ DialogFooter,
+} from "@/components/ui/dialog";
+import {
+ Select,
+ SelectContent,
+ SelectGroup,
+ SelectItem,
+ SelectLabel,
+ SelectTrigger,
+ SelectValue,
+} from "@/components/ui/select";
+import {
+ AlertDialog,
+ AlertDialogAction,
+ AlertDialogCancel,
+ AlertDialogContent,
+ AlertDialogDescription,
+ AlertDialogFooter,
+ AlertDialogHeader,
+ AlertDialogTitle,
+} from "@/components/ui/alert-dialog";
+import { Switch } from "@/components/ui/switch";
+import { Button } from "@/components/ui/button";
+import { Badge } from "@/components/ui/badge";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import { Checkbox } from "@/components/ui/checkbox";
+import { Skeleton } from "@/components/ui/skeleton";
+import { toast } from "sonner";
+import {
+ Plus,
+ Pencil,
+ Trash2,
+ Search,
+ Package,
+ MapPin,
+ FolderOpen,
+ Tag,
+ ChevronRight,
+ X,
+ BarChart3,
+ Copy,
+} from "lucide-react";
+
+// ─── Types ───────────────────────────────────────
+
+interface TreeLocation {
+ id: number;
+ country: string;
+ city: string;
+ district: string;
+ isActive: number;
+ createdAt: string;
+ categoryCount: number;
+ productCount: number;
+}
+
+interface TreeCategory {
+ id: number;
+ locationId: number;
+ name: string;
+ isActive: number;
+ createdAt: string;
+ location: { id: number; country: string; city: string; district: string };
+ subcategoryCount: number;
+ productCount: number;
+}
+
+interface TreeSubcategory {
+ id: number;
+ categoryId: number;
+ name: string;
+ isActive: number;
+ createdAt: string;
+ category: { id: number; name: string; locationId: number };
+ productCount: number;
+}
+
+interface CatalogTree {
+ locations: TreeLocation[];
+ categories: TreeCategory[];
+ subcategories: TreeSubcategory[];
+}
+
+interface Product {
+ id: number;
+ locationId: number;
+ categoryId: number;
+ subcategoryId: number | null;
+ name: string;
+ description: string | null;
+ privateData: string | null;
+ price: number;
+ quantityInStock: number;
+ photoUrl: string | null;
+ hiddenPhotoUrl: string | null;
+ hiddenCoordinates: string | null;
+ hiddenDescription: string | null;
+ isMono: number;
+ createdAt: string;
+ category: { id: number; name: string };
+ subcategory: { id: number; name: string } | null;
+ location: { id: number; country: string; city: string; district: string };
+}
+
+interface ProductFormData {
+ locationId: string;
+ categoryId: string;
+ subcategoryId: string;
+ name: string;
+ description: string;
+ privateData: string;
+ price: string;
+ quantityInStock: string;
+ photoUrl: string;
+ hiddenPhotoUrl: string;
+ hiddenCoordinates: string;
+ hiddenDescription: string;
+ isMono: boolean;
+}
+
+const emptyForm: ProductFormData = {
+ locationId: "",
+ categoryId: "",
+ subcategoryId: "",
+ name: "",
+ description: "",
+ privateData: "",
+ price: "",
+ quantityInStock: "0",
+ photoUrl: "",
+ hiddenPhotoUrl: "",
+ hiddenCoordinates: "",
+ hiddenDescription: "",
+ isMono: false,
+};
+
+type FilterType =
+ | { type: "all" }
+ | { type: "location"; locationId: number }
+ | { type: "category"; categoryId: number; locationId: number }
+ | { type: "subcategory"; subcategoryId: number; categoryId: number; locationId: number };
+
+// ─── Helpers ─────────────────────────────────────
+
+function getProductCountColor(count: number): string {
+ if (count === 0) return "border-l-muted-foreground/30";
+ if (count <= 5) return "border-l-emerald-500";
+ if (count <= 10) return "border-l-yellow-500";
+ return "border-l-orange-500";
+}
+
+// ─── Component ───────────────────────────────────
+
+export function CatalogPage() {
+ // Tree state
+ const [tree, setTree] = useState
+
+
+
+
+
+
+
+
+ Каталог товаров
++ Управление товарами, категориями и локациями +
+
+
+ );
+ }
+
+ if (treeError) {
+ return (
+
+
+ );
+ }
+
+ // ─── Location select groups for form ───────────
+ const locationGroups = new Map{treeError}
+ +
+ {/* Header */}
+
+
+
+
+ {/* Main content */}
+
+
+ {/* ─── Left Panel: Tree ─── */}
+
+
+
+
+
+
+
+
+ {/* ─── Product Modal ─── */}
+
+
+
+ Catalog Tree
+
+
+
+ {/* Add Location Form */}
+ {addMode === "location" && (
+
+
+ )}
+
+ {/* Tree */}
+
+ setAddCountry(e.target.value)}
+ className="h-8 text-xs"
+ />
+ setAddCity(e.target.value)}
+ className="h-8 text-xs"
+ />
+
+
+ setAddDistrict(e.target.value)}
+ className="h-8 text-xs"
+ ref={addInputRef}
+ onKeyDown={(e) => {
+ if (e.key === "Enter") handleAdd();
+ if (e.key === "Escape") setAddMode(null);
+ }}
+ />
+
+
+
+
+
+
+ {countries.length === 0 ? (
+
+ {countries.map((country) => {
+ const countryEntry = groupedTree.get(country)!;
+ const cities = Array.from(countryEntry.cityMap.keys()).sort();
+ return (
+
+
+
+
+
+ {cities.map((city) => {
+ const cityEntry = countryEntry.cityMap.get(city)!;
+ const districts = Array.from(cityEntry.districtMap.keys()).sort();
+ return (
+
+
+ );
+ })}
+
+ )}
+
+ + No locations yet. Add one above. +
+ ) : ( +
+
+ {districts.map((district) => {
+ const { location, categories } = cityEntry.districtMap.get(district)!;
+ const totalCount = location.categoryCount + location.productCount;
+ const isDistrict = district !== "(no district)";
+ return (
+
+
+
+
+ {/* Inline rename for location */}
+ {renamingId === `loc-${location.id}` && (
+
+ {categories.length === 0 ? (
+
+
+ );
+ })}
+
+
+ );
+ })}
+ {
+ e.stopPropagation();
+ handleNodeClick({ type: "location", locationId: location.id });
+ }}
+ >
+
+ {totalCount}
+
+ {location.isActive === 0 && (
+
+ off
+
+ )}
+
+ e.stopPropagation()}>
+ handleToggleActive("location", location.id)}
+ className="scale-75"
+ />
+
+
+
+
+
+ setRenameValue(e.target.value)}
+ className="h-7 text-xs"
+ onKeyDown={(e) => {
+ if (e.key === "Enter") handleRename("location", location.id);
+ if (e.key === "Escape") setRenamingId(null);
+ }}
+ onBlur={() => handleRename("location", location.id)}
+ />
+
+ )}
+
+ {/* Add Category Form */}
+ {addMode === "category" && addParentId === location.id && (
+
+ setAddInput(e.target.value)}
+ placeholder="Category name..."
+ className="h-7 text-xs"
+ onKeyDown={(e) => {
+ if (e.key === "Enter") handleAdd();
+ if (e.key === "Escape") setAddMode(null);
+ }}
+ />
+
+
+
+ )}
+
+ No categories
+ ) : ( + categories.map((cat) => { + const subs = tree?.subcategories.filter((s) => s.categoryId === cat.id) || []; + return ( +
+
+
+
+
+
+ {/* Inline rename for category */}
+ {renamingId === `cat-${cat.id}` && (
+
+ {subs.length === 0 ? (
+
+
+
+
+ );
+ })
+ )}
+ {
+ e.stopPropagation();
+ handleNodeClick({ type: "category", categoryId: cat.id, locationId: cat.locationId });
+ }}
+ >
+
+ {cat.productCount} {cat.productCount === 1 ? "item" : "items"}
+
+ {cat.subcategoryCount > 0 && (
+
+ {cat.subcategoryCount} sub
+
+ )}
+ {cat.isActive === 0 && (
+
+ off
+
+ )}
+
+ e.stopPropagation()}>
+ handleToggleActive("category", cat.id)}
+ className="scale-75"
+ />
+
+
+
+
+
+ setRenameValue(e.target.value)}
+ className="h-7 text-xs"
+ onKeyDown={(e) => {
+ if (e.key === "Enter") handleRename("category", cat.id);
+ if (e.key === "Escape") setRenamingId(null);
+ }}
+ onBlur={() => handleRename("category", cat.id)}
+ />
+
+ )}
+
+ {/* Add Subcategory Form */}
+ {addMode === "subcategory" && addParentId === cat.id && (
+
+ setAddInput(e.target.value)}
+ placeholder="Subcategory name..."
+ className="h-7 text-xs"
+ onKeyDown={(e) => {
+ if (e.key === "Enter") handleAdd();
+ if (e.key === "Escape") setAddMode(null);
+ }}
+ />
+
+
+
+ )}
+
+ No subcategories
+ ) : ( + subs.map((sub) => ( +
+ handleNodeClick({
+ type: "subcategory",
+ subcategoryId: sub.id,
+ categoryId: sub.categoryId,
+ locationId: sub.category.locationId,
+ })
+ }
+ >
+
+ {sub.productCount}
+
+ {sub.isActive === 0 && (
+
+ off
+
+ )}
+
+ ))
+ )}
+ e.stopPropagation()}>
+ handleToggleActive("subcategory", sub.id)}
+ className="scale-50"
+ />
+ {renamingId !== `sub-${sub.id}` && (
+ <>
+
+
+
+ )}
+
+
+ {/* Summary bar */}
+
+
+
+
+ {/* Toolbar */}
+
+
+
+ {/* Table */}
+
+
+ {filter.type !== "all" && (
+
+ )}
+
+ {productTotal} product{productTotal !== 1 ? "s" : ""}
+
+
+ {productsLoading ? (
+
+
+ )}
+
+
+ {/* Pagination */}
+ {totalPages > 1 && (
+
+ {Array.from({ length: 5 }).map((_, i) => (
+
+ ) : products.length === 0 ? (
+
+
+ ) : (
+ No products found
+
+
+ Page {productPage} of {totalPages}
+
+
+ )}
+
+
+
+
+