From 0e62b7c2fdcbe9c7458713499665c022b1c0ad48 Mon Sep 17 00:00:00 2001
From: Markus Thielker <mail.markus.thielker@gmail.com>
Date: Sun, 17 Mar 2024 17:20:00 +0100
Subject: [PATCH] N-FIN-47: replace buttons with new component

---
 src/app/account/page.tsx                      | 32 +++++++++++--------
 .../form/generateSampleDataForm.tsx           | 23 -------------
 src/components/form/signOutForm.tsx           | 25 ---------------
 3 files changed, 18 insertions(+), 62 deletions(-)
 delete mode 100644 src/components/form/generateSampleDataForm.tsx
 delete mode 100644 src/components/form/signOutForm.tsx

diff --git a/src/app/account/page.tsx b/src/app/account/page.tsx
index dbec318..d16a9aa 100644
--- a/src/app/account/page.tsx
+++ b/src/app/account/page.tsx
@@ -5,11 +5,10 @@ import { redirect } from 'next/navigation';
 import signOut from '@/lib/actions/signOut';
 import { Label } from '@/components/ui/label';
 import { Input } from '@/components/ui/input';
-import SignOutForm from '@/components/form/signOutForm';
 import { URL_SIGN_IN } from '@/lib/constants';
-import GenerateSampleDataForm from '@/components/form/generateSampleDataForm';
 import generateSampleData from '@/lib/actions/generateSampleData';
 import { prismaClient } from '@/prisma';
+import { ServerActionTrigger } from '@/components/form/serverActionTrigger';
 
 export default async function AccountPage() {
 
@@ -81,18 +80,23 @@ export default async function AccountPage() {
                         </div>
                     </div>
                 </CardContent>
-                {
-                    process.env.NODE_ENV === 'development' ? (
-                        <CardFooter className="grid gap-4 grid-cols-1 md:grid-cols-2">
-                            <GenerateSampleDataForm onSubmit={generateSampleData}/>
-                            <SignOutForm onSubmit={signOut}/>
-                        </CardFooter>
-                    ) : (
-                        <CardFooter>
-                            <SignOutForm onSubmit={signOut}/>
-                        </CardFooter>
-                    )
-                }
+                <CardFooter className="w-full grid gap-4 grid-cols-1 md:grid-cols-2">
+                    <ServerActionTrigger
+                        className="col-span-2"
+                        action={signOut}>
+                        Sign Out
+                    </ServerActionTrigger>
+                    {
+                        process.env.NODE_ENV === 'development' && (
+                            <ServerActionTrigger
+                                variant="outline"
+                                className="col-span-2"
+                                action={generateSampleData}>
+                                Generate sample data
+                            </ServerActionTrigger>
+                        )
+                    }
+                </CardFooter>
             </Card>
             <div className="flex w-full items-center justify-between max-w-md mt-2 text-neutral-600">
                 <p>Version {process.env.appVersion}</p>
diff --git a/src/components/form/generateSampleDataForm.tsx b/src/components/form/generateSampleDataForm.tsx
deleted file mode 100644
index c8677be..0000000
--- a/src/components/form/generateSampleDataForm.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-'use client';
-
-import { Button } from '@/components/ui/button';
-import React from 'react';
-import { useRouter } from 'next/navigation';
-import { toast } from 'sonner';
-import { sonnerContent } from '@/components/ui/sonner';
-import { ActionResponse } from '@/lib/types/actionResponse';
-
-export default function GenerateSampleDataForm({onSubmit}: { onSubmit: () => Promise<ActionResponse> }) {
-
-    const router = useRouter();
-
-    const handleSubmit = async () => {
-        const response = await onSubmit();
-        toast(sonnerContent(response));
-        router.refresh();
-    };
-
-    return (
-        <Button className="w-full" variant="outline" onClick={handleSubmit}>Generate sample data</Button>
-    );
-}
diff --git a/src/components/form/signOutForm.tsx b/src/components/form/signOutForm.tsx
deleted file mode 100644
index 9dd51fe..0000000
--- a/src/components/form/signOutForm.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-'use client';
-
-import { ActionResponse } from '@/lib/types/actionResponse';
-import { Button } from '@/components/ui/button';
-import React from 'react';
-import { useRouter } from 'next/navigation';
-import { toast } from 'sonner';
-import { sonnerContent } from '@/components/ui/sonner';
-
-export default function SignOutForm({onSubmit}: { onSubmit: () => Promise<ActionResponse> }) {
-
-    const router = useRouter();
-
-    const handleSignOut = async () => {
-        const response = await onSubmit();
-        toast(sonnerContent(response));
-        if (response.redirect) {
-            router.push(response.redirect);
-        }
-    };
-
-    return (
-        <Button className="w-full" onClick={handleSignOut}>Sign out</Button>
-    );
-}