@hedhog/admin 0.48.16 → 0.48.18

package/frontend/dashboard/components/module-installed.tsx.ejs

@@ -0,0 +1,113 @@
+import { Package } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { Badge } from '@/components/ui/badge'
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from '@/components/ui/card'
+import { useApp } from '@/hooks/use-app'
+import { DashboardDefaultData } from '@/types'
+
+const ModuleInstalled = () => {
+  const { request } = useApp()
+  const [isRefreshing, setIsRefreshing] = useState(false)
+  const [data, setData] = useState<DashboardDefaultData>({
+    os: {
+      name: '',
+      platform: '',
+      version: '',
+      architecture: '',
+      uptime: 0,
+      cpu: {
+        model: '',
+        speed: 0,
+        physicalCores: 0,
+        virtualCores: 0,
+      },
+      memory: {
+        total: 0,
+        free: 0,
+      },
+      disk: [],
+    },
+    modules: [],
+    users: {
+      total: 0,
+      admin: 0,
+      active: 0,
+      activities: [],
+    },
+    database: {
+      connections: 0,
+      size: 0,
+      queriesPerSecond: 0,
+    },
+  } as DashboardDefaultData)
+
+  const load = async () => {
+    setIsRefreshing(true)
+    const { data } = await request<DashboardDefaultData>({
+      url: '/core',
+    })
+
+    setData(data)
+
+    setIsRefreshing(false)
+  }
+
+  useEffect(() => {
+    load()
+  }, [])
+
+  return (
+    <Card>
+      <CardHeader className='pb-2'>
+        <CardTitle className='flex items-center'>
+          <Package className='mr-2 h-5 w-5 text-primary' />
+          Módulos Instalados
+        </CardTitle>
+        <CardDescription>Módulos e suas versões</CardDescription>
+      </CardHeader>
+      <CardContent>
+        {isRefreshing ? (
+          <div className='space-y-4'>
+            {Array.from({ length: 5 }).map((_, index) => (
+              <div
+                key={index}
+                className='flex animate-pulse items-center justify-between'
+              >
+                <div>
+                  <div className='h-4 w-24 rounded bg-muted'></div>
+                  <div className='mt-1 h-3 w-16 rounded bg-muted'></div>
+                </div>
+                <div className='h-6 w-20 rounded bg-muted'></div>
+              </div>
+            ))}
+          </div>
+        ) : (
+          <div className='space-y-4'>
+            {data.modules.map((module, index) => (
+              <div key={index} className='flex items-center justify-between'>
+                <div>
+                  <div className='font-medium'>{module.name}</div>
+                  <div className='text-sm text-muted-foreground'>
+                    v{String(module.version).replace(/\^/g, '')}
+                  </div>
+                </div>
+                <Badge variant={module.upToDate ? 'outline' : 'secondary'}>
+                  {module.upToDate ? 'Atualizado' : 'Atualização disponível'}
+                </Badge>
+              </div>
+            ))}
+          </div>
+        )}
+      </CardContent>
+    </Card>
+  )
+}
+
+export default ModuleInstalled

package/frontend/dashboard/components/system-info.tsx.ejs

