fix(Assets): manual author entry

LibreTexts · Sep 4, 2024 · ccdaae4 · ccdaae4
1 parent 1a6ab59
commit ccdaae4
Show file tree

Hide file tree

Showing 5 changed files with 43 additions and 28 deletions.
diff --git a/client/src/components/FilesManager/AuthorsForm.tsx b/client/src/components/FilesManager/AuthorsForm.tsx
@@ -12,6 +12,7 @@ import useDebounce from "../../hooks/useDebounce";
 import api from "../../api";
 import { ProjectFileAuthor } from "../../types/Project";
 import ManualEntryModal from "../util/ManualEntryModal";
+import { useModals } from "../../context/ModalContext";
 
 interface AuthorsFormProps {
   mode: "project-default" | "file";
@@ -39,6 +40,7 @@ const AuthorsForm = forwardRef(
 
     const { handleGlobalError } = useGlobalError();
     const { debounce } = useDebounce();
+    const { openModal, closeAllModals } = useModals();
 
     const [authorOptions, setAuthorOptions] = useState<ProjectFileAuthor[]>([]);
     const [secondaryAuthorOptions, setSecondaryAuthorOptions] = useState<
@@ -52,10 +54,6 @@ const AuthorsForm = forwardRef(
       useState(false);
     const [loadingCorrespondingAuthors, setLoadingCorrespondingAuthors] =
       useState(false);
-    const [showNewAuthorModal, setShowNewAuthorModal] = useState(false);
-    const [manualEntryLocation, setManualEntryLocation] = useState<
-      "primary" | "secondary" | "corresponding"
-    >("primary");
 
     const [selectedPrimary, setSelectedPrimary] =
       useState<ProjectFileAuthor | null>(currentPrimaryAuthor ?? null);
@@ -202,24 +200,32 @@ const AuthorsForm = forwardRef(
       200
     );
 
-    const handleAddAuthor = (newAuthor: Author) => {
-      setAuthorOptions([...authorOptions, newAuthor]);
+    const handleAddAuthor = (newAuthor: Author, ctx: string) => {
+      if (!["primary", "secondary", "corresponding"].includes(ctx)) return;
+
+      const withID = {
+        ...newAuthor,
+        _id: crypto.randomUUID(),
+      }
 
       // Set the manually added author as the primary or secondary author
       // based on where the manual entry was triggered
-      if (manualEntryLocation === "primary") {
-        setSelectedPrimary(newAuthor);
+      if (ctx === "primary") {
+        setSelectedPrimary(withID);
+        setAuthorOptions([...authorOptions, withID]);
       }
 
-      if (manualEntryLocation === "corresponding") {
-        setSelectedCorresponding(newAuthor);
+      if (ctx === "corresponding") {
+        setSelectedCorresponding(withID);
+        setCorrespondingAuthorOptions([...correspondingAuthorOptions, withID]);
       }
 
-      if (manualEntryLocation === "secondary") {
+      if (ctx === "secondary") {
+        setSecondaryAuthorOptions([...secondaryAuthorOptions, withID]);
         if (currentAuthors) {
-          setSelectedSecondary([...currentAuthors, newAuthor]);
+          setSelectedSecondary([...currentAuthors, withID]);
         } else {
-          setSelectedSecondary([newAuthor]);
+          setSelectedSecondary([withID]);
         }
       }
     };
@@ -232,8 +238,17 @@ const AuthorsForm = forwardRef(
       <div className="flex justify-end">
         <Button
           onClick={() => {
-            setManualEntryLocation(from);
-            setShowNewAuthorModal(true);
+            openModal(
+              <ManualEntryModal
+                show={true}
+                onClose={() => closeAllModals()}
+                onSaved={(author, ctx) => {
+                  handleAddAuthor(author, ctx);
+                  closeAllModals();
+                }}
+                ctx={from}
+              />
+            )
           }}
           basic
           size="mini"
@@ -363,7 +378,7 @@ const AuthorsForm = forwardRef(
               loading={loadingCorrespondingAuthors}
             />
           </Form.Field>
-          <ManualEntryButton from="primary" />
+          <ManualEntryButton from="corresponding" />
         </div>
         <div>
           <Form.Field className="flex flex-col">
@@ -404,14 +419,6 @@ const AuthorsForm = forwardRef(
           </Form.Field>
           <ManualEntryButton from="secondary" />
         </div>
-        <ManualEntryModal
-          show={showNewAuthorModal}
-          onClose={() => setShowNewAuthorModal(false)}
-          onSaved={(author) => {
-            handleAddAuthor(author);
-            setShowNewAuthorModal(false);
-          }}
-        />
       </>
     );
   }

diff --git a/client/src/components/FilesManager/FilesManager.tsx b/client/src/components/FilesManager/FilesManager.tsx
@@ -561,7 +561,7 @@ const FilesManager: React.FC<FilesManagerProps> = ({
 
   const MobileTableRow = (item: FileEntry) => {
     return (
-      <Table.Row>
+      <Table.Row key={item.fileID}>
         <Table.Cell colSpan={TABLE_COLS.length}>
           <div className="flex flex-row w-full">
             <div className="flex flex-col w-full">

diff --git a/client/src/components/FilesManager/RenderAssetTags.tsx b/client/src/components/FilesManager/RenderAssetTags.tsx
@@ -207,6 +207,7 @@ const RenderAssetTags: React.FC<{
                     size="small"
                     value={t.text}
                     blackText={false}
+                    key={crypto.randomUUID()}
                   />
                 );
               })}
@@ -216,6 +217,7 @@ const RenderAssetTags: React.FC<{
                 size="small"
                 value={text}
                 blackText={false}
+                key={crypto.randomUUID()}
               />
             )}
             {!text && "No value provided"}

diff --git a/client/src/components/util/ManualEntryModal.tsx b/client/src/components/util/ManualEntryModal.tsx
@@ -8,13 +8,15 @@ import api from "../../api";
 interface ManualEntryModalProps {
   show: boolean;
   onClose: () => void;
-  onSaved: (author: Author) => void;
+  onSaved: (author: Author, ctx: string) => void;
+  ctx: string;
 }
 
 const ManualEntryModal: React.FC<ManualEntryModalProps> = ({
   show,
   onClose,
   onSaved,
+  ctx
 }) => {
   const { handleGlobalError } = useGlobalError();
   const { debounce } = useDebounce();
@@ -225,7 +227,7 @@ const ManualEntryModal: React.FC<ManualEntryModalProps> = ({
         </Button>
         <Button
           onClick={() => {
-            onSaved(newAuthor);
+            onSaved(newAuthor, ctx);
             clearNewAuthor();
           }}
           color="blue"

diff --git a/server/api/projectfiles.ts b/server/api/projectfiles.ts
@@ -1591,6 +1591,7 @@ async function _parseAndSaveAuthors(
     const _parsed: any[] = [];
 
     for (const author of authors) {
+      // If author is a valid ObjectId add to parsed and continue
       if (typeof author === "string" && isObjectIdOrHexString(author)) {
         _parsed.push(new Types.ObjectId(author));
         continue;
@@ -1622,8 +1623,11 @@ async function _parseAndSaveAuthors(
         continue;
       }
 
+      // If author is new author, it was likely sent with an arbitrary _id for UI, remove it before saving
+      // @ts-ignore
+      const {_id, ...authorData} = author;
       const newAuthor = await Author.create({
-        ...author,
+        ...authorData,
         orgID: process.env.ORG_ID,
       });
       _parsed.push(new Types.ObjectId(newAuthor._id));