feat: pre-existing local changes — fischerei, verband, modules, members, packages

Commits all remaining uncommitted local work: - apps/web: fischerei, verband, modules, members-cms, documents, newsletter, meetings, site-builder, courses, bookings, events, finance pages and components - apps/web: marketing page updates, layout, paths config, next.config.mjs, styles/makerkit.css - apps/web/i18n: documents, fischerei, marketing, verband (de+en) - packages/features: finance, fischerei, member-management, module-builder, newsletter, sitzungsprotokolle, verbandsverwaltung server APIs and components - packages/ui: button.tsx updates - pnpm-lock.yaml
2026-04-02 01:19:54 +02:00
parent a1719671df
commit b26e5aaafa
153 changed files with 2329 additions and 1227 deletions
--- a/apps/web/app/[locale]/home/[account]/finance/invoices/invoice-action-buttons.tsx
+++ b/apps/web/app/[locale]/home/[account]/finance/invoices/invoice-action-buttons.tsx
@@ -0,0 +1,141 @@
+'use client';
+
+import { useTransition } from 'react';
+
+import { useRouter } from 'next/navigation';
+
+import { CheckCircle, Send } from 'lucide-react';
+
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+  AlertDialogTrigger,
+} from '@kit/ui/alert-dialog';
+import { Button } from '@kit/ui/button';
+
+interface SendInvoiceButtonProps {
+  invoiceId: string;
+  accountId: string;
+}
+
+export function SendInvoiceButton({
+  invoiceId,
+  accountId,
+}: SendInvoiceButtonProps) {
+  const router = useRouter();
+  const [isPending, startTransition] = useTransition();
+
+  const handleSend = () => {
+    startTransition(async () => {
+      try {
+        const response = await fetch(
+          `/api/finance/invoices/${invoiceId}/send`,
+          {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ accountId }),
+          },
+        );
+
+        if (response.ok) {
+          router.refresh();
+        }
+      } catch (error) {
+        console.error('Failed to send invoice:', error);
+      }
+    });
+  };
+
+  return (
+    <AlertDialog>
+      <AlertDialogTrigger
+        render={
+          <Button disabled={isPending}>
+            <Send className="mr-2 h-4 w-4" aria-hidden="true" />
+            Senden
+          </Button>
+        }
+      />
+      <AlertDialogContent>
+        <AlertDialogHeader>
+          <AlertDialogTitle>Rechnung senden?</AlertDialogTitle>
+          <AlertDialogDescription>
+            Diese Aktion kann nicht rückgängig gemacht werden. Die Rechnung wird
+            an den Empfänger gesendet und der Status auf „Versendet" gesetzt.
+          </AlertDialogDescription>
+        </AlertDialogHeader>
+        <AlertDialogFooter>
+          <AlertDialogCancel>Abbrechen</AlertDialogCancel>
+          <AlertDialogAction onClick={handleSend}>
+            {isPending ? 'Wird gesendet...' : 'Senden'}
+          </AlertDialogAction>
+        </AlertDialogFooter>
+      </AlertDialogContent>
+    </AlertDialog>
+  );
+}
+
+interface MarkPaidButtonProps {
+  invoiceId: string;
+  accountId: string;
+}
+
+export function MarkPaidButton({ invoiceId, accountId }: MarkPaidButtonProps) {
+  const router = useRouter();
+  const [isPending, startTransition] = useTransition();
+
+  const handleMarkPaid = () => {
+    startTransition(async () => {
+      try {
+        const response = await fetch(
+          `/api/finance/invoices/${invoiceId}/mark-paid`,
+          {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ accountId }),
+          },
+        );
+
+        if (response.ok) {
+          router.refresh();
+        }
+      } catch (error) {
+        console.error('Failed to mark invoice as paid:', error);
+      }
+    });
+  };
+
+  return (
+    <AlertDialog>
+      <AlertDialogTrigger
+        render={
+          <Button variant="outline" disabled={isPending}>
+            <CheckCircle className="mr-2 h-4 w-4" aria-hidden="true" />
+            Bezahlt markieren
+          </Button>
+        }
+      />
+      <AlertDialogContent>
+        <AlertDialogHeader>
+          <AlertDialogTitle>Als bezahlt markieren?</AlertDialogTitle>
+          <AlertDialogDescription>
+            Der Status der Rechnung wird auf „Bezahlt" gesetzt. Diese Aktion
+            bestätigt den Zahlungseingang.
+          </AlertDialogDescription>
+        </AlertDialogHeader>
+        <AlertDialogFooter>
+          <AlertDialogCancel>Abbrechen</AlertDialogCancel>
+          <AlertDialogAction onClick={handleMarkPaid}>
+            {isPending ? 'Wird gespeichert...' : 'Bestätigen'}
+          </AlertDialogAction>
+        </AlertDialogFooter>
+      </AlertDialogContent>
+    </AlertDialog>
+  );
+}
--- a/apps/web/app/[locale]/home/[account]/finance/invoices/new/page.tsx
+++ b/apps/web/app/[locale]/home/[account]/finance/invoices/new/page.tsx
@@ -1,3 +1,5 @@
+import { getTranslations } from 'next-intl/server';
+
 import { CreateInvoiceForm } from '@kit/finance/components';
 import { getSupabaseServerClient } from '@kit/supabase/server-client';

