From a290c5cf7404dc20af7694e5dac92996e58f3025 Mon Sep 17 00:00:00 2001
From: porink0424 <daichi2120@gmail.com>
Date: Wed, 28 Aug 2024 18:06:45 +0900
Subject: [PATCH 1/2] Disable use plotlypy setting when plotlypy is not
 available

---
 optuna_dashboard/ts/components/Settings.tsx | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/optuna_dashboard/ts/components/Settings.tsx b/optuna_dashboard/ts/components/Settings.tsx
index 4df44812f..3a6a14d3d 100644
--- a/optuna_dashboard/ts/components/Settings.tsx
+++ b/optuna_dashboard/ts/components/Settings.tsx
@@ -11,8 +11,13 @@ import {
   useTheme,
 } from "@mui/material"
 import React from "react"
+import { useRecoilValue } from "recoil"
 import { PlotlyColorThemeDark, PlotlyColorThemeLight } from "ts/types/optuna"
-import { usePlotBackendRendering, usePlotlyColorThemeState } from "../state"
+import {
+  plotlypyIsAvailableState,
+  usePlotBackendRendering,
+  usePlotlyColorThemeState,
+} from "../state"
 
 interface SettingsProps {
   handleClose: () => void
@@ -23,6 +28,7 @@ export const Settings = ({ handleClose }: SettingsProps) => {
   const [plotlyColorTheme, setPlotlyColorTheme] = usePlotlyColorThemeState()
   const [plotBackendRendering, setPlotBackendRendering] =
     usePlotBackendRendering()
+  const plotlypyIsAvailable = useRecoilValue(plotlypyIsAvailableState)
 
   const handleDarkModeColorChange = (event: SelectChangeEvent) => {
     const dark = event.target.value as PlotlyColorThemeDark
@@ -123,6 +129,7 @@ export const Settings = ({ handleClose }: SettingsProps) => {
             checked={plotBackendRendering}
             onChange={togglePlotBackendRendering}
             value="enable"
+            disabled={!plotlypyIsAvailable}
           />
         </Stack>
       </Stack>

From 70c65cefb708d805a63cb47680867759fc970f58 Mon Sep 17 00:00:00 2001
From: porink0424 <daichi2120@gmail.com>
Date: Wed, 28 Aug 2024 18:20:33 +0900
Subject: [PATCH 2/2] Default plotlypyIsAvailableState set to false to avoid
 crash

---
 optuna_dashboard/ts/state.ts | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/optuna_dashboard/ts/state.ts b/optuna_dashboard/ts/state.ts
index 644bd984f..02e86bc1b 100644
--- a/optuna_dashboard/ts/state.ts
+++ b/optuna_dashboard/ts/state.ts
@@ -53,7 +53,7 @@ export const artifactIsAvailable = atom<boolean>({
 
 export const plotlypyIsAvailableState = atom<boolean>({
   key: "plotlypyIsAvailable",
-  default: true,
+  default: false,
 })
 
 export const studySummariesLoadingState = atom<boolean>({
@@ -138,9 +138,6 @@ export const useBackendRender = (): boolean => {
     if (plotlypyIsAvailable) {
       return true
     }
-    console.warn(
-      "Use frontend rendering because plotlypy is specified but not available."
-    )
   }
   return false
 }