@micha.bigler/ui-core-micha 3.14.4 → 4.0.1

package/src/components/BulkInviteCsvTab.jsx

@@ -1,198 +0,0 @@
-import React, { useMemo, useState } from 'react';
-import {
-  Box,
-  Button,
-  Typography,
-  Alert,
-  LinearProgress,
-  Table,
-  TableBody,
-  TableCell,
-  TableContainer,
-  TableHead,
-  TableRow,
-  Paper,
-} from '@mui/material';
-import { useTranslation } from 'react-i18next';
-import { sendAdminInvite } from '../auth/authApi';
-import { resolveErrorText } from '../utils/resolveErrorText';
-
-export const BULK_INVITE_ACTION_SX = {
-  minWidth: 120,
-  height: 40,
-  whiteSpace: 'nowrap',
-};
-export const BULK_INVITE_ALERT_SX = { mb: 2 };
-
-function parseEmailsFromCsv(text) {
-  if (!text) return [];
-
-  const lines = text
-    .split(/\r?\n/)
-    .map((line) => line.trim())
-    .filter(Boolean);
-
-  if (lines.length === 0) return [];
-
-  const first = lines[0].toLowerCase();
-  const hasHeader = first.includes('email');
-  const dataLines = hasHeader ? lines.slice(1) : lines;
-  const emails = [];
-
-  dataLines.forEach((line) => {
-    const cols = line.split(/[;,|\t]/).map((part) => part.trim());
-    const email = cols.find((part) => part.includes('@'));
-    if (email) emails.push(email);
-  });
-
-  return Array.from(new Set(emails.map((e) => e.toLowerCase())));
-}
-
-export function BulkInviteCsvTab({
-  inviteFn = (email) => sendAdminInvite(email),
-  onCompleted,
-}) {
-  const { t, i18n } = useTranslation();
-  const [emails, setEmails] = useState([]);
-  const [results, setResults] = useState({});
-  const [busy, setBusy] = useState(false);
-  const [error, setError] = useState('');
-  const [success, setSuccess] = useState('');
-
-  const total = emails.length;
-  const done = Object.keys(results).length;
-  const progress = total > 0 ? Math.round((done / total) * 100) : 0;
-
-  const successCount = useMemo(
-    () => Object.values(results).filter((r) => r.ok).length,
-    [results],
-  );
-
-  const handleFile = async (event) => {
-    setError('');
-    setSuccess('');
-    setResults({});
-
-    const file = event.target.files?.[0];
-    if (!file) return;
-
-    try {
-      const text = await file.text();
-      const parsed = parseEmailsFromCsv(text);
-      if (parsed.length === 0) {
-        setError(t('Account.BULK_INVITE_NO_EMAILS', 'No valid email addresses found in CSV.'));
-        return;
-      }
-      setEmails(parsed);
-    } catch (err) {
-      setError(err.message || t('Account.BULK_INVITE_PARSE_FAILED', 'Could not read CSV file.'));
-    }
-  };
-
-  const handleInviteAll = async () => {
-    if (emails.length === 0) return;
-    setBusy(true);
-    setError('');
-    setSuccess('');
-    setResults({});
-
-    const nextResults = {};
-    for (const email of emails) {
-      try {
-        const response = await inviteFn(email);
-        nextResults[email] = {
-          ok: true,
-          message: response?.detail || t('Auth.INVITE_SENT_SUCCESS', 'Invitation sent.'),
-        };
-      } catch (err) {
-        nextResults[email] = {
-          ok: false,
-          message: resolveErrorText(i18n, err, 'Auth.INVITE_FAILED'),
-        };
-      }
-      setResults({ ...nextResults });
-    }
-
-    const okCount = Object.values(nextResults).filter((r) => r.ok).length;
-    setSuccess(
-      t('Account.BULK_INVITE_DONE', '{{ok}} / {{total}} invites sent.', {
-        ok: okCount,
-        total: emails.length,
-      }),
-    );
-    setBusy(false);
-    if (onCompleted) onCompleted(nextResults);
-  };
-
-  return (
-    <Box>
-      <Typography variant="h6" gutterBottom>
-        {t('Account.BULK_INVITE_TITLE', 'Bulk Invite via CSV')}
-      </Typography>
-      <Typography variant="body2" sx={{ mb: 2, color: 'text.secondary' }}>
-        {t(
-          'Account.BULK_INVITE_HINT',
-          'Upload a CSV file containing email addresses. Header "email" is supported.',
-        )}
-      </Typography>
-
-      {error && <Alert severity="error" sx={BULK_INVITE_ALERT_SX}>{error}</Alert>}
-      {success && <Alert severity="success" sx={BULK_INVITE_ALERT_SX}>{success}</Alert>}
-
-      <Box sx={{ display: 'flex', gap: 2, alignItems: 'center', mb: 2, flexWrap: 'wrap' }}>
-        <Button variant="outlined" size="small" component="label" disabled={busy} sx={BULK_INVITE_ACTION_SX}>
-          {t('Account.BULK_INVITE_UPLOAD', 'Upload CSV')}
-          <input type="file" accept=".csv,text/csv" hidden onChange={handleFile} />
-        </Button>
-        <Button variant="contained" size="small" sx={BULK_INVITE_ACTION_SX} onClick={handleInviteAll} disabled={busy || emails.length === 0}>
-          {t('Account.BULK_INVITE_SEND', 'Send Invites')}
-        </Button>
-        <Typography variant="body2">
-          {t('Account.BULK_INVITE_COUNT', '{{count}} emails loaded', { count: emails.length })}
-        </Typography>
-      </Box>
-
-      {busy && (
-        <Box sx={{ mb: 2 }}>
-          <LinearProgress variant="determinate" value={progress} />
-        </Box>
-      )}
-
-      {emails.length > 0 && (
-        <TableContainer component={Paper}>
-          <Table size="small">
-            <TableHead>
-              <TableRow>
-                <TableCell>{t('Auth.EMAIL_LABEL', 'Email')}</TableCell>
-                <TableCell>{t('Common.STATUS', 'Status')}</TableCell>
-                <TableCell>{t('Common.DETAILS', 'Details')}</TableCell>
-              </TableRow>
-            </TableHead>
-            <TableBody>
-              {emails.map((email) => {
-                const row = results[email];
-                return (
-                  <TableRow key={email}>
-                    <TableCell>{email}</TableCell>
-                    <TableCell>
-                      {row ? (row.ok ? t('Common.SUCCESS', 'Success') : t('Common.ERROR', 'Error')) : '-'}
-                    </TableCell>
-                    <TableCell>{row?.message || '-'}</TableCell>
-                  </TableRow>
-                );
-              })}
-            </TableBody>
-          </Table>
-        </TableContainer>
-      )}
-
-      {done > 0 && (
-        <Typography variant="body2" sx={{ mt: 2 }}>
-          {t('Account.BULK_INVITE_PROGRESS', '{{done}} / {{total}} processed', { done, total })}
-          {' - '}
-          {t('Account.BULK_INVITE_SUCCESS_COUNT', '{{count}} successful', { count: successCount })}
-        </Typography>
-      )}
-    </Box>
-  );
-}

