@hed-hog/core 0.0.299 → 0.0.300

package/hedhog/frontend/app/dashboard/components/widgets/core.permissions-card.tsx.ejs

@@ -1,61 +0,0 @@
-import { useWidgetData } from '@/hooks/use-widget-data';
-import { Shield } from 'lucide-react';
-import { useTranslations } from 'next-intl';
-import StatCard from '../stats';
-import { WidgetWrapper } from '../widget-wrapper';
-
-interface PermissionsCardProps {
-  widget?: any;
-  onRemove?: () => void;
-}
-
-interface UserStatsData {
-  cards?: {
-    roles?: {
-      value: number;
-      change: number | null;
-    };
-  };
-}
-
-export default function PermissionsCard({
-  widget,
-  onRemove,
-}: PermissionsCardProps) {
-  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?.roles?.value?.toLocaleString('pt-BR') || '0';
-  const change = data?.cards?.roles?.change;
-  const changeType =
-    change !== null && change !== undefined && change >= 0 ? 'up' : 'down';
-
-  return (
-    <WidgetWrapper
-      isLoading={isLoading}
-      isAccessDenied={isAccessDenied}
-      isError={isError}
-      widgetName={widget?.name || t('permissions')}
-      onRemove={onRemove}
-    >
-      <StatCard
-        title={t('permissions')}
-        value={value}
-        change={
-          change !== null && change !== undefined
-            ? `${change > 0 ? '+' : ''}${change}%`
-            : undefined
-        }
-        changeType={changeType}
-        icon={<Shield className="h-6 w-6 text-rose-500" />}
-        iconBg="bg-rose-500/10"
-        delay={200}
-      />
-    </WidgetWrapper>
-  );
-}

package/hedhog/frontend/app/dashboard/components/widgets/core.permissions-chart.tsx.ejs

