web: Remove spreadsheetRows

dolthub · Oct 25, 2023 · bc00b10 · bc00b10
1 parent 1ecd300
commit bc00b10
Show file tree

Hide file tree

Showing 8 changed files with 22 additions and 90 deletions.
diff --git a/packages/web/components/pageComponents/FileUploadPage/FileInfo/index.tsx b/packages/web/components/pageComponents/FileUploadPage/FileInfo/index.tsx
@@ -17,13 +17,12 @@ export default function FileInfo(props: Props) {
   const removeFile = () => {
     setState({
       selectedFile: undefined,
-      spreadsheetRows: undefined,
       colNames: "",
     });
     if (props.onRemove) props.onRemove();
   };
 
-  if (!state.selectedFile && !state.spreadsheetRows) return null;
+  if (!state.selectedFile) return null;
 
   return (
     <div>
@@ -32,14 +31,10 @@ export default function FileInfo(props: Props) {
       >
         <span className={css.fileInfo}>
           <FiFile className={css.fileIcon} />
-          <span data-cy="file-name">
-            {state.selectedFile?.name ?? "editor.csv"}
+          <span data-cy="file-name">{state.selectedFile.name}</span>
+          <span className={css.fileSize}>
+            {fileSize(state.selectedFile.size)}
           </span>
-          {state.selectedFile && (
-            <span className={css.fileSize}>
-              {fileSize(state.selectedFile.size)}
-            </span>
-          )}
         </span>
         <div className={cx({ [css.buttons]: props.upload })}>
           {props.editButton}

diff --git a/packages/web/components/pageComponents/FileUploadPage/Navigation/index.tsx b/packages/web/components/pageComponents/FileUploadPage/Navigation/index.tsx
@@ -75,7 +75,7 @@ function getComplete(
     case UploadStage.Table:
       return !!state.tableName;
     case UploadStage.Upload:
-      return !!(state.selectedFile ?? state.spreadsheetRows);
+      return !!state.selectedFile;
     default:
       return false;
   }

diff --git a/packages/web/components/pageComponents/FileUploadPage/Steps/Upload/DropZone.tsx b/packages/web/components/pageComponents/FileUploadPage/Steps/Upload/DropZone.tsx
@@ -28,7 +28,6 @@ export default function DropZone() {
         className={cx(css.dropContainer, {
           [css.hover]: dz.hover,
           [css.dropped]: state.selectedFile,
-          [css.faded]: !!state.spreadsheetRows,
         })}
         onDragOver={dz.dragOver}
         onDragLeave={dz.dragLeave}
@@ -53,11 +52,7 @@ export default function DropZone() {
               <div>Drag a file here</div>
               <div>or</div>
               <div className={css.uploadBottom}>
-                <Button.Link
-                  onClick={onBrowse}
-                  className={css.browseButton}
-                  disabled={!!state.spreadsheetRows}
-                >
+                <Button.Link onClick={onBrowse} className={css.browseButton}>
                   Browse files
                 </Button.Link>
 
@@ -73,7 +68,7 @@ export default function DropZone() {
         </div>
       </div>
       <ErrorMsg errString={dz.err} />
-      {!state.selectedFile && !state.spreadsheetRows && (
+      {!state.selectedFile && (
         <div className={css.fileTypes}>File types: {fileTypes}</div>
       )}
     </div>

diff --git a/packages/web/components/pageComponents/FileUploadPage/Steps/Upload/OpenSpreadsheetZone.tsx b/packages/web/components/pageComponents/FileUploadPage/Steps/Upload/OpenSpreadsheetZone.tsx
@@ -1,75 +1,39 @@
 import Button from "@components/Button";
-import { FiCheck } from "@react-icons/all-files/fi/FiCheck";
 import { GrTable } from "@react-icons/all-files/gr/GrTable";
 import cx from "classnames";
-import FileInfo from "../../FileInfo";
 import { useFileUploadContext } from "../../contexts/fileUploadLocalForage";
 import useUploadContext from "./contexts/upload";
 import css from "./index.module.css";
 
 export default function OpenSpreadsheetZone() {
   const { setState } = useUploadContext();
-  const { state, setItem } = useFileUploadContext();
-
-  const onRemove = () => {
-    setState({ error: undefined });
-    setItem("selectedFile", undefined);
-  };
+  const { state } = useFileUploadContext();
 
   const onClick = () => {
     setState({ spreadsheetOverlayOpen: true });
   };
 
-  const onEdit = () => {
-    setState({
-      spreadsheetOverlayOpen: true,
-      error: undefined,
-    });
-  };
-
   return (
     <div>
       <div
         className={cx(css.editableTable, {
-          [css.dropped]: state.spreadsheetRows,
-          [css.faded]: state.selectedFile && !state.spreadsheetRows,
+          [css.faded]: !!state.selectedFile,
         })}
       >
-        {state.spreadsheetRows ? (
+        <div>
+          <GrTable className={css.tableIcon} />
+          <h4>Create spreadsheet</h4>
           <div>
-            <span
-              className={css.success}
-              data-cy="spreadsheet-upload-successful"
+            <Button
+              onClick={onClick}
+              className={css.openButton}
+              disabled={!!state.selectedFile}
+              data-cy="spread-sheet-button"
             >
-              <FiCheck />
-              Upload successful
-            </span>
-            <FileInfo
-              onRemove={onRemove}
-              editButton={
-                <Button.Link onClick={onEdit} className={css.editBtn}>
-                  edit
-                </Button.Link>
-              }
-              upload
-            />
-          </div>
-        ) : (
-          <div>
-            <GrTable className={css.tableIcon} />
-            <h4>Create spreadsheet</h4>
-            <div>
-              <Button
-                onClick={onClick}
-                className={css.openButton}
-                disabled={!!state.selectedFile}
-                data-cy="spread-sheet-button"
-              >
-                Open editor
-              </Button>
-            </div>
+              Open editor
+            </Button>
           </div>
-        )}
+        </div>
       </div>
     </div>
   );

diff --git a/packages/web/components/pageComponents/FileUploadPage/Steps/Upload/contexts/upload.tsx b/packages/web/components/pageComponents/FileUploadPage/Steps/Upload/contexts/upload.tsx
@@ -25,7 +25,6 @@ type UploadContextType = {
   state: UploadState;
   setState: UploadDispatch;
   onUpload: () => Promise<void>;
-  removeSpreadsheet: () => void;
 };
 
 export const UploadContext =
@@ -38,11 +37,7 @@ type Props = {
 export function UploadProvider(props: Props) {
   const { isDolt } = useIsDolt();
   const router = useRouter();
-  const {
-    state: fuState,
-    dbParams,
-    setState: setForageState,
-  } = useFileUploadContext();
+  const { state: fuState, dbParams } = useFileUploadContext();
   const [state, setState] = useSetState({
     ...defaultState,
     spreadsheetOverlayOpen:
@@ -94,22 +89,12 @@ export function UploadProvider(props: Props) {
     }
   };
 
-  const removeSpreadsheet = () => {
-    setForageState({
-      spreadsheetRows: undefined,
-      selectedFile: undefined,
-      colNames: "",
-    });
-    setState({ error: undefined });
-  };
-
   return (
     <UploadContext.Provider
       value={{
         state,
         setState,
         onUpload,
-        removeSpreadsheet,
       }}
     >
       {props.children}

diff --git a/packages/web/components/pageComponents/FileUploadPage/Steps/Upload/index.tsx b/packages/web/components/pageComponents/FileUploadPage/Steps/Upload/index.tsx
@@ -33,10 +33,7 @@ function Inner() {
       title="Upload file"
       stage={UploadStage.Upload}
       disabled={
-        !!uState.error ||
-        (!state.spreadsheetRows && !state.selectedFile) ||
-        updateLoad ||
-        uState.loading
+        !!uState.error || !state.selectedFile || updateLoad || uState.loading
       }
       onNext={onUpload}
       backUrl={getUploadUrl("table")}

diff --git a/packages/web/components/pageComponents/FileUploadPage/Summary.tsx b/packages/web/components/pageComponents/FileUploadPage/Summary.tsx
@@ -21,9 +21,6 @@ export function getOpVerb(op: ImportOperation): string {
 }
 
 export function getUploadMethod(state: FileUploadState): string {
-  if (state.spreadsheetRows) {
-    return " using new spreadsheet";
-  }
   if (state.selectedFile) {
     return " using uploaded file";
   }

diff --git a/...ages/web/components/pageComponents/FileUploadPage/contexts/fileUploadLocalForage/state.ts b/...ages/web/components/pageComponents/FileUploadPage/contexts/fileUploadLocalForage/state.ts
@@ -12,7 +12,6 @@ const defaultState = {
   tableName: "",
   importOp: ImportOperation.Update,
   selectedFile: undefined as File | undefined, // file upload only
-  spreadsheetRows: undefined as string[][] | undefined, // spreadsheet only
   fileType: FileType.Csv,
   modifier: undefined as LoadDataModifier | undefined,
   colNames: "",