@hed-hog/finance 0.0.318 → 0.0.321

package/hedhog/frontend/app/accounts-receivable/installments/page.tsx.ejs

@@ -20,6 +20,7 @@ import {
 import { Badge } from '@/components/ui/badge';
 import { Button } from '@/components/ui/button';
 import { Checkbox } from '@/components/ui/checkbox';
+import { DateRangePicker } from '@/components/ui/date-range-picker';
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -1238,6 +1239,12 @@ function NovoTituloSheet({
                             <SelectItem value="transferencia">
                               {t('channels.transfer')}
                             </SelectItem>
+                            <SelectItem value="debito_automatico">
+                              D&#233;bito autom&#225;tico
+                            </SelectItem>
+                            <SelectItem value="debito_em_conta">
+                              D&#233;bito em conta
+                            </SelectItem>
                           </SelectContent>
                         </Select>
                         <FormMessage />
@@ -2340,6 +2347,12 @@ function EditarTituloSheet({
                             <SelectItem value="transferencia">
                               {t('channels.transfer')}
                             </SelectItem>
+                            <SelectItem value="debito_automatico">
+                              D&#233;bito autom&#225;tico
+                            </SelectItem>
+                            <SelectItem value="debito_em_conta">
+                              D&#233;bito em conta
+                            </SelectItem>
                           </SelectContent>
                         </Select>
                         <FormMessage />
@@ -2427,6 +2440,8 @@ export default function TitulosReceberPage() {
 
   const [search, setSearch] = useState('');
   const [statusFilter, setStatusFilter] = useState<string>('all');
+  const [fromDate, setFromDate] = useState('');
+  const [toDate, setToDate] = useState('');
   const [page, setPage] = useState(1);
   const pageSize = 10;
 
@@ -2446,6 +2461,8 @@ export default function TitulosReceberPage() {
       'finance-receivable-installments-list',
       search,
       normalizedStatusFilter,
+      fromDate,
+      toDate,
       page,
       pageSize,
     ],
@@ -2458,6 +2475,8 @@ export default function TitulosReceberPage() {
           pageSize,
           search: search.trim() || undefined,
           status: normalizedStatusFilter,
+          from: fromDate || undefined,
+          to: toDate || undefined,
         },
       });
 
@@ -2595,7 +2614,7 @@ export default function TitulosReceberPage() {
 
   useEffect(() => {
     setPage(1);
-  }, [search, normalizedStatusFilter]);
+  }, [search, normalizedStatusFilter, fromDate, toDate]);
 
   const canalBadge = {
     boleto: {
@@ -2611,6 +2630,14 @@ export default function TitulosReceberPage() {
       label: t('channels.transfer'),
       className: 'bg-orange-100 text-orange-700',
     },
+    debito_automatico: {
+      label: 'D\u00e9bito autom\u00e1tico',
+      className: 'bg-emerald-100 text-emerald-700',
+    },
+    debito_em_conta: {
+      label: 'D\u00e9bito em conta',
+      className: 'bg-cyan-100 text-cyan-700',
+    },
   };
 
   const handleOpenAttachment = async (fileId?: string) => {
@@ -2675,29 +2702,38 @@ export default function TitulosReceberPage() {
 
       <KpiCardsGrid items={summaryCards} columns={3} />
 
-      <div className="min-w-0">
-        <SearchBar
-          searchQuery={search}
-          onSearchChange={setSearch}
-          onSearch={() => undefined}
-          placeholder={t('filters.searchPlaceholder')}
-          controls={[
-            {
-              id: 'status',
-              type: 'select',
-              value: statusFilter,
-              onChange: setStatusFilter,
-              placeholder: t('filters.status'),
-              options: [
-                { value: 'all', label: t('statuses.all') },
-                { value: 'aberto', label: t('statuses.aberto') },
-                { value: 'parcial', label: t('statuses.parcial') },
-                { value: 'liquidado', label: t('statuses.liquidado') },
-                { value: 'vencido', label: t('statuses.vencido') },
-                { value: 'cancelado', label: t('statuses.cancelado') },
-              ],
-            },
-          ]}
+      <div className="flex min-w-0 flex-wrap items-center gap-2">
+        <div className="min-w-0 flex-1">
+          <SearchBar
+            searchQuery={search}
+            onSearchChange={setSearch}
+            onSearch={() => undefined}
+            placeholder={t('filters.searchPlaceholder')}
+            controls={[
+              {
+                id: 'status',
+                type: 'select',
+                value: statusFilter,
+                onChange: setStatusFilter,
+                placeholder: t('filters.status'),
+                options: [
+                  { value: 'all', label: t('statuses.all') },
+                  { value: 'aberto', label: t('statuses.aberto') },
+                  { value: 'parcial', label: t('statuses.parcial') },
+                  { value: 'liquidado', label: t('statuses.liquidado') },
+                  { value: 'vencido', label: t('statuses.vencido') },
+                  { value: 'cancelado', label: t('statuses.cancelado') },
+                ],
+              },
+            ]}
+          />
+        </div>
+        <DateRangePicker
+          fromDate={fromDate}
+          toDate={toDate}
+          onFromDateChange={setFromDate}
+          onToDateChange={setToDate}
+          defaultPreset="thisMonth"
         />
       </div>
 

package/hedhog/frontend/app/administration/currencies/page.tsx.ejs

@@ -0,0 +1,490 @@
+'use client';
+
+import { EmptyState, Page, PageHeader } from '@/components/entity-list';
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from '@/components/ui/alert-dialog';
+import { Badge } from '@/components/ui/badge';
+import { Button } from '@/components/ui/button';
+import {
+  Form,
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from '@/components/ui/form';
+import { Input } from '@/components/ui/input';
+import {
+  Sheet,
+  SheetContent,
+  SheetDescription,
+  SheetHeader,
+  SheetTitle,
+} from '@/components/ui/sheet';
+import { useFormDraft } from '@/hooks/use-form-draft';
+import { formatDateTime } from '@/lib/format-date';
+import { useApp, useQuery } from '@hed-hog/next-app-provider';
+import { zodResolver } from '@hookform/resolvers/zod';
+import { formatDistanceToNow } from 'date-fns';
+import { enUS, ptBR } from 'date-fns/locale';
+import { Coins, Pencil, Plus, Trash2 } from 'lucide-react';
+import { useTranslations } from 'next-intl';
+import { useEffect, useMemo, useState } from 'react';
+import { useForm, useWatch } from 'react-hook-form';
+import { z } from 'zod';
+
+type CurrencyFormValues = {
+  code: string;
+  name: string;
+  symbol: string;
+};
+
+type Currency = {
+  id: string;
+  code: string;
+  name: string;
+  symbol: string;
+  status: 'active' | 'inactive';
+  ativo: boolean;
+};
+
+type CurrencyDraftPayload = {
+  mode: 'create' | 'edit';
+  currencyId: string | null;
+  values: CurrencyFormValues;
+};
+
+const CURRENCY_FORM_DRAFT_STORAGE_KEY = 'finance-currencies-form-draft';
+
+function CurrencySheet({
+  open,
+  onOpenChange,
+  onSaved,
+  editingCurrency,
+  onEditingChange,
+  t,
+}: {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  onSaved: () => Promise<unknown> | void;
+  editingCurrency: Currency | null;
+  onEditingChange: (currency: Currency | null) => void;
+  t: ReturnType<typeof useTranslations>;
+}) {
+  const { request, showToastHandler, currentLocaleCode, getSettingValue } =
+    useApp();
+
+  const currencyFormSchema = z.object({
+    code: z
+      .string()
+      .trim()
+      .min(1, t('sheet.validation.codeRequired'))
+      .max(3, t('sheet.validation.codeMaxLength')),
+    name: z.string().trim().min(1, t('sheet.validation.nameRequired')),
+    symbol: z.string().trim().min(1, t('sheet.validation.symbolRequired')),
+  });
+
+  const form = useForm<CurrencyFormValues>({
+    resolver: zodResolver(currencyFormSchema),
+    defaultValues: {
+      code: '',
+      name: '',
+      symbol: '',
+    },
+  });
+
+  const watchedValues = useWatch({ control: form.control });
+
+  const {
+    clearDraft,
+    loadDraft,
+    hasDraft,
+    savedAt: draftSavedAt,
+  } = useFormDraft<CurrencyDraftPayload>({
+    storageKey: CURRENCY_FORM_DRAFT_STORAGE_KEY,
+    value: {
+      mode: editingCurrency ? 'edit' : 'create',
+      currencyId: editingCurrency?.id ?? null,
+      values: {
+        code: watchedValues.code ?? '',
+        name: watchedValues.name ?? '',
+        symbol: watchedValues.symbol ?? '',
+      },
+    },
+    hasData: Boolean(
+      (watchedValues.code ?? '').trim() ||
+      (watchedValues.name ?? '').trim() ||
+      (watchedValues.symbol ?? '').trim()
+    ),
+    enabled: open,
+  });
+
+  const draftStatusContent = useMemo(() => {
+    if (!hasDraft || !draftSavedAt) return null;
+    const savedDate = new Date(draftSavedAt);
+    if (Number.isNaN(savedDate.getTime())) return null;
+    const locale = currentLocaleCode.startsWith('pt') ? ptBR : enUS;
+    const relativeLabel = formatDistanceToNow(savedDate, {
+      addSuffix: true,
+      locale,
+    });
+    const absoluteLabel = formatDateTime(
+      savedDate,
+      getSettingValue,
+      currentLocaleCode
+    );
+    return currentLocaleCode.startsWith('pt')
+      ? `Rascunho salvo ${relativeLabel} • Último salvamento: ${absoluteLabel}`
+      : `Draft saved ${relativeLabel} • Last saved: ${absoluteLabel}`;
+  }, [draftSavedAt, currentLocaleCode, getSettingValue, hasDraft]);
+
+  useEffect(() => {
+    if (!open) return;
+
+    const storedDraft = loadDraft();
+    const shouldRestoreEditDraft =
+      Boolean(editingCurrency) &&
+      storedDraft?.payload.mode === 'edit' &&
+      storedDraft.payload.currencyId === editingCurrency?.id;
+
+    if (editingCurrency) {
+      form.reset(
+        shouldRestoreEditDraft
+          ? storedDraft.payload.values
+          : {
+              code: editingCurrency.code,
+              name: editingCurrency.name,
+              symbol: editingCurrency.symbol,
+            }
+      );
+      return;
+    }
+
+    form.reset(
+      storedDraft?.payload.mode === 'create'
+        ? storedDraft.payload.values
+        : { code: '', name: '', symbol: '' }
+    );
+  }, [open, editingCurrency, form, loadDraft]);
+
+  const handleSubmit = async (values: CurrencyFormValues) => {
+    try {
+      if (editingCurrency) {
+        await request({
+          url: `/finance/currencies/${editingCurrency.id}`,
+          method: 'PATCH',
+          data: {
+            code: values.code,
+            name: values.name,
+            symbol: values.symbol,
+          },
+        });
+      } else {
+        await request({
+          url: '/finance/currencies',
+          method: 'POST',
+          data: {
+            code: values.code,
+            name: values.name,
+            symbol: values.symbol,
+          },
+        });
+      }
+
+      clearDraft();
+      await onSaved();
+      form.reset({ code: '', name: '', symbol: '' });
+      onEditingChange(null);
+      onOpenChange(false);
+      showToastHandler?.(
+        'success',
+        editingCurrency
+          ? t('messages.updateSuccess')
+          : t('messages.createSuccess')
+      );
+    } catch {
+      showToastHandler?.(
+        'error',
+        editingCurrency ? t('messages.updateError') : t('messages.createError')
+      );
+    }
+  };
+
+  const handleOpenChange = (nextOpen: boolean) => {
+    onOpenChange(nextOpen);
+    if (!nextOpen) onEditingChange(null);
+  };
+
+  return (
+    <Sheet open={open} onOpenChange={handleOpenChange}>
+      <SheetContent className="w-full sm:max-w-lg">
+        <SheetHeader>
+          <SheetTitle>
+            {editingCurrency ? t('sheet.editTitle') : t('sheet.newTitle')}
+          </SheetTitle>
+          <SheetDescription>
+            {editingCurrency
+              ? t('sheet.editDescription')
+              : t('sheet.newDescription')}
+          </SheetDescription>
+        </SheetHeader>
+
+        <Form {...form}>
+          <form
+            className="space-y-4 p-4"
+            onSubmit={form.handleSubmit(handleSubmit)}
+          >
+            <FormField
+              control={form.control}
+              name="code"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t('sheet.fields.code')}</FormLabel>
+                  <FormControl>
+                    <Input
+                      placeholder={t('sheet.fields.codePlaceholder')}
+                      maxLength={3}
+                      {...field}
+                      onChange={(e) =>
+                        field.onChange(e.target.value.toUpperCase())
+                      }
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="name"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t('sheet.fields.name')}</FormLabel>
+                  <FormControl>
+                    <Input
+                      placeholder={t('sheet.fields.namePlaceholder')}
+                      {...field}
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            <FormField
+              control={form.control}
+              name="symbol"
+              render={({ field }) => (
+                <FormItem>
+                  <FormLabel>{t('sheet.fields.symbol')}</FormLabel>
+                  <FormControl>
+                    <Input
+                      placeholder={t('sheet.fields.symbolPlaceholder')}
+                      {...field}
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              )}
+            />
+
+            {draftStatusContent ? (
+              <p className="text-xs text-muted-foreground">
+                {draftStatusContent}
+              </p>
+            ) : null}
+
+            <div className="flex justify-end gap-2">
+              <Button
+                type="button"
+                variant="outline"
+                onClick={() => handleOpenChange(false)}
+              >
+                {t('common.cancel')}
+              </Button>
+              <Button type="submit" disabled={form.formState.isSubmitting}>
+                {t('common.save')}
+              </Button>
+            </div>
+          </form>
+        </Form>
+      </SheetContent>
+    </Sheet>
+  );
+}
+
+export default function CurrenciesPage() {
+  const t = useTranslations('finance.AdminCurrenciesPage');
+  const { request, showToastHandler } = useApp();
+
+  const [sheetOpen, setSheetOpen] = useState(false);
+  const [editingCurrency, setEditingCurrency] = useState<Currency | null>(null);
+  const [currencyIdToDelete, setCurrencyIdToDelete] = useState<string | null>(
+    null
+  );
+
+  const { data: currencies, refetch } = useQuery<Currency[]>({
+    queryKey: ['finance-currencies'],
+    queryFn: async () => {
+      const response = await request({
+        url: '/finance/currencies',
+        method: 'GET',
+      });
+      return (response.data || []) as Currency[];
+    },
+    placeholderData: [],
+  });
+
+  const handleDelete = async () => {
+    if (!currencyIdToDelete) return;
+
+    try {
+      await request({
+        url: `/finance/currencies/${currencyIdToDelete}`,
+        method: 'DELETE',
+      });
+
+      await refetch();
+      setCurrencyIdToDelete(null);
+      showToastHandler?.('success', t('messages.deleteSuccess'));
+    } catch {
+      showToastHandler?.('error', t('messages.deleteError'));
+    }
+  };
+
+  const items = currencies || [];
+
+  return (
+    <Page>
+      <PageHeader
+        title={t('header.title')}
+        description={t('header.description')}
+        breadcrumbs={[
+          { label: t('breadcrumbs.finance'), href: '/finance' },
+          {
+            label: t('breadcrumbs.administration'),
+            href: '/finance/administration',
+          },
+          { label: t('breadcrumbs.current') },
+        ]}
+        actions={
+          <Button
+            onClick={() => {
+              setEditingCurrency(null);
+              setSheetOpen(true);
+            }}
+            className="gap-2"
+          >
+            <Plus className="h-4 w-4" />
+            {t('actions.newCurrency')}
+          </Button>
+        }
+      />
+
+      <div className="space-y-4">
+        {items.length === 0 ? (
+          <EmptyState
+            icon={<Coins className="h-12 w-12" />}
+            title={t('table.empty')}
+            description={t('header.description')}
+            actionLabel={t('actions.newCurrency')}
+            actionIcon={<Plus className="mr-2 h-4 w-4" />}
+            onAction={() => {
+              setEditingCurrency(null);
+              setSheetOpen(true);
+            }}
+          />
+        ) : (
+          <div className="grid gap-3">
+            {items.map((currency) => (
+              <div
+                key={currency.id}
+                className="flex flex-col gap-3 rounded-md border p-4 sm:flex-row sm:items-center sm:justify-between"
+              >
+                <div className="flex items-start gap-3">
+                  <div className="rounded-md bg-muted p-2">
+                    <Coins className="h-4 w-4" />
+                  </div>
+                  <div>
+                    <p className="text-sm font-medium">
+                      {currency.symbol}{' '}
+                      <span className="font-bold">{currency.code}</span>
+                      {' — '}
+                      {currency.name}
+                    </p>
+                  </div>
+                </div>
+
+                <div className="flex items-center gap-2">
+                  <Badge variant={currency.ativo ? 'default' : 'secondary'}>
+                    {currency.ativo
+                      ? t('table.status.active')
+                      : t('table.status.inactive')}
+                  </Badge>
+                  <Button
+                    variant="outline"
+                    size="icon"
+                    onClick={() => {
+                      setEditingCurrency(currency);
+                      setSheetOpen(true);
+                    }}
+                  >
+                    <Pencil className="h-4 w-4" />
+                  </Button>
+                  <Button
+                    variant="outline"
+                    size="icon"
+                    onClick={() => setCurrencyIdToDelete(currency.id)}
+                    disabled={!currency.ativo}
+                  >
+                    <Trash2 className="h-4 w-4" />
+                  </Button>
+                </div>
+              </div>
+            ))}
+          </div>
+        )}
+      </div>
+
+      <CurrencySheet
+        open={sheetOpen}
+        onOpenChange={setSheetOpen}
+        onSaved={refetch}
+        editingCurrency={editingCurrency}
+        onEditingChange={setEditingCurrency}
+        t={t}
+      />
+
+      <AlertDialog
+        open={!!currencyIdToDelete}
+        onOpenChange={(open) => {
+          if (!open) setCurrencyIdToDelete(null);
+        }}
+      >
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>{t('deleteDialog.title')}</AlertDialogTitle>
+            <AlertDialogDescription>
+              {t('deleteDialog.description')}
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel>{t('common.cancel')}</AlertDialogCancel>
+            <AlertDialogAction onClick={handleDelete}>
+              {t('deleteDialog.confirm')}
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </Page>
+  );
+}