@goplusvn/core 0.1.0 → 0.1.1

package/src/hooks/index.tsx

@@ -0,0 +1,598 @@
+// @goerp/core/hooks
+// Core React hooks for GoERP platform
+// Consolidated from packages/shared/hooks
+
+"use client";
+
+import {
+  useState,
+  useEffect,
+  useCallback,
+  useRef,
+  useContext,
+  createContext,
+  useMemo,
+} from "react";
+import type { ReactNode } from "react";
+import {
+  useSearchParams,
+  useRouter,
+  usePathname,
+  useParams,
+} from "next/navigation";
+import { useMedia } from "react-use";
+import { useDirection } from "@radix-ui/react-direction";
+
+import { SettingsContext, defaultSettings } from "../providers";
+import { remToPx } from "../utils";
+
+const defaultSettingsValue = {
+  settings: defaultSettings,
+  updateSettings: () => {},
+  resetSettings: () => {},
+};
+
+// ============================================================================
+// Debounce Hook
+// ============================================================================
+
+export function useDebounce<T>(value: T, delay: number): T {
+  const [debouncedValue, setDebouncedValue] = useState<T>(value);
+
+  useEffect(() => {
+    const timer = setTimeout(() => setDebouncedValue(value), delay);
+    return () => clearTimeout(timer);
+  }, [value, delay]);
+
+  return debouncedValue;
+}
+
+// ============================================================================
+// Storage Hooks
+// ============================================================================
+
+export function useLocalStorage<T>(
+  key: string,
+  initialValue: T,
+): [T, (value: T | ((prev: T) => T)) => void] {
+  const [storedValue, setStoredValue] = useState<T>(initialValue);
+
+  useEffect(() => {
+    if (typeof window !== "undefined") {
+      try {
+        const item = window.localStorage.getItem(key);
+        if (item) {
+          setStoredValue(JSON.parse(item));
+        }
+      } catch (error) {
+        console.warn(`Error reading localStorage key "${key}":`, error);
+      }
+    }
+  }, [key]);
+
+  const setValue = useCallback(
+    (value: T | ((prev: T) => T)) => {
+      try {
+        const valueToStore =
+          value instanceof Function ? value(storedValue) : value;
+        setStoredValue(valueToStore);
+        if (typeof window !== "undefined") {
+          window.localStorage.setItem(key, JSON.stringify(valueToStore));
+        }
+      } catch (error) {
+        console.warn(`Error setting localStorage key "${key}":`, error);
+      }
+    },
+    [key, storedValue],
+  );
+
+  return [storedValue, setValue];
+}
+
+// ============================================================================
+// State Hooks
+// ============================================================================
+
+export function usePrevious<T>(value: T): T | undefined {
+  const ref = useRef<T>(undefined);
+
+  useEffect(() => {
+    ref.current = value;
+  }, [value]);
+
+  return ref.current;
+}
+
+export function useToggle(
+  initialValue = false,
+): [boolean, () => void, (value: boolean) => void] {
+  const [value, setValue] = useState(initialValue);
+  const toggle = useCallback(() => setValue((v) => !v), []);
+  return [value, toggle, setValue];
+}
+
+export function useMounted(): boolean {
+  const [mounted, setMounted] = useState(false);
+
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  return mounted;
+}
+
+// ============================================================================
+// Media Hooks
+// ============================================================================
+
+export function useMediaQuery(query: string): boolean {
+  const [matches, setMatches] = useState(false);
+
+  useEffect(() => {
+    if (typeof window !== "undefined") {
+      const media = window.matchMedia(query);
+      setMatches(media.matches);
+
+      const listener = (event: MediaQueryListEvent) =>
+        setMatches(event.matches);
+      media.addEventListener("change", listener);
+      return () => media.removeEventListener("change", listener);
+    }
+  }, [query]);
+
+  return matches;
+}
+
+export function useMobile(): boolean {
+  return useMediaQuery("(max-width: 768px)");
+}
+
+// ============================================================================
+// Clipboard Hook
+// ============================================================================
+
+export function useCopyToClipboard(): [
+  string | null,
+  (text: string) => Promise<boolean>,
+] {
+  const [copiedText, setCopiedText] = useState<string | null>(null);
+
+  const copy = useCallback(async (text: string): Promise<boolean> => {
+    if (!navigator?.clipboard) {
+      console.warn("Clipboard not supported");
+      return false;
+    }
+
+    try {
+      await navigator.clipboard.writeText(text);
+      setCopiedText(text);
+      return true;
+    } catch (error) {
+      console.warn("Copy failed", error);
+      setCopiedText(null);
+      return false;
+    }
+  }, []);
+
+  return [copiedText, copy];
+}
+
+// ============================================================================
+// Settings Hooks
+// ============================================================================
+
+export function useSettings() {
+  const context = useContext(SettingsContext);
+  if (!context) {
+    return defaultSettingsValue;
+  }
+  return context;
+}
+
+export function useIsVertical() {
+  const { settings } = useSettings();
+  return settings.layout === "vertical";
+}
+
+export function useIsDarkMode() {
+  const { settings } = useSettings();
+  const isDarkModePreferred = useMedia("(prefers-color-scheme: dark)");
+
+  let resolvedMode = settings.mode;
+  if (resolvedMode === "system") {
+    resolvedMode = isDarkModePreferred ? "dark" : "light";
+  }
+
+  return resolvedMode === "dark";
+}
+
+export function useRadius(asPx = true) {
+  const { settings } = useSettings();
+
+  let radius = Number(settings.radius);
+  if (asPx) {
+    radius = remToPx(radius);
+  }
+
+  return radius;
+}
+
+export function useDensity() {
+  const { settings } = useSettings();
+  return settings.density;
+}
+
+export function useIsRtl() {
+  const direction = useDirection();
+  return direction === "rtl";
+}
+
+// ============================================================================
+// View Mode Hook
+// ============================================================================
+
+export function useViewMode(
+  storageKey: string,
+  defaultMode: "table" | "kanban" | "grid" = "table",
+) {
+  const [viewMode, setViewMode] = useState<"table" | "kanban" | "grid">(
+    defaultMode,
+  );
+
+  useEffect(() => {
+    const saved = localStorage.getItem(storageKey);
+    if (saved === "kanban" || saved === "table" || saved === "grid") {
+      setViewMode(saved as "table" | "kanban" | "grid");
+    }
+  }, [storageKey]);
+
+  const handleViewModeChange = (mode: "table" | "kanban" | "grid") => {
+    setViewMode(mode);
+    localStorage.setItem(storageKey, mode);
+  };
+
+  return [viewMode, handleViewModeChange] as const;
+}
+
+// ============================================================================
+// Dictionary Hooks
+// ============================================================================
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type DictionaryType = any;
+
+const DictionaryContext = createContext<DictionaryType | null>(null);
+
+interface DictionaryProviderProps {
+  dictionary: DictionaryType;
+  children: ReactNode;
+}
+
+export function DictionaryProvider({
+  dictionary,
+  children,
+}: DictionaryProviderProps) {
+  return (
+    <DictionaryContext.Provider value={dictionary}>
+      {children}
+    </DictionaryContext.Provider>
+  );
+}
+
+export function useDictionary() {
+  const dictionary = useContext(DictionaryContext);
+
+  if (!dictionary) {
+    throw new Error("useDictionary must be used within DictionaryProvider");
+  }
+
+  return dictionary;
+}
+
+export function useDictionaryValue(key: string, fallback?: string): string {
+  const dictionary = useDictionary();
+
+  const keys = key.split(".");
+  let value: unknown = dictionary;
+
+  for (const k of keys) {
+    if (value && typeof value === "object" && k in value) {
+      value = (value as Record<string, unknown>)[k];
+    } else {
+      return fallback || key;
+    }
+  }
+
+  return typeof value === "string" ? value : fallback || key;
+}
+
+// ============================================================================
+// CRUD Translations Hook
+// ============================================================================
+
+export function useCrudTranslations() {
+  const params = useParams();
+  const locale = (params.lang as string) || "en";
+
+  const t = useCallback(
+    async (
+      key: string,
+      _params?: Record<string, string | number>,
+    ): Promise<string> => {
+      return key;
+    },
+    [],
+  );
+
+  const tSync = useCallback(
+    (
+      translations: DictionaryType,
+      key: string,
+      params?: Record<string, string | number>,
+    ): string => {
+      const keys = key.split(".");
+      let value: unknown = translations;
+
+      for (const k of keys) {
+        if (value && typeof value === "object" && k in value) {
+          value = (value as Record<string, unknown>)[k];
+        } else {
+          return key;
+        }
+      }
+
+      if (typeof value === "string") {
+        if (params) {
+          return value.replace(/\{\{(\w+)\}\}/g, (_, param) => {
+            return String(params[param] || "");
+          });
+        }
+        return value;
+      }
+
+      return key;
+    },
+    [],
+  );
+
+  return {
+    t,
+    tSync,
+    locale,
+  };
+}
+
+// ============================================================================
+// Prefetch Hook
+// ============================================================================
+
+export function usePrefetch() {
+  const router = useRouter();
+  const prefetchedRoutes = useRef<Set<string>>(new Set());
+  const prefetchedAPIs = useRef<Set<string>>(new Set());
+
+  const prefetchRoute = useCallback(
+    (route: string) => {
+      if (prefetchedRoutes.current.has(route)) {
+        return;
+      }
+
+      try {
+        router.prefetch(route);
+        prefetchedRoutes.current.add(route);
+      } catch (error) {
+        console.debug("Prefetch failed for route:", route, error);
+      }
+    },
+    [router],
+  );
+
+  const prefetchAPI = useCallback((endpoint: string, options?: RequestInit) => {
+    const url = endpoint;
+    const cacheKey = `${url}-${JSON.stringify(options || {})}`;
+
+    if (prefetchedAPIs.current.has(cacheKey)) {
+      return;
+    }
+
+    try {
+      fetch(url, {
+        method: "HEAD",
+        ...options,
+        headers: {
+          ...options?.headers,
+          "Cache-Control": "max-age=60",
+        },
+      })
+        .then(() => {
+          prefetchedAPIs.current.add(cacheKey);
+        })
+        .catch(() => {});
+    } catch (error) {
+      console.debug("API prefetch failed:", url, error);
+    }
+  }, []);
+
+  const prefetchCrudPage = useCallback(
+    (entity: string, apiEndpoint: string) => {
+      const route = `/crud/${entity}`;
+      prefetchRoute(route);
+
+      const apiUrl = `${apiEndpoint}?page=1&pageSize=10`;
+      prefetchAPI(apiUrl);
+    },
+    [prefetchRoute, prefetchAPI],
+  );
+
+  const prefetchNextPage = useCallback(
+    (
+      apiEndpoint: string,
+      currentPage: number,
+      pageSize: number,
+      queryParams?: Record<string, unknown>,
+    ) => {
+      const nextPage = currentPage + 1;
+      const params = new URLSearchParams({
+        page: String(nextPage),
+        pageSize: String(pageSize),
+      });
+
+      if (queryParams) {
+        Object.entries(queryParams).forEach(([k, v]) => {
+          if (v === undefined || v === null || v === "") {
+            return;
+          }
+
+          if (typeof v === "object" && !Array.isArray(v)) {
+            params.append(k, JSON.stringify(v));
+          } else if (Array.isArray(v)) {
+            params.append(k, JSON.stringify(v));
+          } else {
+            params.append(k, String(v));
+          }
+        });
+      }
+
+      const apiUrl = `${apiEndpoint}?${params.toString()}`;
+      prefetchAPI(apiUrl);
+    },
+    [prefetchAPI],
+  );
+
+  return {
+    prefetchRoute,
+    prefetchAPI,
+    prefetchCrudPage,
+    prefetchNextPage,
+  };
+}
+
+// ============================================================================
+// URL Filters Hook
+// ============================================================================
+
+interface UseUrlFiltersOptions {
+  filters?: {
+    search?: string;
+    dateRange?: { from?: Date; to?: Date };
+    materialGroups?: string[];
+    suppliers?: string[];
+    statuses?: string[];
+    warehouses?: string[];
+  };
+}
+
+export function useUrlFilters(options: UseUrlFiltersOptions = {}) {
+  const router = useRouter();
+  const pathname = usePathname();
+  const searchParams = useSearchParams();
+
+  const currentFilters = useMemo(() => {
+    return {
+      search: searchParams.get("search") || "",
+      dateRange: {
+        from: searchParams.get("from")
+          ? new Date(searchParams.get("from")!)
+          : undefined,
+        to: searchParams.get("to")
+          ? new Date(searchParams.get("to")!)
+          : undefined,
+      },
+      materialGroups:
+        searchParams.get("materialGroups")?.split(",").filter(Boolean) || [],
+      suppliers:
+        searchParams.get("suppliers")?.split(",").filter(Boolean) || [],
+      statuses: searchParams.get("statuses")?.split(",").filter(Boolean) || [],
+      warehouses:
+        searchParams.get("warehouses")?.split(",").filter(Boolean) || [],
+    };
+  }, [searchParams]);
+
+  const updateFilters = useCallback(
+    (filters: UseUrlFiltersOptions["filters"]) => {
+      const params = new URLSearchParams(searchParams.toString());
+
+      if (filters?.search) {
+        params.set("search", filters.search);
+      } else {
+        params.delete("search");
+      }
+
+      if (filters?.dateRange?.from) {
+        params.set("from", filters.dateRange.from.toISOString());
+      } else {
+        params.delete("from");
+      }
+
+      if (filters?.dateRange?.to) {
+        params.set("to", filters.dateRange.to.toISOString());
+      } else {
+        params.delete("to");
+      }
+
+      if (filters?.materialGroups && filters.materialGroups.length > 0) {
+        params.set("materialGroups", filters.materialGroups.join(","));
+      } else {
+        params.delete("materialGroups");
+      }
+
+      if (filters?.suppliers && filters.suppliers.length > 0) {
+        params.set("suppliers", filters.suppliers.join(","));
+      } else {
+        params.delete("suppliers");
+      }
+
+      if (filters?.statuses && filters.statuses.length > 0) {
+        params.set("statuses", filters.statuses.join(","));
+      } else {
+        params.delete("statuses");
+      }
+
+      if (filters?.warehouses && filters.warehouses.length > 0) {
+        params.set("warehouses", filters.warehouses.join(","));
+      } else {
+        params.delete("warehouses");
+      }
+
+      router.push(`${pathname}?${params.toString()}`);
+    },
+    [router, pathname, searchParams],
+  );
+
+  const clearFilters = useCallback(() => {
+    router.push(pathname);
+  }, [router, pathname]);
+
+  return {
+    currentFilters,
+    updateFilters,
+    clearFilters,
+  };
+}
+
+
+
+// ============================================================================
+// Tab Navigation Back Hook
+// ============================================================================
+
+// Re-export from layout for use in hooks
+export { useTabNavigation } from "../ui/layout";
+
+/**
+ * Hook to handle back navigation that integrates with the tab system.
+ */
+export function useTabNavigationBack() {
+  // Import dynamically to avoid circular dependency issues at module level
+  const { useTabNavigation } = require("../ui/layout");
+  const { closeAndGoToParent } = useTabNavigation();
+
+  return {
+    navigateBack: closeAndGoToParent,
+  };
+}
+// ============================================================================
+// Tenant Hooks
+// ============================================================================
+
+export * from "./use-tenant";

