Fix CLS issue

optuna_dashboard/ts/components/GraphHistory.tsx

@@ -1,6 +1,7 @@
 import * as plotly from "plotly.js-dist-min"
 import React, { ChangeEvent, FC, useEffect, useState } from "react"
 import {
+  Box,
   Grid,
   FormControl,
   FormLabel,
@@ -163,7 +164,12 @@ export const GraphHistory: FC<{
         </FormControl>
       </Grid>
       <Grid item xs={9}>
-        <div id={plotDomId} />
+        <Box
+          id={plotDomId}
+          sx={{
+            height: "450px",
+          }}
+        />
       </Grid>
     </Grid>
   )

optuna_dashboard/ts/components/StudyHistory.tsx

@@ -89,21 +89,19 @@ export const StudyHistory: FC<{ studyId: number }> = ({ studyId }) => {
           </CardContent>
         </Card>
       ) : null}
-      {studyDetail !== null ? (
-        <Card
-          sx={{
-            margin: theme.spacing(2),
-          }}
-        >
-          <CardContent>
-            <GraphHistory
-              studies={[studyDetail]}
-              includePruned={includePruned}
-              logScale={logScale}
-            />
-          </CardContent>
-        </Card>
-      ) : null}
+      <Card
+        sx={{
+          margin: theme.spacing(2),
+        }}
+      >
+        <CardContent>
+          <GraphHistory
+            studies={studyDetail !== null ? [studyDetail] : []}
+            includePruned={includePruned}
+            logScale={logScale}
+          />
+        </CardContent>
+      </Card>
       <Grid2 container spacing={2} sx={{ padding: theme.spacing(0, 2) }}>
         {studyDetail !== null &&
         studyDetail.directions.length == 1 &&

optuna_dashboard/ts/trialFilter.ts

@@ -201,6 +201,9 @@ export const useObjectiveAndUserAttrTargetsFromStudies = (
     defaultTarget.identifier()
   )
   const minDirections = useMemo<number>(() => {
+    if (studies.length === 0) {
+      return 0
+    }
     return studies.reduce((acc, study) => {
       return Math.min(acc, study.directions.length)
     }, Number.MAX_VALUE)