@@ -0,0 +1,144 @@
+import { Cpu, HardDrive, Server } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from '@/components/ui/card'
+import { Separator } from '@/components/ui/separator'
+import { useApp } from '@/hooks/use-app'
+import { bytesToHuman } from '@/lib/bytes-to-human'
+import { secondsToHuman } from '@/lib/seconds-to-human'
+import { DashboardDefaultData } from '@/types'
+
+const SystemInfo = () => {
+  const { request } = useApp()
+  const [isRefreshing, setIsRefreshing] = useState(false)
+  const [data, setData] = useState<DashboardDefaultData>({
+    os: {
+      name: '',
+      platform: '',
+      version: '',
+      architecture: '',
+      uptime: 0,
+      cpu: {
+        model: '',
+        speed: 0,
+        physicalCores: 0,
+        virtualCores: 0,
+      },
+      memory: {
+        total: 0,
+        free: 0,
+      },
+      disk: [],
+    },
+    modules: [],
+    users: {
+      total: 0,
+      admin: 0,
+      active: 0,
+      activities: [],
+    },
+    database: {
+      connections: 0,
+      size: 0,
+      queriesPerSecond: 0,
+    },
+  } as DashboardDefaultData)
+
+  const load = async () => {
+    setIsRefreshing(true)
+    const { data } = await request<DashboardDefaultData>({
+      url: '/core',
+    })
+
+    setData(data)
+
+    setIsRefreshing(false)
+  }
+
+  useEffect(() => {
+    load()
+  }, [])
+
+  return (
+    <Card>
+      <CardHeader className='pb-2'>
+        <CardTitle className='flex items-center'>
+          <Server className='mr-2 h-5 w-5 text-primary' />
+          Informações do Sistema
+        </CardTitle>
+        <CardDescription>
+          Detalhes do sistema operacional e hardware
+        </CardDescription>
+      </CardHeader>
+      <CardContent>
+        {isRefreshing ? (
+          <div className='space-y-4'>
+            <div className='animate-pulse'>
+              <div className='mb-2 h-4 w-3/4 rounded bg-gray-200'></div>
+              <div className='mb-2 h-4 w-1/2 rounded bg-gray-200'></div>
+              <div className='mb-2 h-4 w-1/4 rounded bg-gray-200'></div>
+              <div className='mb-2 h-4 w-2/3 rounded bg-gray-200'></div>
+            </div>
+            <Separator />
+            <div className='animate-pulse'>
+              <div className='mb-2 h-4 w-3/4 rounded bg-gray-200'></div>
+              <div className='mb-2 h-4 w-1/2 rounded bg-gray-200'></div>
+              <div className='mb-2 h-4 w-1/4 rounded bg-gray-200'></div>
+              <div className='mb-2 h-4 w-2/3 rounded bg-gray-200'></div>
+            </div>
+          </div>
+        ) : (
+          <div className='space-y-4'>
+            <div>
+              <h3 className='flex items-center text-sm font-medium'>
+                <HardDrive className='mr-2 h-4 w-4 text-muted-foreground' />
+                Sistema Operacional
+              </h3>
+              <div className='mt-1 grid grid-cols-2 gap-1 text-sm'>
+                <div className='text-muted-foreground'>Nome:</div>
+                <div>{data.os.name}</div>
+                <div className='text-muted-foreground'>Versão:</div>
+                <div>{data.os.version}</div>
+                <div className='text-muted-foreground'>Arquitetura:</div>
+                <div>{data.os.architecture}</div>
+                <div className='text-muted-foreground'>Tempo ativo:</div>
+                <div>{secondsToHuman(data.os.uptime, true)}</div>
+              </div>
+            </div>
+            <Separator />
+            <div>
+              <h3 className='flex items-center text-sm font-medium'>
+                <Cpu className='mr-2 h-4 w-4 text-muted-foreground' />
+                Hardware
+              </h3>
+              <div className='mt-1 grid grid-cols-2 gap-1 text-sm'>
+                <div className='text-muted-foreground'>CPU:</div>
+                <div>{data.os.cpu.model}</div>
+                <div className='text-muted-foreground'>Memória:</div>
+                <div>{bytesToHuman(data.os.memory.total)}</div>
+                {data.os.disk.map((disk) => (
+                  <>
+                    <div className='text-muted-foreground'>
+                      Disco {disk.filesystem}:
+                    </div>
+                    <div>
+                      {bytesToHuman(disk.size)} ({bytesToHuman(disk.free)} free)
+                    </div>
+                  </>
+                ))}
+              </div>
+            </div>
+          </div>
+        )}
+      </CardContent>
+    </Card>
+  )
+}
+
+export default SystemInfo

package/frontend/dashboard/components/update-panel.tsx.ejs

