@juv/codego-react-ui 3.3.6 → 3.3.8

package/dist/index.cjs

@@ -6405,7 +6405,7 @@ var import_react_dom2 = require("react-dom");
 var import_axios3 = __toESM(require("axios"), 1);
 var import_lucide_react17 = require("lucide-react");
 var import_jsx_runtime32 = require("react/jsx-runtime");
-function useServerTable({ url, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce = 300, transform, manual = false, onSuccess, onError }) {
+function useServerTable({ url, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce = 300, transform, manual = false, refresh: refreshEnabled = false, refreshInterval = 0, hardReload, onSuccess, onError }) {
   const [data, setData] = React28.useState([]);
   const [columns, setColumns] = React28.useState([]);
   const [currentPage, setCurrentPage] = React28.useState(1);
@@ -6415,6 +6415,14 @@ function useServerTable({ url, params, encrypt, key, decryptPayloadLog, columnOv
   const [tick, setTick] = React28.useState(0);
   const [searchValue, setSearchValue] = React28.useState("");
   const debounceTimer = React28.useRef(void 0);
+  React28.useEffect(() => {
+    if (hardReload) hardReload.current = () => setTick((t) => t + 1);
+  }, [hardReload]);
+  React28.useEffect(() => {
+    if (!refreshInterval || refreshInterval <= 0) return;
+    const id = setInterval(() => setTick((t) => t + 1), refreshInterval);
+    return () => clearInterval(id);
+  }, [refreshInterval]);
   React28.useEffect(() => {
     if (manual && tick === 0) return;
     let cancelled = false;
@@ -6486,6 +6494,7 @@ function useServerTable({ url, params, encrypt, key, decryptPayloadLog, columnOv
     error,
     goToPage: (page) => setCurrentPage(page),
     reload: () => setTick((t) => t + 1),
+    refresh: () => setTick((t) => t + 1),
     searchValue,
     onSearchChange: handleSearchChange
   };
@@ -6734,7 +6743,10 @@ function EditModal({
     setLoading(true);
     setError(null);
     try {
-      await import_axios3.default.put(`${baseUrl}/${itemId}/update`, form);
+      const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute("content");
+      await import_axios3.default.put(`${baseUrl}/${itemId}/update`, form, {
+        headers: csrfToken ? { "X-CSRF-Token": csrfToken } : {}
+      });
       const updated = { ...item, ...form };
       if (notif && (notif.type ?? "toast") === "notification") {
         setBanner(true);
@@ -6825,7 +6837,10 @@ function DeleteModal({
     setLoading(true);
     setError(null);
     try {
-      await import_axios3.default.delete(`${baseUrl}/${itemId}/delete`);
+      const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute("content");
+      await import_axios3.default.delete(`${baseUrl}/${itemId}/delete`, {
+        headers: csrfToken ? { "X-CSRF-Token": csrfToken } : {}
+      });
       onSuccess?.(item);
       onClose();
     } catch (err) {
@@ -7340,6 +7355,7 @@ function Table({
             (prev) => prev.map((r) => String(r[actionIdKey]) === String(updated[actionIdKey]) ? updated : r)
           );
           defaultActions.onSuccess?.("edit", updated);
+          defaultActions.onReload?.();
           const notif = defaultActions.onSuccessNotif;
           if (notif && (notif.type ?? "toast") === "toast") {
             toast({
@@ -7365,6 +7381,7 @@ function Table({
             (prev) => prev.filter((r) => String(r[actionIdKey]) !== String(deleted[actionIdKey]))
           );
           defaultActions.onSuccess?.("delete", deleted);
+          defaultActions.onReload?.();
           const notif = defaultActions.onSuccessNotif;
           if (notif && (notif.type ?? "toast") === "toast") {
             toast({

package/dist/index.d.cts

@@ -256,6 +256,19 @@ interface UseServerTableOptions {
     transform?: (response: any) => any[];
     /** If true, hook won't fetch automatically. Call reload() manually */
     manual?: boolean;
+    /** If true, refetch data whenever reload() is called (e.g. after edit/delete) */
+    refresh?: boolean;
+    /** Auto-refresh interval in milliseconds. Omit or set 0 to disable */
+    refreshInterval?: number;
+    /**
+     * A ref that will be assigned the reload function.
+     * Call `hardReloadRef.current()` from any external button or function to trigger a refetch.
+     * @example
+     * const hardReloadRef = React.useRef<() => void>(() => {})
+     * useServerTable({ url, hardReload: hardReloadRef })
+     * // then anywhere: hardReloadRef.current()
+     */
+    hardReload?: React.MutableRefObject<() => void>;
     /** Called after successful data fetch */
     onSuccess?: (data: any[]) => void;
     /** Called on fetch error */
@@ -276,6 +289,8 @@ interface UseServerTableReturn<T> {
     error: string | null;
     goToPage: (page: number) => void;
     reload: () => void;
+    /** Manually trigger a data refresh (alias for reload, respects refresh option) */
+    refresh: () => void;
     searchValue?: string;
     onSearchChange?: (value: string) => void;
 }
@@ -304,7 +319,7 @@ interface ServerPaginationProp {
  * })
  * ```
  */
-declare function useServerTable<T extends Record<string, any>>({ url, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce, transform, manual, onSuccess, onError }: UseServerTableOptions): UseServerTableReturn<T>;
+declare function useServerTable<T extends Record<string, any>>({ url, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce, transform, manual, refresh: refreshEnabled, refreshInterval, hardReload, onSuccess, onError }: UseServerTableOptions): UseServerTableReturn<T>;
 /**
  * Available field types for action forms (edit/view modals)
  * @type {ActionFieldType}
@@ -454,6 +469,8 @@ interface DefaultActionsConfig<T> {
     deleteButton?: ActionButtonConfig;
     /** Extra action buttons rendered alongside view/edit/delete */
     extraActions?: ExtraActionConfig<T>[];
+    /** Called after a successful edit or delete to trigger a server-side reload (e.g. pass reload from useServerTable) */
+    onReload?: () => void;
 }
 /**
  * Configuration for success notifications after edit/delete operations

package/dist/index.d.ts

@@ -256,6 +256,19 @@ interface UseServerTableOptions {
     transform?: (response: any) => any[];
     /** If true, hook won't fetch automatically. Call reload() manually */
     manual?: boolean;
+    /** If true, refetch data whenever reload() is called (e.g. after edit/delete) */
+    refresh?: boolean;
+    /** Auto-refresh interval in milliseconds. Omit or set 0 to disable */
+    refreshInterval?: number;
+    /**
+     * A ref that will be assigned the reload function.
+     * Call `hardReloadRef.current()` from any external button or function to trigger a refetch.
+     * @example
+     * const hardReloadRef = React.useRef<() => void>(() => {})
+     * useServerTable({ url, hardReload: hardReloadRef })
+     * // then anywhere: hardReloadRef.current()
+     */
+    hardReload?: React.MutableRefObject<() => void>;
     /** Called after successful data fetch */
     onSuccess?: (data: any[]) => void;
     /** Called on fetch error */
@@ -276,6 +289,8 @@ interface UseServerTableReturn<T> {
     error: string | null;
     goToPage: (page: number) => void;
     reload: () => void;
+    /** Manually trigger a data refresh (alias for reload, respects refresh option) */
+    refresh: () => void;
     searchValue?: string;
     onSearchChange?: (value: string) => void;
 }
@@ -304,7 +319,7 @@ interface ServerPaginationProp {
  * })
  * ```
  */
-declare function useServerTable<T extends Record<string, any>>({ url, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce, transform, manual, onSuccess, onError }: UseServerTableOptions): UseServerTableReturn<T>;
+declare function useServerTable<T extends Record<string, any>>({ url, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce, transform, manual, refresh: refreshEnabled, refreshInterval, hardReload, onSuccess, onError }: UseServerTableOptions): UseServerTableReturn<T>;
 /**
  * Available field types for action forms (edit/view modals)
  * @type {ActionFieldType}
@@ -454,6 +469,8 @@ interface DefaultActionsConfig<T> {
     deleteButton?: ActionButtonConfig;
     /** Extra action buttons rendered alongside view/edit/delete */
     extraActions?: ExtraActionConfig<T>[];
+    /** Called after a successful edit or delete to trigger a server-side reload (e.g. pass reload from useServerTable) */
+    onReload?: () => void;
 }
 /**
  * Configuration for success notifications after edit/delete operations

package/dist/index.global.js

@@ -69551,7 +69551,7 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
   var React28 = __toESM(require_react(), 1);
   var import_react_dom2 = __toESM(require_react_dom(), 1);
   var import_jsx_runtime32 = __toESM(require_jsx_runtime(), 1);
-  function useServerTable({ url: url2, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce = 300, transform, manual = false, onSuccess, onError }) {
+  function useServerTable({ url: url2, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce = 300, transform, manual = false, refresh: refreshEnabled = false, refreshInterval = 0, hardReload, onSuccess, onError }) {
     const [data, setData] = React28.useState([]);
     const [columns, setColumns] = React28.useState([]);
     const [currentPage, setCurrentPage] = React28.useState(1);
@@ -69561,6 +69561,14 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
     const [tick, setTick] = React28.useState(0);
     const [searchValue, setSearchValue] = React28.useState("");
     const debounceTimer = React28.useRef(void 0);
+    React28.useEffect(() => {
+      if (hardReload) hardReload.current = () => setTick((t) => t + 1);
+    }, [hardReload]);
+    React28.useEffect(() => {
+      if (!refreshInterval || refreshInterval <= 0) return;
+      const id = setInterval(() => setTick((t) => t + 1), refreshInterval);
+      return () => clearInterval(id);
+    }, [refreshInterval]);
     React28.useEffect(() => {
       if (manual && tick === 0) return;
       let cancelled = false;
@@ -69632,6 +69640,7 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
       error,
       goToPage: (page) => setCurrentPage(page),
       reload: () => setTick((t) => t + 1),
+      refresh: () => setTick((t) => t + 1),
       searchValue,
       onSearchChange: handleSearchChange
     };
@@ -69880,7 +69889,10 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
       setLoading(true);
       setError(null);
       try {
-        await axios_default.put(`${baseUrl}/${itemId}/update`, form);
+        const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute("content");
+        await axios_default.put(`${baseUrl}/${itemId}/update`, form, {
+          headers: csrfToken ? { "X-CSRF-Token": csrfToken } : {}
+        });
         const updated = { ...item, ...form };
         if (notif && (notif.type ?? "toast") === "notification") {
           setBanner(true);
@@ -69971,7 +69983,10 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
       setLoading(true);
       setError(null);
       try {
-        await axios_default.delete(`${baseUrl}/${itemId}/delete`);
+        const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute("content");
+        await axios_default.delete(`${baseUrl}/${itemId}/delete`, {
+          headers: csrfToken ? { "X-CSRF-Token": csrfToken } : {}
+        });
         onSuccess?.(item);
         onClose();
       } catch (err) {
@@ -70486,6 +70501,7 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
               (prev) => prev.map((r2) => String(r2[actionIdKey]) === String(updated[actionIdKey]) ? updated : r2)
             );
             defaultActions.onSuccess?.("edit", updated);
+            defaultActions.onReload?.();
             const notif = defaultActions.onSuccessNotif;
             if (notif && (notif.type ?? "toast") === "toast") {
               toast({
@@ -70511,6 +70527,7 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
               (prev) => prev.filter((r2) => String(r2[actionIdKey]) !== String(deleted[actionIdKey]))
             );
             defaultActions.onSuccess?.("delete", deleted);
+            defaultActions.onReload?.();
             const notif = defaultActions.onSuccessNotif;
             if (notif && (notif.type ?? "toast") === "toast") {
               toast({

package/dist/index.js

@@ -6285,7 +6285,7 @@ import { createPortal as createPortal3 } from "react-dom";
 import axios3 from "axios";
 import { ChevronLeft as ChevronLeft6, ChevronRight as ChevronRight8, Search as Search5, Trash2 as Trash22, ChevronsUpDown, ChevronUp, ChevronDown as ChevronDown4, X as X9, Eye as Eye2, Pencil as Pencil2, Trash as Trash3, Loader2 as Loader22 } from "lucide-react";
 import { Fragment as Fragment11, jsx as jsx32, jsxs as jsxs30 } from "react/jsx-runtime";
-function useServerTable({ url, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce = 300, transform, manual = false, onSuccess, onError }) {
+function useServerTable({ url, params, encrypt, key, decryptPayloadLog, columnOverrides, debounce = 300, transform, manual = false, refresh: refreshEnabled = false, refreshInterval = 0, hardReload, onSuccess, onError }) {
   const [data, setData] = React28.useState([]);
   const [columns, setColumns] = React28.useState([]);
   const [currentPage, setCurrentPage] = React28.useState(1);
@@ -6295,6 +6295,14 @@ function useServerTable({ url, params, encrypt, key, decryptPayloadLog, columnOv
   const [tick, setTick] = React28.useState(0);
   const [searchValue, setSearchValue] = React28.useState("");
   const debounceTimer = React28.useRef(void 0);
+  React28.useEffect(() => {
+    if (hardReload) hardReload.current = () => setTick((t) => t + 1);
+  }, [hardReload]);
+  React28.useEffect(() => {
+    if (!refreshInterval || refreshInterval <= 0) return;
+    const id = setInterval(() => setTick((t) => t + 1), refreshInterval);
+    return () => clearInterval(id);
+  }, [refreshInterval]);
   React28.useEffect(() => {
     if (manual && tick === 0) return;
     let cancelled = false;
@@ -6366,6 +6374,7 @@ function useServerTable({ url, params, encrypt, key, decryptPayloadLog, columnOv
     error,
     goToPage: (page) => setCurrentPage(page),
     reload: () => setTick((t) => t + 1),
+    refresh: () => setTick((t) => t + 1),
     searchValue,
     onSearchChange: handleSearchChange
   };
@@ -6614,7 +6623,10 @@ function EditModal({
     setLoading(true);
     setError(null);
     try {
-      await axios3.put(`${baseUrl}/${itemId}/update`, form);
+      const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute("content");
+      await axios3.put(`${baseUrl}/${itemId}/update`, form, {
+        headers: csrfToken ? { "X-CSRF-Token": csrfToken } : {}
+      });
       const updated = { ...item, ...form };
       if (notif && (notif.type ?? "toast") === "notification") {
         setBanner(true);
@@ -6705,7 +6717,10 @@ function DeleteModal({
     setLoading(true);
     setError(null);
     try {
-      await axios3.delete(`${baseUrl}/${itemId}/delete`);
+      const csrfToken = document.querySelector('meta[name="csrf-token"]')?.getAttribute("content");
+      await axios3.delete(`${baseUrl}/${itemId}/delete`, {
+        headers: csrfToken ? { "X-CSRF-Token": csrfToken } : {}
+      });
       onSuccess?.(item);
       onClose();
     } catch (err) {
@@ -7220,6 +7235,7 @@ function Table({
             (prev) => prev.map((r) => String(r[actionIdKey]) === String(updated[actionIdKey]) ? updated : r)
           );
           defaultActions.onSuccess?.("edit", updated);
+          defaultActions.onReload?.();
           const notif = defaultActions.onSuccessNotif;
           if (notif && (notif.type ?? "toast") === "toast") {
             toast({
@@ -7245,6 +7261,7 @@ function Table({
             (prev) => prev.filter((r) => String(r[actionIdKey]) !== String(deleted[actionIdKey]))
           );
           defaultActions.onSuccess?.("delete", deleted);
+          defaultActions.onReload?.();
           const notif = defaultActions.onSuccessNotif;
           if (notif && (notif.type ?? "toast") === "toast") {
             toast({

package/package.json

@@ -4,7 +4,7 @@
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
-  "version": "3.3.6",
+  "version": "3.3.8",
   "description": "Reusable React UI components",
   "license": "MIT",
   "main": "dist/index.js",