@dashadmin/dash-admin 1.3.24 → 1.3.26

package/dist/components/tenant/TenantSettingsContext.js

@@ -1 +1,152 @@
-import{jsx as B}from"react/jsx-runtime";import{useAxios as w}from"@dashadmin/dash-axios-hook";import{createContext as E,useState as u,useEffect as T,useContext as p}from"react";const D="TenantSettingsCacheDB",l="kvstore",b=1;function y(){return new Promise((r,n)=>{const t=indexedDB.open(D,b);t.onupgradeneeded=()=>{t.result.createObjectStore(l)},t.onsuccess=()=>r(t.result),t.onerror=()=>n(t.error)})}async function S(r,n){const t=await y();return new Promise((a,d)=>{const e=t.transaction(l,"readwrite");e.objectStore(l).put(n,r),e.oncomplete=()=>a(),e.onerror=()=>d(e.error)})}async function x(r){const n=await y();return new Promise((t,a)=>{const e=n.transaction(l,"readonly").objectStore(l).get(r);e.onsuccess=()=>t(e.result),e.onerror=()=>a(e.error)})}let c=null,s=null,i=0;const F=E({formats:null,fetchFormats:async()=>{},loading:!1}),C=({children:r})=>{const n=w(),[t,a]=u(s),[d,e]=u(!!c),[P,_]=u(!!i),m=async()=>{if(c)return c;const g=Date.now();if(!i)try{i=await x("tenant_settings_cache")||0}catch(o){console.error("Error reading from IndexedDB:",o)}if(s&&g-i<1e4){t||a(s);return}return e(!0),c=(async()=>{try{console.log("FETCHING SETTINGS FORMATS");const{data:o}=await n.get("system/tenant/systemSettingFormats"),f=o.data?.setting_formats||o.data;s=f,i=Date.now(),a(f),_(!0);try{await S("tenant_settings_cache",i),await S("tenant_settings_formats",f)}catch(h){console.error("Error writing to IndexedDB:",h)}}catch(o){console.error("Error fetching settings formats:",o)}finally{e(!1),c=null}})(),c};return T(()=>{(async()=>{try{if(!s){const o=await x("tenant_settings_formats");o&&(s=o,a(o))}m()}catch(o){console.error("Error loading cached formats:",o),m()}})()},[]),B(F.Provider,{value:{formats:t||s,fetchFormats:m,loading:d},children:r})},O=()=>p(F);var v=C;export{C as TenantSettingsFormatsProvider,v as default,x as idbGet,S as idbSet,O as useTenantSettingsFormats};
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { jsx } from "react/jsx-runtime";
+import { useAxios } from "dash-axios-hook";
+import { createContext, useState, useEffect, useContext } from "react";
+const DB_NAME = "TenantSettingsCacheDB";
+const STORE_NAME = "kvstore";
+const DB_VERSION = 1;
+function openDB() {
+  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);
+  });
+}
+function idbSet(key, value) {
+  return __async(this, null, function* () {
+    const db = yield openDB();
+    return new Promise((resolve, reject) => {
+      const tx = db.transaction(STORE_NAME, "readwrite");
+      tx.objectStore(STORE_NAME).put(value, key);
+      tx.oncomplete = () => resolve();
+      tx.onerror = () => reject(tx.error);
+    });
+  });
+}
+function idbGet(key) {
+  return __async(this, null, function* () {
+    const db = yield openDB();
+    return new Promise((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);
+    });
+  });
+}
+let GLOBAL_FETCH_PROMISE = null;
+let GLOBAL_FORMATS = null;
+let LAST_FETCH_TIME = 0;
+const TenantSettingsFormatsContext = createContext({
+  formats: null,
+  fetchFormats: () => __async(null, null, function* () {
+  }),
+  loading: false
+});
+const TenantSettingsFormatsProvider = ({ children }) => {
+  const axios = useAxios();
+  const [formats, setFormats] = useState(GLOBAL_FORMATS);
+  const [loading, setLoading] = useState(!!GLOBAL_FETCH_PROMISE);
+  const [initialized, setInitialized] = useState(!!LAST_FETCH_TIME);
+  const fetchFormats = () => __async(null, null, function* () {
+    if (GLOBAL_FETCH_PROMISE) {
+      return GLOBAL_FETCH_PROMISE;
+    }
+    const now = Date.now();
+    if (!LAST_FETCH_TIME) {
+      try {
+        LAST_FETCH_TIME = (yield idbGet("tenant_settings_cache")) || 0;
+      } catch (error) {
+        console.error("Error reading from IndexedDB:", error);
+      }
+    }
+    if (GLOBAL_FORMATS && now - LAST_FETCH_TIME < 1e4) {
+      if (!formats) {
+        setFormats(GLOBAL_FORMATS);
+      }
+      return;
+    }
+    setLoading(true);
+    GLOBAL_FETCH_PROMISE = (() => __async(null, null, function* () {
+      var _a;
+      try {
+        console.log("FETCHING SETTINGS FORMATS");
+        const { data } = yield axios.get("system/tenant/systemSettingFormats");
+        const formatsData = ((_a = data.data) == null ? void 0 : _a.setting_formats) || data.data;
+        GLOBAL_FORMATS = formatsData;
+        LAST_FETCH_TIME = Date.now();
+        setFormats(formatsData);
+        setInitialized(true);
+        try {
+          yield idbSet("tenant_settings_cache", LAST_FETCH_TIME);
+          yield idbSet("tenant_settings_formats", formatsData);
+        } catch (error) {
+          console.error("Error writing to IndexedDB:", error);
+        }
+      } catch (error) {
+        console.error("Error fetching settings formats:", error);
+      } finally {
+        setLoading(false);
+        GLOBAL_FETCH_PROMISE = null;
+      }
+    }))();
+    return GLOBAL_FETCH_PROMISE;
+  });
+  useEffect(() => {
+    const loadCachedFormats = () => __async(null, null, function* () {
+      try {
+        if (!GLOBAL_FORMATS) {
+          const cachedFormats = yield idbGet("tenant_settings_formats");
+          if (cachedFormats) {
+            GLOBAL_FORMATS = cachedFormats;
+            setFormats(cachedFormats);
+          }
+        }
+        fetchFormats();
+      } catch (error) {
+        console.error("Error loading cached formats:", error);
+        fetchFormats();
+      }
+    });
+    loadCachedFormats();
+  }, []);
+  return /* @__PURE__ */ jsx(TenantSettingsFormatsContext.Provider, { value: {
+    formats: formats || GLOBAL_FORMATS,
+    fetchFormats,
+    loading
+  }, children });
+};
+const useTenantSettingsFormats = () => {
+  const ctx = useContext(TenantSettingsFormatsContext);
+  return ctx;
+};
+var TenantSettingsContext_default = TenantSettingsFormatsProvider;
+export {
+  TenantSettingsFormatsProvider,
+  TenantSettingsContext_default as default,
+  idbGet,
+  idbSet,
+  useTenantSettingsFormats
+};