@@ -1,80 +1,80 @@
-import FormPanel, {
-  FormPanelRef,
-  getFieldsLocale,
-} from '@/components/panels/form-panel'
-import { Overlay } from '@/components/custom/overlay'
-import { TabPanel } from '@/components/panels/tab-panel'
-import {
-  useDashboardGet,
-  useDashboardUpdate,
-} from '@/features/admin/dashboard'
-import useEffectAfterFirstUpdate from '@/hooks/use-effect-after-first-update'
-import { Dashboard } from '@/types/models'
-import { forwardRef, useImperativeHandle, useRef } from 'react'
-import { useTranslation } from 'react-i18next'
-import { EnumFieldType } from '@/enums/EnumFieldType'
-
-export type DashboardUpdatePanelProps = {
-  data: Dashboard
-  onUpdated?: (data: Dashboard) => void
-}
-
-const DashboardUpdatePanel = forwardRef(
-  ({ data, onUpdated }: DashboardUpdatePanelProps, ref) => {
-    const { t } = useTranslation(['actions', 'fields', 'translations'])
-    const { data: item, isLoading } = useDashboardGet(
-      (data as any).dashboard_id as number
-    )
-    const { mutate: dashboardUpdate } = useDashboardUpdate()
-    const formRef = useRef<FormPanelRef>(null)
-
-    useEffectAfterFirstUpdate(() => {
-      if (item && formRef.current) {
-        formRef.current.setValuesFromItem(item)
-      }
-    }, [item])
-
-    useImperativeHandle(ref, () => ({}))
-
-    return (
-      <TabPanel
-        activeTabIndex={0}
-        tabs={[
-          {
-            title: t('details', { ns: 'actions' }),
-            children: (
-              <Overlay loading={isLoading}>
-                <FormPanel
-                  ref={formRef}
-                  fields={[
-                    {
-                      name: 'slug',
-                      label: { text: t('dashboard.slug', { ns: 'fields' }) },
-                      type: EnumFieldType.TEXT,
-                      required: true,
-                    },
-                    ...getFieldsLocale([{ name: 'name' }], item),
-                  ]}
-                  button={{ text: t('save', { ns: 'actions' }) }}
-                  onSubmit={(data) => {
-                    dashboardUpdate({
-                      id: data.id,
-                      data,
-                    })
-                    if (typeof onUpdated === 'function') {
-                      onUpdated(data)
-                    }
-                  }}
-                />
-              </Overlay>
-            ),
-          },
-        ]}
-      />
-    )
-  }
-)
-
-DashboardUpdatePanel.displayName = 'DashboardUpdatePanel'
-
-export default DashboardUpdatePanel
+import FormPanel, {
+  FormPanelRef,
+  getFieldsLocale,
+} from '@/components/panels/form-panel'
+import { Overlay } from '@/components/custom/overlay'
+import { TabPanel } from '@/components/panels/tab-panel'
+import {
+  useDashboardGet,
+  useDashboardUpdate,
+} from '@/features/admin/dashboard'
+import useEffectAfterFirstUpdate from '@/hooks/use-effect-after-first-update'
+import { Dashboard } from '@/types/models'
+import { forwardRef, useImperativeHandle, useRef } from 'react'
+import { useTranslation } from 'react-i18next'
+import { EnumFieldType } from '@/enums/EnumFieldType'
+
+export type DashboardUpdatePanelProps = {
+  data: Dashboard
+  onUpdated?: (data: Dashboard) => void
+}
+
+const DashboardUpdatePanel = forwardRef(
+  ({ data, onUpdated }: DashboardUpdatePanelProps, ref) => {
+    const { t } = useTranslation(['actions', 'fields', 'translations'])
+    const { data: item, isLoading } = useDashboardGet(
+      (data as any).dashboard_id as number
+    )
+    const { mutate: dashboardUpdate } = useDashboardUpdate()
+    const formRef = useRef<FormPanelRef>(null)
+
+    useEffectAfterFirstUpdate(() => {
+      if (item && formRef.current) {
+        formRef.current.setValuesFromItem(item)
+      }
+    }, [item])
+
+    useImperativeHandle(ref, () => ({}))
+
+    return (
+      <TabPanel
+        activeTabIndex={0}
+        tabs={[
+          {
+            title: t('details', { ns: 'actions' }),
+            children: (
+              <Overlay loading={isLoading}>
+                <FormPanel
+                  ref={formRef}
+                  fields={[
+                    {
+                      name: 'slug',
+                      label: { text: t('dashboard.slug', { ns: 'fields' }) },
+                      type: EnumFieldType.TEXT,
+                      required: true,
+                    },
+                    ...getFieldsLocale([{ name: 'name' }], item),
+                  ]}
+                  button={{ text: t('save', { ns: 'actions' }) }}
+                  onSubmit={(data) => {
+                    dashboardUpdate({
+                      id: data.id,
+                      data,
+                    })
+                    if (typeof onUpdated === 'function') {
+                      onUpdated(data)
+                    }
+                  }}
+                />
+              </Overlay>
+            ),
+          },
+        ]}
+      />
+    )
+  }
+)
+
+DashboardUpdatePanel.displayName = 'DashboardUpdatePanel'
+
+export default DashboardUpdatePanel

