@dashadmin/dash-admin 1.3.51 → 1.3.53

package/src/components/tenant/TenantAttributesContext.tsx

@@ -71,7 +71,7 @@ export const TenantAttributesFormatsProvider: React.FC<{children: React.ReactNod
     if (!LAST_FETCH_TIME) {
       try {
         // Try to get last fetch time from IndexedDB
-        LAST_FETCH_TIME = await idbGet("tenant_attributes_cache") || 0;
+        LAST_FETCH_TIME = (await idbGet("tenant_attributes_cache")) || 0;
       } catch (error) {
         console.error("Error reading from IndexedDB:", error);
       }

package/src/components/tenant/TenantSelector.tsx

@@ -77,9 +77,8 @@ const TenantSelector = React.forwardRef<
 	}
 
 	return (
-		<>
-			Cliente impersonado: {selectedTenantInput}
-			<Autocomplete
+        <>Cliente impersonado: {selectedTenantInput}
+            <Autocomplete
 				fullWidth
 				loading={isLoading && open}
 				sx={{ width: 300 }}
@@ -117,23 +116,27 @@ const TenantSelector = React.forwardRef<
 								handleSearch(ev.target.value);
 							}
 						}}
-						InputProps={{
-							...params.InputProps,
-							autoComplete: 'new-password',
-							endAdornment: (
-								<>
-									{isLoading ? (
-										<CircularProgress color='inherit' size={20} />
-									) : null}
-									{params.InputProps.endAdornment}
-								</>
-							),
-						}}
+						slotProps={{
+                            ...params.slotProps,
+
+                            input: {
+                                ...params.slotProps.input,
+                                autoComplete: 'new-password',
+                                endAdornment: (
+                                    <>
+                                        {isLoading ? (
+                                            <CircularProgress color='inherit' size={20} />
+                                        ) : null}
+                                        {params.slotProps.input.endAdornment}
+                                    </>
+                                ),
+                            }
+                        }}
 					/>
 				)}
 			/>
-		</>
-	);
+        </>
+    );
 });
 
 export default TenantSelector;

package/src/components/tenant/TenantSettingsContext.tsx

