Merge pull request #153 from BoostV/maintenance/152-maintenance-enabl…

…e-typescript-strict-mode

Maintenance/152 maintenance enable typescript strict mode

.gitignore

@@ -39,3 +39,4 @@ db
 # local files used in development
 /specification.yml
 .vscode
+tsconfig.tsbuildinfo

openapi/apis/DefaultApi.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/Experiment.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/ExperimentData.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/ExperimentOptimizerConfig.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/ExperimentOptimizerConfigSpace.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/ModelError.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/Result.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/ResultPlots.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/ResultResult.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

openapi/models/ResultResultModels.ts

@@ -1,3 +1,4 @@
+// @ts-nocheck
 /* tslint:disable */
 /* eslint-disable */
 /**

package.json

@@ -49,6 +49,7 @@
     "@types/node": "^18.0.0",
     "@types/react": "^18.0.14",
     "@types/rimraf": "^3.0.0",
+    "@types/uuid": "^8.3.4",
     "eslint": "8.18.0",
     "eslint-config-next": "12.1.6",
     "git-revision-webpack-plugin": "^5.0.0",

pages/experiment/[experimentid].tsx

@@ -21,7 +21,7 @@ export default function ExperimentContainer() {
     <>
       <ExperimentProvider
         experimentId={
-          Array.isArray(experimentid) ? experimentid[0] : experimentid
+          Array.isArray(experimentid) ? experimentid[0] ?? '' : experimentid
         }
       >
         {focus === 'legacy' ? <Experiment /> : <TabbedExperiment />}

src/components/data-points/data-points.style.ts

@@ -1,6 +1,6 @@
 import { makeStyles } from '@mui/styles'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   tableContainer: {
     overflowX: 'auto',
   },

src/components/data-points/data-points.tsx

@@ -69,10 +69,10 @@ export default function DataPoints(props: DataPointProps) {
   const buildEmptyRow = useCallback((): TableDataRow => {
     return {
       dataPoints: buildCombinedVariables()
-        .map((variable, i) => {
+        .map(variable => {
           return {
             name: variable.name,
-            value: variable.options ? variable.options[0] : '',
+            value: variable.options?.[0] ?? '',
             options: variable.options,
             tooltip: variable.tooltip,
           }

src/components/editable-table/editable-table-cell.style.ts

@@ -1,7 +1,7 @@
 import { makeStyles } from '@mui/styles'
 import { tableBorder } from '../../theme/theme'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   editCell: {
     minWidth: 48,
   },

src/components/editable-table/editable-table-cell.tsx

@@ -2,6 +2,7 @@ import {
   FormControl,
   MenuItem,
   Select,
+  SelectChangeEvent,
   TableCell,
   TextField,
   Tooltip,
@@ -33,7 +34,7 @@ export function EditableTableCell({
       size="small"
       value={value}
       onChange={(e: ChangeEvent<HTMLInputElement>) =>
-        onChange('' + e.target.value)
+        onChange?.('' + e.target.value)
       }
     />
   )
@@ -46,9 +47,7 @@ export function EditableTableCell({
             <FormControl>
               <Select
                 value={value}
-                onChange={(e: ChangeEvent<HTMLInputElement>) =>
-                  onChange(e.target.value)
-                }
+                onChange={(e: SelectChangeEvent) => onChange?.(e.target.value)}
                 displayEmpty
                 inputProps={{ 'aria-label': 'select value' }}
               >

src/components/editable-table/editable-table-collapsed-row.style.ts

@@ -1,7 +1,7 @@
 import { makeStyles } from '@mui/styles'
 import { colors, tableBorder } from '../../theme/theme'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   buttonContainer: {
     whiteSpace: 'nowrap',
     float: 'right',

src/components/editable-table/editable-table-expanded-row.style.ts

@@ -1,7 +1,7 @@
 import { makeStyles } from '@mui/styles'
 import { colors } from '../../theme/theme'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   row: {
     '& + tr': {
       '& td': {

src/components/editable-table/editable-table-expanded-row.tsx

@@ -2,7 +2,6 @@ import useStyles from './editable-table-expanded-row.style'
 import {
   Box,
   Button,
-  IconButton,
   Paper,
   Table,
   TableBody,

src/components/editable-table/editable-table.style.ts

@@ -1,7 +1,7 @@
 import { makeStyles } from '@mui/styles'
 import { tableBorder } from '../../theme/theme'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   emptyCell: {
     border: 'none',
     width: 16,

src/components/editable-table/editable-table.tsx

@@ -35,7 +35,7 @@ export const EditableTable = ({
           <TableRow>
             <TableCell className={classes.emptyCell} />
             <TableCell>#</TableCell>
-            {rows[0].dataPoints.map((item, index) => (
+            {rows[0]?.dataPoints.map((item, index) => (
               <TableCell key={index}>{item.name}</TableCell>
             ))}
             <TableCell align="right">Edit</TableCell>
@@ -66,7 +66,7 @@ export const EditableTable = ({
           <TableRow>
             <TableCell className={classes.emptyCell} />
             <TableCell className={classes.emptyFooterCell} />
-            {rows[0].dataPoints.map((item, index) => (
+            {rows[0]?.dataPoints.map((item, index) => (
               <TableCell
                 key={'footercell' + index}
                 className={classes.footerCell}

src/components/experiment/dataEntryTab.tsx

@@ -1,12 +1,8 @@
-import { Box, Grid } from '@mui/material'
-import { useState } from 'react'
+import { Grid } from '@mui/material'
 import { useExperiment } from '../../context/experiment-context'
 import { DataPointType } from '../../types/common'
 import DataPoints from '../data-points/data-points'
 import { ResultData } from '../result-data/result-data'
-import { SingleDataPoint } from '../result-data/single-data-point'
-import { SummaryConfiguration } from '../summary-configuration'
-import { TitleCard } from '../title-card/title-card'
 
 export const DataEntryTab = () => {
   const {
@@ -30,18 +26,13 @@ export const DataEntryTab = () => {
 
   const expectedMinimum: any[][] = experiment.results.expectedMinimum
 
-  const [highlightNextExperiments, setHighlightNextExperiments] =
-    useState(false)
-
   return (
     <Grid container spacing={3}>
       <Grid item xs={12}>
         <ResultData
           nextValues={nextValues}
           headers={headers}
           expectedMinimum={expectedMinimum}
-          onMouseEnterExpand={() => setHighlightNextExperiments(true)}
-          onMouseLeaveExpand={() => setHighlightNextExperiments(false)}
         />
       </Grid>
 

src/components/experiment/experiment.tsx

@@ -11,7 +11,7 @@ import {
 import Layout from '../layout/layout'
 import OptimizerModel from '../input-model/optimizer-model'
 import OptimizerConfigurator from '../optimizer-configurator'
-import { Alert, Color } from '@mui/material'
+import { Alert } from '@mui/material'
 import Details from '../details'
 import DataPoints from '../data-points/data-points'
 import { useStyles } from './experiment.style'
@@ -26,7 +26,6 @@ import {
 import LoadingExperiment from './loading-experiment'
 import { ResultData } from '../result-data/result-data'
 import LoadingButton from '../loading-button/loading-button'
-import { theme } from '../../theme/theme'
 import { Plots } from '../plots/plots'
 import { saveObjectToLocalFile } from '../../utility/save-to-local-file'
 import { useGlobal } from '../../context/global-context'

src/components/experiment/tabbed-experiment.tsx

@@ -16,12 +16,12 @@ import { useExperiment, runExperiment } from '../../context/experiment-context'
 import React, { useState } from 'react'
 import LoadingExperiment from './loading-experiment'
 import LoadingButton from '../loading-button/loading-button'
-import { theme } from '../../theme/theme'
 import { Plots } from '../plots/plots'
 import { saveObjectToLocalFile } from '../../utility/save-to-local-file'
 import { useGlobal } from '../../context/global-context'
 import { ConfigurationTab } from './configurationTab'
 import { DataEntryTab } from './dataEntryTab'
+import { State } from '../../reducers/global-reducer'
 
 type SnackbarMessage = {
   message: string
@@ -73,7 +73,7 @@ const TabbedExperiment = () => {
     setSnackbarOpen(true)
   }
 
-  const handleChange = (_event, newValue) => {
+  const handleChange = (_event: unknown, newValue: State['focus']) => {
     globalDispatch({ type: 'global/setFocus', payload: newValue })
   }
 

src/components/home/home.tsx

@@ -54,7 +54,7 @@ export default function Home() {
   )
 
   const onDrop = useCallback(
-    acceptedFiles => {
+    (acceptedFiles: Blob[]) => {
       const saveAndRedirect = async (experiment: ExperimentType) => {
         const id: string = experiment.id
         try {
@@ -72,7 +72,7 @@ export default function Home() {
       }
 
       const load = (reader: FileReader) => {
-        const binaryResult: string | ArrayBuffer = reader.result
+        const binaryResult: string | ArrayBuffer | null = reader.result
         try {
           const experiment: ExperimentType = JSON.parse(binaryResult as string)
           if (experiment.id === undefined) {
@@ -94,7 +94,10 @@ export default function Home() {
       reader.onprogress = () =>
         setUploadMessage({ message: 'Loading file...', isError: false })
       reader.onload = () => load(reader)
-      reader.readAsText(acceptedFiles[0])
+      const file = acceptedFiles[0]
+      if (file) {
+        reader.readAsText(file)
+      }
     },
     [saveExperimentLocally, state.experimentsInLocalStorage]
   )
@@ -113,7 +116,7 @@ export default function Home() {
 
   const getExperimentName = (key: string) => {
     try {
-      const json: any = JSON.parse(localStorage.getItem(key))
+      const json: any = JSON.parse(localStorage.getItem(key) ?? '')
       const experiment: ExperimentType = json.experiment
       return '' !== experiment.info.name ? experiment.info.name : '-'
     } catch (e) {
@@ -139,12 +142,16 @@ export default function Home() {
   }
 
   const handleOverwriteDialog = () => {
-    saveExperimentLocally(tempExperiment)
+    if (tempExperiment) {
+      saveExperimentLocally(tempExperiment)
+    }
     setTempExperiment(undefined)
   }
 
   const handleCreateDialog = () => {
-    saveExperimentLocally({ ...tempExperiment, id: uuid() })
+    if (tempExperiment) {
+      saveExperimentLocally({ ...tempExperiment, id: uuid() })
+    }
     setTempExperiment(undefined)
   }
 

src/components/input-model/categorical-variable.style.ts

@@ -1,6 +1,6 @@
 import { makeStyles } from '@mui/styles'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   option: {
     display: 'flex',
     alignItems: 'center',

src/components/input-model/categorical-variable.tsx

@@ -15,7 +15,7 @@ type CategoricalVariableProps = {
 export default function CategoricalVariable(props: CategoricalVariableProps) {
   const classes = useStyles()
   const { isDisabled, onAdded } = props
-  const [options, setOptions] = useState([])
+  const [options, setOptions] = useState<string[]>([])
   const { register, handleSubmit, reset, formState, setError, clearErrors } =
     useForm<CategoricalVariableType>()
   const isOptionsValid = useCallback(() => {
@@ -51,7 +51,6 @@ export default function CategoricalVariable(props: CategoricalVariableProps) {
     <>
       <form onSubmit={handleSubmit(onSubmit)}>
         <TextField
-          name="name"
           {...register('name', { ...validation.required })}
           label="Name"
           fullWidth
@@ -61,7 +60,6 @@ export default function CategoricalVariable(props: CategoricalVariableProps) {
           helperText={formState.errors.name?.message}
         />
         <TextField
-          name="description"
           {...register('description')}
           label="Description"
           fullWidth
@@ -93,8 +91,8 @@ export default function CategoricalVariable(props: CategoricalVariableProps) {
           }}
           error={
             formState.errors.options !== undefined
-              ? formState.errors.options[0].message
-              : undefined
+              ? formState.errors.options[0]?.message ?? ''
+              : ''
           }
         />
         <Box mt={2}>

src/components/input-model/optimizer-model.style.ts

@@ -1,7 +1,7 @@
 import { makeStyles } from '@mui/styles'
 import { grey } from '@mui/material/colors'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   editBox: {
     background: grey[200],
   },

src/components/input-model/value-variable.style.ts

@@ -1,6 +1,6 @@
 import { makeStyles } from '@mui/styles'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   narrowInput: {
     float: 'left',
     width: '50%',

src/components/input-model/variable-editor.tsx

@@ -18,7 +18,7 @@ export default function VariableEditor(props: VariableEditorProps) {
   const [tabIndex, setTabIndex] = useState(0)
   const classes = useStyles()
 
-  const handleTabChange = (event: ChangeEvent<{}>, newValue: number) => {
+  const handleTabChange = (_event: ChangeEvent<{}>, newValue: number) => {
     setTabIndex(newValue)
   }
 

src/components/json-editor/json-editor.style.ts

@@ -1,6 +1,6 @@
 import { makeStyles } from '@mui/styles'
 
-export const useStyles = makeStyles(theme => ({
+export const useStyles = makeStyles(() => ({
   textArea: {
     width: '100%',
   },