@dashadmin/dash-app-common 1.3.25 → 1.3.26

package/dist/resources/demo/todoResource.js

@@ -1 +1,58 @@
-import{jsx as d}from"react/jsx-runtime";import o from"@dashadmin/dash-admin/src/templates/ResourceTemplate";import r from"@mui/icons-material/FiberManualRecord";import{DASHAppConstants as a}from"@dashadmin/dash-constants";import s from"../../schemas/demo/todoSchema";import i from"../../filters/demo/todoFilters";const m=r,e=!0,n={roles:[a.system.SYSTEM_ROLE],component:o,model:"example/todo",label:"Todo",schema:s,icon:d(m,{}),group:"Example",trash:e,menu:[{title:"List",redirect:"/example/todo"},...e?[{title:"Trash",redirect:"/example/todo/trash"}]:[]],referenceFilters:i,mainAction:{title:"Crear Todo",mode:"create",fn:"virtualhash",redirect:"inline/create"},view:!0,create:!0,edit:!0,drawer:!0,drawerOptions:{create:!0,edit:!0,view:!0},isFormData:!0,formGroupMode:"tabs",postFormatter:t=>t,mutationMode:"pessimistic",saveButtonAlwaysEnabled:!0,listProps:{storeKey:!1},resetSelectedIdsOnLoad:!0};var w=n;export{w as default};
+import { jsx } from "react/jsx-runtime";
+import ResourceTemplate from "dash-admin/src/templates/ResourceTemplate";
+import Dot from "@mui/icons-material/FiberManualRecord";
+import { DASHAppConstants } from "dash-constants";
+import todoSchema from "../../schemas/demo/todoSchema";
+import todoFilters from "../../filters/demo/todoFilters";
+const Icon = Dot;
+const enableTrash = true;
+const TodoResource = {
+  roles: [DASHAppConstants.system.SYSTEM_ROLE],
+  component: ResourceTemplate,
+  //trash: true,
+  model: "example/todo",
+  label: "Todo",
+  schema: todoSchema,
+  icon: /* @__PURE__ */ jsx(Icon, {}),
+  group: "Example",
+  trash: enableTrash,
+  menu: [
+    {
+      title: "List",
+      redirect: "/example/todo"
+    },
+    ...enableTrash ? [{
+      title: "Trash",
+      redirect: "/example/todo/trash"
+    }] : []
+  ],
+  referenceFilters: todoFilters,
+  mainAction: {
+    title: "Crear Todo",
+    mode: "create",
+    fn: "virtualhash",
+    redirect: "inline/create"
+  },
+  view: true,
+  create: true,
+  edit: true,
+  drawer: true,
+  drawerOptions: {
+    create: true,
+    edit: true,
+    view: true
+  },
+  isFormData: true,
+  formGroupMode: "tabs",
+  postFormatter: (params) => {
+    return params;
+  },
+  mutationMode: "pessimistic",
+  saveButtonAlwaysEnabled: true,
+  listProps: { storeKey: false },
+  resetSelectedIdsOnLoad: true
+};
+var todoResource_default = TodoResource;
+export {
+  todoResource_default as default
+};

package/dist/schemas/defaultSchema.js

@@ -1 +1,14 @@
-const t=[{attribute:"id",label:"Id",type:String,sortable:!0,inEdit:!1,inCreate:!1}];var i=t;export{i as default};
+const defaultSchema = [
+  {
+    attribute: "id",
+    label: "Id",
+    type: String,
+    sortable: true,
+    inEdit: false,
+    inCreate: false
+  }
+];
+var defaultSchema_default = defaultSchema;
+export {
+  defaultSchema_default as default
+};

package/dist/schemas/demo/todoSchema.js

