Fix company document removal in edit mode

src/components/forms/companies/documents/CompanyDocuments.tsx

@@ -8,9 +8,15 @@ interface IProps {
   companyId?: string;
   value: string[];
   onChange: (ids: string[]) => void;
+  onRemovePersist?: (ids: string[]) => Promise<void>;
 }
 
-const CompanyDocuments = ({ companyId, value, onChange }: IProps) => {
+const CompanyDocuments = ({
+  companyId,
+  value,
+  onChange,
+  onRemovePersist,
+}: IProps) => {
   const {
     isUploading,
     isBusy,
@@ -20,13 +26,18 @@ const CompanyDocuments = ({ companyId, value, onChange }: IProps) => {
     errorMessage,
     onSelectFiles,
     onRemove,
-  } = useCompanyDocumentsPresenter({ companyId, value, onChange });
+  } = useCompanyDocumentsPresenter({
+    companyId,
+    value,
+    onChange,
+    onRemovePersist,
+  });
 
   const inputId = "company-documents-input";
 
   return (
     <div className="flex flex-col gap-4">
-      <div className="relative overflow-hidden rounded-2xl border border-stroke/70 bg-gradient-to-br from-white via-white to-primary/[0.04] p-4 shadow-theme-xs dark:border-dark-3 dark:from-dark-2 dark:via-dark-2 dark:to-primary/[0.12]">
+      <div className="shadow-theme-xs relative overflow-hidden rounded-2xl border border-stroke/70 bg-gradient-to-br from-white via-white to-primary/[0.04] p-4 dark:border-dark-3 dark:from-dark-2 dark:via-dark-2 dark:to-primary/[0.12]">
         <input
           id={inputId}
           type="file"
@@ -45,8 +56,13 @@ const CompanyDocuments = ({ companyId, value, onChange }: IProps) => {
               : "cursor-pointer hover:-translate-y-0.5 hover:border-primary hover:bg-primary/[0.03] dark:hover:bg-primary/[0.08]"
           }`}
         >
-          <div className="mb-3 rounded-2xl bg-primary/[0.12] p-3 text-primary shadow-theme-xs transition-transform duration-300 group-hover:scale-105">
-            <svg className="h-6 w-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <div className="shadow-theme-xs mb-3 rounded-2xl bg-primary/[0.12] p-3 text-primary transition-transform duration-300 group-hover:scale-105">
+            <svg
+              className="h-6 w-6"
+              fill="none"
+              stroke="currentColor"
+              viewBox="0 0 24 24"
+            >
               <path
                 strokeLinecap="round"
                 strokeLinejoin="round"
@@ -80,7 +96,9 @@ const CompanyDocuments = ({ companyId, value, onChange }: IProps) => {
           </div>
         ) : removingFileId ? (
           <div className="mt-3">
-            <p className="text-xs font-medium text-primary">Removing document…</p>
+            <p className="text-xs font-medium text-primary">
+              Removing document…
+            </p>
             <div className="mt-1.5 h-1.5 w-full overflow-hidden rounded-full bg-gray-2 dark:bg-dark-3">
               <div className="h-full w-full animate-pulse rounded-full bg-gradient-to-r from-primary to-purple-500" />
             </div>
@@ -115,8 +133,12 @@ const CompanyDocuments = ({ companyId, value, onChange }: IProps) => {
           </p>
           <ul className="space-y-1">
             {failed.map((item, index) => (
-              <li key={`${item.filename}-${index}`} className="text-sm text-error">
-                <span className="font-medium">{item.filename}</span>: {item.error}
+              <li
+                key={`${item.filename}-${index}`}
+                className="text-sm text-error"
+              >
+                <span className="font-medium">{item.filename}</span>:{" "}
+                {item.error}
               </li>
             ))}
           </ul>