fix(striker-ui): move ContainedButton out of Files

striker-ui/components/ContainedButton.tsx

@@ -1,6 +1,6 @@
 import { Button, ButtonProps, styled } from '@mui/material';
 
-import { BLACK, GREY, TEXT } from '../../lib/consts/DEFAULT_THEME';
+import { BLACK, GREY, TEXT } from '../lib/consts/DEFAULT_THEME';
 
 const StyledButton = styled(Button)({
   backgroundColor: TEXT,
@@ -12,7 +12,7 @@ const StyledButton = styled(Button)({
   },
 });
 
-const StyledContainedButton = ({
+const ContainedButton = ({
   children,
   onClick,
   sx,
@@ -23,4 +23,4 @@ const StyledContainedButton = ({
   </StyledButton>
 );
 
-export default StyledContainedButton;
+export default ContainedButton;

striker-ui/components/Files/FileEditForm.tsx

@@ -9,11 +9,12 @@ import { Box, Checkbox, checkboxClasses } from '@mui/material';
 import API_BASE_URL from '../../lib/consts/API_BASE_URL';
 import { GREY, RED, TEXT } from '../../lib/consts/DEFAULT_THEME';
 
+import ContainedButton from '../ContainedButton';
 import FileInfo from './FileInfo';
+import Spinner from '../Spinner';
+
 import fetchJSON from '../../lib/fetchers/fetchJSON';
 import mainAxiosInstance from '../../lib/singletons/mainAxiosInstance';
-import StyledContainedButton from './StyledContainedButton';
-import Spinner from '../Spinner';
 
 type FileEditProps = {
   filesOverview: FileOverviewMetadata[];
@@ -26,25 +27,24 @@ type FileToEdit = FileDetailMetadata & {
 
 const FileEditForm = ({ filesOverview }: FileEditProps): JSX.Element => {
   const [filesToEdit, setFilesToEdit] = useState<FileToEdit[]>([]);
-  const [isLoadingFilesToEdit, setIsLoadingFilesToEdit] = useState<boolean>(
-    false,
-  );
-
-  const generateFileInfoChangeHandler = (
-    fileIndex: number,
-  ): FileInfoChangeHandler => (inputValues, { fileLocationIndex } = {}) => {
-    if (fileLocationIndex) {
-      filesToEdit[fileIndex].fileLocations[fileLocationIndex] = {
-        ...filesToEdit[fileIndex].fileLocations[fileLocationIndex],
-        ...inputValues,
-      };
-    } else {
-      filesToEdit[fileIndex] = {
-        ...filesToEdit[fileIndex],
-        ...inputValues,
-      };
-    }
-  };
+  const [isLoadingFilesToEdit, setIsLoadingFilesToEdit] =
+    useState<boolean>(false);
+
+  const generateFileInfoChangeHandler =
+    (fileIndex: number): FileInfoChangeHandler =>
+    (inputValues, { fileLocationIndex } = {}) => {
+      if (fileLocationIndex) {
+        filesToEdit[fileIndex].fileLocations[fileLocationIndex] = {
+          ...filesToEdit[fileIndex].fileLocations[fileLocationIndex],
+          ...inputValues,
+        };
+      } else {
+        filesToEdit[fileIndex] = {
+          ...filesToEdit[fileIndex],
+          ...inputValues,
+        };
+      }
+    };
 
   const editFiles: FormEventHandler<HTMLFormElement> = (event) => {
     event.preventDefault();
@@ -181,7 +181,7 @@ const FileEditForm = ({ filesOverview }: FileEditProps): JSX.Element => {
                   },
                 }}
               >
-                <StyledContainedButton
+                <ContainedButton
                   onClick={purgeFiles}
                   sx={{
                     backgroundColor: RED,
@@ -190,10 +190,8 @@ const FileEditForm = ({ filesOverview }: FileEditProps): JSX.Element => {
                   }}
                 >
                   Purge
-                </StyledContainedButton>
-                <StyledContainedButton type="submit">
-                  Update
-                </StyledContainedButton>
+                </ContainedButton>
+                <ContainedButton type="submit">Update</ContainedButton>
               </Box>
             )}
           </Box>

striker-ui/components/Files/FileUploadForm.tsx

@@ -1,3 +1,4 @@
+import EventEmitter from 'events';
 import {
   ChangeEventHandler,
   FormEventHandler,
@@ -6,15 +7,15 @@ import {
   useState,
 } from 'react';
 import { Box, Input, InputLabel } from '@mui/material';
-import EventEmitter from 'events';
 
 import { UPLOAD_FILE_TYPES } from '../../lib/consts/UPLOAD_FILE_TYPES';
 
-import FileInfo from './FileInfo';
 import { ProgressBar } from '../Bars';
+import ContainedButton from '../ContainedButton';
+import FileInfo from './FileInfo';
 import { BodyText } from '../Text';
+
 import mainAxiosInstance from '../../lib/singletons/mainAxiosInstance';
-import StyledContainedButton from './StyledContainedButton';
 
 type FileUploadFormProps = {
   onFileUploadComplete?: () => void;
@@ -87,14 +88,14 @@ const FileUploadForm = (
     }
   };
 
-  const generateFileInfoOnChangeHandler = (
-    fileIndex: number,
-  ): FileInfoChangeHandler => (inputValues) => {
-    selectedFiles[fileIndex] = {
-      ...selectedFiles[fileIndex],
-      ...inputValues,
+  const generateFileInfoOnChangeHandler =
+    (fileIndex: number): FileInfoChangeHandler =>
+    (inputValues) => {
+      selectedFiles[fileIndex] = {
+        ...selectedFiles[fileIndex],
+        ...inputValues,
+      };
     };
-  };
 
   const uploadFiles: FormEventHandler<HTMLFormElement> = (event) => {
     event.preventDefault();
@@ -222,7 +223,7 @@ const FileUploadForm = (
               justifyContent: 'flex-end',
             }}
           >
-            <StyledContainedButton type="submit">Upload</StyledContainedButton>
+            <ContainedButton type="submit">Upload</ContainedButton>
           </Box>
         )}
       </Box>