diff --git a/cypress/integration/distroSettings/navigation.ts b/cypress/integration/distroSettings/navigation.ts index 8b0e39fd26..9d92d620e6 100644 --- a/cypress/integration/distroSettings/navigation.ts +++ b/cypress/integration/distroSettings/navigation.ts @@ -62,3 +62,11 @@ describe("using the distro dropdown", () => { }); }); }); + +describe("/distros redirect route", () => { + it("should redirect to the first distro available", () => { + cy.visit("/distros"); + cy.location("pathname").should("not.contain", "/distros"); + cy.location("pathname").should("eq", "/distro/localhost/settings/general"); + }); +}); diff --git a/src/components/Content/index.tsx b/src/components/Content/index.tsx index fb016acab5..b6df1ed174 100644 --- a/src/components/Content/index.tsx +++ b/src/components/Content/index.tsx @@ -1,5 +1,6 @@ import { Route, Routes, Navigate } from "react-router-dom"; import { + DistroSettingsRedirect, ProjectSettingsRedirect, UserPatchesRedirect, WaterfallCommitsRedirect, @@ -45,6 +46,10 @@ export const Content: React.FC = () => ( }> + } + /> } /> } /> }> diff --git a/src/components/Header/AuxiliaryDropdown.tsx b/src/components/Header/AuxiliaryDropdown.tsx index dc71cf8b53..84c7c1e8f3 100644 --- a/src/components/Header/AuxiliaryDropdown.tsx +++ b/src/components/Header/AuxiliaryDropdown.tsx @@ -18,7 +18,7 @@ export const AuxiliaryDropdown: React.FC = ({ projectIdentifier, }) => { const { sendEvent } = useNavbarAnalytics(); - const distro = useFirstDistro(); + const { distro } = useFirstDistro(); const menuItems = [ { diff --git a/src/components/Redirects/DistroSettingsRedirect.tsx b/src/components/Redirects/DistroSettingsRedirect.tsx new file mode 100644 index 0000000000..345f180668 --- /dev/null +++ b/src/components/Redirects/DistroSettingsRedirect.tsx @@ -0,0 +1,19 @@ +import { Navigate } from "react-router-dom"; +import { + getDistroSettingsRoute, + DistroSettingsTabRoutes, +} from "constants/routes"; +import { useFirstDistro } from "hooks"; + +export const DistroSettingsRedirect: React.FC = () => { + const { distro, loading } = useFirstDistro(); + + if (loading) { + return null; + } + return ( + + ); +}; diff --git a/src/components/Redirects/index.ts b/src/components/Redirects/index.ts index bfea8f8f1c..d8b9def686 100644 --- a/src/components/Redirects/index.ts +++ b/src/components/Redirects/index.ts @@ -1,8 +1,10 @@ +import { DistroSettingsRedirect } from "./DistroSettingsRedirect"; import { ProjectSettingsRedirect } from "./ProjectSettingsRedirect"; import { UserPatchesRedirect } from "./UserPatchesRedirect"; import { WaterfallCommitsRedirect } from "./WaterfallCommitsRedirect"; export { + DistroSettingsRedirect, ProjectSettingsRedirect, UserPatchesRedirect, WaterfallCommitsRedirect, diff --git a/src/constants/routes.ts b/src/constants/routes.ts index 777442bc65..34bf04c19c 100644 --- a/src/constants/routes.ts +++ b/src/constants/routes.ts @@ -56,6 +56,7 @@ const paths = { commits: "/commits", container: "/container", distro: "/distro", + distros: "/distros", host: "/host", hosts: "/hosts", jobLogs: "/job-logs", @@ -74,6 +75,7 @@ const paths = { waterfall: "/waterfall", }; export const redirectRoutes = { + distroSettings: paths.distros, projectSettings: paths.projects, userPatches: `${paths.user}/:id`, waterfall: `${paths.waterfall}/:projectIdentifier`, diff --git a/src/hooks/useFirstDistro.ts b/src/hooks/useFirstDistro.ts index 7c09714de3..fb0972b665 100644 --- a/src/hooks/useFirstDistro.ts +++ b/src/hooks/useFirstDistro.ts @@ -5,14 +5,17 @@ import { DISTROS } from "gql/queries"; /** * `useFirstDistro` returns the alphabetically first distro from Evergreen's list of distros. * This can be used to generate a general link to distro settings. - * @returns the distro ID + * @returns an object containing the distro ID (string) and loading state (boolean) */ export const useFirstDistro = () => { - const { data } = useQuery(DISTROS, { - variables: { - onlySpawnable: false, - }, - }); + const { data, loading } = useQuery( + DISTROS, + { + variables: { + onlySpawnable: false, + }, + } + ); - return data?.distros?.[0]?.name ?? "ubuntu2204-large"; + return { distro: data?.distros?.[0]?.name ?? "ubuntu2204-large", loading }; };