package/frontend/dashboard/components/user-summary.tsx.ejs

@@ -0,0 +1,151 @@
+import { User, Users } from 'lucide-react'
+import { useEffect, useState } from 'react'
+
+import { Button } from '@/components/ui/button'
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from '@/components/ui/card'
+import { useApp } from '@/hooks/use-app'
+import { DashboardDefaultData } from '@/types'
+import { useNavigate } from 'react-router-dom'
+
+const UserSummary = () => {
+  const navigate = useNavigate()
+  const { request } = useApp()
+  const [isRefreshing, setIsRefreshing] = useState(false)
+  const [data, setData] = useState<DashboardDefaultData>({
+    os: {
+      name: '',
+      platform: '',
+      version: '',
+      architecture: '',
+      uptime: 0,
+      cpu: {
+        model: '',
+        speed: 0,
+        physicalCores: 0,
+        virtualCores: 0,
+      },
+      memory: {
+        total: 0,
+        free: 0,
+      },
+      disk: [],
+    },
+    modules: [],
+    users: {
+      total: 0,
+      admin: 0,
+      active: 0,
+      activities: [],
+    },
+    database: {
+      connections: 0,
+      size: 0,
+      queriesPerSecond: 0,
+    },
+  } as DashboardDefaultData)
+
+  const load = async () => {
+    setIsRefreshing(true)
+    const { data } = await request<DashboardDefaultData>({
+      url: '/core',
+    })
+
+    setData(data)
+
+    setIsRefreshing(false)
+  }
+
+  useEffect(() => {
+    load()
+  }, [])
+
+  return (
+    <Card>
+      <CardHeader className='pb-2'>
+        <CardTitle className='flex items-center'>
+          <Users className='mr-2 h-5 w-5 text-primary' />
+          Resumo de Usuários
+        </CardTitle>
+        <CardDescription>Visão geral dos usuários do sistema</CardDescription>
+      </CardHeader>
+      <CardContent>
+        <div className='space-y-4'>
+          {isRefreshing ? (
+            <div className='grid grid-cols-3 gap-4'>
+              {Array.from({ length: 3 }).map((_, index) => (
+                <div
+                  key={index}
+                  className='flex animate-pulse flex-col items-center justify-center rounded-lg bg-primary/10 p-3'
+                >
+                  <div className='h-6 w-12 rounded bg-muted'></div>
+                  <div className='mt-2 h-4 w-16 rounded bg-muted'></div>
+                </div>
+              ))}
+            </div>
+          ) : (
+            <>
+              <div className='grid grid-cols-3 gap-4'>
+                <div className='flex flex-col items-center justify-center rounded-lg bg-primary/10 p-3'>
+                  <div className='text-2xl font-bold'>{data.users.total}</div>
+                  <div className='text-xs text-muted-foreground'>Total</div>
+                </div>
+                <div className='flex flex-col items-center justify-center rounded-lg bg-primary/10 p-3'>
+                  <div className='text-2xl font-bold'>{data.users.admin}</div>
+                  <div className='text-xs text-muted-foreground'>Admins</div>
+                </div>
+                <div className='flex flex-col items-center justify-center rounded-lg bg-primary/10 p-3'>
+                  <div className='text-2xl font-bold'>{data.users.active}</div>
+                  <div className='text-xs text-muted-foreground'>Ativos</div>
+                </div>
+              </div>
+              {data.users.activities.length > 0 && (
+                <div>
+                  <h3 className='mb-2 text-sm font-medium'>
+                    Atividade Recente
+                  </h3>
+
+                  <div className='space-y-2'>
+                    {data.users.activities.map((activity, index) => (
+                      <div
+                        key={index}
+                        className='flex items-center justify-between text-sm'
+                      >
+                        <div className='flex items-center'>
+                          <User className='mr-2 h-4 w-4 text-muted-foreground' />
+                          <span>{activity.user.name}</span>
+                        </div>
+                        <div className='text-muted-foreground'>
+                          {activity.created_at}
+                        </div>
+                      </div>
+                    ))}
+                  </div>
+                </div>
+              )}
+            </>
+          )}
+        </div>
+      </CardContent>
+      <CardFooter>
+        <Button
+          variant='outline'
+          size='sm'
+          className='w-full'
+          onClick={() => navigate('/users')}
+        >
+          <User className='mr-2 h-4 w-4' />
+          Ver Todos Usuários
+        </Button>
+      </CardFooter>
+    </Card>
+  )
+}
+
+export default UserSummary

