refactor: excel cleanup (#734)

* refactor: remove import of project data from excel

apps/client/src/features/modals/sheets-modal/SheetsModal.tsx

@@ -17,10 +17,10 @@ import {
   Select,
 } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
-import { OntimeRundown, ProjectData, UserFields } from 'ontime-types';
+import { OntimeRundown, UserFields } from 'ontime-types';
 import { defaultExcelImportMap, ExcelImportMap } from 'ontime-utils';
 
-import { PROJECT_DATA, RUNDOWN, USERFIELDS } from '../../../common/api/apiConstants';
+import { RUNDOWN, USERFIELDS } from '../../../common/api/apiConstants';
 import { maybeAxiosError } from '../../../common/api/apiUtils';
 import {
   getAuthentication,
@@ -33,7 +33,6 @@ import {
   postWorksheet,
   uploadSheetClientFile,
 } from '../../../common/api/ontimeApi';
-import { projectDataPlaceholder } from '../../../common/models/ProjectData';
 import { userFieldsPlaceholder } from '../../../common/models/UserFields';
 import { openLink } from '../../../common/utils/linkUtils';
 import ModalLink from '../ModalLink';
@@ -54,7 +53,6 @@ export default function SheetsModal(props: SheetsModalProps) {
 
   const [rundown, setRundown] = useState<OntimeRundown | null>(null);
   const [userFields, setUserFields] = useState<UserFields | null>(null);
-  const [project, setProject] = useState<ProjectData | null>(null);
 
   const [id, setSheetId] = useState('');
   const [worksheet, setWorksheet] = useState('');
@@ -84,12 +82,11 @@ export default function SheetsModal(props: SheetsModalProps) {
 
   const handleClose = () => {
     setRundown(null);
-    setProject(null);
     setUserFields(null);
     onClose();
   };
 
-  //SETP-1 Upload Client ID
+  //STEP-1 Upload Client ID
   const handleClick = () => {
     fileInputRef.current?.click();
   };
@@ -139,7 +136,7 @@ export default function SheetsModal(props: SheetsModalProps) {
       });
   };
 
-  //SETP-2 Authenticate
+  //STEP-2 Authenticate
   const handleAuthenticate = () => {
     getSheetsAuthUrl()
       .then((data) => {
@@ -175,7 +172,7 @@ export default function SheetsModal(props: SheetsModalProps) {
       });
   };
 
-  //SETP-3 set sheet ID
+  //STEP-3 set sheet ID
   const testSheetId = () => {
     postId(id)
       .then((data) => {
@@ -194,7 +191,7 @@ export default function SheetsModal(props: SheetsModalProps) {
       });
   };
 
-  //SETP-4 Select Worksheet
+  //STEP-4 Select Worksheet
   const testWorksheet = (value: string) => {
     excelFileOptions.current.worksheet = value;
     setWorksheet(value);
@@ -208,7 +205,7 @@ export default function SheetsModal(props: SheetsModalProps) {
       });
   };
 
-  //SETP-5 Upload / Download
+  //STEP-5 Upload / Download
   const updateExcelFileOptions = <T extends keyof ExcelImportMap>(field: T, value: ExcelImportMap[T]) => {
     if (excelFileOptions.current[field] !== value) {
       excelFileOptions.current = { ...excelFileOptions.current, [field]: value };
@@ -218,7 +215,6 @@ export default function SheetsModal(props: SheetsModalProps) {
   const handlePullData = () => {
     postPreviewSheet(id, excelFileOptions.current)
       .then((data) => {
-        setProject(data.project);
         setRundown(data.rundown);
         setUserFields(data.userFields);
       })
@@ -244,15 +240,14 @@ export default function SheetsModal(props: SheetsModalProps) {
 
   //GET preview
   const handleFinalise = async () => {
-    if (rundown && userFields && project) {
+    if (rundown && userFields) {
       let doClose = false;
       try {
-        await patchData({ rundown, userFields, project });
+        await patchData({ rundown, userFields });
         queryClient.setQueryData(RUNDOWN, rundown);
         queryClient.setQueryData(USERFIELDS, userFields);
-        queryClient.setQueryData(PROJECT_DATA, project);
         await queryClient.invalidateQueries({
-          queryKey: [...RUNDOWN, ...USERFIELDS, ...PROJECT_DATA],
+          queryKey: [...RUNDOWN, ...USERFIELDS],
         });
         doClose = true;
       } catch (error) {
@@ -418,11 +413,7 @@ export default function SheetsModal(props: SheetsModalProps) {
               </>
             )
           ) : (
-            <PreviewExcel
-              rundown={rundown ?? []}
-              project={project ?? projectDataPlaceholder}
-              userFields={userFields ?? userFieldsPlaceholder}
-            />
+            <PreviewExcel rundown={rundown ?? []} userFields={userFields ?? userFieldsPlaceholder} />
           )}
         </ModalBody>
         <ModalFooter>

apps/client/src/features/modals/upload-modal/UploadModal.tsx

@@ -10,10 +10,10 @@ import {
   ModalOverlay,
 } from '@chakra-ui/react';
 import { useQueryClient } from '@tanstack/react-query';
-import { OntimeRundown, ProjectData, UserFields } from 'ontime-types';
+import { OntimeRundown, UserFields } from 'ontime-types';
 import { defaultExcelImportMap, ExcelImportMap } from 'ontime-utils';
 
-import { PROJECT_DATA, RUNDOWN, USERFIELDS } from '../../../common/api/apiConstants';
+import { RUNDOWN, USERFIELDS } from '../../../common/api/apiConstants';
 import { invalidateAllCaches, maybeAxiosError } from '../../../common/api/apiUtils';
 import {
   patchData,
@@ -21,7 +21,6 @@ import {
   ProjectFileImportOptions,
   uploadProjectFile,
 } from '../../../common/api/ontimeApi';
-import { projectDataPlaceholder } from '../../../common/models/ProjectData';
 import { userFieldsPlaceholder } from '../../../common/models/UserFields';
 
 import PreviewExcel from './preview/PreviewExcel';
@@ -50,7 +49,6 @@ export default function UploadModal({ onClose, isOpen }: UploadModalProps) {
   const [submitting, setSubmitting] = useState(false);
   const [rundown, setRundown] = useState<OntimeRundown | null>(null);
   const [userFields, setUserFields] = useState<UserFields | null>(null);
-  const [project, setProject] = useState<ProjectData | null>(null);
 
   const [errors, setErrors] = useState('');
 
@@ -85,7 +83,6 @@ export default function UploadModal({ onClose, isOpen }: UploadModalProps) {
     setSubmitting(false);
     setRundown(null);
     setUserFields(null);
-    setProject(null);
     setErrors('');
   }, [clear, isOpen]);
 
@@ -127,7 +124,6 @@ export default function UploadModal({ onClose, isOpen }: UploadModalProps) {
       if (response.status === 200) {
         setRundown(response.data.rundown);
         setUserFields(response.data.userFields);
-        setProject(response.data.project);
         // in excel imports we have an extra review step
         setUploadStep('review');
       }
@@ -144,22 +140,20 @@ export default function UploadModal({ onClose, isOpen }: UploadModalProps) {
     clear();
     setRundown([]);
     setUserFields(userFieldsPlaceholder);
-    setProject(projectDataPlaceholder);
     onClose();
   };
 
   const handleFinalise = async () => {
     // this step is currently only used for excel files, after preview
-    if (isExcel && rundown && userFields && project) {
+    if (isExcel && rundown && userFields) {
       let doClose = false;
       setSubmitting(true);
       try {
-        await patchData({ rundown, userFields, project });
+        await patchData({ rundown, userFields });
         queryClient.setQueryData(RUNDOWN, { rundown, revision: -1 });
         queryClient.setQueryData(USERFIELDS, userFields);
-        queryClient.setQueryData(PROJECT_DATA, project);
         await queryClient.invalidateQueries({
-          queryKey: [...RUNDOWN, ...USERFIELDS, ...PROJECT_DATA],
+          queryKey: [...RUNDOWN, ...USERFIELDS],
         });
         doClose = true;
       } catch (error) {
@@ -214,11 +208,7 @@ export default function UploadModal({ onClose, isOpen }: UploadModalProps) {
               {isExcel && <ExcelFileOptions optionsRef={excelFileOptions} updateOptions={updateExcelFileOptions} />}
             </>
           ) : (
-            <PreviewExcel
-              rundown={rundown ?? []}
-              project={project ?? projectDataPlaceholder}
-              userFields={userFields ?? userFieldsPlaceholder}
-            />
+            <PreviewExcel rundown={rundown ?? []} userFields={userFields ?? userFieldsPlaceholder} />
           )}
         </ModalBody>
         <ModalFooter>

apps/client/src/features/modals/upload-modal/preview/PreviewColumn.module.scss

@@ -1,22 +0,0 @@
-@use "../../../../theme/_ontimeColours" as *;
-
-@mixin pad-item {
-  padding-left: 0.5rem;
-  padding-right: 1rem;
-}
-
-.previewTable {
-  display: grid;
-  grid-template-columns: auto 1fr;
-  grid-template-rows: repeat(6, auto);
-  font-size: calc(1rem - 2px);
-}
-
-.field {
-  font-weight: 200;
-  @include pad-item;
-}
-
-.value {
-  @include pad-item;
-}

apps/client/src/features/modals/upload-modal/preview/PreviewExcel.tsx

@@ -1,24 +1,19 @@
-import { OntimeRundown, ProjectData, UserFields } from 'ontime-types';
+import { OntimeRundown, UserFields } from 'ontime-types';
 
-import PreviewProjectData from './PreviewProjectData';
 import PreviewRundown from './PreviewRundown';
 
 import style from '../../Modal.module.scss';
 
 interface PreviewExcelProps {
   rundown: OntimeRundown;
-  project: ProjectData;
   userFields: UserFields;
 }
 
 export default function PreviewExcel(props: PreviewExcelProps) {
-  const { rundown, project, userFields } = props;
+  const { rundown, userFields } = props;
 
   return (
     <div className={`${style.column}`}>
-      <div className={style.title}>Review Project Data</div>
-      <PreviewProjectData project={project} />
-      <div className={style.vSpacer} />
       <div className={style.title}>Review Rundown</div>
       <PreviewRundown rundown={rundown} userFields={userFields} />
     </div>

apps/client/src/features/modals/upload-modal/preview/PreviewProjectData.tsx

@@ -1,26 +0,0 @@
-import { ProjectData } from 'ontime-types';
-
-import style from './PreviewColumn.module.scss';
-
-interface PreviewProjectDataProps {
-  project: ProjectData;
-}
-
-export default function PreviewProjectData({ project }: PreviewProjectDataProps) {
-  return (
-    <div className={style.previewTable}>
-      <span className={style.field}>Title</span>
-      <span className={style.value}>{project.title}</span>
-      <span className={style.field}>Description</span>
-      <span className={style.value}>{project.description}</span>
-      <span className={style.field}>Public URL</span>
-      <span className={style.value}>{project.publicUrl}</span>
-      <span className={style.field}>Public info</span>
-      <span className={style.value}>{project.publicInfo}</span>
-      <span className={style.field}>Backstage URL</span>
-      <span className={style.value}>{project.backstageUrl}</span>
-      <span className={style.field}>Backstage info</span>
-      <span className={style.value}>{project.backstageInfo}</span>
-    </div>
-  );
-}