@@ -1,156 +0,0 @@
-'use client';
-
-import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardHeader,
-  CardTitle,
-} from '@/components/ui/card';
-import { useWidgetData } from '@/hooks/use-widget-data';
-import { IconGripVertical } from '@tabler/icons-react';
-import { useTranslations } from 'next-intl';
-import { Cell, Pie, PieChart, ResponsiveContainer, Tooltip } from 'recharts';
-import { WidgetWrapper } from '../widget-wrapper';
-
-function CustomTooltip({
-  active,
-  payload,
-}: {
-  active?: boolean;
-  payload?: Array<{ name: string; value: number; payload: { color: string } }>;
-}) {
-  const t = useTranslations('core.Dashboard');
-  if (!active || !payload?.length) return null;
-
-  const entry = payload[0];
-  return (
-    <div className="rounded-lg border bg-card px-3 py-2 shadow-xl">
-      <p className="text-xs text-muted-foreground">
-        <span
-          className="mr-1.5 inline-block h-2 w-2 rounded-full"
-          style={{ backgroundColor: entry?.payload.color }}
-        />
-        {entry?.name}: {entry?.value} {t('permissionsLowercase')}
-      </p>
-    </div>
-  );
-}
-
-interface PermissionsChartProps {
-  widget?: {
-    name?: string;
-  } | null;
-  onRemove?: () => void;
-}
-
-interface PermissionDistributionItem {
-  name: string;
-  value: number;
-  color: string;
-}
-
-interface UserStatsData {
-  charts?: {
-    permissionDistribution?: PermissionDistributionItem[];
-  };
-}
-
-export default function PermissionsChart({
-  widget,
-  onRemove,
-}: PermissionsChartProps) {
-  const t = useTranslations('core.Dashboard');
-
-  const {
-    data: statsData,
-    isLoading,
-    isAccessDenied,
-    isError,
-  } = useWidgetData<UserStatsData>({
-    endpoint: '/dashboard-core/stats/overview/users',
-    queryKey: 'dashboard-stats-users',
-  });
-
-  const data = statsData?.charts?.permissionDistribution || [];
-  const total = data.reduce((sum, item) => sum + item.value, 0);
-
-  return (
-    <WidgetWrapper
-      isLoading={isLoading}
-      isAccessDenied={isAccessDenied}
-      isError={isError}
-      widgetName={widget?.name || t('permissionsDistributionTitle')}
-      onRemove={onRemove}
-    >
-      <Card className="h-full flex flex-col group">
-        <div
-          className="drag-handle absolute top-3 left-4 z-10"
-          style={{ cursor: 'grab' }}
-        >
-          <IconGripVertical className="text-muted-foreground/50 size-4 shrink-0" />
-        </div>
-        <CardHeader className="pb-2 pt-4 pl-10">
-          <CardTitle className="text-base font-semibold">
-            {t('permissionsDistributionTitle')}
-          </CardTitle>
-          <CardDescription>
-            {t('permissionsDistributionDescription')}
-          </CardDescription>
-        </CardHeader>
-        <CardContent className="flex-1 pt-0">
-          <div className="flex h-full items-center justify-between gap-4 overflow-hidden">
-            <div className="relative h-[280px] w-[280px] shrink-0">
-              <ResponsiveContainer width="100%" height="100%">
-                <PieChart>
-                  <Pie
-                    data={data}
-                    cx="50%"
-                    cy="50%"
-                    innerRadius={70}
-                    outerRadius={110}
-                    paddingAngle={4}
-                  dataKey="value"
-                  animationDuration={1200}
-                  strokeWidth={0}
-                >
-                    {data.map((entry, index: number) => (
-                      <Cell key={`cell-${index}`} fill={entry.color} />
-                    ))}
-                  </Pie>
-                  <Tooltip content={<CustomTooltip />} />
-                </PieChart>
-              </ResponsiveContainer>
-              <div className="absolute inset-0 flex flex-col items-center justify-center">
-                <span className="text-2xl font-bold text-foreground">
-                  {total}
-                </span>
-                <span className="text-[10px] text-muted-foreground">
-                  {t('total')}
-                </span>
-              </div>
-            </div>
-            <div className="grid max-h-[280px] min-w-0 flex-1 grid-cols-2 content-start gap-x-4 gap-y-2 overflow-y-auto pr-2">
-              {data.map((item) => (
-                <div key={item.name} className="flex min-w-0 items-start gap-2.5">
-                  <div
-                    className="mt-1 h-2.5 w-2.5 shrink-0 rounded-sm"
-                    style={{ backgroundColor: item.color }}
-                  />
-                  <div className="flex min-w-0 flex-col">
-                    <span className="break-words text-xs font-medium leading-tight text-foreground">
-                      {item.name}
-                    </span>
-                    <span className="text-[11px] text-muted-foreground">
-                      {item.value} ({total ? Math.round((item.value / total) * 100) : 0}%)
-                    </span>
-                  </div>
-                </div>
-              ))}
-            </div>
-          </div>
-        </CardContent>
-      </Card>
-    </WidgetWrapper>
-  );
-}

package/hedhog/frontend/app/dashboard/components/widgets/core.profile-card.tsx.ejs