package/frontend/dashboard/locales/en/dashboard.dashboard.json

@@ -1,11 +1,11 @@
-{
-  "create": "Create dashboard",
-  "createText": "Fill the dashboard informations.",
-  "createTooltip": "Create new dashboard",
-  "delete": "Delete dashboard",
-  "deleteText": "Are you sure to delete these dashboard?",
-  "deleteTooltip": "Delete the selected dashboard",
-  "edit": "Edit dashboard",
-  "editText": "View and edit dashboard information.",
-  "editTooltip": "Edit the selected dashboard"
-}
+{
+  "create": "Create dashboard",
+  "createText": "Fill the dashboard informations.",
+  "createTooltip": "Create new dashboard",
+  "delete": "Delete dashboard",
+  "deleteText": "Are you sure to delete these dashboard?",
+  "deleteTooltip": "Delete the selected dashboard",
+  "edit": "Edit dashboard",
+  "editText": "View and edit dashboard information.",
+  "editTooltip": "Edit the selected dashboard"
+}

package/frontend/dashboard/locales/pt/dashboard.dashboard.json

@@ -1,11 +1,11 @@
-{
-  "create": "Criar dashboard",
-  "createText": "Preencha as informações do dashboard.",
-  "createTooltip": "Criar novo dashboard",
-  "delete": "Excluir dashboard",
-  "deleteText": "Você tem certeza de que deseja excluir estes dashboards?",
-  "deleteTooltip": "Excluir o dashboard selecionado",
-  "edit": "Editar dashboard",
-  "editText": "Visualizar e editar informações do dashboard.",
-  "editTooltip": "Editar o dashboard selecionado"
-}
+{
+  "create": "Criar dashboard",
+  "createText": "Preencha as informações do dashboard.",
+  "createTooltip": "Criar novo dashboard",
+  "delete": "Excluir dashboard",
+  "deleteText": "Você tem certeza de que deseja excluir estes dashboards?",
+  "deleteTooltip": "Excluir o dashboard selecionado",
+  "edit": "Editar dashboard",
+  "editText": "Visualizar e editar informações do dashboard.",
+  "editTooltip": "Editar o dashboard selecionado"
+}

package/frontend/dashboard/react-query/handlers.ts.ejs

@@ -1,28 +1,28 @@
-import { useDefaultMutation } from "@/hooks/use-default-mutation";
-import { useQuery } from "@tanstack/react-query";
-import { requests } from "./requests";
-
-const scope = "dashboard";
-
-export function useDashboardCreate() {
-  const { dashboardCreate } = requests();
-  return useDefaultMutation(scope, "create", dashboardCreate);
-}
-
-export function useDashboardDelete() {
-  const { dashboardDelete } = requests();
-  return useDefaultMutation(scope, "delete", dashboardDelete);
-}
-
-export function useDashboardUpdate() {
-  const { dashboardUpdate } = requests();
-  return useDefaultMutation(scope, "update", dashboardUpdate);
-}
-
-export function useDashboardGet(id: number) {
-  const { dashboardGet } = requests();
-  return useQuery({
-    queryKey: [scope, "get"],
-    queryFn: () => dashboardGet(id),
-  });
-}
+import { useDefaultMutation } from "@/hooks/use-default-mutation";
+import { useQuery } from "@tanstack/react-query";
+import { requests } from "./requests";
+
+const scope = "dashboard";
+
+export function useDashboardCreate() {
+  const { dashboardCreate } = requests();
+  return useDefaultMutation(scope, "create", dashboardCreate);
+}
+
+export function useDashboardDelete() {
+  const { dashboardDelete } = requests();
+  return useDefaultMutation(scope, "delete", dashboardDelete);
+}
+
+export function useDashboardUpdate() {
+  const { dashboardUpdate } = requests();
+  return useDefaultMutation(scope, "update", dashboardUpdate);
+}
+
+export function useDashboardGet(id: number) {
+  const { dashboardGet } = requests();
+  return useQuery({
+    queryKey: [scope, "get"],
+    queryFn: () => dashboardGet(id),
+  });
+}