diff --git a/src/app/[locale]/incident/components/IncidentDescriptionForm.tsx b/src/app/[locale]/incident/components/IncidentDescriptionForm.tsx
index e8f96f7..c799ff5 100644
--- a/src/app/[locale]/incident/components/IncidentDescriptionForm.tsx
+++ b/src/app/[locale]/incident/components/IncidentDescriptionForm.tsx
@@ -26,7 +26,6 @@ import {
ACCEPTED_IMAGE_TYPES,
FileUpload,
MAX_FILE_SIZE,
- MAX_NUMBER_FILES,
MIN_FILE_SIZE,
} from '@/components/ui/upload/FileUpload'
@@ -52,9 +51,6 @@ export const IncidentDescriptionForm = () => {
})
.refine((files) => files.every((file) => file.size >= MIN_FILE_SIZE), {
message: t('errors.file_size_too_small'),
- })
- .refine((files) => files.length <= MAX_NUMBER_FILES, {
- message: t('errors.file_limit_exceeded'), // Your error message here
}),
})
@@ -160,11 +156,12 @@ export const IncidentDescriptionForm = () => {
5. voeg preview toe aan summary [x]
6. check toetsenboard controls pt1.[x] pt2.[]
7. check overige toegankelijkheid []
- 8. op de een of andere manier worden de files niet goed bewaard bij een refresh []
- 9. op dit moment wordt de hele array vervangen []
+ 8. op de een of andere manier worden de files niet goed bewaard bij een refresh [x] --> weggoien
+ 9. op dit moment wordt de hele array vervangen [x]
10. ipv form naar upload component alleen een methode passen daarin de update uitvoeren -> makkelijker hergebruik
11. form validatie eerder triggeren []
12. verschillende screen sizes
+ 13. max 5 items en description aanpassen [x]
vraag:
- wat doen bij overschrijden max aantal files?
diff --git a/src/app/[locale]/incident/summary/components/IncidentSummaryForm.tsx b/src/app/[locale]/incident/summary/components/IncidentSummaryForm.tsx
index 92277fd..a68cfc4 100644
--- a/src/app/[locale]/incident/summary/components/IncidentSummaryForm.tsx
+++ b/src/app/[locale]/incident/summary/components/IncidentSummaryForm.tsx
@@ -61,14 +61,12 @@ const IncidentSummaryForm = () => {
if (formState.attachments.length > 0) {
const signalId = res.signal_id
if (signalId) {
- formState.attachments
- .slice(0, MAX_NUMBER_FILES)
- .forEach((attachment) => {
- const formData = new FormData()
- formData.append('signal_id', signalId)
- formData.append('file', attachment)
- postAttachments(signalId, formData)
- })
+ formState.attachments.forEach((attachment) => {
+ const formData = new FormData()
+ formData.append('signal_id', signalId)
+ formData.append('file', attachment)
+ postAttachments(signalId, formData)
+ })
}
}
})
@@ -178,7 +176,7 @@ export const IncidentSummaryFormAttachments = ({
{title}
- {attachments.slice(0, MAX_NUMBER_FILES).map((image, index) => (
+ {attachments.map((image, index) => (
))}
diff --git a/src/components/ui/upload/FileUpload.tsx b/src/components/ui/upload/FileUpload.tsx
index ad6e9af..23c986d 100644
--- a/src/components/ui/upload/FileUpload.tsx
+++ b/src/components/ui/upload/FileUpload.tsx
@@ -13,7 +13,7 @@ export const ACCEPTED_IMAGE_TYPES = [
export const MAX_FILE_SIZE = 20971520
export const MIN_FILE_SIZE = 30720
-export const MAX_NUMBER_FILES = 3
+export const MAX_NUMBER_FILES = 5
interface FormWithFiles extends FieldValues {
files: File[]
@@ -37,7 +37,10 @@ export const FileUpload = ({ form }: FileUploadProps) => {
const handleFileChange = (e: React.ChangeEvent
) => {
const files = e.target.files
if (files && files.length > 0) {
- const filesArray = Array.from(files)
+ const filesArray = form
+ .getValues('files')
+ .concat(Array.from(files))
+ .slice(0, MAX_NUMBER_FILES)
form.setValue('files', filesArray)
setNrOfFiles(filesArray.length)
}
diff --git a/src/components/ui/upload/PreviewFile.tsx b/src/components/ui/upload/PreviewFile.tsx
index a6a59dd..6abc874 100644
--- a/src/components/ui/upload/PreviewFile.tsx
+++ b/src/components/ui/upload/PreviewFile.tsx
@@ -10,7 +10,7 @@ type Props = {
const PreviewFile = ({ file, allowDelete = false, onDelete }: Props) => {
const [imageUrl, setImageUrl] = useState('')
- const t = useTranslations('general.button')
+ const t = useTranslations('general')
useEffect(() => {
const objectUrl = file['name'] ? URL.createObjectURL(file) : ''
@@ -21,11 +21,11 @@ const PreviewFile = ({ file, allowDelete = false, onDelete }: Props) => {
return (
-
+
{allowDelete && (