verschieben des sofortigen verzichts auf das Widerrrufsrecht zum Anlegen des Events

resources/js/admin/mobile/components/LegalConsentSheet.tsx

@@ -11,11 +11,31 @@ type LegalConsentSheetProps = {
   onClose: () => void;
   onConfirm: (consents: { acceptedTerms: boolean; acceptedWaiver: boolean }) => Promise<void> | void;
   busy?: boolean;
+  requireTerms?: boolean;
   requireWaiver?: boolean;
+  copy?: {
+    title?: string;
+    description?: string;
+    checkboxTerms?: string;
+    checkboxWaiver?: string;
+    errorTerms?: string;
+    errorWaiver?: string;
+    confirm?: string;
+    cancel?: string;
+  };
   t: Translator;
 };
 
-export function LegalConsentSheet({ open, onClose, onConfirm, busy = false, requireWaiver = true, t }: LegalConsentSheetProps) {
+export function LegalConsentSheet({
+  open,
+  onClose,
+  onConfirm,
+  busy = false,
+  requireTerms = true,
+  requireWaiver = true,
+  copy,
+  t,
+}: LegalConsentSheetProps) {
   const [acceptedTerms, setAcceptedTerms] = React.useState(false);
   const [acceptedWaiver, setAcceptedWaiver] = React.useState(false);
   const [error, setError] = React.useState<string | null>(null);
@@ -29,25 +49,28 @@ export function LegalConsentSheet({ open, onClose, onConfirm, busy = false, requ
   }, [open]);
 
   async function handleConfirm() {
-    if (!acceptedTerms) {
-      setError(t('events.legalConsent.errorTerms', 'Please confirm the terms.'));
+    if (requireTerms && !acceptedTerms) {
+      setError(copy?.errorTerms ?? t('events.legalConsent.errorTerms', 'Please confirm the terms.'));
       return;
     }
 
     if (requireWaiver && !acceptedWaiver) {
-      setError(t('events.legalConsent.errorWaiver', 'Please confirm the waiver.'));
+      setError(copy?.errorWaiver ?? t('events.legalConsent.errorWaiver', 'Please confirm the waiver.'));
       return;
     }
 
     setError(null);
-    await onConfirm({ acceptedTerms, acceptedWaiver: requireWaiver ? acceptedWaiver : true });
+    await onConfirm({
+      acceptedTerms: requireTerms ? acceptedTerms : true,
+      acceptedWaiver: requireWaiver ? acceptedWaiver : true,
+    });
   }
 
   return (
     <MobileSheet
       open={open}
       onClose={onClose}
-      title={t('events.legalConsent.title', 'Before purchase')}
+      title={copy?.title ?? t('events.legalConsent.title', 'Before purchase')}
       footer={
         <YStack space="$2">
           {error ? (
@@ -55,29 +78,41 @@ export function LegalConsentSheet({ open, onClose, onConfirm, busy = false, requ
               {error}
             </Text>
           ) : null}
-          <CTAButton label={t('events.legalConsent.confirm', 'Continue to checkout')} onPress={handleConfirm} loading={busy} disabled={busy} />
-          <CTAButton label={t('events.legalConsent.cancel', 'Cancel')} tone="ghost" onPress={onClose} disabled={busy} />
+          <CTAButton
+            label={copy?.confirm ?? t('events.legalConsent.confirm', 'Continue to checkout')}
+            onPress={handleConfirm}
+            loading={busy}
+            disabled={busy}
+          />
+          <CTAButton
+            label={copy?.cancel ?? t('events.legalConsent.cancel', 'Cancel')}
+            tone="ghost"
+            onPress={onClose}
+            disabled={busy}
+          />
         </YStack>
       }
     >
       <YStack space="$2">
         <Text fontSize="$sm" color="#111827">
-          {t('events.legalConsent.description', 'Please confirm the legal notes before buying an add-on.')}
+          {copy?.description ?? t('events.legalConsent.description', 'Please confirm the legal notes before buying an add-on.')}
         </Text>
-        <label style={{ display: 'flex', alignItems: 'flex-start', gap: 12 }}>
-          <input
-            type="checkbox"
-            checked={acceptedTerms}
-            onChange={(event) => setAcceptedTerms(event.target.checked)}
-            style={{ marginTop: 4, width: 16, height: 16 }}
-          />
-          <Text fontSize="$sm" color="#111827">
-            {t(
-              'events.legalConsent.checkboxTerms',
-              'I have read and accept the Terms & Conditions, Privacy Policy, and Right of Withdrawal.',
-            )}
-          </Text>
-        </label>
+        {requireTerms ? (
+          <label style={{ display: 'flex', alignItems: 'flex-start', gap: 12 }}>
+            <input
+              type="checkbox"
+              checked={acceptedTerms}
+              onChange={(event) => setAcceptedTerms(event.target.checked)}
+              style={{ marginTop: 4, width: 16, height: 16 }}
+            />
+            <Text fontSize="$sm" color="#111827">
+              {copy?.checkboxTerms ?? t(
+                'events.legalConsent.checkboxTerms',
+                'I have read and accept the Terms & Conditions, Privacy Policy, and Right of Withdrawal.',
+              )}
+            </Text>
+          </label>
+        ) : null}
         {requireWaiver ? (
           <label style={{ display: 'flex', alignItems: 'flex-start', gap: 12 }}>
             <input
@@ -87,7 +122,7 @@ export function LegalConsentSheet({ open, onClose, onConfirm, busy = false, requ
               style={{ marginTop: 4, width: 16, height: 16 }}
             />
             <Text fontSize="$sm" color="#111827">
-              {t(
+              {copy?.checkboxWaiver ?? t(
                 'events.legalConsent.checkboxWaiver',
                 'I expressly request immediate provision of the digital service and understand my right of withdrawal expires once fulfilled.',
               )}

resources/js/admin/mobile/components/Primitives.tsx

@@ -73,16 +73,29 @@ export function CTAButton({
   onPress,
   tone = 'primary',
   fullWidth = true,
+  disabled = false,
+  loading = false,
 }: {
   label: string;
   onPress: () => void;
   tone?: 'primary' | 'ghost';
   fullWidth?: boolean;
+  disabled?: boolean;
+  loading?: boolean;
 }) {
   const theme = useTheme();
   const isPrimary = tone === 'primary';
+  const isDisabled = disabled || loading;
   return (
-    <Pressable onPress={onPress} style={{ width: fullWidth ? '100%' : undefined, flex: fullWidth ? undefined : 1 }}>
+    <Pressable
+      onPress={isDisabled ? undefined : onPress}
+      disabled={isDisabled}
+      style={{
+        width: fullWidth ? '100%' : undefined,
+        flex: fullWidth ? undefined : 1,
+        opacity: isDisabled ? 0.6 : 1,
+      }}
+    >
       <XStack
         height={56}
         borderRadius={14}