fix: email address as property

src/app/(home)/kontakt/page.tsx

@@ -49,6 +49,7 @@ export default function ContactPage() {
       <ContactSection
         title={"Kontaktformular"}
         description={"Füllen Sie einfach unser Kontaktformular aus und wir werden uns umgehend mit Ihnen in Verbindung setzen. Oder senden Sie uns eine Nachricht auf kontakt@dreikoenige.berlin"}
+        toEmail={"kontakt@dreikoenige.berlin"}
       />
     </>
   )

src/app/(home)/mithelfen/kleinanzeigen/page.tsx

@@ -40,7 +40,9 @@ export default function Page() {
       <ContactSection
         backgroundColor={'off-white'}
         title={'Noch Fragen?'}
-        description={'Wir sind für dich da! Wenn du noch offene Fragen hast oder mehr über unsere ehrenamtlichen Möglichkeiten erfahren möchtest, schreib uns einfach. Wir freuen uns darauf, von dir zu hören!'} />
+        description={'Wir sind für dich da! Wenn du noch offene Fragen hast oder mehr über unsere ehrenamtlichen Möglichkeiten erfahren möchtest, schreib uns einfach. Wir freuen uns darauf, von dir zu hören!'}
+        toEmail={"kontakt@dreikoenige.berlin"}
+        />
     </>
   )
 }

src/app/(home)/neu-in-der-gemeinde/page.tsx

@@ -55,6 +55,7 @@ export default function Page() {
         backgroundColor={'off-white'}
         title={'Mehr wissen?'}
         description={'Zögern Sie nicht und nehmen Sie Kontakt mit uns auf! Wir freuen uns über Ihre Nachricht und sind gerne für Sie da. Füllen Sie einfach das Formular aus und wir melden uns schnellstmöglich bei Ihnen zurück.'}
+        toEmail={"kontakt@dreikoenige.berlin"}
       />
     </>
   )

src/app/(home)/sakramente/ehe/page.tsx

@@ -56,6 +56,7 @@ export default function MarriagePage() {
         backgroundColor={"off-white"}
         title={"Bei uns heiraten?"}
         description={"Gerne!  Wir freuen uns, wenn Sie sich für den Bund der Ehe entscheiden.  Der Sakrament der Ehe ist ein besonderes Zeichen der Liebe Gottes und  die Kirche bietet Ihnen einen feierlichen und würdevollen Rahmen, um sich  das Ja-Wort zu geben.  Sprechen Sie uns an, wir begleiten Sie gerne bei den Vorbereitungen und gestalten mit Ihnen einen unvergesslichen Traugottesdienst."}
+        toEmail={"kontakt@dreikoenige.berlin"}
       />
     </>
   )

src/app/(home)/sakramente/taufe/page.tsx

@@ -66,6 +66,7 @@ export default function BaptismPage() {
         backgroundColor={"off-white"}
         title={'Wagst du den Schritt?'}
         description={'Vielleicht hast du schon lange mit dem Gedanken gespielt, dich taufen zu lassen. Oder die Frage taucht gerade zum ersten Mal in dir auf. Egal, wo du stehst: Die Taufe ist ein Angebot, eine Einladung. Eine Einladung, Teil der großen Familie der Christen zu werden, Gottes Liebe zu erfahren und deinen Glauben gemeinsam mit anderen zu leben. Nimm Kontakt mit uns auf für ein Gespräch!'}
+        toEmail={"kontakt@dreikoenige.berlin"}
       />
     </>
   )

src/compositions/Blocks/Blocks.tsx

@@ -47,6 +47,7 @@ export function Blocks({ content }: BlocksProps) {
                 key={item.id}
                 title={item.title}
                 description={item.description}
+                toEmail={item.email}
                 backgroundColor={"off-white"}
               />
             )

src/compositions/ContactForm/ContactForm.stories.tsx

@@ -10,12 +10,14 @@ export default meta
 
 export const Default: Story = {
   args: {
-    schema: 'base'
+    schema: 'base',
+    toEmail: 'test@test.com'
   },
 }
 
 export const Schema: Story = {
   args: {
-    schema: 'contrast'
+    schema: 'contrast',
+    toEmail: 'test@test.com'
   }
 }

