@dashadmin/dash-admin 1.3.73 → 1.3.74-srcfree.2

package/src/components/tenant/SettingsSections.tsx

@@ -1,151 +0,0 @@
-import { DashAutoFormTabs } from "dash-auto-admin";
-import React, { useState } from "react";
-import { useTranslate } from "react-admin";
-import {
-    Box,
-    Card,
-    CardActionArea,
-    CardContent,
-    Divider,
-    Drawer,
-    IconButton,
-    Typography,
-} from "@mui/material";
-import CloseIcon from "@mui/icons-material/Close";
-
-/**
- * Shared by TenantSettings.tsx and TenancySettings.tsx — both render the
- * same "one card per settings group, each opening a drawer" layout over a
- * backend-declared setting_formats schema, the only difference being which
- * record (Tenant vs Tenancy) supplies the current values. Extracted here
- * rather than duplicated a second time WITHIN this package (unlike
- * kt-ecommerce's own TenantSettings.tsx twin, which stays separate on
- * purpose — see that file's docblock — because pulling a cross-PACKAGE
- * shared export would break the *-system apps until dash-admin is
- * republished; that constraint doesn't apply to two components already in
- * the same package).
- */
-
-/** Wrapper creating a React component boundary so DashAutoFormTabs hooks don't violate Rules of Hooks */
-export const FormTabsRenderer: React.FC<{ schema: any; method: "list" | "create" | "edit" | "view"; label: string }> = ({ schema, method, label }) => (
-    <>{DashAutoFormTabs({ schema, resourceConfig: null, options: { mode: method, label } })}</>
-);
-
-/**
- * Split the settings schema into the cards shown on the configuration tab.
- *
- * Grouped by the `group` each setting format already declares — data-driven, so
- * this is agnostic to which product is running: a domain that ships different
- * groups gets different cards with no change here, and one that ships none at
- * all still gets a single card rather than an error.
- *
- * `group` rather than `tab`: tab is the coarser of the two, and a domain that
- * puts everything on one tab (the common case) would get no split at all.
- */
-const toSettingsSections = (schema: any[]) => {
-    const order: string[] = [];
-    const byGroup: Record<string, any[]> = {};
-
-    schema.forEach((entry) => {
-        const key = entry.group || entry.tab || 'general';
-
-        if (!byGroup[key]) {
-            byGroup[key] = [];
-            order.push(key);
-        }
-
-        byGroup[key].push(entry);
-    });
-
-    return order.map((key) => ({ key, entries: byGroup[key] }));
-};
-
-const prettifyGroup = (key: string) =>
-    key.replace(/[_-]+/g, ' ').replace(/^./, (c) => c.toUpperCase());
-
-/**
- * The configuration panel: one card per settings group, each opening a drawer.
- *
- * Replaces a single flat list that grew to whatever the backend declared —
- * unreadable once a product ships more than a handful of settings.
- *
- * ── Two things this has to get right ─────────────────────────────────────────
- *
- * keepMounted: the fields belong to the surrounding react-hook-form. Unmounting
- * a closed drawer unregisters them and drops edits made in a section the user
- * closed before saving. Context reaches through the portal, so the form itself
- * is fine — it is only unmount that loses data.
- *
- * z-index: this panel is often rendered INSIDE a Drawer already (the tenancy/
- * tenant resource opens records in one). Two Drawers both sit at
- * theme.zIndex.modal, where stacking falls to DOM order; raising this one
- * makes it deliberate.
- *
- * Labels resolve through the translator, so a domain can name its own groups.
- * A missing key falls back to the prettified group key rather than rendering a
- * raw translation string.
- */
-export const SettingsSections: React.FC<{
-    schema: any[];
-    method: "list" | "create" | "edit" | "view";
-    /** Translation namespace prefix — 'tenant.settings' or 'tenancy.settings'. */
-    translationNamespace?: string;
-}> = ({ schema, method, translationNamespace = 'tenant.settings' }) => {
-    const translate = useTranslate();
-    const [openSection, setOpenSection] = useState<string | null>(null);
-    const sections = toSettingsSections(schema);
-
-    const labelFor = (key: string) =>
-        translate(`${translationNamespace}.groups.${key}`, { _: prettifyGroup(key) });
-
-    return (
-        <section>
-            <Box
-                sx={{
-                    display: 'grid',
-                    gap: 2,
-                    gridTemplateColumns: { xs: '1fr', sm: 'repeat(2, 1fr)', md: 'repeat(3, 1fr)' },
-                }}
-            >
-                {sections.map((section) => (
-                    <Card key={section.key} variant="outlined">
-                        <CardActionArea onClick={() => setOpenSection(section.key)}>
-                            <CardContent>
-                                <Typography variant="subtitle1" sx={{ fontWeight: 600 }}>
-                                    {labelFor(section.key)}
-                                </Typography>
-                                <Typography variant="caption" color="text.secondary">
-                                    {translate(`${translationNamespace}.option_count`, {
-                                        smart_count: section.entries.length,
-                                        _: `${section.entries.length}`,
-                                    })}
-                                </Typography>
-                            </CardContent>
-                        </CardActionArea>
-                    </Card>
-                ))}
-            </Box>
-
-            {sections.map((section) => (
-                <Drawer
-                    key={section.key}
-                    anchor="right"
-                    open={openSection === section.key}
-                    onClose={() => setOpenSection(null)}
-                    ModalProps={{ keepMounted: true }}
-                >
-                    <Box sx={{ width: { xs: '100vw', sm: 560 }, p: 2 }}>
-                        <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', mb: 1 }}>
-                            <Typography variant="h6">{labelFor(section.key)}</Typography>
-                            <IconButton onClick={() => setOpenSection(null)} size="small" aria-label="Close">
-                                <CloseIcon />
-                            </IconButton>
-                        </Box>
-                        <Divider sx={{ mb: 2 }} />
-                        <FormTabsRenderer schema={section.entries} method={method} label={labelFor(section.key)} />
-                    </Box>
-                </Drawer>
-            ))}
-        </section>
-    );
-};