@@ -1,186 +0,0 @@
-'use client';
-
-import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
-import { Badge } from '@/components/ui/badge';
-import { Button } from '@/components/ui/button';
-import { Card, CardContent } from '@/components/ui/card';
-import { Separator } from '@/components/ui/separator';
-import { useWidgetData } from '@/hooks/use-widget-data';
-import { formatDateTime } from '@/lib/format-date';
-import { getPhotoUrl } from '@/lib/get-photo-url';
-import type { AllWidgetsData, ProfileData } from '@/types/widget-data';
-import { useApp } from '@hed-hog/next-app-provider';
-import {
-  Calendar,
-  CheckCircle2,
-  Clock,
-  Edit3,
-  Globe,
-  Mail,
-  Shield,
-} from 'lucide-react';
-import { useTranslations } from 'next-intl';
-import { useRouter } from 'next/navigation';
-import { WidgetWrapper } from '../widget-wrapper';
-
-function getInitials(name: string): string {
-  return name
-    .split(' ')
-    .filter(Boolean)
-    .slice(0, 2)
-    .map((n) => n[0]?.toUpperCase() ?? '')
-    .join('');
-}
-
-function ProfileContent({ profile }: { profile: ProfileData }) {
-  const { getSettingValue } = useApp();
-  const router = useRouter();
-  const t = useTranslations('core.DashboardPage.profileCard');
-
-  return (
-    <Card className="relative flex h-full flex-col overflow-hidden">
-      <div className="absolute inset-x-0 top-0 h-28 bg-linear-to-br from-muted to-muted/50" />
-      <CardContent className="relative flex flex-1 flex-col overflow-hidden pt-7 pb-12">
-        <div className="flex flex-col items-center gap-4 sm:flex-row sm:items-end">
-          <div className="relative">
-            <Avatar className="h-20 w-20 border-4 border-card shadow-md">
-              {profile.photo_id && (
-                <AvatarImage
-                  src={getPhotoUrl(profile.photo_id)}
-                  alt={profile.name}
-                />
-              )}
-              <AvatarFallback className="bg-foreground text-background text-xl font-bold">
-                {getInitials(profile.name)}
-              </AvatarFallback>
-            </Avatar>
-            <div className="absolute -bottom-0.5 -right-0.5 h-5 w-5 rounded-full border-2 border-card bg-emerald-500" />
-          </div>
-          <div className="flex flex-1 flex-col items-center gap-1 text-center sm:items-start sm:text-left">
-            <div className="flex items-center gap-2">
-              <h2 className="text-xl font-bold text-foreground">
-                {profile.name}
-              </h2>
-              <CheckCircle2 className="h-4 w-4 text-blue-500" />
-            </div>
-            <p className="text-sm text-muted-foreground">{profile.role}</p>
-            <div className="flex flex-wrap items-center gap-2 pt-1">
-              <Badge
-                variant="outline"
-                className="border-emerald-200 bg-emerald-50 text-xs text-emerald-700 dark:border-emerald-800 dark:bg-emerald-950/40 dark:text-emerald-400"
-              >
-                {t('online')}
-              </Badge>
-            </div>
-          </div>
-          <Button
-            onClick={() => router.push('/core/account/profile')}
-            variant="outline"
-            size="sm"
-            className="shrink-0 gap-1.5"
-          >
-            <Edit3 className="h-3.5 w-3.5" />
-            {t('editProfile')}
-          </Button>
-        </div>
-
-        <Separator className="my-6" />
-
-        <div className="grid grid-cols-1 gap-2 sm:grid-cols-2">
-          <div className="flex items-center gap-2.5 rounded-lg p-2 transition-colors hover:bg-muted/50">
-            <div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-md bg-muted">
-              <Mail className="h-4 w-4 text-muted-foreground" />
-            </div>
-            <div className="flex min-w-0 flex-col">
-              <span className="text-[11px] text-muted-foreground">
-                {t('email')}
-              </span>
-              <span className="truncate text-xs font-medium text-foreground">
-                {profile.email}
-              </span>
-            </div>
-          </div>
-
-          <div className="flex items-center gap-2.5 rounded-lg p-2 transition-colors hover:bg-muted/50">
-            <div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-md bg-muted">
-              <Calendar className="h-4 w-4 text-muted-foreground" />
-            </div>
-            <div className="flex min-w-0 flex-col">
-              <span className="text-[11px] text-muted-foreground">
-                {t('memberSinceLabel')}
-              </span>
-              <span className="truncate text-xs font-medium text-foreground">
-                {formatDateTime(profile.memberSince, getSettingValue)}
-              </span>
-            </div>
-          </div>
-
-          <div className="flex items-center gap-2.5 rounded-lg p-2 transition-colors hover:bg-muted/50">
-            <div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-md bg-blue-50 dark:bg-blue-950/40">
-              <Globe className="h-4 w-4 text-blue-600 dark:text-blue-400" />
-            </div>
-            <div className="flex min-w-0 flex-col">
-              <span className="text-[11px] text-muted-foreground">
-                {t('activeSessions')}
-              </span>
-              <span className="text-xs font-semibold text-foreground">
-                {profile.totalSessions}
-              </span>
-            </div>
-          </div>
-
-          <div className="flex items-center gap-2.5 rounded-lg p-2 transition-colors hover:bg-muted/50">
-            <div className="flex h-8 w-8 shrink-0 items-center justify-center rounded-md bg-amber-50 dark:bg-amber-950/40">
-              <Shield className="h-4 w-4 text-amber-600 dark:text-amber-400" />
-            </div>
-            <div className="flex min-w-0 flex-col">
-              <span className="text-[11px] text-muted-foreground">
-                {t('roles')}
-              </span>
-              <span className="text-xs font-semibold text-foreground">
-                {profile.totalRoles}
-              </span>
-            </div>
-          </div>
-        </div>
-      </CardContent>
-
-      <div className="absolute bottom-0 inset-x-0 flex items-center gap-2 border-t bg-card px-4 py-2">
-        <Clock className="h-3.5 w-3.5 shrink-0 text-muted-foreground" />
-        <span className="truncate text-xs text-muted-foreground">
-          {t('lastLogin', {
-            date: formatDateTime(profile.lastLogin, getSettingValue),
-          })}
-        </span>
-      </div>
-    </Card>
-  );
-}
-
-interface ProfileCardProps {
-  widget?: { name?: string };
-  onRemove?: () => void;
-}
-
-export default function ProfileCard({ widget, onRemove }: ProfileCardProps) {
-  const { data, isLoading, isError, isAccessDenied } = useWidgetData<
-    AllWidgetsData,
-    ProfileData
-  >({
-    endpoint: '/dashboard-core/widgets/me',
-    queryKey: 'widget-me',
-    select: (d) => d.profile,
-  });
-
-  return (
-    <WidgetWrapper
-      isLoading={isLoading}
-      isError={isError}
-      isAccessDenied={isAccessDenied}
-      widgetName={widget?.name ?? 'profile-card'}
-      onRemove={onRemove}
-    >
-      {data && <ProfileContent profile={data} />}
-    </WidgetWrapper>
-  );
-}

