Passing server action prepare as prop

src/app/prep/page.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import Header from '@/components/common/Header';
 import PrepForm from '@/components/prep/PrepForm';
+import { prepareInterview } from '@/app/actions/prepare';
 
 const PrepPage = () => {
     return (
@@ -12,7 +13,7 @@ const PrepPage = () => {
                     Please upload your resume as a .pdf file and provide the company's website URL.
                 </p>
                 <div className="max-w-2xl lg:max-w-3xl mx-auto">
-                    <PrepForm />
+                    <PrepForm prepareInterview={prepareInterview} />
                 </div>
             </main>
         </div>

src/components/prep/PrepForm.tsx

@@ -2,12 +2,15 @@
 
 import React, { useState } from 'react';
 
-import { prepareInterview } from '@/app/actions/prepare';
 import CompanyNameInput from '@/components/prep/CompanyNameInput';
 import FileUpload from '@/components/prep/FileUpload';
 import SubmitButton from '@/components/prep/SubmitButton';
 
-const PrepForm = () => {
+interface PrepFormProps {
+    prepareInterview: (formData: FormData) => Promise<{ response: string }>;
+}
+
+const PrepForm: React.FC<PrepFormProps> = ({ prepareInterview }) => {
     const [companyName, setCompanyName] = useState('');
     const [file, setFile] = useState<File | null>(null);
     const [response, setResponse] = useState<string | null>(null);