package/src/components/tenant/TenancySettings.tsx

@@ -1,122 +0,0 @@
-import { IDashAutoAdminCustomFieldComponent } from "dash-auto-admin";
-import React, { useEffect, useState } from "react";
-import { Loading, useRecordContext } from "react-admin";
-
-import { useSystemRequestsCache } from "../../contexts/SystemRequestsCache";
-import { FormTabsRenderer, SettingsSections } from "./SettingsSections";
-
-/**
- * The Tenancy-level twin of TenantSettings.tsx — same backend-driven
- * card+drawer settings layout (shared via ./SettingsSections.tsx), reading
- * a Tenancy record's `settings` JSON column instead of a Tenant's. Feeds
- * the system app's Tenancy edit screen "AI Providers" tab (per-provider
- * system_key/tenant_key/disabled mode + the tenancy's own default-provider
- * fallback — see the backend's config/ai_tenancy_settings.php) with no
- * further frontend change if a domain adds more tenancy-level settings
- * later, the same guarantee TenantSettings.tsx already makes for Tenant.
- *
- * Requires the resource's contextComponent to wrap edit/view in
- * <SystemRequestsCache apiUrl="system/tenancy/systemSettingFormats" ...>
- * — see systemResources.tsx's `system/tenancy` resource.
- *
- * FILTERED TO tab === 'ai' — `system/tenancy/systemSettingFormats` returns
- * EVERY tenancy setting_formats entry, including core's pre-existing
- * billing-tab fields (billing_email/tax_id_type/auto_pay_enabled,
- * config/tenancies.php) that have never had a dedicated UI before this
- * component's own contextComponent wiring was added. Mirrors
- * TenantTheme.tsx's own `.filter((entry) => entry.tab === 'colors')` — this
- * component owns exactly ONE tab, not "everything the endpoint returns".
- */
-const AI_PROVIDERS_TAB = 'ai';
-
-const TenancySettingsEdit: React.FC<IDashAutoAdminCustomFieldComponent & { tenancy: any }> = ({ method, tenancy }) => {
-    const [settingFormatsSchema, setSettingFormatsSchema] = useState<any>(null);
-    const { formats: formatsData } = useSystemRequestsCache();
-
-    useEffect(() => {
-        if (formatsData?.data?.setting_formats) {
-            const parsedSchema = formatsData.data.setting_formats
-                .filter((entry: any) => entry.tab === AI_PROVIDERS_TAB && entry.visible !== false)
-                .map((entry: any) => {
-                    // 'settings.foo' -> 'foo', the actual key on the record.
-                    const settingName = entry.attribute ? entry.attribute.replace('settings.', '') : entry.id;
-                    const defaultValue = tenancy?.settings?.[settingName] ?? entry?.default_value;
-
-                    return {
-                        ...entry,
-                        ...(defaultValue !== null && defaultValue !== undefined && {
-                            fieldOptions: { defaultValue, fullWidth: true },
-                        }),
-                    };
-                });
-
-            setSettingFormatsSchema(parsedSchema);
-        }
-    }, [formatsData, tenancy]);
-
-    if (!settingFormatsSchema) {
-        return <Loading />;
-    }
-
-    return <SettingsSections schema={settingFormatsSchema} method={method} translationNamespace="tenancy.settings" />;
-};
-
-const TenancySettingsView: React.FC<IDashAutoAdminCustomFieldComponent & { tenancy: any }> = ({ method, tenancy }) => {
-    const [settingFormatsSchema, setSettingFormatsSchema] = useState<any>(null);
-    const { formats: formatsData } = useSystemRequestsCache();
-
-    useEffect(() => {
-        if (formatsData?.data?.setting_formats) {
-            const parsedSchema = formatsData.data.setting_formats
-                .filter((entry: any) => entry.tab === AI_PROVIDERS_TAB && entry.visible !== false)
-                .map((entry: any) => ({ ...entry, readOnly: true }));
-
-            setSettingFormatsSchema(parsedSchema);
-        }
-    }, [formatsData]);
-
-    if (!settingFormatsSchema) {
-        return <Loading />;
-    }
-
-    return <SettingsSections schema={settingFormatsSchema} method={method} translationNamespace="tenancy.settings" />;
-};
-
-const TenancySettingsCreate: React.FC<IDashAutoAdminCustomFieldComponent> = ({ method }) => {
-    const [settingFormatsSchema, setSettingFormatsSchema] = useState<any>(null);
-    const { formats: formatsData, loading } = useSystemRequestsCache();
-
-    useEffect(() => {
-        if (!loading && formatsData?.data?.setting_formats) {
-            setSettingFormatsSchema(
-                formatsData.data.setting_formats.filter(
-                    (entry: any) => entry.tab === AI_PROVIDERS_TAB && entry.visible !== false,
-                ),
-            );
-        }
-    }, [formatsData, loading]);
-
-    if (!settingFormatsSchema) {
-        return <Loading />;
-    }
-
-    return <FormTabsRenderer schema={settingFormatsSchema} method={method} label="AI Providers" />;
-};
-
-const TenancySettings = ({ method, attribute, resourceConfig }: IDashAutoAdminCustomFieldComponent) => {
-    const tenancy = useRecordContext();
-
-    switch (method) {
-        case "edit":
-            return <TenancySettingsEdit attribute={attribute} method={method} tenancy={tenancy} resourceConfig={resourceConfig} />;
-        case "view":
-            return <TenancySettingsView attribute={attribute} method={method} tenancy={tenancy} resourceConfig={resourceConfig} />;
-        case "create":
-            return <TenancySettingsCreate attribute={attribute} method={method} resourceConfig={resourceConfig} />;
-        case "list":
-        default:
-            return <></>;
-    }
-};
-
-export default TenancySettings;

