fix(site): resolve circular dependency (#23517)

Super unclear why CI hates me and only [fails
lint](https://github.com/coder/coder/actions/runs/23504799702/job/68409588632?pr=23385)
for me (I feel personally attacked), but `dpdm` detected a circular
dependency between the WorkspaceSettingPage and its Sidebar in my other
branch. They both wanted the same context/hook combo, so easy solve to
move the hook/context into a third module to resolve the circular dep.

site/src/pages/WorkspaceSettingsPage/Sidebar.tsx

@@ -11,7 +11,7 @@ import {
 	TimerIcon as ScheduleIcon,
 	Users as SharingIcon,
 } from "lucide-react";
-import { useWorkspaceSettings } from "./WorkspaceSettingsLayout";
+import { useWorkspaceSettings } from "./useWorkspaceSettings";
 
 export const Sidebar: React.FC = () => {
 	const { owner, workspace, permissions } = useWorkspaceSettings();

site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersExperimentRouter.tsx

@@ -1,5 +1,5 @@
 import type { FC } from "react";
-import { useWorkspaceSettings } from "../WorkspaceSettingsLayout";
+import { useWorkspaceSettings } from "../useWorkspaceSettings";
 import WorkspaceParametersPage from "./WorkspaceParametersPage";
 import WorkspaceParametersPageExperimental from "./WorkspaceParametersPageExperimental";
 

site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.tsx

@@ -22,7 +22,7 @@ import {
 	type WorkspacePermissions,
 	workspaceChecks,
 } from "../../../modules/workspaces/permissions";
-import { useWorkspaceSettings } from "../WorkspaceSettingsLayout";
+import { useWorkspaceSettings } from "../useWorkspaceSettings";
 import {
 	WorkspaceParametersForm,
 	type WorkspaceParametersFormValues,

site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPageExperimental.tsx

@@ -29,7 +29,7 @@ import {
 	type WorkspacePermissions,
 	workspaceChecks,
 } from "../../../modules/workspaces/permissions";
-import { useWorkspaceSettings } from "../WorkspaceSettingsLayout";
+import { useWorkspaceSettings } from "../useWorkspaceSettings";
 import { WorkspaceParametersPageViewExperimental } from "./WorkspaceParametersPageViewExperimental";
 
 const WorkspaceParametersPageExperimental: FC = () => {

site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx

@@ -15,13 +15,13 @@ import {
 	scheduleToAutostart,
 } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule";
 import { ttlMsToAutostop } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/ttl";
-import { useWorkspaceSettings } from "pages/WorkspaceSettingsPage/WorkspaceSettingsLayout";
 import { type FC, useState } from "react";
 import { useMutation, useQuery, useQueryClient } from "react-query";
 import { useNavigate, useParams } from "react-router";
 import { toast } from "sonner";
 import { docs } from "utils/docs";
 import { pageTitle } from "utils/page";
+import { useWorkspaceSettings } from "#/pages/WorkspaceSettingsPage/useWorkspaceSettings";
 import {
 	formValuesToAutostartRequest,
 	formValuesToTTLRequest,

site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsLayout.tsx

@@ -2,38 +2,16 @@ import {
 	workspaceByOwnerAndName,
 	workspacePermissions,
 } from "api/queries/workspaces";
-import type { Workspace } from "api/typesGenerated";
 import { ErrorAlert } from "components/Alert/ErrorAlert";
 import { Loader } from "components/Loader/Loader";
 import { Margins } from "components/Margins/Margins";
 import { Stack } from "components/Stack/Stack";
-import type { WorkspacePermissions } from "modules/workspaces/permissions";
-import { createContext, type FC, Suspense, useContext } from "react";
+import { type FC, Suspense } from "react";
 import { useQuery } from "react-query";
 import { Outlet, useParams } from "react-router";
 import { pageTitle } from "utils/page";
 import { Sidebar } from "./Sidebar";
-
-type WorkspaceSettingsContext = {
-	owner: string;
-	workspace: Workspace;
-	permissions?: WorkspacePermissions;
-};
-
-const WorkspaceSettings = createContext<WorkspaceSettingsContext | undefined>(
-	undefined,
-);
-
-export function useWorkspaceSettings() {
-	const value = useContext(WorkspaceSettings);
-	if (!value) {
-		throw new Error(
-			"This hook can only be used from a workspace settings page",
-		);
-	}
-
-	return value;
-}
+import { WorkspaceSettings } from "./useWorkspaceSettings";
 
 export const WorkspaceSettingsLayout: FC = () => {
 	const params = useParams() as {

site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.tsx

@@ -4,8 +4,8 @@ import { useMutation } from "react-query";
 import { useNavigate, useParams } from "react-router";
 import { toast } from "sonner";
 import { pageTitle } from "utils/page";
+import { useWorkspaceSettings } from "./useWorkspaceSettings";
 import type { WorkspaceSettingsFormValues } from "./WorkspaceSettingsForm";
-import { useWorkspaceSettings } from "./WorkspaceSettingsLayout";
 import { WorkspaceSettingsPageView } from "./WorkspaceSettingsPageView";
 
 const WorkspaceSettingsPage: FC = () => {

site/src/pages/WorkspaceSettingsPage/WorkspaceSharingPage/WorkspaceSharingPage.tsx

@@ -7,7 +7,7 @@ import type { FC } from "react";
 import { useQuery } from "react-query";
 import { docs } from "utils/docs";
 import { pageTitle } from "utils/page";
-import { useWorkspaceSettings } from "../WorkspaceSettingsLayout";
+import { useWorkspaceSettings } from "../useWorkspaceSettings";
 import { WorkspaceSharingPageView } from "./WorkspaceSharingPageView";
 
 const WorkspaceSharingPage: FC = () => {

site/src/pages/WorkspaceSettingsPage/useWorkspaceSettings.ts

@@ -0,0 +1,24 @@
+import { createContext, useContext } from "react";
+import type { Workspace } from "#/api/typesGenerated";
+import type { WorkspacePermissions } from "#/modules/workspaces/permissions";
+
+type WorkspaceSettingsContext = {
+	owner: string;
+	workspace: Workspace;
+	permissions?: WorkspacePermissions;
+};
+
+export const WorkspaceSettings = createContext<
+	WorkspaceSettingsContext | undefined
+>(undefined);
+
+export function useWorkspaceSettings() {
+	const value = useContext(WorkspaceSettings);
+	if (!value) {
+		throw new Error(
+			"This hook can only be used from a workspace settings page",
+		);
+	}
+
+	return value;
+}