@@ -1 +1,24 @@
-const t=[{tab:"Todo",attribute:"name",label:"Nombre",type:String},{tab:"Todo",attribute:"description",label:"Description",type:"textarea"},{tab:"Todo",attribute:"completed",label:"Completed",type:Boolean}];var a=t;export{a as default};
+const todoSchema = [
+  {
+    tab: "Todo",
+    attribute: "name",
+    label: "Nombre",
+    type: String
+  },
+  {
+    tab: "Todo",
+    attribute: "description",
+    label: "Description",
+    type: "textarea"
+  },
+  {
+    tab: "Todo",
+    attribute: "completed",
+    label: "Completed",
+    type: Boolean
+  }
+];
+var todoSchema_default = todoSchema;
+export {
+  todoSchema_default as default
+};

package/package.json

@@ -1,78 +1,133 @@
 {
-  "name": "@dashadmin/dash-app-common",
-  "version": "1.3.25",
-  "description": "Common defaults and utilities for Dash applications - provides pre-configured components, extensions, pages, filters, and schemas",
-  "private": false,
-  "main": "dist/index.js",
-  "type": "module",
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "dependencies": {
-    "react": "latest",
-    "react-dom": "latest",
-    "react-redux": "latest",
-    "react-router-dom": "7.17.0",
-    "@dashadmin/dash-utils": "1.3.25",
-    "@dashadmin/dash-admin-state": "1.3.25",
-    "@dashadmin/dash-components": "1.3.25",
-    "@dashadmin/dash-auth": "1.3.25",
-    "@dashadmin/dash-axios-hook": "1.3.25",
-    "@dashadmin/dash-constants": "1.3.25",
-    "@dashadmin/dash-auto-admin": "1.3.25",
-    "@dashadmin/dash-dialog": "1.3.25",
-    "@dashadmin/dash-admin": "1.3.25"
-  },
-  "devDependencies": {
-    "@types/node": "latest",
-    "@types/react": "latest",
-    "@types/react-dom": "latest",
-    "eslint": "latest",
-    "typescript": "latest",
-    "vite": "^5.2.0",
-    "rollup": "^4.0.0",
-    "@dashadmin/dash-tsconfig": "1.3.25",
-    "@dashadmin/dash-prettier": "1.3.25",
-    "@dashadmin/dash-eslint": "1.3.25"
-  },
-  "peerDependencies": {
-    "react": "latest",
-    "react-dom": "latest"
-  },
-  "eslintConfig": {
-    "extends": "react-app"
-  },
-  "publishConfig": {
-    "name": "@dashadmin/dash-app-common",
-    "access": "public"
-  },
-  "files": [
-    "dist"
-  ],
-  "exports": {
-    ".": {
-      "import": "./dist/index.js"
-    },
-    "./src/*": {
-      "import": "./dist/*.js"
-    }
-  },
-  "scripts": {
-    "lint": "eslint --ext .ts,.tsx .",
-    "format": "pnpm prettier --write . && pnpm format-check && pnpm lint",
-    "lint:check": "pnpm prettier --check .",
-    "lint:fix": "pnpm prettier --write .",
-    "check-updates": "pnpm npm-check-updates",
-    "updates-packages": "pnpm npm-check-updates -u",
-    "build": "rm -rf dist && node ../dash-build/compile.mjs && vite build"
-  }
-}
+	"name": "@dashadmin/dash-app-common",
+	"version": "1.3.26",
+	"description": "Common defaults and utilities for Dash applications - provides pre-configured components, extensions, pages, filters, and schemas",
+	"main": "dist/index.js",
+	"type": "module",
+	"scripts": {
+		"lint": "eslint --ext .ts,.tsx .",
+		"format": "pnpm prettier --write . && pnpm format-check && pnpm lint",
+		"lint:check": "pnpm prettier --check .",
+		"lint:fix": "pnpm prettier --write .",
+		"check-updates": "pnpm npm-check-updates",
+		"updates-packages": "pnpm npm-check-updates -u",
+		"build": "tsup"
+	},
+	"browserslist": {
+		"production": [
+			">0.2%",
+			"not dead",
+			"not op_mini all"
+		],
+		"development": [
+			"last 1 chrome version",
+			"last 1 firefox version",
+			"last 1 safari version"
+		]
+	},
+	"dependencies": {
+		"react": "latest",
+		"react-dom": "latest",
+		"react-redux": "latest",
+		"react-router-dom": "^7.9.6",
+		"@dashadmin/dash-utils": "workspace:*",
+		"@dashadmin/dash-admin": "workspace:*",
+		"@dashadmin/dash-admin-state": "workspace:*",
+		"@dashadmin/dash-components": "workspace:*",
+		"@dashadmin/dash-constants": "workspace:*",
+		"@dashadmin/dash-auth": "workspace:*",
+		"@dashadmin/dash-axios-hook": "workspace:*",
+		"@dashadmin/dash-dialog": "workspace:*",
+		"@dashadmin/dash-auto-admin": "workspace:*"
+	},
+	"devDependencies": {
+		"@types/node": "latest",
+		"@types/react": "latest",
+		"@types/react-dom": "latest",
+		"eslint": "latest",
+		"typescript": "latest",
+		"@dashadmin/dash-tsconfig": "workspace:*",
+		"@dashadmin/dash-eslint": "workspace:*",
+		"@dashadmin/dash-prettier": "workspace:*"
+	},
+	"peerDependencies": {
+		"react": "latest",
+		"react-dom": "latest"
+	},
+	"eslintConfig": {
+		"extends": "react-app"
+	},
+	"module": "dist/index.js",
+	"types": "./src/index.ts",
+	"exports": {
+		".": "./dist/index.js",
+		"./defaults": "./dist/defaults/index.js",
+		"./src/defaults": "./dist/defaults/index.js",
+		"./defaults/extensions": "./dist/defaults/extensions/index.js",
+		"./src/defaults/extensions": "./dist/defaults/extensions/index.js",
+		"./defaults/extensions/bootstrap": "./dist/defaults/extensions/bootstrap/index.js",
+		"./src/defaults/extensions/bootstrap": "./dist/defaults/extensions/bootstrap/index.js",
+		"./defaults/extensions/components": "./dist/defaults/extensions/components/index.js",
+		"./src/defaults/extensions/components": "./dist/defaults/extensions/components/index.js",
+		"./defaults/extensions/electron": "./dist/defaults/extensions/electron/index.js",
+		"./src/defaults/extensions/electron": "./dist/defaults/extensions/electron/index.js",
+		"./defaults/extensions/hooks": "./dist/defaults/extensions/hooks/index.js",
+		"./src/defaults/extensions/hooks": "./dist/defaults/extensions/hooks/index.js",
+		"./defaults/extensions/i18n": "./dist/defaults/extensions/i18n/index.js",
+		"./src/defaults/extensions/i18n": "./dist/defaults/extensions/i18n/index.js",
+		"./defaults/extensions/layout": "./dist/defaults/extensions/layout/index.js",
+		"./src/defaults/extensions/layout": "./dist/defaults/extensions/layout/index.js",
+		"./defaults/extensions/managers": "./dist/defaults/extensions/managers/index.js",
+		"./src/defaults/extensions/managers": "./dist/defaults/extensions/managers/index.js",
+		"./defaults/extensions/providers": "./dist/defaults/extensions/providers/index.js",
+		"./src/defaults/extensions/providers": "./dist/defaults/extensions/providers/index.js",
+		"./defaults/extensions/router": "./dist/defaults/extensions/router/index.js",
+		"./src/defaults/extensions/router": "./dist/defaults/extensions/router/index.js",
+		"./defaults/extensions/state": "./dist/defaults/extensions/state/index.js",
+		"./src/defaults/extensions/state": "./dist/defaults/extensions/state/index.js",
+		"./defaults/extensions/styles": "./dist/defaults/extensions/styles/index.js",
+		"./src/defaults/extensions/styles": "./dist/defaults/extensions/styles/index.js",
+		"./defaults/extensions/theme": "./dist/defaults/extensions/theme/index.js",
+		"./src/defaults/extensions/theme": "./dist/defaults/extensions/theme/index.js",
+		"./defaults/extensions/utils": "./dist/defaults/extensions/utils/index.js",
+		"./src/defaults/extensions/utils": "./dist/defaults/extensions/utils/index.js",
+		"./defaults/filters": "./dist/defaults/filters/index.js",
+		"./src/defaults/filters": "./dist/defaults/filters/index.js",
+		"./defaults/filters/demo": "./dist/defaults/filters/demo/index.js",
+		"./src/defaults/filters/demo": "./dist/defaults/filters/demo/index.js",
+		"./defaults/pages": "./dist/defaults/pages/index.js",
+		"./src/defaults/pages": "./dist/defaults/pages/index.js",
+		"./defaults/pages/Account": "./dist/defaults/pages/Account/index.js",
+		"./src/defaults/pages/Account": "./dist/defaults/pages/Account/index.js",
+		"./defaults/pages/Misc": "./dist/defaults/pages/Misc/index.js",
+		"./src/defaults/pages/Misc": "./dist/defaults/pages/Misc/index.js",
+		"./defaults/pages/Static": "./dist/defaults/pages/Static/index.js",
+		"./src/defaults/pages/Static": "./dist/defaults/pages/Static/index.js",
+		"./defaults/schemas": "./dist/defaults/schemas/index.js",
+		"./src/defaults/schemas": "./dist/defaults/schemas/index.js",
+		"./defaults/schemas/demo": "./dist/defaults/schemas/demo/index.js",
+		"./src/defaults/schemas/demo": "./dist/defaults/schemas/demo/index.js",
+		"./*": "./dist/*.js",
+		"./src/*": "./dist/*.js"
+	},
+	"publishConfig": {
+		"access": "public",
+		"registry": "https://registry.npmjs.org"
+	},
+	"files": [
+		"dist",
+		"src"
+	],
+	"typesVersions": {
+		"*": {
+			"src/*": [
+				"src/*",
+				"src/*/index"
+			],
+			"*": [
+				"src/*",
+				"src/*/index"
+			]
+		}
+	}
+}