package/src/components/tenant/TenantAttributes.tsx

@@ -1,153 +0,0 @@
-import { DashAutoFormGroups, DashAutoFormTabs, IDashAutoAdminCustomFieldComponent } from "dash-auto-admin";
-import React, { useState, useEffect, useContext, createContext, useRef } from "react";
-import { useGetList, Loading, useRecordContext } from "react-admin";
-import { useAxios } from 'dash-axios-hook';
-import { useFormContext, useWatch } from "react-hook-form";
-import { Tenant } from "../../interfaces/Tenant";
-import MUISimpleJsonTable from "../misc/MuiSimpleJsonTable";
-import { useTenantAttributesFormats } from "./TenantAttributesContext";
-import { useSystemRequestsCache } from "../../contexts/SystemRequestsCache";
-
-/** Wrapper creating a React component boundary so DashAutoFormTabs hooks don't violate Rules of Hooks */
-const FormTabsRenderer: React.FC<{schema: any; method: "list" | "create" | "edit" | "view"; label: string}> = ({schema, method, label}) => (
-    <>{DashAutoFormTabs({schema, resourceConfig: null, options: {mode: method, label}})}</>
-);
-
-const TenantAttributesEdit: React.FC<IDashAutoAdminCustomFieldComponent> = ({ method, attribute, tenant }) => {
-  const [attributeFormatsSchema, setAttributeFormatsSchema] = useState<any>(null);
-  /*const formContext = useFormContext();
-  const formValues = useWatch({
-    control: formContext.control
-  });*/
-
-  const { formats: formatsData, loading } = useSystemRequestsCache();
-
-  useEffect(() => {
-    if (formatsData && formatsData.data && formatsData.data.attribute_formats) {
-     
-      const parsedSchema = formatsData.data.attribute_formats.map((entry) => {
-        /*const defaultValue =
-          (tenant.attributes && tenant.attributes[entry.attribute]) ||
-          entry?.default_value;
-*/
-
-        const settingName = entry.attribute ? entry.attribute.replace('attributes.', '') : entry.id;
-        
-        const defaultValue =
-          (tenant.attributes && tenant.attributes[settingName]) ||
-          entry?.default_value;
-    
-        return {
-          ...entry,
-          .../*method === "edit" &&*/ ((defaultValue !== null ||
-            defaultValue !== undefined) && {
-            fieldOptions: {
-              defaultValue: defaultValue,
-              fullWidth: true,
-            },
-          }),
-          ...(method === 'view' && {
-            readOnly: true,
-          }),
-        };
-      });
-
-      console.log('ATTRIBUTES SCHEMA', parsedSchema);
-
-      setAttributeFormatsSchema(parsedSchema);
-
-    }
-
-  }, [formatsData])
-
-  return <section>
-    {attributeFormatsSchema && <FormTabsRenderer schema={attributeFormatsSchema} method={method} label="Datos de contacto" />}
-  </section>
-
-}
-
-const TenantAttributesCreate: React.FC<IDashAutoAdminCustomFieldComponent> = ({ method, attribute }) => {
-  
-  const [attributeFormatsSchema, setAttributeFormatsSchema] = useState<any>(null);
-  /*const formContext = useFormContext();
-  const formValues = useWatch({
-    control: formContext.control
-  });*/
-
-  const { formats: formatsData, loading } = useSystemRequestsCache();
-
-  useEffect(() => {
-
-    if (!loading && formatsData && formatsData.data && formatsData.data.attribute_formats) {
-      const parsedSchema = formatsData.data.attribute_formats.map((entry) => ({
-        ...entry,
-        ...(method === 'view' && {
-          readOnly: true,
-        }),
-      }));
-
-      setAttributeFormatsSchema(parsedSchema);
-
-    }
-
-  }, [formatsData, loading])
-
-  return <section>
-    {attributeFormatsSchema && <FormTabsRenderer schema={attributeFormatsSchema} method={method} label="Datos de contacto" />}
-  </section>
-
-}
-
-const TenantAttributesView: React.FC<IDashAutoAdminCustomFieldComponent> = ({ method, attribute, tenant }) => {
-
-  const { formats: attributeFormats, loading } = useTenantAttributesFormats();
-  const [attributeFormatsParsedValues, setAttributeFormatsParsedValues] = useState<any>(null);
-
-  const parseValue = (value) => {
-    switch (typeof value) {
-      case "boolean":
-        return value ? "Sí" : "No";
-      case "number":
-      case "string":
-      default:
-        return value
-    }
-  }
-
-  useEffect(() => {
-    let object = {};
-    if (attributeFormats && tenant) {
-
-      attributeFormats.forEach((entry) => {
-        const defaultValue = tenant.attributes && tenant.attributes.hasOwnProperty(entry.id) ? tenant.attributes[entry.id] : entry?.default_value;
-
-        object[entry.label] = <>{parseValue(defaultValue)}</>;
-      });
-
-      console.log("ATTRIBUTES SCHEMA", object);
-
-      setAttributeFormatsParsedValues(object);
-
-    }
-
-  }, [attributeFormats, tenant])
-
-  return attributeFormatsParsedValues ? <MUISimpleJsonTable tableData={attributeFormatsParsedValues} vertical={true} /> : <Loading />
-
-}
-
-const TenantAttributes = ({ method, attribute, resourceConfig }: IDashAutoAdminCustomFieldComponent) => {
-  const tenant: Tenant = useRecordContext();
-  switch (method) {
-    case "edit":
-      return <TenantAttributesEdit attribute={attribute} method={method} tenant={tenant} resourceConfig={resourceConfig} />
-    case "view":
-      return <TenantAttributesView attribute={attribute} method={method} tenant={tenant} resourceConfig={resourceConfig} />
-    case "create":
-      return <TenantAttributesCreate attribute={attribute} method={method} resourceConfig={resourceConfig} />
-    case "list":
-      return <></>
-  }
-}
-
-export default TenantAttributes;

