xertica-ui 2.3.0 → 2.4.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (105) hide show
  1. package/CHANGELOG.md +22 -2
  2. package/README.md +33 -22
  3. package/bin/cli.ts +136 -47
  4. package/bin/language-config.ts +5 -8
  5. package/components/assistant/modern-chat-input/ModernChatInput.tsx +17 -7
  6. package/components/assistant/xertica-assistant/parts/AssistantConversationList.tsx +1 -3
  7. package/components/assistant/xertica-assistant/parts/AssistantFeedbackDialog.tsx +13 -3
  8. package/components/assistant/xertica-assistant/parts/AssistantMessageBubble.tsx +10 -6
  9. package/components/assistant/xertica-assistant/xertica-assistant.tsx +1 -3
  10. package/components/blocks/card-patterns/FeatureCardSkeleton.tsx +1 -6
  11. package/components/blocks/card-patterns/ProfileCard.tsx +1 -3
  12. package/components/blocks/card-patterns/ProjectCardSkeleton.tsx +1 -6
  13. package/components/brand/language-selector/language-selector.stories.tsx +1 -4
  14. package/components/brand/theme-toggle/ThemeToggle.tsx +5 -1
  15. package/components/brand/xertica-provider/XerticaProvider.tsx +1 -4
  16. package/components/index.ts +1 -5
  17. package/components/layout/sidebar/sidebar.tsx +9 -3
  18. package/components/media/audio-player/AudioPlayer.tsx +4 -2
  19. package/components/pages/forgot-password-page/ForgotPasswordPage.tsx +188 -188
  20. package/components/pages/home-content/HomeContent.tsx +55 -55
  21. package/components/pages/home-page/HomePage.tsx +5 -1
  22. package/components/pages/login-page/LoginPage.tsx +4 -2
  23. package/components/pages/reset-password-page/ResetPasswordPage.tsx +7 -3
  24. package/components/pages/template-content/TemplateContent.tsx +268 -149
  25. package/components/pages/verify-email-page/VerifyEmailPage.tsx +9 -9
  26. package/components/shared/error-boundary.stories.tsx +114 -132
  27. package/components/shared/error-boundary.tsx +150 -154
  28. package/components/shared/error-fallbacks.tsx +222 -226
  29. package/components/ui/stats-card/stats-card-skeleton.tsx +1 -3
  30. package/components/ui/stats-card/stats-card.stories.tsx +18 -0
  31. package/components/ui/stats-card/stats-card.tsx +18 -2
  32. package/components.json +512 -892
  33. package/contexts/AuthContext.tsx +121 -118
  34. package/contexts/LanguageContext.tsx +1 -2
  35. package/dist/AssistantChart-BKVtGUKF.js +3383 -0
  36. package/dist/AssistantChart-WeycT5Pd.cjs +3551 -0
  37. package/dist/VerifyEmailPage-Bp1XXl3H.cjs +3305 -0
  38. package/dist/VerifyEmailPage-DGhuIqkb.js +3296 -0
  39. package/dist/XerticaProvider-BErr83Bg.js +42 -0
  40. package/dist/XerticaProvider-CwOkHxiT.cjs +44 -0
  41. package/dist/XerticaXLogo-BX3ueACh.js +255 -0
  42. package/dist/XerticaXLogo-qBPhwK3g.cjs +260 -0
  43. package/dist/assistant.cjs.js +1 -1
  44. package/dist/assistant.es.js +1 -1
  45. package/dist/brand.cjs.js +2 -2
  46. package/dist/brand.es.js +2 -2
  47. package/dist/cli.js +90 -37
  48. package/dist/components/brand/theme-toggle/ThemeToggle.d.ts +1 -1
  49. package/dist/components/index.d.ts +1 -1
  50. package/dist/components/ui/stats-card/stats-card.d.ts +10 -0
  51. package/dist/index.cjs.js +6 -6
  52. package/dist/index.es.js +6 -6
  53. package/dist/layout.cjs.js +1 -1
  54. package/dist/layout.es.js +1 -1
  55. package/dist/pages.cjs.js +1 -1
  56. package/dist/pages.es.js +1 -1
  57. package/dist/sidebar-B4ZWaMrE.js +792 -0
  58. package/dist/sidebar-BS1p2V7t.cjs +795 -0
  59. package/dist/ui.cjs.js +1 -1
  60. package/dist/ui.es.js +1 -1
  61. package/dist/xertica-assistant-B1NaSFFj.js +2173 -0
  62. package/dist/xertica-assistant-CIaUlbIt.cjs +2180 -0
  63. package/dist/xertica-ui.css +1 -1
  64. package/docs/architecture-improvements.md +5 -5
  65. package/docs/architecture.md +16 -10
  66. package/docs/components/card-patterns.md +19 -17
  67. package/docs/components/error-boundary.md +201 -191
  68. package/docs/components/hooks.md +15 -13
  69. package/docs/components/language-selector.md +20 -16
  70. package/docs/components/pages.md +323 -309
  71. package/docs/components/stats-card.md +20 -2
  72. package/docs/doc-audit.md +12 -11
  73. package/docs/getting-started.md +41 -28
  74. package/docs/guidelines.md +14 -12
  75. package/docs/i18n.md +61 -57
  76. package/docs/installation.md +268 -267
  77. package/docs/llms.md +17 -17
  78. package/docs/state-management.md +17 -17
  79. package/guidelines/Guidelines.md +17 -14
  80. package/llms-compact.txt +1 -1
  81. package/llms-full.txt +11553 -7133
  82. package/llms.txt +1 -1
  83. package/package.json +1 -1
  84. package/styles/xertica/base.css +90 -84
  85. package/templates/CLAUDE.md +16 -1
  86. package/templates/guidelines/Guidelines.md +42 -18
  87. package/templates/package.json +3 -3
  88. package/templates/src/app/components/AuthGuard.tsx +131 -82
  89. package/templates/src/features/auth/ui/AuthPageShell.tsx +32 -32
  90. package/templates/src/features/auth/ui/ForgotPasswordContent.tsx +1 -3
  91. package/templates/src/features/auth/ui/ResetPasswordContent.tsx +6 -2
  92. package/templates/src/features/auth/ui/VerifyEmailContent.tsx +2 -6
  93. package/templates/src/features/home/data/mock.ts +41 -35
  94. package/templates/src/features/home/ui/HomeContent.tsx +62 -64
  95. package/templates/src/features/template/ui/CrudTemplate.tsx +1 -4
  96. package/templates/src/features/template/ui/LoginTemplate.tsx +1 -1
  97. package/templates/src/features/template/ui/TemplateContent.tsx +28 -20
  98. package/templates/src/locales/en/pages/templates.json +17 -17
  99. package/templates/src/locales/es/pages/templates.json +17 -17
  100. package/templates/src/locales/pt-BR/pages/templates.json +17 -17
  101. package/templates/src/pages/AssistantPage.tsx +26 -20
  102. package/templates/src/pages/HomePage.tsx +5 -1
  103. package/templates/src/shared/error-boundary.tsx +150 -154
  104. package/templates/src/shared/error-fallbacks.tsx +222 -226
  105. package/templates/vite.config.ts +12 -9
