diff --git a/dashboard/client/src/App.tsx b/dashboard/client/src/App.tsx index 0e36807b8..458338504 100644 --- a/dashboard/client/src/App.tsx +++ b/dashboard/client/src/App.tsx @@ -2,7 +2,7 @@ import { CssBaseline } from "@material-ui/core"; import { ThemeProvider } from "@material-ui/core/styles"; import React, { Suspense, useEffect, useState } from "react"; import { Provider } from "react-redux"; -import { HashRouter, Route, Switch } from "react-router-dom"; +import { HashRouter, Redirect, Route, Switch } from "react-router-dom"; import Dashboard from "./pages/dashboard/Dashboard"; import Events from "./pages/event/Events"; import Loading from "./pages/exception/Loading"; @@ -83,7 +83,12 @@ const App = () => { - + } + exact + path="/" + /> + ( diff --git a/dashboard/client/src/common/UsageStatsAlert.tsx b/dashboard/client/src/common/UsageStatsAlert.tsx new file mode 100644 index 000000000..b6afcf30d --- /dev/null +++ b/dashboard/client/src/common/UsageStatsAlert.tsx @@ -0,0 +1,37 @@ +import { Alert } from "@material-ui/lab"; +import React, { useEffect, useState } from "react"; +import { getUsageStatsEnabled } from "../api"; + +export const UsageStatsAlert = () => { + const [usageStatsPromptEnabled, setUsageStatsPromptEnabled] = useState(false); + const [usageStatsEnabled, setUsageStatsEnabled] = useState(false); + useEffect(() => { + getUsageStatsEnabled().then((res) => { + setUsageStatsPromptEnabled(res.usageStatsPromptEnabled); + setUsageStatsEnabled(res.usageStatsEnabled); + }); + }, []); + + return usageStatsPromptEnabled ? ( + + {usageStatsEnabled ? ( + + Usage stats collection is enabled. To disable this, add + `--disable-usage-stats` to the command that starts the cluster, or run + the following command: `ray disable-usage-stats` before starting the + cluster. See{" "} + + https://docs.ray.io/en/master/cluster/usage-stats.html + {" "} + for more details. + + ) : ( + Usage stats collection is disabled. + )} + + ) : null; +}; diff --git a/dashboard/client/src/pages/dashboard/Dashboard.tsx b/dashboard/client/src/pages/dashboard/Dashboard.tsx index 91cc8003e..b68450f2d 100644 --- a/dashboard/client/src/pages/dashboard/Dashboard.tsx +++ b/dashboard/client/src/pages/dashboard/Dashboard.tsx @@ -7,16 +7,11 @@ import { Theme, Typography, } from "@material-ui/core"; -import { Alert } from "@material-ui/lab"; -import React, { useCallback, useEffect, useRef, useState } from "react"; +import React, { useCallback, useEffect, useRef } from "react"; import { useDispatch, useSelector } from "react-redux"; import { useHistory } from "react-router-dom"; -import { - getActorGroups, - getNodeInfo, - getTuneAvailability, - getUsageStatsEnabled, -} from "../../api"; +import { getActorGroups, getNodeInfo, getTuneAvailability } from "../../api"; +import { UsageStatsAlert } from "../../common/UsageStatsAlert"; import { StoreState } from "../../store"; import LastUpdated from "./LastUpdated"; import LogicalView from "./logical-view/LogicalView"; @@ -105,14 +100,6 @@ const Dashboard: React.FC = () => { } const SelectedComponent = tabs[tab].component; - const [usageStatsPromptEnabled, setUsageStatsPromptEnabled] = useState(false); - const [usageStatsEnabled, setUsageStatsEnabled] = useState(false); - useEffect(() => { - getUsageStatsEnabled().then((res) => { - setUsageStatsPromptEnabled(res.usageStatsPromptEnabled); - setUsageStatsEnabled(res.usageStatsEnabled); - }); - }, []); return (
Ray Dashboard @@ -123,7 +110,7 @@ const Dashboard: React.FC = () => { color="primary" onClick={() => history.push("/node")} > - Try Experimental Dashboard + Back to new dashboard { ))} - {usageStatsPromptEnabled ? ( - - {usageStatsEnabled ? ( - - Usage stats collection is enabled. To disable this, add - `--disable-usage-stats` to the command that starts the cluster, or - run the following command: `ray disable-usage-stats` before - starting the cluster. See{" "} - - https://docs.ray.io/en/master/cluster/usage-stats.html - {" "} - for more details. - - ) : ( - Usage stats collection is disabled. - )} - - ) : null} +
); diff --git a/dashboard/client/src/pages/layout/index.tsx b/dashboard/client/src/pages/layout/index.tsx index 6696fde4e..34279db88 100644 --- a/dashboard/client/src/pages/layout/index.tsx +++ b/dashboard/client/src/pages/layout/index.tsx @@ -9,6 +9,7 @@ import { NightsStay, VerticalAlignTop, WbSunny } from "@material-ui/icons"; import classnames from "classnames"; import React, { PropsWithChildren } from "react"; import { RouteComponentProps } from "react-router-dom"; +import { UsageStatsAlert } from "../../common/UsageStatsAlert"; import SpeedTools from "../../components/SpeedTools"; import Logo from "../../logo.svg"; @@ -130,9 +131,9 @@ const BasicLayout = ( history.push("/")} + onClick={() => history.push("/legacy")} > - BACK TO LEGACY DASHBOARD + TO LEGACY DASHBOARD -
{children}
+
+ {children} + +
); }; diff --git a/dashboard/tests/cypress/e2e/test_render.cy.js b/dashboard/tests/cypress/e2e/test_render.cy.js index c0393d22f..80675ee96 100644 --- a/dashboard/tests/cypress/e2e/test_render.cy.js +++ b/dashboard/tests/cypress/e2e/test_render.cy.js @@ -2,7 +2,5 @@ describe('Ray Dashboard Test', () => { it('opens a new Ray dashboard', () => { cy.visit('localhost:8653') cy.contains('Ray') - cy.contains('Memory').click() - cy.contains('Tune').click() }) })