package/src/components/EmptyState.jsx

@@ -1,38 +0,0 @@
-import { Box, Button, Typography } from '@mui/material';
-import { cloneElement } from 'react';
-
-/**
- * A shared, compact presentation for an empty section: optional decorative icon,
- * title, supporting description, and an optional outlined action.
- */
-export default function EmptyState({ icon, title, description, action, sx }) {
-  return (
-    <Box
-      sx={[{
-        display: 'flex',
-        flexDirection: 'column',
-        alignItems: 'center',
-        gap: 1,
-        p: 2,
-        textAlign: 'center',
-      }, sx]}
-    >
-      {icon && (
-        <Box sx={{ color: 'text.secondary', display: 'flex' }}>
-          {cloneElement(icon, { 'aria-hidden': true, focusable: false })}
-        </Box>
-      )}
-      <Typography component="p">{title}</Typography>
-      {description && (
-        <Typography component="p" variant="body2" color="text.secondary">
-          {description}
-        </Typography>
-      )}
-      {action && (
-        <Button type="button" variant="outlined" onClick={action.onClick}>
-          {action.label}
-        </Button>
-      )}
-    </Box>
-  );
-}

package/src/components/LoginForm.jsx

@@ -1,159 +0,0 @@
-import React, { useState, useEffect } from 'react';
-import {
-  Box,
-  TextField,
-  Button,
-  Typography,
-  Divider,
-} from '@mui/material';
-import { useTranslation } from 'react-i18next';
-import { SocialLoginButtons } from './SocialLoginButtons';
-
-export const LOGIN_FORM_DIVIDER_SX = { my: 2 };
-
-export function LoginForm({
-  onSubmit,
-  onForgotPassword,
-  onSocialLogin,
-  socialProviders,
-  onPasskeyLogin,
-  onSignUp,
-  error,           // bereits übersetzter Text oder t(errorKey) aus dem Parent
-  disabled = false,
-  initialIdentifier = '',
-}) {
-  const { t } = useTranslation();
-
-  const [identifier, setIdentifier] = useState(initialIdentifier);
-  const [password, setPassword] = useState('');
-
-  // Keep identifier in sync if initialIdentifier changes (e.g. recovery link)
-  useEffect(() => {
-    setIdentifier(initialIdentifier);
-  }, [initialIdentifier]);
-
-  const handleSubmit = (event) => {
-    event.preventDefault();
-    if (!onSubmit) return;
-    onSubmit({ identifier, password });
-  };
-
-  const supportsPasskey =
-    !!onPasskeyLogin &&
-    typeof window !== 'undefined' &&
-    !!window.PublicKeyCredential;
-
-  return (
-    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}>
-      {error && (
-        <Typography color="error" gutterBottom>
-          {error}
-        </Typography>
-      )}
-
-      {/* Sign in: Passkey zuerst, falls verfügbar */}
-      {supportsPasskey && (
-        <>
-          <Button
-            variant="contained"
-            fullWidth
-            type="button"
-            onClick={onPasskeyLogin}
-            disabled={disabled}
-          >
-            {t('Auth.LOGIN_USE_PASSKEY_BUTTON')}
-          </Button>
-
-          <Divider sx={LOGIN_FORM_DIVIDER_SX}>
-            {t('Auth.LOGIN_OR')}
-          </Divider>
-        </>
-      )}
-
-      {/* Sign in: E-Mail + Passwort */}
-      {onSubmit && (
-        <Box
-          component="form"
-          onSubmit={handleSubmit}
-          sx={{ display: 'flex', flexDirection: 'column', gap: 2 }}
-        >
-          <TextField
-            label={t('Auth.EMAIL_LABEL')}
-            type="email"
-            required
-            fullWidth
-            value={identifier}
-            onChange={(e) => setIdentifier(e.target.value)}
-            disabled={disabled}
-          />
-
-          <TextField
-            label={t('Auth.LOGIN_PASSWORD_LABEL')}
-            type="password"
-            required
-            fullWidth
-            value={password}
-            onChange={(e) => setPassword(e.target.value)}
-            disabled={disabled}
-          />
-
-          <Button
-            type="submit"
-            variant="contained"
-            fullWidth
-            disabled={disabled}
-          >
-            {t('Auth.PAGE_LOGIN_TITLE')}
-          </Button>
-        </Box>
-      )}
-
-      {/* Other ways to sign in */}
-      {onSocialLogin && (
-        <Box>
-          <Divider sx={LOGIN_FORM_DIVIDER_SX}>
-            {t('Auth.LOGIN_OR')}
-          </Divider>
-          <SocialLoginButtons
-            onProviderClick={onSocialLogin}
-            providers={socialProviders}
-          />
-        </Box>
-      )}
-      {/* Account actions */}
-      {(onSignUp || onForgotPassword) && (
-      <Box>
-        <Divider sx={LOGIN_FORM_DIVIDER_SX}>
-          {t('Auth.LOGIN_OR')}
-        </Divider>
-
-        <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1.5 }}>
-          {onSignUp && (
-            <Button
-              type="button"
-              variant="outlined"
-              onClick={onSignUp}
-              disabled={disabled}
-              fullWidth
-            >
-              {t('Auth.LOGIN_SIGNUP_BUTTON')}
-            </Button>
-          )}
-
-          {onForgotPassword && (
-            <Button
-              type="button"
-              variant="outlined"
-              onClick={onForgotPassword}
-              disabled={disabled}
-              fullWidth
-            >
-              {t('Auth.LOGIN_FORGOT_PASSWORD_BUTTON')}
-            </Button>
-          )}
-        </Box>
-      </Box>
-      )}
-    </Box>
-  );
-};