strapi-plugin-magic-link-v5 4.8.1 → 4.9.0

package/admin/src/pages/Tokens/IPBans.jsx

@@ -97,6 +97,10 @@ const float = keyframes`
 const Container = styled(Box)`
   animation: ${fadeIn} 0.5s;
   min-height: calc(100vh - 200px);
+  
+  @media (prefers-color-scheme: dark) {
+    background: transparent;
+  }
 `;
 
 const StatsGrid = styled(Box)`
@@ -132,6 +136,16 @@ const StatCard = styled(Box)`
       transform: rotate(10deg) scale(1.1);
     }
   }
+  
+  @media (prefers-color-scheme: dark) {
+    background: rgba(30, 30, 40, 0.6);
+    border-color: rgba(255, 255, 255, 0.1);
+    
+    &:hover {
+      background: rgba(40, 40, 50, 0.8);
+      border-color: ${props => props.$color || theme.colors.primary[500]};
+    }
+  }
 `;
 
 const StatIcon = styled(Box)`
@@ -170,6 +184,11 @@ const DataTable = styled(Box)`
   overflow: hidden;
   box-shadow: ${theme.shadows.sm};
   border: 1px solid ${theme.colors.neutral[200]};
+  
+  @media (prefers-color-scheme: dark) {
+    background: rgba(30, 30, 40, 0.6);
+    border-color: rgba(255, 255, 255, 0.1);
+  }
 `;
 
 const StyledTable = styled(Table)`
@@ -185,6 +204,15 @@ const StyledTable = styled(Table)`
       letter-spacing: 0.05em;
       padding: ${theme.spacing.md};
     }
+    
+    @media (prefers-color-scheme: dark) {
+      background: rgba(40, 40, 50, 0.4);
+      border-bottom-color: rgba(255, 255, 255, 0.1);
+      
+      th {
+        color: rgba(255, 255, 255, 0.9);
+      }
+    }
   }
   
   tbody tr {
@@ -199,6 +227,18 @@ const StyledTable = styled(Table)`
       padding: ${theme.spacing.md};
       color: ${theme.colors.neutral[700]};
     }
+    
+    @media (prefers-color-scheme: dark) {
+      border-bottom-color: rgba(255, 255, 255, 0.05);
+      
+      &:hover {
+        background: rgba(220, 38, 38, 0.15);
+      }
+      
+      td {
+        color: rgba(255, 255, 255, 0.85);
+      }
+    }
   }
 `;
 
@@ -241,6 +281,11 @@ const FilterBar = styled(Flex)`
   margin-bottom: ${theme.spacing.lg};
   box-shadow: ${theme.shadows.sm};
   border: 1px solid ${theme.colors.neutral[200]};
+  
+  @media (prefers-color-scheme: dark) {
+    background: rgba(30, 30, 40, 0.6);
+    border-color: rgba(255, 255, 255, 0.1);
+  }
 `;
 
 const LoadingOverlay = styled(Flex)`
