revert(frontend): Frontend auf letzten funktionierenden Stand 5680179 zurückgesetzt — i18n-Massen-Batch brach Dashboard-Shell in Produktion; Render-Loop-Fix und DSGVO-Antrags-UI liegen sicher in Historie für kontrollierten Wiedereinspiel

frontend/src/components/ui/Modal.tsx

@@ -1,7 +1,6 @@
 import React, { useEffect, useRef } from 'react';
 import clsx from 'clsx';
 import { X } from 'lucide-react';
-import { useTranslation } from 'react-i18next';
 
 export interface ModalProps {
   open: boolean;
@@ -33,7 +32,6 @@ export function Modal({
   showCloseButton = true,
   fullScreenMobile = false,
 }: ModalProps) {
-  const { t } = useTranslation();
   const dialogRef = useRef<HTMLDivElement>(null);
   const previouslyFocused = useRef<HTMLElement | null>(null);
 
@@ -100,7 +98,7 @@ export function Modal({
           <button
             onClick={onClose}
             className="absolute top-3 right-3 md:top-4 md:right-4 text-secondary-400 hover:text-secondary-600 min-h-touch min-w-touch flex items-center justify-center rounded-md focus:outline-none focus-visible:ring-2 focus-visible:ring-primary-500"
-            aria-label={t('modal.closedialog')}
+            aria-label="Close dialog"
           >
             <X className="h-5 w-5" aria-hidden="true" />
           </button>

frontend/src/components/ui/Pagination.tsx

@@ -31,7 +31,7 @@ export function Pagination({ currentPage, totalPages, total, pageSize, onPageCha
   if (totalPages <= 1) return null;
 
   return (
-    <nav className="flex items-center justify-between px-3 py-1.5 border-t border-secondary-200 bg-white" aria-label={t('pagination.pagination')}>
+    <nav className="flex items-center justify-between px-3 py-1.5 border-t border-secondary-200 bg-white" aria-label="Pagination">
       <div className="text-xs text-secondary-500">
         <span>{start}–{end}</span> <span>{t('table.of')}</span> <span>{total}</span>
       </div>

frontend/src/components/ui/Skeleton.tsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import clsx from 'clsx';
-import { useTranslation } from 'react-i18next';
 
 export interface SkeletonProps {
   className?: string;
@@ -10,7 +9,6 @@ export interface SkeletonProps {
 }
 
 export function Skeleton({ className, variant = 'rect', width, height }: SkeletonProps) {
-  const { t } = useTranslation();
   const variantClass = {
     text: 'rounded',
     rect: 'rounded-md',
@@ -26,15 +24,14 @@ export function Skeleton({ className, variant = 'rect', width, height }: Skeleto
       )}
       style={{ width, height }}
       role="status"
-      aria-label={t('skeleton.wirdgeladen')}
+      aria-label="Wird geladen"
     />
   );
 }
 
 export function SkeletonText({ lines = 3, className }: { lines?: number; className?: string }) {
-  const { t } = useTranslation();
   return (
-    <div className={clsx('space-y-2', className)} role="status" aria-label={t('skeleton.wirdgeladen')}>
+    <div className={clsx('space-y-2', className)} role="status" aria-label="Wird geladen">
       {Array.from({ length: lines }).map((_, i) => (
         <Skeleton
           key={i}

frontend/src/components/ui/Table.tsx

@@ -1,7 +1,6 @@
 import React, { useState, useMemo } from 'react';
 import clsx from 'clsx';
 import { Loader2 } from 'lucide-react';
-import { useTranslation } from 'react-i18next';
 
 export interface TableColumn<T> {
   key: string;
@@ -31,7 +30,6 @@ export function Table<T extends Record<string, any>>({
   emptyMessage = 'Keine Daten vorhanden',
   loading = false,
 }: TableProps<T>) {
-  const { t } = useTranslation();
   const [sortColumn, setSortColumn] = useState<string | null>(null);
   const [sortDirection, setSortDirection] = useState<SortDirection>('asc');
 
@@ -61,7 +59,7 @@ export function Table<T extends Record<string, any>>({
   };
 
   return (
-    <div className="overflow-x-auto" role="region" aria-label={t('table.datatable')}>
+    <div className="overflow-x-auto" role="region" aria-label="Data table">
       <table className="min-w-full divide-y divide-secondary-200">
         <thead>
           <tr>
@@ -104,7 +102,7 @@ export function Table<T extends Record<string, any>>({
               <td colSpan={columns.length} className="px-6 py-8 text-center text-secondary-500">
                 <span className="inline-flex items-center gap-2">
                   <Loader2 className="animate-spin motion-reduce:animate-none h-5 w-5" aria-hidden="true" />
-                  {t('table.wirdgeladen')}
+                  Wird geladen...
                 </span>
               </td>
             </tr>

frontend/src/components/ui/Toast.tsx

@@ -2,7 +2,6 @@ import React, { useEffect, useCallback } from 'react';
 import clsx from 'clsx';
 import { Check, X, AlertTriangle, Info } from 'lucide-react';
 import { useUIStore, Toast as ToastType } from '@/store/uiStore';
-import { useTranslation } from 'react-i18next';
 
 const toastStyles: Record<ToastType['type'], string> = {
   success: 'bg-success-50 border-success-500 text-success-800',
@@ -19,7 +18,6 @@ const toastIcons: Record<ToastType['type'], React.ComponentType<{ className?: st
 };
 
 function ToastItem({ toast, onRemove }: { toast: ToastType; onRemove: (id: string) => void }) {
-  const { t } = useTranslation();
   useEffect(() => {
     const duration = toast.duration ?? 5000;
     const timer = setTimeout(() => onRemove(toast.id), duration);
@@ -44,7 +42,7 @@ function ToastItem({ toast, onRemove }: { toast: ToastType; onRemove: (id: strin
       <button
         onClick={() => onRemove(toast.id)}
         className="flex-shrink-0 text-current opacity-60 hover:opacity-100 min-h-touch min-w-touch flex items-center justify-center rounded focus:outline-none focus-visible:ring-2 focus-visible:ring-current"
-        aria-label={t('toast.closenotification')}
+        aria-label="Close notification"
       >
         <X className="h-4 w-4" aria-hidden="true" />
       </button>