package/hedhog/frontend/app/dashboard/components/widgets/core.routes-card.tsx.ejs

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

package/hedhog/frontend/app/dashboard/components/widgets/core.session-activity-chart.tsx.ejs

@@ -1,183 +0,0 @@
-'use client';
-
-import {
-  Card,
-  CardContent,
-  CardDescription,
-  CardHeader,
-  CardTitle,
-} from '@/components/ui/card';
-import { useWidgetData } from '@/hooks/use-widget-data';
-import { IconGripVertical } from '@tabler/icons-react';
-import { useTranslations } from 'next-intl';
-import {
-  CartesianGrid,
-  Line,
-  LineChart,
-  ResponsiveContainer,
-  Tooltip,
-  XAxis,
-  YAxis,
-} from 'recharts';
-import { WidgetWrapper } from '../widget-wrapper';
-
-function CustomTooltip({
-  active,
-  payload,
-  label,
-}: {
-  active?: boolean;
-  payload?: Array<{ value: number; dataKey: string }>;
-  label?: string;
-}) {
-  const t = useTranslations('core.Dashboard');
-  if (!active || !payload?.length) return null;
-
-  return (
-    <div className="rounded-lg border bg-card px-3 py-2 shadow-xl">
-      <p className="mb-1 text-xs font-medium text-card-foreground">{label}</p>
-      {payload.map((entry) => (
-        <p key={entry.dataKey} className="text-xs text-muted-foreground">
-          <span
-            className="mr-1.5 inline-block h-2 w-2 rounded-full"
-            style={{
-              backgroundColor:
-                entry.dataKey === 'active' ? '#10b981' : '#f59e0b',
-            }}
-          />
-          {entry.dataKey === 'active' ? t('active') : t('expired')}:{' '}
-          {entry.value}
-        </p>
-      ))}
-    </div>
-  );
-}
-
-interface SessionActivityChartProps {
-  widget?: any;
-  onRemove?: () => void;
-}
-
-interface UserStatsData {
-  charts?: {
-    sessionActivity?: Array<{
-      hour: string;
-      active: number;
-      expired: number;
-    }>;
-  };
-}
-
-export default function SessionActivityChart({
-  widget,
-  onRemove,
-}: SessionActivityChartProps) {
-  const t = useTranslations('core.Dashboard');
-
-  const {
-    data: statsData,
-    isLoading,
-    isAccessDenied,
-    isError,
-  } = useWidgetData<UserStatsData>({
-    endpoint: '/dashboard-core/stats/overview/users',
-    queryKey: 'dashboard-stats-users',
-  });
-
-  const data = statsData?.charts?.sessionActivity || [];
-
-  return (
-    <WidgetWrapper
-      isLoading={isLoading}
-      isAccessDenied={isAccessDenied}
-      isError={isError}
-      widgetName={widget?.name || t('sessionActivityTitle')}
-      onRemove={onRemove}
-    >
-      <Card className="h-full flex flex-col group">
-        <div
-          className="drag-handle absolute top-3 left-4 z-10"
-          style={{ cursor: 'grab' }}
-        >
-          <IconGripVertical className="text-muted-foreground/50 size-4 shrink-0" />
-        </div>
-        <CardHeader className="flex flex-row items-center justify-between pb-2 pt-4">
-          <div className="pl-6">
-            <CardTitle className="text-base font-semibold">
-              {t('sessionActivityTitle')}
-            </CardTitle>
-            <CardDescription>{t('sessionActivityDescription')}</CardDescription>
-          </div>
-        </CardHeader>
-        <CardContent className="flex-1 pt-0">
-          <div className="h-[200px] w-full">
-            <ResponsiveContainer width="100%" height="100%">
-              <LineChart
-                data={data}
-                margin={{ top: 5, right: 10, left: -20, bottom: 0 }}
-              >
-                <CartesianGrid
-                  strokeDasharray="3 3"
-                  stroke="currentColor"
-                  opacity={0.1}
-                />
-                <XAxis
-                  dataKey="hour"
-                  tick={{ fill: 'hsl(var(--muted-foreground))', fontSize: 11 }}
-                  axisLine={false}
-                  tickLine={false}
-                />
-                <YAxis
-                  tick={{ fill: 'hsl(var(--muted-foreground))', fontSize: 11 }}
-                  axisLine={false}
-                  tickLine={false}
-                />
-                <Tooltip content={<CustomTooltip />} />
-                <Line
-                  type="monotone"
-                  dataKey="active"
-                  stroke="#10b981"
-                  strokeWidth={3}
-                  dot={false}
-                  activeDot={{ r: 5, fill: '#10b981' }}
-                  animationDuration={1500}
-                />
-                <Line
-                  type="monotone"
-                  dataKey="expired"
-                  stroke="#f59e0b"
-                  strokeWidth={2.5}
-                  dot={false}
-                  strokeDasharray="5 5"
-                  activeDot={{ r: 4, fill: '#f59e0b' }}
-                  animationDuration={1500}
-                  animationBegin={300}
-                />
-              </LineChart>
-            </ResponsiveContainer>
-          </div>
-          <div className="mt-2 flex items-center justify-center gap-6">
-            <div className="flex items-center gap-2">
-              <div
-                className="h-0.5 w-4 rounded-full"
-                style={{ backgroundColor: '#10b981' }}
-              />
-              <span className="text-xs text-muted-foreground">
-                {t('active')}
-              </span>
-            </div>
-            <div className="flex items-center gap-2">
-              <div
-                className="h-0.5 w-4 rounded-full"
-                style={{ backgroundColor: '#f59e0b' }}
-              />
-              <span className="text-xs text-muted-foreground">
-                {t('expired')}
-              </span>
-            </div>
-          </div>
-        </CardContent>
-      </Card>
-    </WidgetWrapper>
-  );
-}