package/dist/components/tenant/TenantTheme.js

@@ -1 +1,112 @@
-import{Fragment as g,jsx as a}from"react/jsx-runtime";import{DashAutoFormTabs as C}from"@dashadmin/dash-auto-admin";import{useState as d,useEffect as f}from"react";import{Loading as F,useRecordContext as b}from"react-admin";import{useFormContext as S,useWatch as T}from"react-hook-form";import A from"../misc/MuiSimpleJsonTable";import{useTenantSettingsFormats as D}from"./TenantSettingsContext";import{useSystemRequestsCache as h}from"../../contexts/SystemRequestsCache";const p=({schema:o,method:i,label:t})=>a(g,{children:C({schema:o,resourceConfig:null,options:{mode:i,label:t}})}),R=({method:o,attribute:i,tenant:t})=>{const[n,l]=d(null),{formats:r,loading:m}=h();return f(()=>{if(r&&r.data&&r.data.setting_formats){const u=r.data.setting_formats.filter(e=>e.tab==="colors").map(e=>{const s=e.attribute?e.attribute.replace("settings.",""):e.id,c=t.settings&&t.settings[s]||e?.default_value;return{...e,...(c!==null||c!==void 0)&&{fieldOptions:{defaultValue:c,fullWidth:!0}},...o==="view"&&{readOnly:!0}}});console.log("SCHEMA",u),l(u)}},[r]),a("section",{children:n&&a(p,{schema:n,method:o,label:"Tema"})})},w=({method:o,attribute:i})=>{const[t,n]=d(null),l=S(),r=T({control:l.control}),{formats:m,loading:u}=h();return f(()=>{if(!u&&m&&m.data&&m.data.setting_formats){const e=m.data.setting_formats.filter(s=>s.tab==="colors").map(s=>({...s,...o==="view"&&{readOnly:!0}}));n(e)}},[m,u]),a("section",{children:t&&a(p,{schema:t,method:o,label:"Tema"})})},V=({method:o,attribute:i,tenant:t})=>{const{formats:n,loading:l}=D(),[r,m]=d(null),u=e=>typeof e==="boolean"?e?"S\xED":"No":e;return f(()=>{let e={};n&&t&&(n.filter(s=>s.tab==="colors").forEach(s=>{const c=t.settings&&t.settings.hasOwnProperty(s.id)?t.settings[s.id]:s?.default_value;e[s.label]=a(g,{children:u(c)})}),console.log("SCHEMA",e),m(e))},[n,t]),r?a(A,{tableData:r,vertical:!0}):a(F,{})},x=({method:o,attribute:i,resourceConfig:t})=>{const n=b();switch(o){case"edit":return a(R,{attribute:i,method:o,tenant:n,resourceConfig:t});case"view":return a(V,{attribute:i,method:o,tenant:n,resourceConfig:t});case"create":return a(w,{attribute:i,method:o,resourceConfig:t});case"list":return a(g,{})}};var z=x;export{z as default};
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import { Fragment, jsx } from "react/jsx-runtime";
+import { DashAutoFormTabs } from "dash-auto-admin";
+import { useState, useEffect } from "react";
+import { Loading, useRecordContext } from "react-admin";
+import { useFormContext, useWatch } from "react-hook-form";
+import MUISimpleJsonTable from "../misc/MuiSimpleJsonTable";
+import { useTenantSettingsFormats } from "./TenantSettingsContext";
+import { useSystemRequestsCache } from "../../contexts/SystemRequestsCache";
+const FormTabsRenderer = ({ schema, method, label }) => /* @__PURE__ */ jsx(Fragment, { children: DashAutoFormTabs({ schema, resourceConfig: null, options: { mode: method, label } }) });
+const TenantThemeEdit = ({ method, attribute, tenant }) => {
+  const [settingFormatsSchema, setSettingFormatsSchema] = useState(null);
+  const { formats: formatsData, loading } = useSystemRequestsCache();
+  useEffect(() => {
+    if (formatsData && formatsData.data && formatsData.data.setting_formats) {
+      const parsedSchema = formatsData.data.setting_formats.filter((entry) => entry.tab === "colors").map((entry) => {
+        const settingName = entry.attribute ? entry.attribute.replace("settings.", "") : entry.id;
+        const defaultValue = tenant.settings && tenant.settings[settingName] || (entry == null ? void 0 : entry.default_value);
+        return __spreadValues(__spreadValues(
+          __spreadValues({}, entry),
+          /*method === "edit" &&*/
+          (defaultValue !== null || defaultValue !== void 0) && {
+            fieldOptions: {
+              defaultValue,
+              fullWidth: true
+            }
+          }
+        ), method === "view" && {
+          readOnly: true
+        });
+      });
+      console.log("SCHEMA", parsedSchema);
+      setSettingFormatsSchema(parsedSchema);
+    }
+  }, [formatsData]);
+  return /* @__PURE__ */ jsx("section", { children: settingFormatsSchema && /* @__PURE__ */ jsx(FormTabsRenderer, { schema: settingFormatsSchema, method, label: "Tema" }) });
+};
+const TenantThemeCreate = ({ method, attribute }) => {
+  const [settingFormatsSchema, setSettingFormatsSchema] = useState(null);
+  const formContext = useFormContext();
+  const formValues = useWatch({
+    control: formContext.control
+  });
+  const { formats: formatsData, loading } = useSystemRequestsCache();
+  useEffect(() => {
+    if (!loading && formatsData && formatsData.data && formatsData.data.setting_formats) {
+      const parsedSchema = formatsData.data.setting_formats.filter((entry) => entry.tab === "colors").map((entry) => __spreadValues(__spreadValues({}, entry), method === "view" && {
+        readOnly: true
+      }));
+      setSettingFormatsSchema(parsedSchema);
+    }
+  }, [formatsData, loading]);
+  return /* @__PURE__ */ jsx("section", { children: settingFormatsSchema && /* @__PURE__ */ jsx(FormTabsRenderer, { schema: settingFormatsSchema, method, label: "Tema" }) });
+};
+const TenantThemeView = ({ method, attribute, tenant }) => {
+  const { formats: settingFormats, loading } = useTenantSettingsFormats();
+  const [settingFormatsParsedValues, setSettingFormatsParsedValues] = useState(null);
+  const parseValue = (value) => {
+    switch (typeof value) {
+      case "boolean":
+        return value ? "S\xED" : "No";
+      case "number":
+      case "string":
+      default:
+        return value;
+    }
+  };
+  useEffect(() => {
+    let object = {};
+    if (settingFormats && tenant) {
+      settingFormats.filter((entry) => entry.tab === "colors").forEach((entry) => {
+        const defaultValue = tenant.settings && tenant.settings.hasOwnProperty(entry.id) ? tenant.settings[entry.id] : entry == null ? void 0 : entry.default_value;
+        object[entry.label] = /* @__PURE__ */ jsx(Fragment, { children: parseValue(defaultValue) });
+      });
+      console.log("SCHEMA", object);
+      setSettingFormatsParsedValues(object);
+    }
+  }, [settingFormats, tenant]);
+  return settingFormatsParsedValues ? /* @__PURE__ */ jsx(MUISimpleJsonTable, { tableData: settingFormatsParsedValues, vertical: true }) : /* @__PURE__ */ jsx(Loading, {});
+};
+const TenantTheme = ({ method, attribute, resourceConfig }) => {
+  const tenant = useRecordContext();
+  switch (method) {
+    case "edit":
+      return /* @__PURE__ */ jsx(TenantThemeEdit, { attribute, method, tenant, resourceConfig });
+    case "view":
+      return /* @__PURE__ */ jsx(TenantThemeView, { attribute, method, tenant, resourceConfig });
+    case "create":
+      return /* @__PURE__ */ jsx(TenantThemeCreate, { attribute, method, resourceConfig });
+    case "list":
+      return /* @__PURE__ */ jsx(Fragment, {});
+  }
+};
+var TenantTheme_default = TenantTheme;
+export {
+  TenantTheme_default as default
+};

