From c183cac5415d290ba2e6eb457a317e6d6b19d8d9 Mon Sep 17 00:00:00 2001
From: Jeroen Branje <info@jeroenbranje.nl>
Date: Mon, 26 Feb 2024 15:40:20 +0100
Subject: [PATCH] feat(envited.ascs.digital): Add file input field

Signed-off-by: Jeroen Branje <info@jeroenbranje.nl>
---
 .../modules/Profile/Profile.tsx               | 29 ++++++++++++++++++-
 1 file changed, 28 insertions(+), 1 deletion(-)

diff --git a/apps/envited.ascs.digital/modules/Profile/Profile.tsx b/apps/envited.ascs.digital/modules/Profile/Profile.tsx
index b63741da..95abfdde 100644
--- a/apps/envited.ascs.digital/modules/Profile/Profile.tsx
+++ b/apps/envited.ascs.digital/modules/Profile/Profile.tsx
@@ -1,6 +1,14 @@
 'use client'
 
-import { Card, Checkbox, Checkboxes, Heading, TextField, TextareaField } from '@envited-marketplace/design-system'
+import {
+  Card,
+  Checkbox,
+  Checkboxes,
+  FileField,
+  Heading,
+  TextField,
+  TextareaField,
+} from '@envited-marketplace/design-system'
 import { zodResolver } from '@hookform/resolvers/zod'
 import { append, equals, includes, pathOr, prop, propOr, reject } from 'ramda'
 import { FC } from 'react'
@@ -21,6 +29,7 @@ type ProfileInputs = {
   name: string
   description: string
   logo: string
+  file: any
   streetAddress: string
   postalCode: string
   addressLocality: string
@@ -159,6 +168,24 @@ export const Profile: FC<ProfileProps> = ({ profile, memberCategories }) => {
                     />
                   )}
                 />
+                <Controller
+                  name="file"
+                  control={control}
+                  render={({ field: { ref, onChange, value, ...field } }) => (
+                    <FileField
+                      label="File"
+                      {...field}
+                      inputRef={ref}
+                      value={value?.name}
+                      onChange={event => {
+                        if (event.target.files) {
+                          onChange(event.target.files?.[0])
+                        }
+                      }}
+                      error={pathOr('', ['file', 'message'])(errors)}
+                    />
+                  )}
+                />
               </div>
 
               <div className="sm:col-span-full">