mirror of
https://github.com/Tria-plc/edr-platform.git
synced 2026-08-26 18:42:49 +00:00
fix: document uploaded
This commit is contained in:
@@ -1,4 +1,16 @@
|
|||||||
import { useState } from "react";
|
import { api } from "@/services/api";
|
||||||
|
import { companiesService } from "@/services/companies.service";
|
||||||
|
import { getMinFiles } from "@/types/fileUploadSettings";
|
||||||
|
import type { ProfileResponse } from "@/types/profile";
|
||||||
|
import { SmartFileInput } from "@edr/ui-common";
|
||||||
|
import {
|
||||||
|
Button,
|
||||||
|
Card,
|
||||||
|
Center,
|
||||||
|
Group,
|
||||||
|
Text,
|
||||||
|
Title,
|
||||||
|
} from "@mantine/core";
|
||||||
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
|
||||||
import {
|
import {
|
||||||
ArrowRight,
|
ArrowRight,
|
||||||
@@ -8,18 +20,7 @@ import {
|
|||||||
UploadCloud,
|
UploadCloud,
|
||||||
XCircle,
|
XCircle,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import {
|
import { useState } from "react";
|
||||||
Card,
|
|
||||||
Group,
|
|
||||||
Title,
|
|
||||||
Text,
|
|
||||||
Button,
|
|
||||||
Center,
|
|
||||||
} from "@mantine/core";
|
|
||||||
import { api } from "@/services/api";
|
|
||||||
import { companiesService } from "@/services/companies.service";
|
|
||||||
import { SmartFileInput } from "@edr/ui-common";
|
|
||||||
import type { ProfileResponse } from "@/types/profile";
|
|
||||||
|
|
||||||
interface TabDocumentsProps {
|
interface TabDocumentsProps {
|
||||||
profile: ProfileResponse;
|
profile: ProfileResponse;
|
||||||
@@ -45,6 +46,42 @@ export default function TabDocuments({ profile, mode = "edit", onContinue }: Tab
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const [fieldErrors, setFieldErrors] = useState<Record<string, string>>({});
|
||||||
|
|
||||||
|
const handleFilesChange = (next: Record<string, File | File[] | null>) => {
|
||||||
|
setDocumentFiles(next);
|
||||||
|
// Clear required-field errors for any field that now has a file.
|
||||||
|
setFieldErrors((prev) => {
|
||||||
|
if (Object.keys(prev).length === 0) return prev;
|
||||||
|
const updated = { ...prev };
|
||||||
|
for (const key of Object.keys(updated)) {
|
||||||
|
const v = next[key];
|
||||||
|
const hasValue = Array.isArray(v) ? v.length > 0 : v != null;
|
||||||
|
if (hasValue) delete updated[key];
|
||||||
|
}
|
||||||
|
return updated;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
// Array-aware: an emptied multi-file field is `[]`, which must not count.
|
||||||
|
const hasFiles = Object.values(documentFiles).some((f) =>
|
||||||
|
Array.isArray(f) ? f.length > 0 : f != null,
|
||||||
|
);
|
||||||
|
|
||||||
|
const validateRequired = (): Record<string, string> => {
|
||||||
|
const errs: Record<string, string> = {};
|
||||||
|
for (const field of docSettingQuery.data?.fields ?? []) {
|
||||||
|
const min = getMinFiles(field);
|
||||||
|
if (min <= 0) continue;
|
||||||
|
const v = documentFiles[field.fileKey];
|
||||||
|
const count = Array.isArray(v) ? v.length : v ? 1 : 0;
|
||||||
|
if (count < min) {
|
||||||
|
errs[field.fileKey] = `${field.fileLabel} is required`;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return errs;
|
||||||
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Card padding="lg">
|
<Card padding="lg">
|
||||||
<Group gap="sm" mb="xs">
|
<Group gap="sm" mb="xs">
|
||||||
@@ -67,7 +104,8 @@ export default function TabDocuments({ profile, mode = "edit", onContinue }: Tab
|
|||||||
<SmartFileInput
|
<SmartFileInput
|
||||||
file={docSettingQuery.data}
|
file={docSettingQuery.data}
|
||||||
value={documentFiles}
|
value={documentFiles}
|
||||||
onChange={setDocumentFiles}
|
onChange={handleFilesChange}
|
||||||
|
errors={fieldErrors}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
@@ -100,13 +138,14 @@ export default function TabDocuments({ profile, mode = "edit", onContinue }: Tab
|
|||||||
leftSection={<ArrowRight size={16} />}
|
leftSection={<ArrowRight size={16} />}
|
||||||
loading={docUploadMutation.isPending}
|
loading={docUploadMutation.isPending}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
const hasFiles = Object.values(documentFiles).some((f) => f !== null);
|
const validationErrors = validateRequired();
|
||||||
|
if (Object.keys(validationErrors).length > 0) {
|
||||||
|
setFieldErrors(validationErrors);
|
||||||
|
return;
|
||||||
|
}
|
||||||
if (hasFiles) {
|
if (hasFiles) {
|
||||||
docUploadMutation.mutate(documentFiles, {
|
docUploadMutation.mutate(documentFiles, {
|
||||||
onSuccess: () => {
|
onSuccess: () => onContinue?.(),
|
||||||
queryClient.invalidateQueries({ queryKey: api.companies.getProfile.queryKey() });
|
|
||||||
onContinue?.();
|
|
||||||
},
|
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
onContinue?.();
|
onContinue?.();
|
||||||
@@ -120,7 +159,11 @@ export default function TabDocuments({ profile, mode = "edit", onContinue }: Tab
|
|||||||
type="button"
|
type="button"
|
||||||
leftSection={<UploadCloud size={16} />}
|
leftSection={<UploadCloud size={16} />}
|
||||||
loading={docUploadMutation.isPending}
|
loading={docUploadMutation.isPending}
|
||||||
onClick={() => docUploadMutation.mutate(documentFiles)}
|
disabled={!hasFiles}
|
||||||
|
onClick={() => {
|
||||||
|
if (!hasFiles) return;
|
||||||
|
docUploadMutation.mutate(documentFiles);
|
||||||
|
}}
|
||||||
>
|
>
|
||||||
Upload Documents
|
Upload Documents
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
Reference in New Issue
Block a user