package/src/hooks/use-tenant.test.tsx

@@ -0,0 +1,30 @@
+import { renderHook } from "@testing-library/react";
+import { describe, it, expect } from "vitest";
+import { useTenant } from "./use-tenant";
+import { TenantProvider } from "../providers/tenant-provider";
+
+describe("useTenant", () => {
+  const mockTenant = {
+    id: "test-tenant",
+    name: "Test Tenant",
+    branding: {
+      companyName: "Test Company",
+    },
+  };
+
+  it("should return tenant context when used within TenantProvider", () => {
+    const wrapper = ({ children }: { children: React.ReactNode }) => (
+      <TenantProvider tenant={mockTenant}>{children}</TenantProvider>
+    );
+
+    const { result } = renderHook(() => useTenant(), { wrapper });
+    expect(result.current.tenant).toEqual(mockTenant);
+  });
+
+  it("should throw error when used outside TenantProvider", () => {
+    // Assert that rendering the hook throws an error
+    expect(() => {
+      renderHook(() => useTenant());
+    }).toThrow("useTenantContext must be used within a TenantProvider");
+  });
+});

package/src/hooks/use-tenant.ts

@@ -0,0 +1,5 @@
+import { useTenantContext } from "../providers/tenant-provider";
+
+export function useTenant() {
+  return useTenantContext();
+}

package/src/index.ts

@@ -0,0 +1,17 @@
+// @goerp/core - Main Entry Point
+// ERP Core Library for building enterprise applications
+
+// Re-export core modules (non-conflicting)
+export * from "./system";
+export * from "./types";
+
+// Note: Utils and Configs should be imported from their subpaths to avoid conflicts:
+// import { cn, formatDate } from "@goerp/core/utils"
+// import { i18n, crudConfig } from "@goerp/core/configs"
+
+// React components are exported from their respective subpaths:
+// import { AppShell } from "@goerp/core/layout"
+// import { Button } from "@goerp/core/ui"
+// import { useToast } from "@goerp/core/hooks"
+// import { CrudPage } from "@goerp/core/crud"
+// import { withAuth } from "@goerp/core/auth"