@@ -343,8 +388,8 @@ const IPBans = () => {
     if (!newIP || !isValidIP(newIP)) {
       toggleNotification({
         type: 'warning',
-        message: 'Bitte geben Sie eine gültige IP-Adresse ein',
-        title: 'Ungültige IP'
+        message: formatMessage({ id: getTrad('ipban.modal.invalidIP') }),
+        title: formatMessage({ id: getTrad('tokens.notifications.validation') })
       });
       return;
     }
@@ -535,9 +580,9 @@ const IPBans = () => {
             <StyledTable>
               <Thead>
                 <Tr>
-                  <Th>IP-Adresse</Th>
-                  <Th>Status</Th>
-                  <Th>Aktionen</Th>
+                  <Th>{formatMessage({ id: getTrad('common.tableHeaders.ipAddress') })}</Th>
+                  <Th>{formatMessage({ id: getTrad('common.status') })}</Th>
+                  <Th>{formatMessage({ id: getTrad('common.actions') })}</Th>
                 </Tr>
               </Thead>
               <Tbody>
@@ -691,7 +736,7 @@ const IPBans = () => {
                   <Flex gap={2} alignItems="flex-start">
                     <WarningCircle style={{ width: '20px', height: '20px', color: theme.colors.warning[600], flexShrink: 0 }} />
                     <Typography variant="pi" style={{ fontSize: '12px', lineHeight: '1.5' }}>
-                      <strong>Warnung:</strong> Diese IP-Adresse wird sofort gesperrt und alle zugehörigen Tokens werden deaktiviert.
+                      {formatMessage({ id: getTrad('ipban.modal.warning') })}
                     </Typography>
                   </Flex>
                 </Box>

package/admin/src/pages/Tokens/JWTSessions.jsx

@@ -102,6 +102,10 @@ const float = keyframes`
 const Container = styled(Box)`
   animation: ${fadeIn} 0.5s;
   min-height: calc(100vh - 200px);
+  
+  @media (prefers-color-scheme: dark) {
+    background: transparent;
+  }
 `;
 
 const StatsGrid = styled(Box)`
@@ -137,6 +141,16 @@ const StatCard = styled(Box)`
       transform: rotate(10deg) scale(1.1);
     }
   }
+  
+  @media (prefers-color-scheme: dark) {
+    background: rgba(30, 30, 40, 0.6);
+    border-color: rgba(255, 255, 255, 0.1);
+    
+    &:hover {
+      background: rgba(40, 40, 50, 0.8);
+      border-color: ${props => props.$color || theme.colors.primary[500]};
+    }
+  }
 `;
 
 const StatIcon = styled(Box)`
@@ -175,6 +189,11 @@ const DataTable = styled(Box)`
   overflow: hidden;
   box-shadow: ${theme.shadows.sm};
   border: 1px solid ${theme.colors.neutral[200]};
+  
+  @media (prefers-color-scheme: dark) {
+    background: rgba(30, 30, 40, 0.6);
+    border-color: rgba(255, 255, 255, 0.1);
+  }
 `;
 
 const StyledTable = styled(Table)`
@@ -190,6 +209,15 @@ const StyledTable = styled(Table)`
       letter-spacing: 0.05em;
       padding: ${theme.spacing.md};
     }
+    
+    @media (prefers-color-scheme: dark) {
+      background: rgba(40, 40, 50, 0.4);
+      border-bottom-color: rgba(255, 255, 255, 0.1);
+      
+      th {
+        color: rgba(255, 255, 255, 0.9);
+      }
+    }
   }
   
   tbody tr {
@@ -204,6 +232,18 @@ const StyledTable = styled(Table)`
       padding: ${theme.spacing.md};
       color: ${theme.colors.neutral[700]};
     }
+    
+    @media (prefers-color-scheme: dark) {
+      border-bottom-color: rgba(255, 255, 255, 0.05);
+      
+      &:hover {
+        background: rgba(2, 132, 199, 0.15);
+      }
+      
+      td {
+        color: rgba(255, 255, 255, 0.85);
+      }
+    }
   }
 `;
 
@@ -246,6 +286,11 @@ const FilterBar = styled(Flex)`
   margin-bottom: ${theme.spacing.lg};
   box-shadow: ${theme.shadows.sm};
   border: 1px solid ${theme.colors.neutral[200]};
+  
+  @media (prefers-color-scheme: dark) {
+    background: rgba(30, 30, 40, 0.6);
+    border-color: rgba(255, 255, 255, 0.1);
+  }
 `;
 
 const ActionBar = styled(Flex)`
@@ -421,8 +466,8 @@ const JWTSessions = () => {
     fetchSessions();
     toggleNotification({
       type: 'success',
-      message: 'Daten wurden aktualisiert',
-      title: 'Erfolg'
+      message: formatMessage({ id: getTrad('jwt.notifications.refreshSuccess') }),
+      title: formatMessage({ id: getTrad('tokens.notifications.success') })
     });
   };
   
@@ -583,12 +628,12 @@ const JWTSessions = () => {
         <SingleSelect
           value={pageSize.toString()}
           onChange={(value) => setPageSize(parseInt(value))}
-          placeholder="Einträge pro Seite"
+          placeholder={formatMessage({ id: getTrad('common.entriesPerPage') })}
         >
-          <SingleSelectOption value="10">10 Einträge</SingleSelectOption>
-          <SingleSelectOption value="25">25 Einträge</SingleSelectOption>
-          <SingleSelectOption value="50">50 Einträge</SingleSelectOption>
-          <SingleSelectOption value="100">100 Einträge</SingleSelectOption>
+          <SingleSelectOption value="10">{formatMessage({ id: getTrad('common.entries') }, { count: 10 })}</SingleSelectOption>
+          <SingleSelectOption value="25">{formatMessage({ id: getTrad('common.entries') }, { count: 25 })}</SingleSelectOption>
+          <SingleSelectOption value="50">{formatMessage({ id: getTrad('common.entries') }, { count: 50 })}</SingleSelectOption>
+          <SingleSelectOption value="100">{formatMessage({ id: getTrad('common.entries') }, { count: 100 })}</SingleSelectOption>
         </SingleSelect>
         <Button
           onClick={handleCleanup}
@@ -612,14 +657,14 @@ const JWTSessions = () => {
       {selectedSessions.length > 0 && (
         <ActionBar justifyContent="space-between" alignItems="center">
           <Typography fontWeight="semiBold">
-            {selectedSessions.length} Session{selectedSessions.length !== 1 && 's'} ausgewählt
+            {formatMessage({ id: getTrad('common.selectedSessions') }, { count: selectedSessions.length })}
           </Typography>
           <Button
             onClick={() => setSelectedSessions([])}
             variant="tertiary"
             size="S"
           >
-            Auswahl aufheben
+            {formatMessage({ id: getTrad('common.clearSelection') })}
           </Button>
         </ActionBar>
       )}
@@ -693,21 +738,21 @@ const JWTSessions = () => {
                       onCheckedChange={handleSelectAll}
                     />
                   </Th>
-                  <Th action={<IconButton label="Nach Benutzer sortieren" onClick={() => handleSort('username')} variant="ghost" withTooltip={false}><CaretDown /></IconButton>}>
-                    Benutzer
+                  <Th action={<IconButton label={formatMessage({ id: getTrad('common.tableHeaders.sortByUser') })} onClick={() => handleSort('username')} variant="ghost" withTooltip={false}><CaretDown /></IconButton>}>
+                    {formatMessage({ id: getTrad('common.user') })}
                   </Th>
-                  <Th>IP-Adresse</Th>
-                  <Th>User Agent</Th>
-                  <Th action={<IconButton label="Nach Status sortieren" onClick={() => handleSort('revoked')} variant="ghost" withTooltip={false}><CaretDown /></IconButton>}>
-                    Status
+                  <Th>{formatMessage({ id: getTrad('common.tableHeaders.ipAddress') })}</Th>
+                  <Th>{formatMessage({ id: getTrad('common.userAgent') })}</Th>
+                  <Th action={<IconButton label={formatMessage({ id: getTrad('common.tableHeaders.sortByStatus') })} onClick={() => handleSort('revoked')} variant="ghost" withTooltip={false}><CaretDown /></IconButton>}>
+                    {formatMessage({ id: getTrad('common.status') })}
                   </Th>
-                  <Th action={<IconButton label="Nach Erstelldatum sortieren" onClick={() => handleSort('createdAt')} variant="ghost" withTooltip={false}><CaretDown /></IconButton>}>
-                    Erstellt
+                  <Th action={<IconButton label={formatMessage({ id: getTrad('common.tableHeaders.sortByCreated') })} onClick={() => handleSort('createdAt')} variant="ghost" withTooltip={false}><CaretDown /></IconButton>}>
+                    {formatMessage({ id: getTrad('common.created') })}
                   </Th>
-                  <Th action={<IconButton label="Nach Ablaufdatum sortieren" onClick={() => handleSort('expiresAt')} variant="ghost" withTooltip={false}><CaretDown /></IconButton>}>
-                    Gültig bis
+                  <Th action={<IconButton label={formatMessage({ id: getTrad('common.tableHeaders.sortByExpiry') })} onClick={() => handleSort('expiresAt')} variant="ghost" withTooltip={false}><CaretDown /></IconButton>}>
+                    {formatMessage({ id: getTrad('common.expiresAt') })}
                   </Th>
-                  <Th>Aktionen</Th>
+                  <Th>{formatMessage({ id: getTrad('common.actions') })}</Th>
                 </Tr>
               </Thead>
               <Tbody>

package/admin/src/pages/Tokens/TokensProfessional.jsx

@@ -236,13 +236,13 @@ const float = keyframes`
 const Container = styled(Box)`
   animation: ${fadeIn} ${theme.transitions.slow};
   min-height: 100vh;
-  background: linear-gradient(180deg, 
-    ${theme.colors.neutral[50]} 0%, 
-    ${theme.colors.neutral[100]} 100%
-  );
   max-width: 1440px;
   margin: 0 auto;
   padding: ${theme.spacing.xl} ${theme.spacing.lg} 0;
+  
+  @media (prefers-color-scheme: dark) {
+    background: transparent;
+  }
 `;
 
 const Header = styled(Box)`
@@ -449,6 +449,16 @@ const StatCard = styled(Box)`
     );
     transform: translate(40%, -40%);
   }
+  
+  @media (prefers-color-scheme: dark) {
+    background: rgba(30, 30, 40, 0.6);
+    border-color: rgba(255, 255, 255, 0.1);
+    
+    &:hover {
+      background: rgba(40, 40, 50, 0.8);
+      border-color: ${props => props.$color || theme.colors.primary[500]};
+    }
+  }
 `;
 
 const StatIcon = styled(Box)`
@@ -490,6 +500,11 @@ const DataTable = styled(Box)`
   overflow: hidden;
   box-shadow: ${theme.shadows.sm};
   border: 1px solid ${theme.colors.neutral[200]};
+  
+  @media (prefers-color-scheme: dark) {
+    background: rgba(30, 30, 40, 0.6);
+    border-color: rgba(255, 255, 255, 0.1);
+  }
 `;
 
 const StyledTable = styled(Table)`
@@ -506,6 +521,15 @@ const StyledTable = styled(Table)`
       letter-spacing: 0.05em;
       padding: ${theme.spacing.md};
     }
+    
+    @media (prefers-color-scheme: dark) {
+      background: rgba(40, 40, 50, 0.4);
+      border-bottom-color: rgba(255, 255, 255, 0.1);
+      
+      th {
+        color: rgba(255, 255, 255, 0.9);
+      }
+    }
   }
   
   tbody tr {
@@ -528,6 +552,18 @@ const StyledTable = styled(Table)`
       padding: ${theme.spacing.md};
       color: ${theme.colors.neutral[700]};
     }
+    
+    @media (prefers-color-scheme: dark) {
+      border-bottom-color: rgba(255, 255, 255, 0.05);
+      
+      &:hover {
+        background: rgba(2, 132, 199, 0.15);
+      }
+      
+      td {
+        color: rgba(255, 255, 255, 0.85);
+      }
+    }
   }
 `;
 

package/admin/src/translations/de.json

@@ -335,6 +335,7 @@
   "magic-link.ipban.modal.label": "IP-Adresse",
   "magic-link.ipban.modal.placeholder": "z.B. 192.168.1.1",
   "magic-link.ipban.modal.hint": "Geben Sie eine IPv4 oder IPv6 Adresse ein",
+  "magic-link.ipban.modal.invalidIP": "Bitte geben Sie eine gültige IP-Adresse ein",
   "magic-link.ipban.modal.cancel": "Abbrechen",
   "magic-link.ipban.modal.submit": "IP sperren",
   "magic-link.ipban.status.banned": "Gesperrt",
@@ -370,5 +371,13 @@
   "magic-link.common.submit": "Absenden",
   "magic-link.common.entriesPerPage": "Einträge pro Seite",
   "magic-link.common.entries": "{count} Einträge",
-  "magic-link.common.selectedCount": "{count} ausgewählt"
+  "magic-link.common.selectedCount": "{count} ausgewählt",
+  "magic-link.common.selectedSessions": "{count} Session{count, plural, one {} other {s}} ausgewählt",
+  "magic-link.common.clearSelection": "Auswahl aufheben",
+  "magic-link.common.tableHeaders.ipAddress": "IP-Adresse",
+  "magic-link.common.tableHeaders.tokens": "Tokens",
+  "magic-link.common.tableHeaders.sortByUser": "Nach Benutzer sortieren",
+  "magic-link.common.tableHeaders.sortByStatus": "Nach Status sortieren",
+  "magic-link.common.tableHeaders.sortByCreated": "Nach Erstelldatum sortieren",
+  "magic-link.common.tableHeaders.sortByExpiry": "Nach Ablaufdatum sortieren"
 }

package/admin/src/translations/en.json

@@ -335,6 +335,7 @@
   "magic-link.ipban.modal.label": "IP Address",
   "magic-link.ipban.modal.placeholder": "e.g. 192.168.1.1",
   "magic-link.ipban.modal.hint": "Enter an IPv4 or IPv6 address",
+  "magic-link.ipban.modal.invalidIP": "Please enter a valid IP address",
   "magic-link.ipban.modal.cancel": "Cancel",
   "magic-link.ipban.modal.submit": "Ban IP",
   "magic-link.ipban.status.banned": "Banned",
@@ -370,5 +371,13 @@
   "magic-link.common.submit": "Submit",
   "magic-link.common.entriesPerPage": "Entries per page",
   "magic-link.common.entries": "{count} entries",
-  "magic-link.common.selectedCount": "{count} selected"
+  "magic-link.common.selectedCount": "{count} selected",
+  "magic-link.common.selectedSessions": "{count} session(s) selected",
+  "magic-link.common.clearSelection": "Clear selection",
+  "magic-link.common.tableHeaders.ipAddress": "IP Address",
+  "magic-link.common.tableHeaders.tokens": "Tokens",
+  "magic-link.common.tableHeaders.sortByUser": "Sort by user",
+  "magic-link.common.tableHeaders.sortByStatus": "Sort by status",
+  "magic-link.common.tableHeaders.sortByCreated": "Sort by created date",
+  "magic-link.common.tableHeaders.sortByExpiry": "Sort by expiry date"
 }

package/admin/src/translations/es.json

@@ -335,6 +335,7 @@
   "magic-link.ipban.modal.label": "Dirección IP",
   "magic-link.ipban.modal.placeholder": "ej. 192.168.1.1",
   "magic-link.ipban.modal.hint": "Ingrese una dirección IPv4 o IPv6",
+  "magic-link.ipban.modal.invalidIP": "Por favor ingrese una dirección IP válida",
   "magic-link.ipban.modal.cancel": "Cancelar",
   "magic-link.ipban.modal.submit": "Bloquear IP",
   "magic-link.ipban.status.banned": "Bloqueado",
@@ -370,6 +371,14 @@
   "magic-link.common.submit": "Enviar",
   "magic-link.common.entriesPerPage": "Entradas por página",
   "magic-link.common.entries": "{count} entradas",
-  "magic-link.common.selectedCount": "{count} seleccionado(s)"
+  "magic-link.common.selectedCount": "{count} seleccionado(s)",
+  "magic-link.common.selectedSessions": "{count} sesión/sesiones seleccionada(s)",
+  "magic-link.common.clearSelection": "Borrar selección",
+  "magic-link.common.tableHeaders.ipAddress": "Dirección IP",
+  "magic-link.common.tableHeaders.tokens": "Tokens",
+  "magic-link.common.tableHeaders.sortByUser": "Ordenar por usuario",
+  "magic-link.common.tableHeaders.sortByStatus": "Ordenar por estado",
+  "magic-link.common.tableHeaders.sortByCreated": "Ordenar por fecha de creación",
+  "magic-link.common.tableHeaders.sortByExpiry": "Ordenar por fecha de expiración"
 }
 

package/admin/src/translations/fr.json

@@ -335,6 +335,7 @@
   "magic-link.ipban.modal.label": "Adresse IP",
   "magic-link.ipban.modal.placeholder": "ex. 192.168.1.1",
   "magic-link.ipban.modal.hint": "Entrez une adresse IPv4 ou IPv6",
+  "magic-link.ipban.modal.invalidIP": "Veuillez saisir une adresse IP valide",
   "magic-link.ipban.modal.cancel": "Annuler",
   "magic-link.ipban.modal.submit": "Bannir IP",
   "magic-link.ipban.status.banned": "Banni",
@@ -370,6 +371,14 @@
   "magic-link.common.submit": "Soumettre",
   "magic-link.common.entriesPerPage": "Entrées par page",
   "magic-link.common.entries": "{count} entrées",
-  "magic-link.common.selectedCount": "{count} sélectionné(s)"
+  "magic-link.common.selectedCount": "{count} sélectionné(s)",
+  "magic-link.common.selectedSessions": "{count} session(s) sélectionnée(s)",
+  "magic-link.common.clearSelection": "Effacer la sélection",
+  "magic-link.common.tableHeaders.ipAddress": "Adresse IP",
+  "magic-link.common.tableHeaders.tokens": "Jetons",
+  "magic-link.common.tableHeaders.sortByUser": "Trier par utilisateur",
+  "magic-link.common.tableHeaders.sortByStatus": "Trier par statut",
+  "magic-link.common.tableHeaders.sortByCreated": "Trier par date de création",
+  "magic-link.common.tableHeaders.sortByExpiry": "Trier par date d'expiration"
 }
 

package/admin/src/translations/pt.json

@@ -335,6 +335,7 @@
   "magic-link.ipban.modal.label": "Endereço IP",
   "magic-link.ipban.modal.placeholder": "ex. 192.168.1.1",
   "magic-link.ipban.modal.hint": "Digite um endereço IPv4 ou IPv6",
+  "magic-link.ipban.modal.invalidIP": "Por favor, insira um endereço IP válido",
   "magic-link.ipban.modal.cancel": "Cancelar",
   "magic-link.ipban.modal.submit": "Banir IP",
   "magic-link.ipban.status.banned": "Banido",
@@ -370,6 +371,14 @@
   "magic-link.common.submit": "Enviar",
   "magic-link.common.entriesPerPage": "Entradas por página",
   "magic-link.common.entries": "{count} entradas",
-  "magic-link.common.selectedCount": "{count} selecionado(s)"
+  "magic-link.common.selectedCount": "{count} selecionado(s)",
+  "magic-link.common.selectedSessions": "{count} sessão/sessões selecionada(s)",
+  "magic-link.common.clearSelection": "Limpar seleção",
+  "magic-link.common.tableHeaders.ipAddress": "Endereço IP",
+  "magic-link.common.tableHeaders.tokens": "Tokens",
+  "magic-link.common.tableHeaders.sortByUser": "Ordenar por usuário",
+  "magic-link.common.tableHeaders.sortByStatus": "Ordenar por status",
+  "magic-link.common.tableHeaders.sortByCreated": "Ordenar por data de criação",
+  "magic-link.common.tableHeaders.sortByExpiry": "Ordenar por data de expiração"
 }
 

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "4.8.1",
+  "version": "4.9.0",
   "keywords": [],
   "type": "commonjs",
   "exports": {