src/compositions/ContactForm/ContactForm.tsx

@@ -8,16 +8,18 @@ import { send } from '@/utils/actions'
 import { useActionState } from 'react'
 
 type ContactFormProps = {
-  schema?: "base" | "contrast"
+  schema?: "base" | "contrast",
+  toEmail: string
 }
 
 const initialState = {
   message: '',
 }
 
-export const ContactForm = ({schema}: ContactFormProps) => {
+export const ContactForm = ({schema, toEmail}: ContactFormProps) => {
 
-  const [state, formAction, pending] = useActionState(send, initialState)
+  const sendWithEmail = send.bind(null, toEmail);
+  const [state, formAction, pending] = useActionState(sendWithEmail, initialState)
 
   return (
     <form action={formAction}>

src/compositions/ContactSection/ContactSection.stories.tsx

@@ -11,6 +11,7 @@ export default meta
 export const Default: Story = {
   args: {
     title: "Kontakt",
-    description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vel dolor semper, consectetur augue quis, elementum tellus. Nulla ut porta lorem. Nulla posuere quam nisi, ut porttitor diam dignissim eget. Morbi imperdiet et lectus quis dapibus. Cras sollicitudin est augue, vel rhoncus massa elementum vitae. Donec sagittis pulvinar nibh ultrices tincidunt. Interdum et malesuada fames ac ante ipsum primis in faucibus.'
+    description: 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce vel dolor semper, consectetur augue quis, elementum tellus. Nulla ut porta lorem. Nulla posuere quam nisi, ut porttitor diam dignissim eget. Morbi imperdiet et lectus quis dapibus. Cras sollicitudin est augue, vel rhoncus massa elementum vitae. Donec sagittis pulvinar nibh ultrices tincidunt. Interdum et malesuada fames ac ante ipsum primis in faucibus.',
+    toEmail: 'kontak@test.com'
   },
 }

src/compositions/ContactSection/ContactSection.tsx

@@ -11,10 +11,11 @@ type ContactSectionProps = {
   description: string,
   backgroundColor?: 'off-white'
   schema?: 'base' | 'contrast'
+  toEmail: string
 }
 
 
-export const ContactSection = ({title, description, schema, backgroundColor}: ContactSectionProps) => {
+export const ContactSection = ({title, description, schema, backgroundColor, toEmail}: ContactSectionProps) => {
   return (
     <Section backgroundColor={backgroundColor}>
       <Container>
@@ -24,7 +25,7 @@ export const ContactSection = ({title, description, schema, backgroundColor}: Co
             <TextDiv text={description} />
           </Col>
           <Col>
-            <ContactForm schema={schema}/>
+            <ContactForm schema={schema} toEmail={toEmail}/>
           </Col>
         </Row>
       </Container>

src/pageComponents/Home/Home.tsx

@@ -188,6 +188,7 @@ export const Home = ({
           '\n' +
           'Zögern Sie nicht, uns über das Kontaktformular zu schreiben.  Wir freuen uns über jede Nachricht und sind gerne für Sie da.'}
         schema={"base"}
+        toEmail={"kontakt@dreikoenige.berlin"}
       />
     </>
 

src/utils/actions.ts

@@ -7,10 +7,11 @@ import { isSpam } from '@/utils/detectSpam'
 /**
  * Send email through Resend API
  *
+ * @param toEmail
  * @param prevState
  * @param formData
  */
-export async function send(prevState: any, formData: FormData) {
+export async function send(toEmail: string, prevState: any, formData: FormData) {
 
   const schema = z.object({
     email: z.string().email(),
@@ -44,7 +45,7 @@ export async function send(prevState: any, formData: FormData) {
     const resp = await resend.emails.send({
       from: 'noreply@dreikoenige.berlin',
       replyTo: validatedFields.data.email,
-      to: 'kontakt@dreikoenige.berlin',
+      to: toEmail,
       subject: `Über Kontaktformular: ${validatedFields.data.subject}`,
       text: `Nachricht von ${validatedFields.data.name} (${validatedFields.data.email}): \n\n ${validatedFields.data.message}`
     });