package/src/components/tenant/TenantAttributesContext.tsx

@@ -1,163 +0,0 @@
-import { useAxios } from "dash-axios-hook";
-import { createContext, useState, useRef, useEffect, useContext } from "react";
-
-// --- IndexedDB Utility ---
-const DB_NAME = "TenantAttributesCacheDB";
-const STORE_NAME = "kvstore";
-const DB_VERSION = 1;
-
-function openDB(): Promise<IDBDatabase> {
-  return new Promise((resolve, reject) => {
-    const req = indexedDB.open(DB_NAME, DB_VERSION);
-    req.onupgradeneeded = () => {
-      req.result.createObjectStore(STORE_NAME);
-    };
-    req.onsuccess = () => resolve(req.result);
-    req.onerror = () => reject(req.error);
-  });
-}
-
-export async function idbSet(key: string, value: any) {
-  const db = await openDB();
-  return new Promise<void>((resolve, reject) => {
-    const tx = db.transaction(STORE_NAME, "readwrite");
-    tx.objectStore(STORE_NAME).put(value, key);
-    tx.oncomplete = () => resolve();
-    tx.onerror = () => reject(tx.error);
-  });
-}
-
-export async function idbGet(key: string) {
-  const db = await openDB();
-  return new Promise<any>((resolve, reject) => {
-    const tx = db.transaction(STORE_NAME, "readonly");
-    const req = tx.objectStore(STORE_NAME).get(key);
-    req.onsuccess = () => resolve(req.result);
-    req.onerror = () => reject(req.error);
-  });
-}
-
-// Global request tracking to prevent multiple requests across component instances
-let GLOBAL_FETCH_PROMISE: Promise<any> | null = null;
-let GLOBAL_FORMATS: any = null;
-let LAST_FETCH_TIME = 0;
-
-// --- Context and Provider for memoizing attributes formats ---
-const TenantAttributesFormatsContext = createContext<{
-  formats: any;
-  fetchFormats: () => Promise<void>;
-  loading: boolean;
-}>({
-  formats: null,
-  fetchFormats: async () => {},
-  loading: false,
-});
-
-export const TenantAttributesFormatsProvider: React.FC<{children: React.ReactNode}> = ({ children }) => {
-  const axios = useAxios();
-  // Use global formats if available or initialize with null
-  const [formats, setFormats] = useState<any>(GLOBAL_FORMATS);
-  const [loading, setLoading] = useState<boolean>(!!GLOBAL_FETCH_PROMISE);
-  const [initialized, setInitialized] = useState<boolean>(!!LAST_FETCH_TIME);
-  
-  const fetchFormats = async () => {
-    // If there's already a global fetch in progress, return that promise
-    if (GLOBAL_FETCH_PROMISE) {
-      return GLOBAL_FETCH_PROMISE;
-    }
-    
-    // Check if we recently fetched (within 10 seconds)
-    const now = Date.now();
-    if (!LAST_FETCH_TIME) {
-      try {
-        // Try to get last fetch time from IndexedDB
-        LAST_FETCH_TIME = (await idbGet("tenant_attributes_cache")) || 0;
-      } catch (error) {
-        console.error("Error reading from IndexedDB:", error);
-      }
-    }
-    
-    // Return early if we have formats and fetched recently
-    if (GLOBAL_FORMATS && now - LAST_FETCH_TIME < 10000) {
-      if (!formats) {
-        setFormats(GLOBAL_FORMATS);
-      }
-      return;
-    }
-    
-    // Start a new fetch
-    setLoading(true);
-    
-    // Create global fetch promise and store it
-    GLOBAL_FETCH_PROMISE = (async () => {
-      try {
-        console.log("FETCHING ATTRIBUTES FORMATS");
-        const { data } = await axios.get('system/tenant/systemAttributeFormats');
-        const formatsData = data.data?.attribute_formats || data.data;
-        
-        // Update global state
-        GLOBAL_FORMATS = formatsData;
-        LAST_FETCH_TIME = Date.now();
-        
-        // Update component state
-        setFormats(formatsData);
-        
-        // Cache in IndexedDB
-        try {
-          await idbSet("tenant_attributes_cache", LAST_FETCH_TIME);
-          await idbSet("tenant_attributes_formats", formatsData);
-        } catch (error) {
-          console.error("Error writing to IndexedDB:", error);
-        }
-      } catch (error) {
-        console.error("Error fetching attributes formats:", error);
-      } finally {
-        setLoading(false);
-        // Clear the global promise so future calls can initiate new fetches
-        GLOBAL_FETCH_PROMISE = null;
-      }
-    })();
-    
-    return GLOBAL_FETCH_PROMISE;
-  };
-  
-  useEffect(() => {
-    const loadCachedFormats = async () => {
-      try {
-        // Try to load from IndexedDB first
-        if (!GLOBAL_FORMATS) {
-          const cachedFormats = await idbGet("tenant_attributes_formats");
-          if (cachedFormats) {
-            GLOBAL_FORMATS = cachedFormats;
-            setFormats(cachedFormats);
-            setLoading(false);
-          }
-        }
-        // Always fetch if not recently fetched
-        await fetchFormats();
-      } catch (error) {
-        console.error("Error loading cached formats:", error);
-        // Fallback to fetching
-        await fetchFormats();
-      }
-    };
-    loadCachedFormats();
-    // eslint-disable-next-line
-  }, []);
-  
-  useEffect(() => {
-    if (formats) {
-      setLoading(false);
-    }
-  }, [formats]);
-  
-  return (
-    <TenantAttributesFormatsContext.Provider value={{ formats, fetchFormats, loading }}>
-      {children}
-    </TenantAttributesFormatsContext.Provider>
-  );
-};
-
-export function useTenantAttributesFormats() {
-  return useContext(TenantAttributesFormatsContext);
-}