@@ -10,6 +12,7 @@ interface Props {

 export default async function NewInvoicePage({ params }: Props) {
  const { account } = await params;
+  const t = await getTranslations('finance');
  const client = getSupabaseServerClient();
  const { data: acct } = await client
    .from('accounts')
@@ -21,8 +24,8 @@ export default async function NewInvoicePage({ params }: Props) {
  return (
    <CmsPageShell
      account={account}
-      title="Neue Rechnung"
-      description="Rechnung mit Positionen erstellen"
+      title={t('invoices.newInvoice')}
+      description={t('invoices.newInvoiceDesc')}
    >
      <CreateInvoiceForm accountId={acct.id} account={account} />
    </CmsPageShell>
--- a/apps/web/app/[locale]/home/[account]/finance/payments/page.tsx
+++ b/apps/web/app/[locale]/home/[account]/finance/payments/page.tsx
@@ -7,6 +7,7 @@ import { getSupabaseServerClient } from '@kit/supabase/server-client';
 import { Badge } from '@kit/ui/badge';
 import { Button } from '@kit/ui/button';
 import { Card, CardContent, CardHeader, CardTitle } from '@kit/ui/card';
+import { getTranslations } from 'next-intl/server';

 import { AccountNotFound } from '~/components/account-not-found';
 import { CmsPageShell } from '~/components/cms-page-shell';
@@ -23,6 +24,7 @@ const formatCurrency = (amount: number) =>

 export default async function PaymentsPage({ params }: PageProps) {
  const { account } = await params;
+  const t = await getTranslations('finance');
  const client = getSupabaseServerClient();

  const { data: acct } = await client
@@ -78,41 +80,40 @@ export default async function PaymentsPage({ params }: PageProps) {
  );

  return (
-    <CmsPageShell account={account} title="Zahlungen">
+    <CmsPageShell account={account} title={t('payments.title')}>
      <div className="flex w-full flex-col gap-6">
        {/* Header */}
        <div>
-          <h1 className="text-2xl font-bold">Zahlungsübersicht</h1>
          <p className="text-muted-foreground">
-            Zusammenfassung aller Zahlungen und offenen Beträge
+            {t('payments.subtitle')}
          </p>
        </div>

        {/* Stats */}
        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4">
          <StatsCard
-            title="Bezahlt"
+            title={t('payments.statPaid')}
            value={formatCurrency(paidTotal)}
            icon={<Euro className="h-5 w-5" />}
-            description={`${paidInvoices.length} Rechnungen`}
+            description={`${paidInvoices.length} ${t('payments.paidInvoices')}`}
          />
          <StatsCard
-            title="Offen"
+            title={t('payments.statOpen')}
            value={formatCurrency(openTotal)}
            icon={<CreditCard className="h-5 w-5" />}
-            description={`${openInvoices.length} Rechnungen`}
+            description={`${openInvoices.length} ${t('invoices.title')}`}
          />
          <StatsCard
-            title="Überfällig"
+            title={t('payments.statOverdue')}
            value={formatCurrency(overdueTotal)}
            icon={<TrendingUp className="h-5 w-5" />}
-            description={`${overdueInvoices.length} Rechnungen`}
+            description={`${overdueInvoices.length} ${t('invoices.title')}`}
          />
          <StatsCard
-            title="SEPA-Einzüge"
+            title={t('payments.sepaBatches')}
            value={formatCurrency(sepaTotal)}
            icon={<Euro className="h-5 w-5" />}
-            description={`${batches.length} Einzüge`}
+            description={`${batches.length} ${t('payments.batchUnit')}`}
          />
        </div>

@@ -120,7 +121,7 @@ export default async function PaymentsPage({ params }: PageProps) {
        <div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
          <Card>
            <CardHeader className="flex flex-row items-center justify-between">
-              <CardTitle className="text-base">Offene Rechnungen</CardTitle>
+              <CardTitle className="text-base">{t('payments.openInvoices')}</CardTitle>
              <Badge
                variant={openInvoices.length > 0 ? 'default' : 'secondary'}
              >
@@ -130,21 +131,21 @@ export default async function PaymentsPage({ params }: PageProps) {
            <CardContent>
              <p className="text-muted-foreground mb-4 text-sm">
                {openInvoices.length > 0
-                  ? `${openInvoices.length} Rechnungen mit einem Gesamtbetrag von ${formatCurrency(openTotal)} sind offen.`
-                  : 'Keine offenen Rechnungen vorhanden.'}
+                  ? t('payments.invoicesOpenSummary', { count: openInvoices.length, total: formatCurrency(openTotal) })
+                  : t('payments.noOpenInvoices')}
              </p>
-              <Link href={`/home/${account}/finance/invoices`}>
-                <Button variant="outline" size="sm">
-                  Rechnungen anzeigen
+              <Button variant="outline" size="sm" asChild>
+                <Link href={`/home/${account}/finance/invoices`}>
+                  {t('payments.viewInvoices')}
                  <ArrowRight className="ml-2 h-4 w-4" />
-                </Button>
-              </Link>
+                </Link>
+              </Button>
            </CardContent>
          </Card>

          <Card>
            <CardHeader className="flex flex-row items-center justify-between">
-              <CardTitle className="text-base">SEPA-Einzüge</CardTitle>
+              <CardTitle className="text-base">{t('payments.sepaBatches')}</CardTitle>
              <Badge variant={batches.length > 0 ? 'default' : 'secondary'}>
                {batches.length}
              </Badge>
@@ -152,15 +153,15 @@ export default async function PaymentsPage({ params }: PageProps) {
            <CardContent>
              <p className="text-muted-foreground mb-4 text-sm">
                {batches.length > 0
-                  ? `${batches.length} SEPA-Einzüge mit einem Gesamtvolumen von ${formatCurrency(sepaTotal)}.`
-                  : 'Keine SEPA-Einzüge vorhanden.'}
+                  ? t('payments.batchSummary', { count: batches.length, total: formatCurrency(sepaTotal) })
+                  : t('payments.noBatchesFound')}
              </p>
-              <Link href={`/home/${account}/finance/sepa`}>
-                <Button variant="outline" size="sm">
-                  Einzüge anzeigen
+              <Button variant="outline" size="sm" asChild>
+                <Link href={`/home/${account}/finance/sepa`}>
+                  {t('payments.viewBatches')}
                  <ArrowRight className="ml-2 h-4 w-4" />
-                </Button>
-              </Link>
+                </Link>
+              </Button>
            </CardContent>
          </Card>
        </div>
--- a/apps/web/app/[locale]/home/[account]/finance/sepa/new/page.tsx
+++ b/apps/web/app/[locale]/home/[account]/finance/sepa/new/page.tsx
@@ -1,3 +1,5 @@
+import { getTranslations } from 'next-intl/server';
+
 import { CreateSepaBatchForm } from '@kit/finance/components';
 import { getSupabaseServerClient } from '@kit/supabase/server-client';

@@ -10,6 +12,7 @@ interface Props {

 export default async function NewSepaBatchPage({ params }: Props) {
  const { account } = await params;
+  const t = await getTranslations('finance');
  const client = getSupabaseServerClient();

  const { data: acct } = await client
@@ -23,8 +26,8 @@ export default async function NewSepaBatchPage({ params }: Props) {
  return (
    <CmsPageShell
      account={account}
-      title="Neuer SEPA-Einzug"
-      description="SEPA-Lastschrifteinzug erstellen"
+      title={t('sepa.newBatch')}
+      description={t('sepa.newBatchDesc')}
    >
      <CreateSepaBatchForm accountId={acct.id} account={account} />
    </CmsPageShell>