package/dist/components/user/AvatarComponent.js

@@ -1 +1,270 @@
-import{Fragment as ee,jsx as t,jsxs as L}from"react/jsx-runtime";import{Avatar as A,useMediaQuery as B,useTheme as Q}from"@mui/material";import{useEffect as i,useState as d,useRef as g}from"react";import{IconMenuItem as E}from"mui-nested-menu";import X from"react-dom";import $ from"@mui/icons-material/AccountCircle";import q from"@mui/icons-material/Logout";import{useWindowSize as G}from"@dashadmin/dash-utils";import{useAuthContext as J}from"../../contexts/auth/AuthContext";import{useTranslate as K}from"react-admin";import{useNavigate as Z}from"react-router-dom";import{NavEventManager as R}from"../../utils/navEvents";const j=({sidebarPosition:N="left"})=>{const{user:o,logout:T,authenticated:y}=J(),s=G(),v=K(),_=Q(),D=B(_.breakpoints.down("md")),[u,b]=d(!1),[m,a]=d(!1),f=g(null),P=g(null),[M,k]=d({top:0,left:0}),n=g(null),I=Z(),[r,S]=d(o);i(()=>{console.log("AvatarComponent: User data changed in auth context:",o),S(o),(o?.image_url!==r?.image_url||o?.image_path!==r?.image_path)&&console.log("AvatarComponent: User image changed, forcing update")},[o,o?.name,o?.image_url,o?.image_path,o?.id]),i(()=>{document.body.classList.contains("webview")?b(!0):b(!1)},[]);const U=async e=>{e.preventDefault(),localStorage.clear(),await T(),window.location.href="/"},x=()=>{I("/profile")},p=()=>{if(f.current&&s.width&&s.height){const e=f.current.getBoundingClientRect(),l=230,Y=120;let c=e.left+window.scrollX,C=e.top+window.scrollY;c+l>s.width&&(c=s.width-l-10),c<10&&(c=10),N==="bottom"&&(C=e.top+window.scrollY-Y-10),k({top:C,left:c+40})}},H=e=>{console.log("handleAvatarMouseEnter"),e.preventDefault(),n.current&&(clearTimeout(n.current),n.current=null),a(!0),p()},O=e=>{console.log("handleAvatarClick"),e.preventDefault(),a(l=>!l),p()},z=()=>{console.log("handleMouseLeave"),u||(n.current=setTimeout(()=>{a(!1)},100))},W=()=>{console.log("handleMenuMouseEnter"),n.current&&(clearTimeout(n.current),n.current=null)},F=()=>{console.log("handleMenuMouseLeave"),u||a(!1)};if(i(()=>()=>{n.current&&clearTimeout(n.current)},[]),i(()=>{m&&p()},[s.width,s.height,m,D]),i(()=>{const e=R.onSubmenuOpened(()=>{a(!1)}),l=R.onCloseAllSubmenus(()=>{a(!1)});return()=>{e(),l()}},[]),!y||!r)return null;const h=()=>r?.image_url||r?.image_path||null,w=()=>r?.name||"Usuario",V=()=>{const e=w();return e?e.charAt(0).toUpperCase():"?"};return L(ee,{children:[t("div",{ref:f,className:"dash-user-avatar",...u?{onClick:O}:{onMouseEnter:H,onMouseLeave:z},children:h()?t(A,{src:h(),className:"dash-icon-button-color dash-icon-button-bg"},h()):t(A,{className:"dash-icon-button-color dash-icon-button-bg",children:V()})}),m&&X.createPortal(t("div",{ref:P,className:"dash-user-menu-portal",onMouseEnter:u?void 0:W,onMouseLeave:u?void 0:F,children:L("div",{className:`dash-user-menu ${m?"show":""}`,style:{zIndex:1e4,position:"absolute",top:M.top,left:M.left},children:[t("span",{className:"dash-user-name",style:{padding:"8px 16px",display:"block"},children:w()}),t(E,{onClick:e=>{e.preventDefault(),a(!1),x()},leftIcon:t("span",{className:"dash-user-icon",children:t($,{})}),label:v("ra.auth.user_menu",{_:"Perfil"}),className:"dash-icon-button-color dash-icon-button-bg"}),t(E,{onClick:e=>{a(!1),U(e)},leftIcon:t("span",{className:"dash-user-icon",children:t(q,{})}),label:v("ra.auth.logout",{_:"Cerrar sesi\xF3n"}),className:"dash-icon-button-color dash-icon-button-bg"})]})}),document.body)]})};var be=j;export{be as default};
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __async = (__this, __arguments, generator) => {
+  return new Promise((resolve, reject) => {
+    var fulfilled = (value) => {
+      try {
+        step(generator.next(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var rejected = (value) => {
+      try {
+        step(generator.throw(value));
+      } catch (e) {
+        reject(e);
+      }
+    };
+    var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
+    step((generator = generator.apply(__this, __arguments)).next());
+  });
+};
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Avatar, useMediaQuery, useTheme } from "@mui/material";
+import { useEffect, useState, useRef } from "react";
+import { IconMenuItem } from "mui-nested-menu";
+import ReactDOM from "react-dom";
+import AccountCircleIcon from "@mui/icons-material/AccountCircle";
+import LogoutIcon from "@mui/icons-material/Logout";
+import { useWindowSize } from "dash-utils";
+import { useAuthContext } from "../../contexts/auth/AuthContext";
+import { useTranslate } from "react-admin";
+import { useNavigate } from "react-router-dom";
+import { NavEventManager } from "../../utils/navEvents";
+const AvatarComponent = ({ sidebarPosition = "left" }) => {
+  const { user, logout, authenticated } = useAuthContext();
+  const windowSize = useWindowSize();
+  const translate = useTranslate();
+  const theme = useTheme();
+  const isSmallScreen = useMediaQuery(theme.breakpoints.down("md"));
+  const [webView, setWebView] = useState(false);
+  const [open, setOpen] = useState(false);
+  const avatarRef = useRef(null);
+  const menuRef = useRef(null);
+  const [menuPosition, setMenuPosition] = useState({ top: 0, left: 0 });
+  const timeoutRef = useRef(null);
+  const navigate = useNavigate();
+  const [currentUser, setCurrentUser] = useState(user);
+  useEffect(() => {
+    console.log("AvatarComponent: User data changed in auth context:", user);
+    setCurrentUser(user);
+    if ((user == null ? void 0 : user.image_url) !== (currentUser == null ? void 0 : currentUser.image_url) || (user == null ? void 0 : user.image_path) !== (currentUser == null ? void 0 : currentUser.image_path)) {
+      console.log("AvatarComponent: User image changed, forcing update");
+    }
+  }, [user, user == null ? void 0 : user.name, user == null ? void 0 : user.image_url, user == null ? void 0 : user.image_path, user == null ? void 0 : user.id]);
+  useEffect(() => {
+    if (document.body.classList.contains("webview")) {
+      setWebView(true);
+    } else {
+      setWebView(false);
+    }
+  }, []);
+  const handleLogout = (e) => __async(null, null, function* () {
+    e.preventDefault();
+    localStorage.clear();
+    yield logout();
+    window.location.href = "/";
+  });
+  const handleProfileRedirect = () => {
+    navigate("/profile");
+  };
+  const calculateMenuPosition = () => {
+    if (avatarRef.current && windowSize.width && windowSize.height) {
+      const rect = avatarRef.current.getBoundingClientRect();
+      const menuWidth = 230;
+      const menuHeight = 120;
+      let left = rect.left + window.scrollX;
+      let top = rect.top + window.scrollY;
+      if (left + menuWidth > windowSize.width) {
+        left = windowSize.width - menuWidth - 10;
+      }
+      if (left < 10) {
+        left = 10;
+      }
+      if (sidebarPosition === "bottom") {
+        top = rect.top + window.scrollY - menuHeight - 10;
+      }
+      setMenuPosition({
+        top,
+        left: left + 40
+      });
+    }
+  };
+  const handleAvatarMouseEnter = (e) => {
+    console.log("handleAvatarMouseEnter");
+    e.preventDefault();
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+    setOpen(true);
+    calculateMenuPosition();
+  };
+  const handleAvatarClick = (e) => {
+    console.log("handleAvatarClick");
+    e.preventDefault();
+    setOpen((prevOpen) => !prevOpen);
+    calculateMenuPosition();
+  };
+  const handleMouseLeave = () => {
+    console.log("handleMouseLeave");
+    if (!webView) {
+      timeoutRef.current = setTimeout(() => {
+        setOpen(false);
+      }, 100);
+    }
+  };
+  const handleMenuMouseEnter = () => {
+    console.log("handleMenuMouseEnter");
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+  };
+  const handleMenuMouseLeave = () => {
+    console.log("handleMenuMouseLeave");
+    if (!webView) {
+      setOpen(false);
+    }
+  };
+  useEffect(() => {
+    return () => {
+      if (timeoutRef.current) {
+        clearTimeout(timeoutRef.current);
+      }
+    };
+  }, []);
+  useEffect(() => {
+    if (open) {
+      calculateMenuPosition();
+    }
+  }, [windowSize.width, windowSize.height, open, isSmallScreen]);
+  useEffect(() => {
+    const unsubscribeSubmenuOpened = NavEventManager.onSubmenuOpened(() => {
+      setOpen(false);
+    });
+    const unsubscribeCloseAll = NavEventManager.onCloseAllSubmenus(() => {
+      setOpen(false);
+    });
+    return () => {
+      unsubscribeSubmenuOpened();
+      unsubscribeCloseAll();
+    };
+  }, []);
+  if (!authenticated || !currentUser) {
+    return null;
+  }
+  const getAvatarImageUrl = () => {
+    return (currentUser == null ? void 0 : currentUser.image_url) || (currentUser == null ? void 0 : currentUser.image_path) || null;
+  };
+  const getUserDisplayName = () => {
+    return (currentUser == null ? void 0 : currentUser.name) || "Usuario";
+  };
+  const getUserInitials = () => {
+    const name = getUserDisplayName();
+    return name ? name.charAt(0).toUpperCase() : "?";
+  };
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      __spreadProps(__spreadValues({
+        ref: avatarRef,
+        className: "dash-user-avatar"
+      }, !webView ? {
+        onMouseEnter: handleAvatarMouseEnter,
+        onMouseLeave: handleMouseLeave
+      } : {
+        onClick: handleAvatarClick
+      }), {
+        children: getAvatarImageUrl() ? /* @__PURE__ */ jsx(
+          Avatar,
+          {
+            src: getAvatarImageUrl(),
+            className: "dash-icon-button-color dash-icon-button-bg"
+          },
+          getAvatarImageUrl()
+        ) : /* @__PURE__ */ jsx(
+          Avatar,
+          {
+            className: "dash-icon-button-color dash-icon-button-bg",
+            children: getUserInitials()
+          }
+        )
+      })
+    ),
+    open && ReactDOM.createPortal(
+      /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: menuRef,
+          className: "dash-user-menu-portal",
+          onMouseEnter: !webView ? handleMenuMouseEnter : void 0,
+          onMouseLeave: !webView ? handleMenuMouseLeave : void 0,
+          children: /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: `dash-user-menu ${open ? "show" : ""}`,
+              style: {
+                zIndex: 1e4,
+                position: "absolute",
+                top: menuPosition.top,
+                left: menuPosition.left
+              },
+              children: [
+                /* @__PURE__ */ jsx("span", { className: "dash-user-name", style: { padding: "8px 16px", display: "block" }, children: getUserDisplayName() }),
+                /* @__PURE__ */ jsx(
+                  IconMenuItem,
+                  {
+                    onClick: (e) => {
+                      e.preventDefault();
+                      setOpen(false);
+                      handleProfileRedirect();
+                    },
+                    leftIcon: /* @__PURE__ */ jsx("span", { className: "dash-user-icon", children: /* @__PURE__ */ jsx(AccountCircleIcon, {}) }),
+                    label: translate("ra.auth.user_menu", { _: "Perfil" }),
+                    className: "dash-icon-button-color dash-icon-button-bg"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  IconMenuItem,
+                  {
+                    onClick: (e) => {
+                      setOpen(false);
+                      handleLogout(e);
+                    },
+                    leftIcon: /* @__PURE__ */ jsx("span", { className: "dash-user-icon", children: /* @__PURE__ */ jsx(LogoutIcon, {}) }),
+                    label: translate("ra.auth.logout", { _: "Cerrar sesi\xF3n" }),
+                    className: "dash-icon-button-color dash-icon-button-bg"
+                  }
+                )
+              ]
+            }
+          )
+        }
+      ),
+      document.body
+    )
+  ] });
+};
+var AvatarComponent_default = AvatarComponent;
+export {
+  AvatarComponent_default as default
+};