@@ -71,7 +71,7 @@ export const TenantSettingsFormatsProvider: React.FC<{children: React.ReactNode}
     if (!LAST_FETCH_TIME) {
       try {
         // Try to get last fetch time from IndexedDB
-        LAST_FETCH_TIME = await idbGet("tenant_settings_cache") || 0;
+        LAST_FETCH_TIME = (await idbGet("tenant_settings_cache")) || 0;
       } catch (error) {
         console.error("Error reading from IndexedDB:", error);
       }

package/src/components/user/UserPreferences.tsx

@@ -332,7 +332,9 @@ const UserPreferences: React.FC = () => {
                             <Box>
                                 <Typography variant="subtitle1">{format.label}</Typography>
                                 {format.description && (
-                                    <Typography variant="caption" color="text.secondary">
+                                    <Typography variant="caption" sx={{
+                                        color: "text.secondary"
+                                    }}>
                                         {format.description}
                                     </Typography>
                                 )}
@@ -352,7 +354,13 @@ const UserPreferences: React.FC = () => {
                         <CardContent>
                             <Typography variant="subtitle1" gutterBottom>{format.label}</Typography>
                             {format.description && (
-                                <Typography variant="caption" color="text.secondary" display="block" mb={2}>
+                                <Typography
+                                    variant="caption"
+                                    sx={{
+                                        color: "text.secondary",
+                                        display: "block",
+                                        mb: 2
+                                    }}>
                                     {format.description}
                                 </Typography>
                             )}
@@ -371,12 +379,14 @@ const UserPreferences: React.FC = () => {
                                     value={value ?? format.default_value ?? 0}
                                     onChange={(e) => handleGenericPreferenceChange(format.id, parseInt(e.target.value, 10))}
                                     disabled={saving || !format.editable}
-                                    inputProps={{
-                                        min: format.min ?? 0,
-                                        max: format.max ?? 100,
-                                    }}
                                     sx={{ width: 80 }}
                                     size="small"
+                                    slotProps={{
+                                        htmlInput: {
+                                            min: format.min ?? 0,
+                                            max: format.max ?? 100,
+                                        }
+                                    }}
                                 />
                             </Box>
                         </CardContent>
@@ -389,7 +399,13 @@ const UserPreferences: React.FC = () => {
                         <CardContent>
                             <Typography variant="subtitle1" gutterBottom>{format.label}</Typography>
                             {format.description && (
-                                <Typography variant="caption" color="text.secondary" display="block" mb={2}>
+                                <Typography
+                                    variant="caption"
+                                    sx={{
+                                        color: "text.secondary",
+                                        display: "block",
+                                        mb: 2
+                                    }}>
                                     {format.description}
                                 </Typography>
                             )}
@@ -398,15 +414,17 @@ const UserPreferences: React.FC = () => {
                                 value={value ?? ''}
                                 onChange={(e) => handleGenericPreferenceChange(format.id, e.target.value)}
                                 disabled={saving || !format.editable}
-                                inputProps={{ maxLength: format.maxLength }}
-                                InputProps={format.maxLength ? {
-                                    endAdornment: (
-                                        <InputAdornment position="end">
-                                            {(value?.length || 0)}/{format.maxLength}
-                                        </InputAdornment>
-                                    ),
-                                } : undefined}
-                            />
+                                slotProps={{
+                                    input: format.maxLength ? {
+                                        endAdornment: (
+                                            <InputAdornment position="end">
+                                                {(value?.length || 0)}/{format.maxLength}
+                                            </InputAdornment>
+                                        ),
+                                    } : undefined,
+
+                                    htmlInput: { maxLength: format.maxLength }
+                                }} />
                         </CardContent>
                     </Card>
                 );
@@ -417,7 +435,13 @@ const UserPreferences: React.FC = () => {
                         <CardContent>
                             <Typography variant="subtitle1" gutterBottom>{format.label}</Typography>
                             {format.description && (
-                                <Typography variant="caption" color="text.secondary" display="block" mb={2}>
+                                <Typography
+                                    variant="caption"
+                                    sx={{
+                                        color: "text.secondary",
+                                        display: "block",
+                                        mb: 2
+                                    }}>
                                     {format.description}
                                 </Typography>
                             )}
@@ -428,8 +452,10 @@ const UserPreferences: React.FC = () => {
                                 value={value ?? ''}
                                 onChange={(e) => handleGenericPreferenceChange(format.id, e.target.value)}
                                 disabled={saving || !format.editable}
-                                inputProps={{ maxLength: format.maxLength }}
                                 helperText={format.maxLength ? `${(value?.length || 0)}/${format.maxLength} characters` : undefined}
+                                slotProps={{
+                                    htmlInput: { maxLength: format.maxLength }
+                                }}
                             />
                         </CardContent>
                     </Card>
@@ -462,7 +488,9 @@ const UserPreferences: React.FC = () => {
                                     <Typography variant="subtitle1">
                                         {formatNotificationName(pref.name)}
                                     </Typography>
-                                    <Typography variant="caption" color="text.secondary">
+                                    <Typography variant="caption" sx={{
+                                        color: "text.secondary"
+                                    }}>
                                         {pref.name}
                                     </Typography>
                                 </Box>
@@ -497,7 +525,9 @@ const UserPreferences: React.FC = () => {
                                     )}
 
                                     {!config?.hasEmail && !config?.hasPush && (
-                                        <Typography variant="caption" color="text.secondary">
+                                        <Typography variant="caption" sx={{
+                                            color: "text.secondary"
+                                        }}>
                                             (No configurable channels)
                                         </Typography>
                                     )}
@@ -518,7 +548,12 @@ const UserPreferences: React.FC = () => {
         return (
             <Box sx={{ pt: 2 }}>
                 {groupConfig?.description && (
-                    <Typography variant="body2" color="text.secondary" sx={{ mb: 3 }}>
+                    <Typography
+                        variant="body2"
+                        sx={{
+                            color: "text.secondary",
+                            mb: 3
+                        }}>
                         {groupConfig.description}
                     </Typography>
                 )}

package/src/contexts/SystemRequestsCache.tsx

@@ -101,7 +101,7 @@ export const SystemRequestsCacheProvider: React.FC<SystemRequestsCacheProviderPr
     const now = Date.now();
     if (!GLOBALS.current.lastFetchTime) {
       try {
-        GLOBALS.current.lastFetchTime = await idbGet(cacheKey) || 0;
+        GLOBALS.current.lastFetchTime = (await idbGet(cacheKey)) || 0;
         if (DEBUG_SYSTEM_REQUESTS_CACHE) {
           console.log(`[SystemRequestsCache] Loaded lastFetchTime from IndexedDB: ${GLOBALS.current.lastFetchTime}`);
         }

package/src/default-theme/menu/AppMenuComponents/expanded/CollapsableSidebarMenu.tsx

@@ -231,7 +231,7 @@ const CollapsableSidebarMenu = ({
             // onClick above does closest('.expand-icon') to tell "clicked the arrow"
             // from "clicked the row" — if only the svg had it, clicking the circle's
             // padding (outside the svg's own box) would miss the check and navigate.
-            <div className="expand-icon expand-icon-wrapper" onClick={handleExpandClick}>
+            (<div className="expand-icon expand-icon-wrapper" onClick={handleExpandClick}>
               {/* For bottom position, invert icons since submenu opens upward */}
               {sidebarPosition === "bottom" ? (
                 localOpen ? 
@@ -242,11 +242,11 @@ const CollapsableSidebarMenu = ({
                   <ExpandLessOutlinedIcon className='expand-icon less' /> : 
                   <ExpandMoreOutlinedIcon className='expand-icon more' />
               )}
-            </div>
+            </div>)
           )}
         </ListItemButton>
       </div>
-      
+
       {/* Portal submenu for all positions */}
       {/* Vertical mode (Left/Right) - Inline Expansion using Collapse */}
       {!isHorizontal && (

package/src/default-theme/menu/SidebarActions.tsx

@@ -62,20 +62,20 @@ const SidebarActions: React.FC<SidebarActionsProps> = ({
                 ),
             }}
         >
-              {authContext?.authenticated && authContext.user?.id !== 'guest' && (
-                        <AvatarComponent sidebarPosition={sidebarPosition} />
-                    )}    
+            {authContext?.authenticated && authContext.user?.id !== 'guest' && (
+                      <AvatarComponent sidebarPosition={sidebarPosition} />
+                  )}
 
             {HeaderToolBar && headerToolBarReplace ? (
                 // Replace mode: Only render the custom HeaderToolBar
-                <HeaderToolBar />
+                (<HeaderToolBar />)
             ) : (
                 // Default mode: Render all actions
-                <>       
+                (<>
                     {HeaderToolBar && <HeaderToolBar />}
                     {authContext?.authenticated ? <BridgedLocalesMenuButton /> :  <LangSwitcher />}
                     <DarkToggleMode />
-                </>
+                </>)
             )}
         </Box>
     );

package/src/pages/DASHLightWeightLogin.tsx

@@ -403,13 +403,14 @@ const DASHLightWeightLogin: React.FC<DASHLightWeightLoginProps> = (props) => {
                
             >
                 <Container maxWidth="sm" sx={{ p: 1 }}>
-                    <Box 
-                        display="flex" 
-                        justifyContent="center" 
-                        alignItems="center" 
-                        minHeight="50vh"
-                        textAlign="center"
-                    >
+                    <Box
+                        sx={{
+                            display: "flex",
+                            justifyContent: "center",
+                            alignItems: "center",
+                            minHeight: "50vh",
+                            textAlign: "center"
+                        }}>
                         <div>Cargando...</div>
                     </Box>
                 </Container>

package/src/pages/Profile.tsx

@@ -149,9 +149,9 @@ const Profile: FC = (_props) => {
 	};
 
 	return (
-		<div className='dash-profile'>
+        <div className='dash-profile'>
 
-			{user ? (
+            {user ? (
 				<Form
 					onSubmit={handleSubmit}
 					validate={validateUserCreation}
@@ -168,11 +168,12 @@ const Profile: FC = (_props) => {
 						>
 							{/* Profile Image Section */}
 							<Grid
-								size={{ xs: 12, md: 4 }}
-								display="flex"
-								justifyContent="center"
-								alignItems="center"
-							>
+                                size={{ xs: 12, md: 4 }}
+                                sx={{
+                                    display: "flex",
+                                    justifyContent: "center",
+                                    alignItems: "center"
+                                }}>
 								<CardContent
 									sx={{
 										height: '100%',
@@ -349,8 +350,8 @@ const Profile: FC = (_props) => {
 			) : (
 				<Loading />
 			)}
-		</div>
-	);
+        </div>
+    );
 };
 
 export default Profile;

package/src/pages/RecoverPassword.tsx

@@ -55,8 +55,8 @@ const RecoverPassword = ({  }: {  }) => {
     }, [])
 
 	return (
-		<FullLayoutMarkup>
-			<Box
+        <FullLayoutMarkup>
+            <Box
 				sx={{
 					//height: '100vh',
 					display: 'flex',
@@ -104,7 +104,14 @@ const RecoverPassword = ({  }: {  }) => {
 						</Box>
 					) : (
 						<form onSubmit={handleSubmit} className='dash-app-login-form'>
-							<Grid container sx={{ mb:4, mt:2 }} spacing={2} alignItems="center">
+							<Grid
+                                container
+                                spacing={2}
+                                sx={{
+                                    alignItems: "center",
+                                    mb:4,
+                                    mt:2
+                                }}>
                                 {/* @ts-ignore */}
 								<Grid item xs={2}>
 									<IconButton
@@ -135,13 +142,15 @@ const RecoverPassword = ({  }: {  }) => {
 									placeholder='Email'
 									required
 									value={email}
-									inputProps={{type:'email'}}
 									onChange={(e) => setEmail(e.target.value)}
 									className='dash-app-form-item-input'
 									autoComplete="username"
 									name="email"
 									type="email"
 									id="email"
+									slotProps={{
+                                        htmlInput: {type:'email'}
+                                    }}
 								/>
 							</div>
 
@@ -159,8 +168,8 @@ const RecoverPassword = ({  }: {  }) => {
 					)}
 				</Box>
 			</Box>
-		</FullLayoutMarkup>
-	);
+        </FullLayoutMarkup>
+    );
 };
 
 export default RecoverPassword;

package/src/schemas/subscription/components/SubscriptionPaymentHistory.tsx

@@ -53,7 +53,12 @@ const PaymentHistoryView: React.FC<IDashAutoAdminCustomFieldComponent> = () => {
 
     if (loading) {
         return (
-            <Box display="flex" justifyContent="center" p={2}>
+            <Box
+                sx={{
+                    display: "flex",
+                    justifyContent: "center",
+                    p: 2
+                }}>
                 <CircularProgress />
             </Box>
         );
@@ -96,7 +101,9 @@ const PaymentHistoryView: React.FC<IDashAutoAdminCustomFieldComponent> = () => {
                                 </Typography>
                             </TableCell>
                             <TableCell>
-                                <Typography variant="body2" fontFamily="monospace">
+                                <Typography variant="body2" sx={{
+                                    fontFamily: "monospace"
+                                }}>
                                     {payment.transaction_id}
                                 </Typography>
                             </TableCell>

package/src/schemas/subscription/components/SubscriptionPlanFeatures.tsx

@@ -48,8 +48,13 @@ const EditComponent: React.FC<IDashAutoAdminCustomFieldComponent> = ({ method, a
             <Typography variant="h6" gutterBottom>
                 Características del Plan
             </Typography>
-            
-            <Box display="flex" gap={1} mb={2}>
+
+            <Box
+                sx={{
+                    display: "flex",
+                    gap: 1,
+                    mb: 2
+                }}>
                 <TextField
                     fullWidth
                     size="small"
@@ -95,7 +100,9 @@ const EditComponent: React.FC<IDashAutoAdminCustomFieldComponent> = ({ method, a
                 </Typography>
             )}
 
-            <Box mt={2}>
+            <Box sx={{
+                mt: 2
+            }}>
                 <Typography variant="body2" color="textSecondary">
                     Las características se mostrarán a los usuarios al seleccionar este plan de suscripción.
                 </Typography>

package/src/schemas/subscription/components/SubscriptionPlanPreview.tsx

@@ -31,11 +31,17 @@ const SubscriptionPlanPreview: React.FC<IDashAutoAdminCustomFieldComponent> = ({
     };
 
     return (
-        <Box maxWidth={400}>
+        <Box sx={{
+            maxWidth: 400
+        }}>
             <Card elevation={3}>
                 <CardContent>
                     {/* Header */}
-                    <Box textAlign="center" mb={2}>
+                    <Box
+                        sx={{
+                            textAlign: "center",
+                            mb: 2
+                        }}>
                         <Typography variant="h5" component="h2" gutterBottom>
                             {record.name}
                         </Typography>
@@ -59,7 +65,9 @@ const SubscriptionPlanPreview: React.FC<IDashAutoAdminCustomFieldComponent> = ({
                         </Typography>
 
                         {record.billing_cycle === 'yearly' && (
-                            <Typography variant="body2" color="success.main">
+                            <Typography variant="body2" sx={{
+                                color: "success.main"
+                            }}>
                                 {formatPrice(record.price_per_month)} por mes
                             </Typography>
                         )}
@@ -69,7 +77,9 @@ const SubscriptionPlanPreview: React.FC<IDashAutoAdminCustomFieldComponent> = ({
 
                     {/* Description */}
                     {record.description && (
-                        <Typography variant="body2" color="textSecondary" paragraph>
+                        <Typography variant="body2" color="textSecondary" sx={{
+                            marginBottom: "16px"
+                        }}>
                             {record.description}
                         </Typography>
                     )}
@@ -88,7 +98,9 @@ const SubscriptionPlanPreview: React.FC<IDashAutoAdminCustomFieldComponent> = ({
                                         </ListItemIcon>
                                         <ListItemText 
                                             primary={feature}
-                                            primaryTypographyProps={{ variant: 'body2' }}
+                                            slotProps={{
+                                                primary: { variant: 'body2' }
+                                            }}
                                         />
                                     </ListItem>
                                 ))}
@@ -109,13 +121,14 @@ const SubscriptionPlanPreview: React.FC<IDashAutoAdminCustomFieldComponent> = ({
                     </Button>
 
                     {!record.is_active && (
-                        <Typography 
-                            variant="caption" 
-                            color="error" 
-                            display="block" 
-                            textAlign="center" 
-                            mt={1}
-                        >
+                        <Typography
+                            variant="caption"
+                            color="error"
+                            sx={{
+                                display: "block",
+                                textAlign: "center",
+                                mt: 1
+                            }}>
                             Plan no disponible
                         </Typography>
                     )}