package/src/DashApp.tsx

@@ -0,0 +1,294 @@
+/**
+ * DashApp - Simplified Application Shell
+ * 
+ * A simple, easy-to-understand component that:
+ * 1. Sets up the Router context FIRST (solving useNavigate issues)
+ * 2. Checks authentication state
+ * 3. Renders either Public or Private app based on auth
+ * 
+ * Usage:
+ * ```tsx
+ * import { DashApp } from 'dash-app-common';
+ * 
+ * // Zero-config (uses default public/private apps)
+ * <DashApp />
+ * 
+ * // With custom apps
+ * <DashApp
+ *     PublicApp={MyPublicApp}
+ *     PrivateApp={MyPrivateApp}
+ * />
+ * ```
+ */
+import React, { useEffect, useState } from 'react';
+import { useSelector, useDispatch } from 'react-redux';
+import { BrowserRouter, HashRouter, Routes, Route } from 'react-router-dom';
+import { getEnv } from 'dash-utils';
+import { AuthPersistenceService, syncLocalStorageToDeviceStore } from 'dash-auth';
+import { dashStorage } from 'dash-utils';
+
+// Framework imports
+import DASHAuthenticationService from 'dash-admin/src/contexts/auth/DASHAuthenticationService';
+import { DASH_REDUX_ACTIONS } from 'dash-admin-state';
+import { ACTION_UPDATE_AUTH } from 'dash-admin-state/src/redux/reducers/Auth';
+import AppLoadingFallback from 'dash-components/src/components/theme/AppLoadingFallback';
+
+// Default apps and routes
+import { dashDefaultPublicRoutes } from './defaults/extensions/router/dashDefaultPublicRoutes';
+import { dashDefaultPrivateRoutes } from './defaults/extensions/router/dashDefaultPrivateRoutes';
+
+// Lazy load default private app
+const DashDefaultPrivateApp = React.lazy(
+    () => import('./components/DashDefaultPrivateApp')
+);
+
+// ============================================================================
+// TYPES
+// ============================================================================
+
+interface DashAppProps {
+    /**
+     * Custom public routes function. If not provided, uses default login/register routes.
+     */
+    publicRoutes?: () => React.ReactNode[];
+    
+    /**
+     * Custom private routes function. If not provided, uses default admin routes.
+     */
+    privateRoutes?: () => React.ReactNode[];
+    
+    /**
+     * Custom component to render for authenticated users instead of routes.
+     * Use this when you have a full custom admin app (like DashLazyAdminApp).
+     */
+    PrivateApp?: React.ComponentType<any>;
+    
+    /**
+     * Props to pass to the PrivateApp component.
+     */
+    privateAppProps?: Record<string, any>;
+    
+    /**
+     * Loading component shown during initialization.
+     */
+    LoadingComponent?: React.ComponentType<{ message?: string }>;
+    
+    /**
+     * Force hash router (for Electron apps).
+     */
+    useHashRouter?: boolean;
+    
+    /**
+     * Base path for the router.
+     */
+    basename?: string;
+    
+    /**
+     * Enable debug logging.
+     */
+    debug?: boolean;
+}
+
+// ============================================================================
+// HELPER: Determine router type
+// ============================================================================
+
+const shouldUseHashRouter = (): boolean => {
+    const platformType = getEnv('PLATFORM_TYPE');
+    const platform = getEnv('PLATFORM');
+    return platformType === 'desktop' || platform === 'electron';
+};
+
+// ============================================================================
+// INNER COMPONENT: Routes Content (rendered inside Router)
+// This component is responsible for rendering routes AFTER Router is mounted
+// ============================================================================
+
+interface RoutesContentProps {
+    publicRoutes: () => React.ReactNode[];
+    privateRoutes?: () => React.ReactNode[];
+    isAuthenticated: boolean;
+    LoadingComponent: React.ComponentType<{ message?: string }>;
+    privateAppProps?: Record<string, any>;
+    PrivateApp?: React.ComponentType<any>;
+}
+
+const RoutesContent: React.FC<RoutesContentProps> = ({
+    publicRoutes,
+    privateRoutes,
+    isAuthenticated,
+    LoadingComponent,
+    privateAppProps = {},
+    PrivateApp,
+}) => {
+    // Render authenticated app
+    if (isAuthenticated) {
+        // If a custom PrivateApp is provided, render it directly
+        if (PrivateApp) {
+            return <PrivateApp {...privateAppProps} />;
+        }
+        
+        // If custom private routes provided, render them
+        if (privateRoutes) {
+            return (
+                <Routes>
+                    {privateRoutes()}
+                </Routes>
+            );
+        }
+        
+        // Default: Use DashDefaultPrivateApp (with useOwnRouter=false since we already have Router)
+        return (
+            <React.Suspense fallback={<LoadingComponent message="Loading admin..." />}>
+                <DashDefaultPrivateApp useOwnRouter={false} {...privateAppProps} />
+            </React.Suspense>
+        );
+    }
+    
+    // Render public routes (login, register, etc.)
+    // Routes are called here, INSIDE the Router context
+    return (
+        <Routes>
+            {publicRoutes()}
+        </Routes>
+    );
+};
+
+// ============================================================================
+// INNER COMPONENT: App Content (rendered inside Router)
+// ============================================================================
+
+interface AppContentProps {
+    publicRoutes: () => React.ReactNode[];
+    privateRoutes?: () => React.ReactNode[];
+    PrivateApp?: React.ComponentType<any>;
+    privateAppProps?: Record<string, any>;
+    LoadingComponent: React.ComponentType<{ message?: string }>;
+    debug?: boolean;
+}
+
+const AppContent: React.FC<AppContentProps> = ({
+    publicRoutes,
+    privateRoutes,
+    PrivateApp,
+    privateAppProps = {},
+    LoadingComponent,
+    debug = false,
+}) => {
+    const [isInitializing, setIsInitializing] = useState(true);
+    const dispatch = useDispatch();
+    
+    // Get auth state from Redux
+    const auth = useSelector((state: any) => state.auth);
+    const isAuthenticated = auth?.authenticated ?? false;
+    
+    const log = (...args: any[]) => {
+        if (debug) console.log('🔷 DashApp:', ...args);
+    };
+    
+    // Initialize auth on mount
+    useEffect(() => {
+        const initializeAuth = async () => {
+            log('Initializing authentication...');
+            
+            try {
+                // Check for persisted auth data
+                const storedToken = AuthPersistenceService.getToken();
+                const storedUser = AuthPersistenceService.getUser();
+                const isAuthenticatedStored = JSON.parse(dashStorage.getItem('authenticated') || 'false');
+                
+                log('Persisted data:', { hasToken: !!storedToken, hasUser: !!storedUser, isAuthenticated: isAuthenticatedStored });
+                
+                if (storedToken && isAuthenticatedStored) {
+                    // Try to restore session
+                    const result = await DASHAuthenticationService.initializeFromToken();
+                    
+                    if (result.success) {
+                        log('Session restored successfully');
+                        dispatch(DASH_REDUX_ACTIONS.updateAuth(ACTION_UPDATE_AUTH, {
+                            user: result.user,
+                            authenticated: true,
+                            auth: result.auth || null,
+                        }));
+                        await syncLocalStorageToDeviceStore();
+                    } else {
+                        log('Session restore failed, clearing auth');
+                        AuthPersistenceService.clearAuth();
+                    }
+                } else {
+                    log('No valid session found');
+                }
+            } catch (error) {
+                console.error('DashApp: Auth initialization error:', error);
+                AuthPersistenceService.clearAuth();
+            } finally {
+                setIsInitializing(false);
+            }
+        };
+        
+        initializeAuth();
+    }, [dispatch, debug]);
+    
+    // Show loading during initialization
+    if (isInitializing) {
+        return <LoadingComponent message="Initializing..." />;
+    }
+    
+    log('Rendering:', isAuthenticated ? 'Private App' : 'Public Routes');
+    
+    // Use RoutesContent to defer route evaluation until we're sure we're inside Router
+    return (
+        <RoutesContent
+            publicRoutes={publicRoutes}
+            privateRoutes={privateRoutes}
+            isAuthenticated={isAuthenticated}
+            LoadingComponent={LoadingComponent}
+            privateAppProps={privateAppProps}
+            PrivateApp={PrivateApp}
+        />
+    );
+};
+
+// ============================================================================
+// MAIN COMPONENT
+// ============================================================================
+
+/**
+ * DashApp - The main application shell
+ * 
+ * Sets up Router context first, then handles auth and conditional rendering.
+ * This ensures useNavigate() and other Router hooks work everywhere.
+ */
+export const DashApp: React.FC<DashAppProps> = ({
+    publicRoutes = dashDefaultPublicRoutes,
+    privateRoutes,
+    PrivateApp,
+    privateAppProps,
+    LoadingComponent = AppLoadingFallback,
+    useHashRouter: forceHashRouter,
+    basename,
+    debug = false,
+}) => {
+    // Determine router type
+    const useHash = forceHashRouter ?? shouldUseHashRouter();
+    const effectiveBasename = basename ?? getEnv('BASE_PATH') ?? '/';
+    
+    // Router wrapper
+    const Router = useHash ? HashRouter : BrowserRouter;
+    const routerProps = useHash ? { basename: '' } : { basename: effectiveBasename };
+    
+    return (
+        <Router {...routerProps}>
+            <AppContent
+                publicRoutes={publicRoutes}
+                privateRoutes={privateRoutes}
+                PrivateApp={PrivateApp}
+                privateAppProps={privateAppProps}
+                LoadingComponent={LoadingComponent}
+                debug={debug}
+            />
+        </Router>
+    );
+};
+
+export default DashApp;