From d43e731fe191d7e35d96847fe095c94555dd8ca6 Mon Sep 17 00:00:00 2001
From: Sebastien Castiel <sebastien@castiel.me>
Date: Sun, 28 Jan 2024 18:51:29 -0500
Subject: Attach documents to expenses (#64)

* Upload documents to receipts

* Improve documents

* Make the feature opt-in

* Fix file name issue
---
 src/components/expense-form.tsx | 29 +++++++++++++++++++++++++++++
 1 file changed, 29 insertions(+)

(limited to 'src/components/expense-form.tsx')

diff --git a/src/components/expense-form.tsx b/src/components/expense-form.tsx
index 92e24d0..a847949 100644
--- a/src/components/expense-form.tsx
+++ b/src/components/expense-form.tsx
@@ -1,6 +1,7 @@
 'use client'
 import { AsyncButton } from '@/components/async-button'
 import { CategorySelector } from '@/components/category-selector'
+import { ExpenseDocumentsInput } from '@/components/expense-documents-input'
 import { SubmitButton } from '@/components/submit-button'
 import { Button } from '@/components/ui/button'
 import {
@@ -83,6 +84,7 @@ export function ExpenseForm({
           })),
           splitMode: expense.splitMode,
           isReimbursement: expense.isReimbursement,
+          documents: expense.documents,
         }
       : searchParams.get('reimbursement')
       ? {
@@ -100,6 +102,7 @@ export function ExpenseForm({
           ],
           isReimbursement: true,
           splitMode: 'EVENLY',
+          documents: [],
         }
       : {
           title: '',
@@ -114,6 +117,7 @@ export function ExpenseForm({
           paidBy: getSelectedPayer(),
           isReimbursement: false,
           splitMode: 'EVENLY',
+          documents: [],
         },
   })
 
@@ -506,6 +510,31 @@ export function ExpenseForm({
           </CardContent>
         </Card>
 
+        {process.env.NEXT_PUBLIC_ENABLE_EXPENSE_DOCUMENTS && (
+          <Card className="mt-4">
+            <CardHeader>
+              <CardTitle className="flex justify-between">
+                <span>Attach documents</span>
+              </CardTitle>
+              <CardDescription>
+                See and attach receipts to the expense.
+              </CardDescription>
+            </CardHeader>
+            <CardContent>
+              <FormField
+                control={form.control}
+                name="documents"
+                render={({ field }) => (
+                  <ExpenseDocumentsInput
+                    documents={field.value}
+                    updateDocuments={field.onChange}
+                  />
+                )}
+              />
+            </CardContent>
+          </Card>
+        )}
+
         <div className="flex mt-4 gap-2">
           <SubmitButton
             loadingContent={isCreate ? <>Creating…</> : <>Saving…</>}
-- 
cgit v1.3

