diff --git a/optuna_dashboard/ts/action.ts b/optuna_dashboard/ts/action.ts
index 64dd8131..195a215b 100644
--- a/optuna_dashboard/ts/action.ts
+++ b/optuna_dashboard/ts/action.ts
@@ -1,4 +1,4 @@
-import * as plotly from 'plotly.js';
+import * as plotly from "plotly.js"
 import { useRecoilState, useSetRecoilState } from "recoil"
 import { useSnackbar } from "notistack"
 import {
@@ -36,11 +36,11 @@ import {
 import { getDominatedTrials } from "./dominatedTrials"
 
 type PlotlyFigure = {
-  data: plotly.Data[],
-  layout: plotly.Layout,
-};
+  data: plotly.Data[]
+  layout: plotly.Layout
+}
 export type AllPlotlyFigures = {
-  [studyId: number]: {[plotName: string]: PlotlyFigure},
+  [studyId: number]: { [plotName: string]: PlotlyFigure }
 }
 
 // eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
@@ -56,7 +56,8 @@ export const actionCreator = () => {
   const setUploading = useSetRecoilState<boolean>(isFileUploading)
   const setTrialsUpdating = useSetRecoilState(trialsUpdatingState)
   const setArtifactIsAvailable = useSetRecoilState<boolean>(artifactIsAvailable)
-  const [allPlotlyFigures, setAllPlotlyFigures] = useRecoilState<AllPlotlyFigures>(allPlotlyFiguresState)
+  const [allPlotlyFigures, setAllPlotlyFigures] =
+    useRecoilState<AllPlotlyFigures>(allPlotlyFiguresState)
 
   const setStudyDetailState = (studyId: number, study: StudyDetail) => {
     setStudyDetails((prevVal) => {
@@ -707,21 +708,25 @@ export const actionCreator = () => {
         })
         console.log(err)
       })
-    }
+  }
 
   const updatePlotlyFigures = (studyId: number) => {
-    fetch(`/api/studies/${studyId}/contour_plot`, {mode: "cors"})
-    .then((response) => response.json())
-    .then((figure) => {
-      const newAllPlotlyFigures = Object.assign({}, allPlotlyFigures)
-      if (!(studyId in newAllPlotlyFigures)) {
-        newAllPlotlyFigures[studyId] = {}
-      }
-      newAllPlotlyFigures[studyId].contour = {data: figure.data, layout: figure.layout}
-      setAllPlotlyFigures(newAllPlotlyFigures)
-    }).catch((err) => {
-      console.error(err);
-    })
+    fetch(`/api/studies/${studyId}/contour_plot`, { mode: "cors" })
+      .then((response) => response.json())
+      .then((figure) => {
+        const newAllPlotlyFigures = Object.assign({}, allPlotlyFigures)
+        if (!(studyId in newAllPlotlyFigures)) {
+          newAllPlotlyFigures[studyId] = {}
+        }
+        newAllPlotlyFigures[studyId].contour = {
+          data: figure.data,
+          layout: figure.layout,
+        }
+        setAllPlotlyFigures(newAllPlotlyFigures)
+      })
+      .catch((err) => {
+        console.error(err)
+      })
   }
 
   return {
diff --git a/optuna_dashboard/ts/components/GraphContour.tsx b/optuna_dashboard/ts/components/GraphContour.tsx
index c30f98c7..75c3164f 100644
--- a/optuna_dashboard/ts/components/GraphContour.tsx
+++ b/optuna_dashboard/ts/components/GraphContour.tsx
@@ -37,12 +37,12 @@ const ContourBackend: FC<{
   study: StudyDetail | null
 }> = ({ study }) => {
   if (study === null) {
-    return (
-      <Box id={plotDomId} sx={{ height: "450px" }} />
-    )
+    return <Box id={plotDomId} sx={{ height: "450px" }} />
   }
   const studyId = study.id
-  const allPlotlyFigures = useRecoilValue<AllPlotlyFigures>(allPlotlyFiguresState)
+  const allPlotlyFigures = useRecoilValue<AllPlotlyFigures>(
+    allPlotlyFiguresState
+  )
   const contourPlot = allPlotlyFigures[studyId]?.contour
   const action = actionCreator()
   useEffect(() => {
@@ -52,11 +52,13 @@ const ContourBackend: FC<{
     if (contourPlot === undefined) {
       return
     }
-    plotly.react(plotDomId, JSON.parse(JSON.stringify(contourPlot.data)), JSON.parse(JSON.stringify(contourPlot.layout)))
+    plotly.react(
+      plotDomId,
+      JSON.parse(JSON.stringify(contourPlot.data)),
+      JSON.parse(JSON.stringify(contourPlot.layout))
+    )
   }, [contourPlot])
-  return (
-    <Box id={plotDomId} sx={{ height: "450px" }} />
-  )
+  return <Box id={plotDomId} sx={{ height: "450px" }} />
 }
 
 const ContourFrontend: FC<{