Files
fotospiel-app/resources/js/pages/legal/Show.tsx
Codex Agent 42b4b647d7 • Added the two‑step Widerruf flow with an auth‑only CTA on the Widerrufsbelehrung page and a dedicated confirmation
screen where users pick an eligible end‑customer purchase and confirm. Eligibility is enforced server‑side
  (endcustomer_event, within 14 days, no event package created after purchase), refund is issued via Paddle, the
  purchase is marked refunded, the tenant package is deactivated, and a new confirmation email is sent using resources/
  views/emails/partials/layout.blade.php.

  Details

  - New controller + form request for the confirm flow: app/Http/Controllers/WithdrawalController.php, app/Http/
    Requests/Marketing/WithdrawalConfirmRequest.php
  - New confirmation page + CTA: resources/js/pages/marketing/WithdrawalConfirm.tsx, resources/js/pages/legal/Show.tsx
  - Routes + locale rewrites: routes/web.php, resources/js/lib/localizedPath.ts
  - New email notification + template: app/Notifications/Customer/WithdrawalConfirmed.php, resources/views/emails/
    withdrawal-confirmation.blade.php
  - Translations added for marketing UI + backend flash + email copy: public/lang/de/marketing.json, public/lang/en/
    marketing.json, resources/lang/de/marketing.php, resources/lang/en/marketing.php, resources/lang/de/emails.php,
    resources/lang/en/emails.php
  - Tests: tests/Feature/Marketing/WithdrawalConfirmationTest.php
2025-12-24 11:54:15 +01:00

73 lines
2.6 KiB
TypeScript

import React from 'react';
import { Link, usePage } from '@inertiajs/react';
import { useTranslation } from 'react-i18next';
import MarketingLayout from '@/layouts/mainWebsite';
import { useLocalizedRoutes } from '@/hooks/useLocalizedRoutes';
type LegalShowProps = {
seoTitle: string;
title: string;
content: string;
effectiveFrom?: string | null;
effectiveFromLabel?: string | null;
versionLabel?: string | null;
slug: string;
};
const LegalShow: React.FC<LegalShowProps> = (props) => {
const { seoTitle, title, content, effectiveFromLabel, versionLabel, slug } = props;
const { t } = useTranslation('marketing');
const { localizedPath } = useLocalizedRoutes();
const { auth } = usePage<{ auth?: { user?: { id?: number } | null } }>().props;
const showWithdrawalAction = slug === 'widerrufsbelehrung' && Boolean(auth?.user);
return (
<MarketingLayout title={seoTitle}>
<section className="bg-white py-16">
<div className="mx-auto max-w-4xl px-6">
<header className="mb-10">
<p className="text-sm uppercase tracking-[0.2em] text-gray-400">
Fotospiel App
</p>
<h1 className="mt-2 text-3xl font-semibold text-gray-900 md:text-4xl">
{title}
</h1>
{(effectiveFromLabel || versionLabel) && (
<p className="mt-3 text-sm text-gray-500">
{[effectiveFromLabel, versionLabel].filter(Boolean).join(' · ')}
</p>
)}
</header>
{showWithdrawalAction && (
<div className="mb-10 rounded-2xl border border-pink-200/60 bg-pink-50 p-6">
<h2 className="text-lg font-semibold text-gray-900">
{t('withdrawal.cta_title')}
</h2>
<p className="mt-2 text-sm text-gray-600">
{t('withdrawal.cta_body')}
</p>
<Link
href={localizedPath('/widerruf')}
className="mt-4 inline-flex items-center justify-center rounded-full bg-gray-900 px-5 py-2 text-sm font-semibold text-white transition hover:bg-gray-800 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-900"
>
{t('withdrawal.cta_button')}
</Link>
</div>
)}
<article
className="prose prose-slate max-w-none prose-headings:font-display"
dangerouslySetInnerHTML={{ __html: content }}
/>
</div>
</section>
</MarketingLayout>
);
};
LegalShow.layout = (page: React.ReactNode) => page;
export default LegalShow;