@hed-hog/core 0.0.297 → 0.0.299

package/hedhog/frontend/messages/en.json

@@ -904,10 +904,13 @@
   "AddWidgetDialog": {
     "title": "Select Dashboard Components",
     "description": "Choose the components you want to display on your dashboard.",
+    "selectedOfTotal": "{selected} selected of {total}",
     "noComponentsAvailable": "No components available at the moment.",
     "dimensions": "Dimensions",
     "resizable": "Resizable",
     "fixedSize": "Fixed size",
+    "select": "Select",
+    "selected": "Selected",
     "cancel": "Cancel",
     "add": "Add"
   },
@@ -1026,6 +1029,96 @@
       "hoursAgo": "{count}h ago",
       "daysAgo": "{count} day ago",
       "daysAgoPlural": "{count} days ago"
+    },
+    "emailNotifications": {
+      "title": "Email Notifications",
+      "description": "System email flow in the last 14 days",
+      "received": "Received",
+      "read": "Read",
+      "unread": "Unread",
+      "error": "Error",
+      "receivedShort": "Recv.",
+      "readShort": "Read",
+      "unreadShort": "Unrd.",
+      "errorShort": "Err."
+    },
+    "localeConfig": {
+      "title": "Localization",
+      "description": "Locale and regional format summary",
+      "configured": "Configured",
+      "pending": "Pending",
+      "enabled": "Enabled",
+      "disabled": "Disabled",
+      "total": "Total",
+      "timezone": "Timezone",
+      "dateFormat": "Date format",
+      "timeFormat": "Time format",
+      "enabledLocales": "Enabled locales",
+      "noneEnabled": "No locale enabled",
+      "notSet": "Not set"
+    },
+    "mailConfig": {
+      "title": "Mail Configuration",
+      "description": "Provider and delivery overview",
+      "configured": "Configured",
+      "pending": "Pending",
+      "templates": "Templates",
+      "sentTotal": "Sent total",
+      "sent30Days": "Sent (30d)",
+      "sender": "Default sender",
+      "providers": "Providers",
+      "selectedProvider": "Selected: {provider}",
+      "selected": "Selected",
+      "missingKeys": "Missing keys: {count}",
+      "allKeysPresent": "All required keys present",
+      "noProviders": "No providers found",
+      "none": "None",
+      "notSet": "Not set"
+    },
+    "oauthConfig": {
+      "title": "OAuth Providers",
+      "description": "Social login readiness summary",
+      "configured": "Configured",
+      "pending": "Pending",
+      "enabled": "Enabled",
+      "disabled": "Disabled",
+      "configuredProviders": "Configured",
+      "connectedAccounts": "Connected",
+      "scopesCount": "Scopes: {count}",
+      "connectedUsers": "Users: {count}",
+      "missingKeys": "Missing keys: {count}",
+      "allKeysPresent": "All required keys present",
+      "noProviders": "No providers found"
+    },
+    "storageConfig": {
+      "title": "Storage Profiles",
+      "description": "Active providers and profile health",
+      "configured": "Configured",
+      "pending": "Pending",
+      "profiles": "Profiles",
+      "active": "Active",
+      "providers": "Providers",
+      "defaultProfile": "Default profile",
+      "defaults": "defaults",
+      "providerSummary": "{active} active of {total}",
+      "defaultTag": "Default",
+      "inactive": "Inactive",
+      "noProfiles": "No profiles found",
+      "notSet": "Not set"
+    },
+    "themeConfig": {
+      "title": "Theme and Branding",
+      "description": "Visual identity configuration snapshot",
+      "configured": "Configured",
+      "pending": "Pending",
+      "tokens": "Tokens",
+      "font": "Font",
+      "textSize": "Text size",
+      "radius": "Radius",
+      "lightPalette": "Light palette",
+      "darkPalette": "Dark palette",
+      "primary": "Primary",
+      "notSet": "Not set"
     }
   },
   "HomePage": {

package/hedhog/frontend/messages/pt.json

@@ -907,10 +907,13 @@
   "AddWidgetDialog": {
     "title": "Selecionar Componentes do Dashboard",
     "description": "Escolha os componentes que deseja exibir no seu dashboard.",
+    "selectedOfTotal": "{selected} selecionados de {total}",
     "noComponentsAvailable": "Nenhum componente disponível no momento.",
     "dimensions": "Dimensões",
     "resizable": "Redimensionável",
     "fixedSize": "Tamanho fixo",
+    "select": "Selecionar",
+    "selected": "Selecionado",
     "cancel": "Cancelar",
     "add": "Adicionar"
   },
@@ -1031,6 +1034,96 @@
       "hoursAgo": "{count}h atrás",
       "daysAgo": "{count} dia atrás",
       "daysAgoPlural": "{count} dias atrás"
+    },
+    "emailNotifications": {
+      "title": "Notificações por E-mail",
+      "description": "Fluxo de e-mails do sistema nos últimos 14 dias",
+      "received": "Recebidos",
+      "read": "Lidos",
+      "unread": "Não lidos",
+      "error": "Com erro",
+      "receivedShort": "Rec.",
+      "readShort": "Lid.",
+      "unreadShort": "N. lid.",
+      "errorShort": "Erro"
+    },
+    "localeConfig": {
+      "title": "Localização",
+      "description": "Resumo de idiomas e formatos regionais",
+      "configured": "Configurado",
+      "pending": "Pendente",
+      "enabled": "Ativos",
+      "disabled": "Inativos",
+      "total": "Total",
+      "timezone": "Fuso horário",
+      "dateFormat": "Formato de data",
+      "timeFormat": "Formato de hora",
+      "enabledLocales": "Idiomas ativos",
+      "noneEnabled": "Nenhum idioma ativo",
+      "notSet": "Não definido"
+    },
+    "mailConfig": {
+      "title": "Configuração de E-mail",
+      "description": "Resumo de provedor e entrega",
+      "configured": "Configurado",
+      "pending": "Pendente",
+      "templates": "Templates",
+      "sentTotal": "Enviados total",
+      "sent30Days": "Enviados (30d)",
+      "sender": "Remetente padrão",
+      "providers": "Provedores",
+      "selectedProvider": "Selecionado: {provider}",
+      "selected": "Selecionado",
+      "missingKeys": "Chaves pendentes: {count}",
+      "allKeysPresent": "Todas as chaves obrigatórias presentes",
+      "noProviders": "Nenhum provedor encontrado",
+      "none": "Nenhum",
+      "notSet": "Não definido"
+    },
+    "oauthConfig": {
+      "title": "Provedores OAuth",
+      "description": "Resumo de prontidão para login social",
+      "configured": "Configurado",
+      "pending": "Pendente",
+      "enabled": "Ativo",
+      "disabled": "Inativo",
+      "configuredProviders": "Configurados",
+      "connectedAccounts": "Conectadas",
+      "scopesCount": "Escopos: {count}",
+      "connectedUsers": "Usuários: {count}",
+      "missingKeys": "Chaves pendentes: {count}",
+      "allKeysPresent": "Todas as chaves obrigatórias presentes",
+      "noProviders": "Nenhum provedor encontrado"
+    },
+    "storageConfig": {
+      "title": "Perfis de Armazenamento",
+      "description": "Provedores ativos e saúde dos perfis",
+      "configured": "Configurado",
+      "pending": "Pendente",
+      "profiles": "Perfis",
+      "active": "Ativos",
+      "providers": "Provedores",
+      "defaultProfile": "Perfil padrão",
+      "defaults": "padrões",
+      "providerSummary": "{active} ativos de {total}",
+      "defaultTag": "Padrão",
+      "inactive": "Inativo",
+      "noProfiles": "Nenhum perfil encontrado",
+      "notSet": "Não definido"
+    },
+    "themeConfig": {
+      "title": "Tema e Identidade",
+      "description": "Resumo da configuração visual do sistema",
+      "configured": "Configurado",
+      "pending": "Pendente",
+      "tokens": "Tokens",
+      "font": "Fonte",
+      "textSize": "Tamanho do texto",
+      "radius": "Raio",
+      "lightPalette": "Paleta clara",
+      "darkPalette": "Paleta escura",
+      "primary": "Primária",
+      "notSet": "Não definido"
     }
   },
   "HomePage": {

package/hedhog/frontend/public/dashboard-previews/.gitkeep

@@ -0,0 +1,12 @@
+# Dashboard Widget Previews
+#
+# Place one .webp file per dashboard component, named exactly by the component slug.
+# Example: active-users-card.webp, user-sessions.webp
+#
+# These files are copied by `hedhog add` / `hedhog dev apply` to:
+#   apps/admin/public/libraries/core/dashboard-previews/<slug>.webp
+#
+# The admin selector loads them as:
+#   /libraries/core/dashboard-previews/<slug>.webp
+#
+# If a file is missing, the selector card falls back gracefully (image hidden).

package/hedhog/frontend/{app/dashboard/components/widgets → widgets}/account-security.tsx.ejs

@@ -1,6 +1,4 @@
 'use client';
-
-import { Button } from '@/components/ui/button';
 import {
   Card,
   CardContent,
@@ -34,6 +32,13 @@ const ICON_MAP: Record<string, React.ElementType> = {
   sessions: AlertTriangle,
 };
 
+const CHECK_ROUTE_MAP: Record<string, string> = {
+  password: '/core/account/password',
+  '2fa': '/core/account/2fa',
+  email: '/core/account/email',
+  sessions: '/core/account/sessions',
+};
+
 function AccountSecurityContent({ data }: { data: AccountSecurityData }) {
   const t = useTranslations('core.DashboardPage.accountSecurity');
   const router = useRouter();
@@ -60,60 +65,66 @@ function AccountSecurityContent({ data }: { data: AccountSecurityData }) {
 
   return (
     <Card className="flex h-full min-h-0 flex-col overflow-hidden">
-      <CardHeader className="shrink-0 pb-3">
+      <CardHeader className="shrink-0 px-4 pb-2 pt-4 sm:px-5">
         <div className="flex items-center gap-2">
           <ShieldCheck className="h-5 w-5 text-emerald-600 dark:text-emerald-400" />
           <div>
             <CardTitle className="text-base font-semibold">
               {t('title')}
             </CardTitle>
-            <CardDescription>{t('description')}</CardDescription>
+            <CardDescription className="text-xs sm:text-sm">
+              {t('description')}
+            </CardDescription>
           </div>
         </div>
       </CardHeader>
-      <CardContent className="flex min-h-0 flex-1 flex-col overflow-auto pt-0">
-        <div className="mb-4 flex flex-col items-center gap-2.5 rounded-xl bg-muted/50 p-3 sm:mb-5 sm:gap-3 sm:p-5">
+      <CardContent className="flex min-h-0 flex-1 flex-col overflow-auto px-4 pb-3 pt-0 sm:px-5 sm:pb-4">
+        <div className="mb-2 flex flex-col items-center gap-1.5 rounded-xl bg-muted/50 p-2 sm:mb-3 sm:gap-2 sm:p-3">
           <div className="flex items-baseline gap-1">
             <span
-              className={`text-4xl font-bold tracking-tight sm:text-5xl ${scoreColor}`}
+              className={`text-2xl font-bold tracking-tight sm:text-3xl ${scoreColor}`}
             >
               {score}
             </span>
-            <span className="text-base text-muted-foreground sm:text-lg">
+            <span className="text-xs text-muted-foreground sm:text-sm">
               /100
             </span>
           </div>
           <Progress
             value={score}
-            className="h-2.5 w-full max-w-xs"
+            className="h-1.5 w-full max-w-70"
             style={
               {
                 '--progress-foreground': progressColor,
               } as any
             }
           />
-          <p className="text-[11px] text-muted-foreground sm:text-xs">
+          <p className="text-[10px] text-muted-foreground sm:text-[11px]">
             {score >= 80 ? t('wellProtected') : t('recommendProtections')}
           </p>
         </div>
 
-        <div className="flex flex-col gap-1.5">
+        <div className="flex flex-col gap-1">
           {data.checks.map((item) => {
             const Icon = ICON_MAP[item.id] ?? ShieldCheck;
             return (
-              <div
+              <button
+                type="button"
                 key={item.id}
-                className="group flex flex-wrap items-start gap-2.5 rounded-lg p-2.5 transition-colors hover:bg-muted/50 sm:items-center sm:gap-3 sm:p-3"
+                onClick={() =>
+                  router.push(CHECK_ROUTE_MAP[item.id] ?? '/core/account')
+                }
+                className="group flex w-full cursor-pointer flex-wrap items-start gap-2 rounded-lg p-2 text-left transition-colors hover:bg-muted/50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring sm:items-center sm:gap-2.5 sm:p-2.5"
               >
                 <div
-                  className={`flex h-8 w-8 shrink-0 items-center justify-center rounded-lg sm:h-9 sm:w-9 ${
+                  className={`flex h-7 w-7 shrink-0 items-center justify-center rounded-lg sm:h-8 sm:w-8 ${
                     item.enabled
                       ? 'bg-emerald-50 dark:bg-emerald-950/40'
                       : 'bg-muted'
                   }`}
                 >
                   <Icon
-                    className={`h-3.5 w-3.5 sm:h-4 sm:w-4 ${
+                    className={`h-3.5 w-3.5 ${
                       item.enabled
                         ? 'text-emerald-600 dark:text-emerald-400'
                         : 'text-muted-foreground'
@@ -122,7 +133,7 @@ function AccountSecurityContent({ data }: { data: AccountSecurityData }) {
                 </div>
                 <div className="flex min-w-0 flex-1 flex-col">
                   <div className="flex flex-wrap items-center gap-2">
-                    <span className="wrap-break-word text-[13px] font-medium text-foreground sm:text-sm">
+                    <span className="wrap-break-word text-[12px] font-medium text-foreground sm:text-[13px]">
                       {t(`labels.${item.labelKey}` as any) || item.labelKey}
                     </span>
                     {item.enabled ? (
@@ -131,23 +142,16 @@ function AccountSecurityContent({ data }: { data: AccountSecurityData }) {
                       <AlertTriangle className="h-3.5 w-3.5 text-amber-500" />
                     )}
                   </div>
-                  <span className="text-[11px] text-muted-foreground sm:text-xs">
+                  <span className="text-[10px] text-muted-foreground sm:text-[11px]">
                     {t(`descriptions.${item.descriptionKey}` as any) ||
                       item.descriptionKey}
                   </span>
                 </div>
-                {!item.enabled && (
-                  <Button
-                    variant="ghost"
-                    size="sm"
-                    onClick={() => router.push('/core/account/2fa')}
-                    className="mt-1 w-full shrink-0 gap-1 text-xs sm:mt-0 sm:w-auto"
-                  >
-                    {t('activate')}
-                    <ChevronRight className="h-3 w-3" />
-                  </Button>
-                )}
-              </div>
+                <div className="mt-0.5 flex w-full shrink-0 items-center justify-end gap-1 text-[11px] font-medium text-foreground sm:mt-0 sm:w-auto sm:text-xs">
+                  {!item.enabled && <span>{t('activate')}</span>}
+                  <ChevronRight className="h-3 w-3" />
+                </div>
+              </button>
             );
           })}
         </div>

package/hedhog/frontend/widgets/active-users-card.tsx.ejs

@@ -0,0 +1,58 @@
+import { useWidgetData } from '@/hooks/use-widget-data';
+import { Users } from 'lucide-react';
+import { useTranslations } from 'next-intl';
+import StatCard from '../stats';
+import { WidgetWrapper } from '../widget-wrapper';
+
+interface ActiveUsersProps {
+  widget?: any;
+  onRemove?: () => void;
+}
+
+interface UserStatsData {
+  cards?: {
+    activeUsers?: {
+      value: number;
+      change: number | null;
+    };
+  };
+}
+
+export default function ActiveUsers({ widget, onRemove }: ActiveUsersProps) {
+  const t = useTranslations('core.Dashboard');
+
+  const { data, isLoading, isAccessDenied, isError } =
+    useWidgetData<UserStatsData>({
+      endpoint: '/dashboard-core/stats/overview/users',
+      queryKey: 'dashboard-stats-users',
+    });
+
+  const value = data?.cards?.activeUsers?.value?.toLocaleString('pt-BR') || '0';
+  const change = data?.cards?.activeUsers?.change;
+  const changeType =
+    change !== null && change !== undefined && change >= 0 ? 'up' : 'down';
+
+  return (
+    <WidgetWrapper
+      isLoading={isLoading}
+      isAccessDenied={isAccessDenied}
+      isError={isError}
+      widgetName={widget?.name || t('activeUsers')}
+      onRemove={onRemove}
+    >
+      <StatCard
+        title={t('activeUsers')}
+        value={value}
+        change={
+          change !== null && change !== undefined
+            ? `${change > 0 ? '+' : ''}${change}%`
+            : undefined
+        }
+        changeType={changeType}
+        icon={<Users className="h-6 w-6 text-blue-500" />}
+        iconBg="bg-blue-500/10"
+        delay={50}
+      />
+    </WidgetWrapper>
+  );
+}