package/dist/components/user/TenantAvatarComponent.js

@@ -1 +1,83 @@
-import{jsx as s}from"react/jsx-runtime";import{Box as h}from"@mui/material";const d=({imageUrl:m,maxWidth:n=130,maxHeight:r=130,alt:g="Tenant Logo",sidebarPosition:t="left",sidebarSmallWidth:a="64px",navExpanded:i=!1,navSize:o="large",onClick:l})=>{const p=t==="top"||t==="bottom",e=t==="left"||t==="right",c={padding:"8px",display:"flex",alignItems:"center",justifyContent:"center",...p&&{height:r,maxHeight:r},...e&&o==="small"&&{width:a,maxWidth:a},...e&&o==="large"&&i&&{width:n,maxWidth:n},...e&&o==="large"&&!i&&{width:a,maxWidth:a}};return s(h,{component:"div",sx:{...c,cursor:l?"pointer":"default"},className:"dash-tenant-avatar",onClick:l,children:s("img",{src:m,alt:g,style:{width:"auto",height:"auto",maxWidth:"100%",maxHeight:"100%",objectFit:"contain"}})})};var y=d;export{y as default};
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { jsx } from "react/jsx-runtime";
+import { Box } from "@mui/material";
+const TenantAvatarComponent = ({
+  imageUrl,
+  maxWidth = 130,
+  maxHeight = 130,
+  alt = "Tenant Logo",
+  sidebarPosition = "left",
+  sidebarSmallWidth = "64px",
+  navExpanded = false,
+  navSize = "large",
+  onClick
+}) => {
+  const isHorizontal = sidebarPosition === "top" || sidebarPosition === "bottom";
+  const isVertical = sidebarPosition === "left" || sidebarPosition === "right";
+  const containerSx = __spreadValues(__spreadValues(__spreadValues(__spreadValues({
+    padding: "8px",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center"
+  }, isHorizontal && {
+    height: maxHeight,
+    maxHeight
+  }), isVertical && navSize === "small" && {
+    width: sidebarSmallWidth,
+    maxWidth: sidebarSmallWidth
+  }), isVertical && navSize === "large" && navExpanded && {
+    width: maxWidth,
+    maxWidth
+  }), isVertical && navSize === "large" && !navExpanded && {
+    width: sidebarSmallWidth,
+    maxWidth: sidebarSmallWidth
+  });
+  return /* @__PURE__ */ jsx(
+    Box,
+    {
+      component: "div",
+      sx: __spreadProps(__spreadValues({}, containerSx), {
+        //m: 1,
+        cursor: onClick ? "pointer" : "default"
+      }),
+      className: "dash-tenant-avatar",
+      onClick,
+      children: /* @__PURE__ */ jsx(
+        "img",
+        {
+          src: imageUrl,
+          alt,
+          style: {
+            width: "auto",
+            height: "auto",
+            maxWidth: "100%",
+            maxHeight: "100%",
+            objectFit: "contain"
+          }
+        }
+      )
+    }
+  );
+};
+var TenantAvatarComponent_default = TenantAvatarComponent;
+export {
+  TenantAvatarComponent_default as default
+};