package/components/pages/template-content/TemplateContent.tsx CHANGED
@@ -76,6 +76,7 @@ import {
76
76
  import { PageHeader } from '../../ui/page-header';
77
77
 
78
78
  import { useOptionalLayout } from '../../../contexts/LayoutContext';
79
+ import { useTheme } from '../../../contexts/ThemeContext';
79
80
  import { useTeamMembers, useDashboardStore } from '../../../features/home';
80
81
  import { useTranslation } from 'react-i18next';
81
82
  import { SectionErrorBoundary } from '../../shared/error-boundary';
@@ -99,6 +100,7 @@ import { Skeleton } from '../../ui/skeleton';
99
100
  export function TemplateContent() {
100
101
  const { t } = useTranslation();
101
102
  const layout = useOptionalLayout();
103
+ const { disableDarkMode } = useTheme();
102
104
  const [localSidebarExpanded, setLocalSidebarExpanded] = useState(false);
103
105
  const [localSidebarWidth, setLocalSidebarWidth] = useState(280);
104
106
  const sidebarExpanded = layout?.sidebarExpanded ?? localSidebarExpanded;
@@ -156,10 +158,7 @@ export function TemplateContent() {
156
158
  <div className="p-5 sm:p-4 md:p-6">
157
159
  <div className="max-w-6xl mx-auto space-y-8">
158
160
  {/* Page header */}
159
- <PageHeader
160
- title={t('templates.title')}
161
- subtitle={t('templates.subtitle')}
162
- />
161
+ <PageHeader title={t('templates.title')} subtitle={t('templates.subtitle')} />
163
162
 
164
163
  {/* Page Header Example */}
165
164
  <section>
@@ -167,22 +166,38 @@ export function TemplateContent() {
167
166
  <Card>
168
167
  <CardHeader>
169
168
  <CardTitle>{t('templates.headerWithBreadcrumbs.cardTitle')}</CardTitle>
170
- <CardDescription>{t('templates.headerWithBreadcrumbs.cardDescription')}</CardDescription>
169
+ <CardDescription>
170
+ {t('templates.headerWithBreadcrumbs.cardDescription')}
171
+ </CardDescription>
171
172
  </CardHeader>
172
173
  <CardContent className="p-0 border-t bg-background overflow-hidden rounded-b-[var(--radius-lg)]">
173
174
  <Header
174
175
  className="border-b"
175
176
  breadcrumbs={[
176
- { label: t('templates.headerWithBreadcrumbs.breadcrumbs.dashboard'), href: '#', icon: <Home className="w-4 h-4" /> },
177
- { label: t('templates.headerWithBreadcrumbs.breadcrumbs.settings'), href: '#', icon: <Settings className="w-4 h-4" /> },
178
- { label: t('templates.headerWithBreadcrumbs.breadcrumbs.users'), href: '#', icon: <Users className="w-4 h-4" /> },
177
+ {
178
+ label: t('templates.headerWithBreadcrumbs.breadcrumbs.dashboard'),
179
+ href: '#',
180
+ icon: <Home className="w-4 h-4" />,
181
+ },
182
+ {
183
+ label: t('templates.headerWithBreadcrumbs.breadcrumbs.settings'),
184
+ href: '#',
185
+ icon: <Settings className="w-4 h-4" />,
186
+ },
187
+ {
188
+ label: t('templates.headerWithBreadcrumbs.breadcrumbs.users'),
189
+ href: '#',
190
+ icon: <Users className="w-4 h-4" />,
191
+ },
179
192
  { label: t('templates.headerWithBreadcrumbs.breadcrumbs.accessProfile') },
180
193
  ]}
181
194
  showLanguageSelector={true}
182
195
  showThemeToggle={true}
183
196
  />
184
197
  <div className="p-6 min-h-[200px]">
185
- <h4 className="text-lg font-semibold mb-2">{t('templates.headerWithBreadcrumbs.exampleContentTitle')}</h4>
198
+ <h4 className="text-lg font-semibold mb-2">
199
+ {t('templates.headerWithBreadcrumbs.exampleContentTitle')}
200
+ </h4>
186
201
  <p className="text-muted-foreground">
187
202
  {t('templates.headerWithBreadcrumbs.exampleContentDescriptionPart1')}
188
203
  <strong>Header</strong>
@@ -293,7 +308,9 @@ export function TemplateContent() {
293
308
  <Card>
294
309
  <CardHeader>
295
310
  <CardTitle>{t('templates.overview.progressTitle')}</CardTitle>
296
- <CardDescription>{t('templates.overview.progressDescription')}</CardDescription>
311
+ <CardDescription>
312
+ {t('templates.overview.progressDescription')}
313
+ </CardDescription>
297
314
  </CardHeader>
298
315
  <CardContent className="space-y-6">
299
316
  <div className="space-y-2">
@@ -348,18 +365,26 @@ export function TemplateContent() {
348
365
  <Card>
349
366
  <CardHeader>
350
367
  <CardTitle>{t('templates.forms.registrationTitle')}</CardTitle>
351
- <CardDescription>{t('templates.forms.registrationDescription')}</CardDescription>
368
+ <CardDescription>
369
+ {t('templates.forms.registrationDescription')}
370
+ </CardDescription>
352
371
  </CardHeader>
353
372
  <CardContent>
354
373
  <form onSubmit={handleFormSubmit} className="space-y-4">
355
374
  <div className="grid gap-4 md:grid-cols-2">
356
375
  <div className="space-y-2">
357
376
  <Label htmlFor="firstName">{t('templates.forms.firstName')}</Label>
358
- <Input id="firstName" placeholder={t('templates.forms.firstNamePlaceholder')} />
377
+ <Input
378
+ id="firstName"
379
+ placeholder={t('templates.forms.firstNamePlaceholder')}
380
+ />
359
381
  </div>
360
382
  <div className="space-y-2">
361
383
  <Label htmlFor="lastName">{t('templates.forms.lastName')}</Label>
362
- <Input id="lastName" placeholder={t('templates.forms.lastNamePlaceholder')} />
384
+ <Input
385
+ id="lastName"
386
+ placeholder={t('templates.forms.lastNamePlaceholder')}
387
+ />
363
388
  </div>
364
389
  </div>
365
390
 
@@ -396,10 +421,18 @@ export function TemplateContent() {
396
421
  <SelectValue placeholder={t('templates.forms.rolePlaceholder')} />
397
422
  </SelectTrigger>
398
423
  <SelectContent>
399
- <SelectItem value="developer">{t('templates.forms.roles.developer')}</SelectItem>
400
- <SelectItem value="designer">{t('templates.forms.roles.designer')}</SelectItem>
401
- <SelectItem value="manager">{t('templates.forms.roles.manager')}</SelectItem>
402
- <SelectItem value="analyst">{t('templates.forms.roles.analyst')}</SelectItem>
424
+ <SelectItem value="developer">
425
+ {t('templates.forms.roles.developer')}
426
+ </SelectItem>
427
+ <SelectItem value="designer">
428
+ {t('templates.forms.roles.designer')}
429
+ </SelectItem>
430
+ <SelectItem value="manager">
431
+ {t('templates.forms.roles.manager')}
432
+ </SelectItem>
433
+ <SelectItem value="analyst">
434
+ {t('templates.forms.roles.analyst')}
435
+ </SelectItem>
403
436
  </SelectContent>
404
437
  </Select>
405
438
  </div>
@@ -445,7 +478,10 @@ export function TemplateContent() {
445
478
 
446
479
  <div className="space-y-3">
447
480
  <Label>{t('templates.forms.accountType')}</Label>
448
- <RadioGroup defaultValue="personal" aria-label={t('templates.forms.accountType')}>
481
+ <RadioGroup
482
+ defaultValue="personal"
483
+ aria-label={t('templates.forms.accountType')}
484
+ >
449
485
  <div className="flex items-center space-x-2">
450
486
  <RadioGroupItem value="personal" id="personal" />
451
487
  <Label htmlFor="personal" className="font-normal">
@@ -471,7 +507,9 @@ export function TemplateContent() {
471
507
  </CardContent>
472
508
  <CardFooter className="flex justify-between">
473
509
  <Button variant="outline">{t('templates.forms.cancel')}</Button>
474
- <Button onClick={handleFormSubmit}>{t('templates.forms.createAccount')}</Button>
510
+ <Button onClick={handleFormSubmit}>
511
+ {t('templates.forms.createAccount')}
512
+ </Button>
475
513
  </CardFooter>
476
514
  </Card>
477
515
  </TabsContent>
@@ -479,97 +517,108 @@ export function TemplateContent() {
479
517
  {/* Data Tab */}
480
518
  <TabsContent value="data" className="space-y-4">
481
519
  <SectionErrorBoundary>
482
- <Card>
483
- <CardHeader>
484
- <CardTitle>{t('templates.data.title')}</CardTitle>
485
- <CardDescription>{t('templates.data.description')}</CardDescription>
486
- </CardHeader>
487
- <CardContent>
488
- <div className="mb-4">
489
- <div className="relative">
490
- <Search className="absolute left-3 top-3 h-4 w-4 text-muted-foreground" />
491
- <Input
492
- placeholder={t('templates.data.searchPlaceholder')}
493
- aria-label={t('templates.data.searchPlaceholder')}
494
- className="pl-10"
495
- />
520
+ <Card>
521
+ <CardHeader>
522
+ <CardTitle>{t('templates.data.title')}</CardTitle>
523
+ <CardDescription>{t('templates.data.description')}</CardDescription>
524
+ </CardHeader>
525
+ <CardContent>
526
+ <div className="mb-4">
527
+ <div className="relative">
528
+ <Search className="absolute left-3 top-3 h-4 w-4 text-muted-foreground" />
529
+ <Input
530
+ placeholder={t('templates.data.searchPlaceholder')}
531
+ aria-label={t('templates.data.searchPlaceholder')}
532
+ className="pl-10"
533
+ />
534
+ </div>
496
535
  </div>
497
- </div>
498
536
 
499
- <div className="rounded-[var(--radius-lg)] border border-border overflow-hidden">
500
- <Table>
501
- <TableHeader>
502
- <TableRow>
503
- <TableHead>{t('team.name')}</TableHead>
504
- <TableHead>{t('team.email')}</TableHead>
505
- <TableHead>{t('team.role')}</TableHead>
506
- <TableHead>{t('team.status')}</TableHead>
507
- <TableHead className="text-right">{t('team.actions')}</TableHead>
508
- </TableRow>
509
- </TableHeader>
510
- <TableBody>
511
- {teamLoading ? (
512
- <>
513
- {Array.from({ length: 5 }).map((_, i) => (
514
- <TableRow key={i}>
537
+ <div className="rounded-[var(--radius-lg)] border border-border overflow-hidden">
538
+ <Table>
539
+ <TableHeader>
540
+ <TableRow>
541
+ <TableHead>{t('team.name')}</TableHead>
542
+ <TableHead>{t('team.email')}</TableHead>
543
+ <TableHead>{t('team.role')}</TableHead>
544
+ <TableHead>{t('team.status')}</TableHead>
545
+ <TableHead className="text-right">{t('team.actions')}</TableHead>
546
+ </TableRow>
547
+ </TableHeader>
548
+ <TableBody>
549
+ {teamLoading ? (
550
+ <>
551
+ {Array.from({ length: 5 }).map((_, i) => (
552
+ <TableRow key={i}>
553
+ <TableCell>
554
+ <div className="flex items-center gap-2">
555
+ <Skeleton className="size-8 rounded-full shrink-0" />
556
+ <Skeleton className="h-3.5 w-28" />
557
+ </div>
558
+ </TableCell>
559
+ <TableCell>
560
+ <Skeleton className="h-3.5 w-36" />
561
+ </TableCell>
562
+ <TableCell>
563
+ <Skeleton className="h-3.5 w-20" />
564
+ </TableCell>
565
+ <TableCell>
566
+ <Skeleton className="h-5 w-16 rounded-full" />
567
+ </TableCell>
568
+ <TableCell className="text-right">
569
+ <Skeleton className="h-7 w-14 ml-auto" />
570
+ </TableCell>
571
+ </TableRow>
572
+ ))}
573
+ </>
574
+ ) : (
575
+ teamMembers.map(member => (
576
+ <TableRow key={member.id}>
577
+ <TableCell>{member.name}</TableCell>
578
+ <TableCell>{member.email}</TableCell>
579
+ <TableCell>{t(`team.roles.${member.role}`)}</TableCell>
515
580
  <TableCell>
516
- <div className="flex items-center gap-2">
517
- <Skeleton className="size-8 rounded-full shrink-0" />
518
- <Skeleton className="h-3.5 w-28" />
519
- </div>
581
+ <Badge
582
+ variant={
583
+ member.status === 'active'
584
+ ? 'default'
585
+ : member.status === 'away'
586
+ ? 'secondary'
587
+ : 'outline'
588
+ }
589
+ >
590
+ {t(`common.${member.status}`)}
591
+ </Badge>
592
+ </TableCell>
593
+ <TableCell className="text-right">
594
+ <Button variant="ghost" size="sm">
595
+ {t('common.edit')}
596
+ </Button>
520
597
  </TableCell>
521
- <TableCell><Skeleton className="h-3.5 w-36" /></TableCell>
522
- <TableCell><Skeleton className="h-3.5 w-20" /></TableCell>
523
- <TableCell><Skeleton className="h-5 w-16 rounded-full" /></TableCell>
524
- <TableCell className="text-right"><Skeleton className="h-7 w-14 ml-auto" /></TableCell>
525
598
  </TableRow>
526
- ))}
527
- </>
528
- ) : (
529
- teamMembers.map(member => (
530
- <TableRow key={member.id}>
531
- <TableCell>{member.name}</TableCell>
532
- <TableCell>{member.email}</TableCell>
533
- <TableCell>{t(`team.roles.${member.role}`)}</TableCell>
534
- <TableCell>
535
- <Badge
536
- variant={
537
- member.status === 'active'
538
- ? 'default'
539
- : member.status === 'away'
540
- ? 'secondary'
541
- : 'outline'
542
- }
543
- >
544
- {t(`common.${member.status}`)}
545
- </Badge>
546
- </TableCell>
547
- <TableCell className="text-right">
548
- <Button variant="ghost" size="sm">
549
- {t('common.edit')}
550
- </Button>
551
- </TableCell>
552
- </TableRow>
553
- ))
554
- )}
555
- </TableBody>
556
- </Table>
557
- </div>
558
- </CardContent>
559
- <CardFooter className="flex justify-between items-center">
560
- <p className="text-muted-foreground">
561
- {t('team.showing', { count: teamMembers.length, total: teamMembers.length })}
562
- </p>
563
- <div className="flex gap-2">
564
- <Button variant="outline" size="sm">
565
- {t('common.previous')}
566
- </Button>
567
- <Button variant="outline" size="sm">
568
- {t('common.next')}
569
- </Button>
570
- </div>
571
- </CardFooter>
572
- </Card>
599
+ ))
600
+ )}
601
+ </TableBody>
602
+ </Table>
603
+ </div>
604
+ </CardContent>
605
+ <CardFooter className="flex justify-between items-center">
606
+ <p className="text-muted-foreground">
607
+ {t('team.showing', {
608
+ count: teamMembers.length,
609
+ total: teamMembers.length,
610
+ })}
611
+ </p>
612
+ <div className="flex gap-2">
613
+ <Button variant="outline" size="sm">
614
+ {t('common.previous')}
615
+ </Button>
616
+ <Button variant="outline" size="sm">
617
+ {t('common.next')}
618
+ </Button>
619
+ </div>
620
+ </CardFooter>
621
+ </Card>
573
622
  </SectionErrorBoundary>
574
623
  </TabsContent>
575
624
 
@@ -581,25 +630,33 @@ export function TemplateContent() {
581
630
  <CardDescription>{t('templates.settings.description')}</CardDescription>
582
631
  </CardHeader>
583
632
  <CardContent className="space-y-6">
584
- <div className="flex items-center justify-between">
585
- <div className="space-y-1">
586
- <Label htmlFor="dark-mode">{t('templates.settings.darkMode')}</Label>
587
- <p className="text-muted-foreground">
588
- {t('templates.settings.darkModeDescription')}
589
- </p>
590
- </div>
591
- <Switch
592
- id="dark-mode"
593
- checked={switchEnabled}
594
- onCheckedChange={toggleSwitch}
595
- />
596
- </div>
633
+ {!disableDarkMode && (
634
+ <>
635
+ <div className="flex items-center justify-between">
636
+ <div className="space-y-1">
637
+ <Label htmlFor="dark-mode">
638
+ {t('templates.settings.darkMode')}
639
+ </Label>
640
+ <p className="text-muted-foreground">
641
+ {t('templates.settings.darkModeDescription')}
642
+ </p>
643
+ </div>
644
+ <Switch
645
+ id="dark-mode"
646
+ checked={switchEnabled}
647
+ onCheckedChange={toggleSwitch}
648
+ />
649
+ </div>
597
650
 
598
- <Separator />
651
+ <Separator />
652
+ </>
653
+ )}
599
654
 
600
655
  <div className="flex items-center justify-between">
601
656
  <div className="space-y-1">
602
- <Label htmlFor="email-notifications">{t('templates.settings.emailNotifications')}</Label>
657
+ <Label htmlFor="email-notifications">
658
+ {t('templates.settings.emailNotifications')}
659
+ </Label>
603
660
  <p className="text-muted-foreground">
604
661
  {t('templates.settings.emailNotificationsDescription')}
605
662
  </p>
@@ -611,7 +668,9 @@ export function TemplateContent() {
611
668
 
612
669
  <div className="flex items-center justify-between">
613
670
  <div className="space-y-1">
614
- <Label htmlFor="push-notifications">{t('templates.settings.pushNotifications')}</Label>
671
+ <Label htmlFor="push-notifications">
672
+ {t('templates.settings.pushNotifications')}
673
+ </Label>
615
674
  <p className="text-muted-foreground">
616
675
  {t('templates.settings.pushNotificationsDescription')}
617
676
  </p>
@@ -628,9 +687,15 @@ export function TemplateContent() {
628
687
  <SelectValue />
629
688
  </SelectTrigger>
630
689
  <SelectContent>
631
- <SelectItem value="pt-br">{t('templates.settings.languages.ptBR')}</SelectItem>
632
- <SelectItem value="en">{t('templates.settings.languages.en')}</SelectItem>
633
- <SelectItem value="es">{t('templates.settings.languages.es')}</SelectItem>
690
+ <SelectItem value="pt-br">
691
+ {t('templates.settings.languages.ptBR')}
692
+ </SelectItem>
693
+ <SelectItem value="en">
694
+ {t('templates.settings.languages.en')}
695
+ </SelectItem>
696
+ <SelectItem value="es">
697
+ {t('templates.settings.languages.es')}
698
+ </SelectItem>
634
699
  </SelectContent>
635
700
  </Select>
636
701
  </div>
@@ -650,7 +715,9 @@ export function TemplateContent() {
650
715
  <SelectItem value="america-new-york">
651
716
  {t('templates.settings.timezones.newYork')}
652
717
  </SelectItem>
653
- <SelectItem value="europe-london">{t('templates.settings.timezones.london')}</SelectItem>
718
+ <SelectItem value="europe-london">
719
+ {t('templates.settings.timezones.london')}
720
+ </SelectItem>
654
721
  </SelectContent>
655
722
  </Select>
656
723
  </div>
@@ -808,12 +875,16 @@ export function TemplateContent() {
808
875
  <Card>
809
876
  <CardHeader>
810
877
  <CardTitle>{t('templates.dialogs.alertDialogTitle')}</CardTitle>
811
- <CardDescription>{t('templates.dialogs.alertDialogDescription')}</CardDescription>
878
+ <CardDescription>
879
+ {t('templates.dialogs.alertDialogDescription')}
880
+ </CardDescription>
812
881
  </CardHeader>
813
882
  <CardContent className="flex justify-center py-6">
814
883
  <AlertDialog>
815
884
  <AlertDialogTrigger asChild>
816
- <Button variant="destructive">{t('templates.dialogs.deleteAccount')}</Button>
885
+ <Button variant="destructive">
886
+ {t('templates.dialogs.deleteAccount')}
887
+ </Button>
817
888
  </AlertDialogTrigger>
818
889
  <AlertDialogContent className="sm:max-w-[425px]">
819
890
  <AlertDialogHeader>
@@ -850,11 +921,15 @@ export function TemplateContent() {
850
921
  <Card>
851
922
  <CardHeader>
852
923
  <CardTitle>{t('templates.headerVariations.cardTitle')}</CardTitle>
853
- <CardDescription>{t('templates.headerVariations.cardDescription')}</CardDescription>
924
+ <CardDescription>
925
+ {t('templates.headerVariations.cardDescription')}
926
+ </CardDescription>
854
927
  </CardHeader>
855
928
  <CardContent className="space-y-6">
856
929
  <div className="p-4 border rounded-[var(--radius-lg)] bg-muted/30">
857
- <h4 className="text-sm font-semibold mb-4">{t('templates.headerVariations.visibleElements')}</h4>
930
+ <h4 className="text-sm font-semibold mb-4">
931
+ {t('templates.headerVariations.visibleElements')}
932
+ </h4>
858
933
  <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-6">
859
934
  <div className="flex items-center space-x-2">
860
935
  <Switch
@@ -884,7 +959,11 @@ export function TemplateContent() {
884
959
  {t('templates.headerVariations.preview')}
885
960
  </div>
886
961
  <Header
887
- title={!showHeaderBreadcrumbs ? t('templates.headerVariations.currentPage') : undefined}
962
+ title={
963
+ !showHeaderBreadcrumbs
964
+ ? t('templates.headerVariations.currentPage')
965
+ : undefined
966
+ }
888
967
  breadcrumbs={
889
968
  showHeaderBreadcrumbs
890
969
  ? [
@@ -893,7 +972,10 @@ export function TemplateContent() {
893
972
  href: '#',
894
973
  icon: <Home className="w-4 h-4" />,
895
974
  },
896
- { label: t('templates.headerVariations.breadcrumbSettings'), href: '#' },
975
+ {
976
+ label: t('templates.headerVariations.breadcrumbSettings'),
977
+ href: '#',
978
+ },
897
979
  { label: t('templates.headerVariations.breadcrumbProfile') },
898
980
  ]
899
981
  : undefined
@@ -904,13 +986,15 @@ export function TemplateContent() {
904
986
  {
905
987
  id: 'notify',
906
988
  icon: <Bell className="w-5 h-5" />,
907
- onClick: () => toast(t('templates.headerVariations.notificationsOpenedToast')),
989
+ onClick: () =>
990
+ toast(t('templates.headerVariations.notificationsOpenedToast')),
908
991
  },
909
992
  {
910
993
  id: 'mail',
911
994
  label: t('templates.headerVariations.messagesLabel'),
912
995
  icon: <Mail className="w-5 h-5" />,
913
- onClick: () => toast(t('templates.headerVariations.messagesOpenedToast')),
996
+ onClick: () =>
997
+ toast(t('templates.headerVariations.messagesOpenedToast')),
914
998
  },
915
999
  ]
916
1000
  : undefined
@@ -937,12 +1021,18 @@ export function TemplateContent() {
937
1021
  <CardContent>
938
1022
  <Tabs defaultValue="assistant" className="w-full">
939
1023
  <TabsList className="mb-4">
940
- <TabsTrigger value="assistant">{t('templates.sidebar.assistantMode')}</TabsTrigger>
941
- <TabsTrigger value="default">{t('templates.sidebar.defaultMode')}</TabsTrigger>
1024
+ <TabsTrigger value="assistant">
1025
+ {t('templates.sidebar.assistantMode')}
1026
+ </TabsTrigger>
1027
+ <TabsTrigger value="default">
1028
+ {t('templates.sidebar.defaultMode')}
1029
+ </TabsTrigger>
942
1030
  </TabsList>
943
1031
 
944
1032
  <div className="mb-6 p-4 border rounded-[var(--radius-lg)] bg-muted/30">
945
- <h4 className="text-sm font-semibold mb-4">{t('templates.sidebarControls.footerSettings')}</h4>
1033
+ <h4 className="text-sm font-semibold mb-4">
1034
+ {t('templates.sidebarControls.footerSettings')}
1035
+ </h4>
946
1036
  <div className="flex flex-wrap gap-6 mt-2">
947
1037
  <div className="flex items-center space-x-2">
948
1038
  <Switch
@@ -978,7 +1068,9 @@ export function TemplateContent() {
978
1068
 
979
1069
  <div className="mt-6 pt-6 border-t">
980
1070
  <div className="flex items-center justify-between mb-4">
981
- <h4 className="text-sm font-semibold">{t('templates.sidebarControls.sidebarWidthDesktop')}</h4>
1071
+ <h4 className="text-sm font-semibold">
1072
+ {t('templates.sidebarControls.sidebarWidthDesktop')}
1073
+ </h4>
982
1074
  <span className="text-xs font-mono bg-muted px-2 py-1 rounded">
983
1075
  {sidebarWidth}px
984
1076
  </span>
@@ -1064,12 +1156,15 @@ export function TemplateContent() {
1064
1156
  {
1065
1157
  path: '/assistant/refatoracao',
1066
1158
  label: t('templates.sidebar.items.sidebarRefactor'),
1067
- description: t('templates.sidebar.items.sidebarRefactorDescription'),
1159
+ description: t(
1160
+ 'templates.sidebar.items.sidebarRefactorDescription'
1161
+ ),
1068
1162
  actions: [
1069
1163
  {
1070
1164
  label: t('templates.sidebar.actions.rename'),
1071
1165
  icon: FileEdit,
1072
- onClick: () => toast(t('templates.sidebar.actions.renameToast')),
1166
+ onClick: () =>
1167
+ toast(t('templates.sidebar.actions.renameToast')),
1073
1168
  },
1074
1169
  {
1075
1170
  label: t('templates.sidebar.actions.move'),
@@ -1077,22 +1172,30 @@ export function TemplateContent() {
1077
1172
  children: [
1078
1173
  {
1079
1174
  label: t('templates.sidebar.actions.moveActive'),
1080
- onClick: () => toast(t('templates.sidebar.actions.moveActiveToast')),
1175
+ onClick: () =>
1176
+ toast(t('templates.sidebar.actions.moveActiveToast')),
1081
1177
  },
1082
1178
  {
1083
1179
  label: t('templates.sidebar.actions.moveMonitoring'),
1084
- onClick: () => toast(t('templates.sidebar.actions.moveMonitoringToast')),
1180
+ onClick: () =>
1181
+ toast(
1182
+ t('templates.sidebar.actions.moveMonitoringToast')
1183
+ ),
1085
1184
  },
1086
1185
  {
1087
1186
  label: t('templates.sidebar.actions.moveArchive'),
1088
- onClick: () => toast(t('templates.sidebar.actions.moveArchiveToast')),
1187
+ onClick: () =>
1188
+ toast(
1189
+ t('templates.sidebar.actions.moveArchiveToast')
1190
+ ),
1089
1191
  },
1090
1192
  ],
1091
1193
  },
1092
1194
  {
1093
1195
  label: t('templates.sidebar.actions.clear'),
1094
1196
  icon: Trash2,
1095
- onClick: () => toast(t('templates.sidebar.actions.clearToast')),
1197
+ onClick: () =>
1198
+ toast(t('templates.sidebar.actions.clearToast')),
1096
1199
  variant: 'destructive',
1097
1200
  },
1098
1201
  ],
@@ -1107,12 +1210,14 @@ export function TemplateContent() {
1107
1210
  {
1108
1211
  label: t('templates.sidebar.actions.newCategory'),
1109
1212
  icon: Plus,
1110
- onClick: () => toast(t('templates.sidebar.actions.newCategoryToast')),
1213
+ onClick: () =>
1214
+ toast(t('templates.sidebar.actions.newCategoryToast')),
1111
1215
  },
1112
1216
  {
1113
1217
  label: t('templates.sidebar.actions.archiveGroup'),
1114
1218
  icon: Archive,
1115
- onClick: () => toast(t('templates.sidebar.actions.archiveGroupToast')),
1219
+ onClick: () =>
1220
+ toast(t('templates.sidebar.actions.archiveGroupToast')),
1116
1221
  },
1117
1222
  ],
1118
1223
  items: [
@@ -1170,14 +1275,28 @@ export function TemplateContent() {
1170
1275
  avatar: 'https://github.com/shadcn.png',
1171
1276
  }}
1172
1277
  onLogout={() => toast(t('templates.sidebar.logoutToast'))}
1173
- onSettingsClick={() => toast(t('templates.sidebar.settingsClickedToast'))}
1278
+ onSettingsClick={() =>
1279
+ toast(t('templates.sidebar.settingsClickedToast'))
1280
+ }
1174
1281
  location={{ pathname: '/home' }}
1175
1282
  navigate={() => {}}
1176
1283
  variant="default"
1177
1284
  routes={[
1178
- { path: '/home', label: t('templates.sidebar.routes.home'), icon: Home },
1179
- { path: '/dashboard', label: t('templates.sidebar.routes.dashboard'), icon: Users },
1180
- { path: '/settings', label: t('templates.sidebar.routes.settings'), icon: Settings },
1285
+ {
1286
+ path: '/home',
1287
+ label: t('templates.sidebar.routes.home'),
1288
+ icon: Home,
1289
+ },
1290
+ {
1291
+ path: '/dashboard',
1292
+ label: t('templates.sidebar.routes.dashboard'),
1293
+ icon: Users,
1294
+ },
1295
+ {
1296
+ path: '/settings',
1297
+ label: t('templates.sidebar.routes.settings'),
1298
+ icon: Settings,
1299
+ },
1181
1300
  ]}
1182
1301
  footer={{
1183
1302
  showUser: showSidebarUser,