coder · brettkolodny · Apr 28, 2025 · Apr 28, 2025 · Apr 28, 2025 · Apr 28, 2025
diff --git a/site/package.json b/site/package.json
@@ -13,8 +13,9 @@
 		"dev": "vite",
 		"format": "biome format --write .",
 		"format:check": "biome format .",
-		"lint": "pnpm run lint:check && pnpm run lint:types",
+		"lint": "pnpm run lint:check && pnpm run lint:types && pnpm run lint:circular-deps",
 		"lint:check": " biome lint --error-on-warnings .",
+		"lint:circular-deps": "dpdm --no-tree --no-warning -T ./src/App.tsx",
 		"lint:fix": " biome lint --error-on-warnings --write .",
 		"lint:types": "tsc -p .",
 		"playwright:install": "playwright install --with-deps chromium",
@@ -171,6 +172,7 @@
 		"@vitejs/plugin-react": "4.3.4",
 		"autoprefixer": "10.4.20",
 		"chromatic": "11.25.2",
+		"dpdm": "3.14.0",
 		"express": "4.21.2",
 		"jest": "29.7.0",
 		"jest-canvas-mock": "2.5.2",

diff --git a/site/pnpm-lock.yaml b/site/pnpm-lock.yaml
diff --git a/site/src/components/Filter/UserFilter.tsx b/site/src/components/Filter/UserFilter.tsx
@@ -5,7 +5,7 @@ import {
 	type SelectFilterOption,
 	SelectFilterSearch,
 } from "components/Filter/SelectFilter";
-import { useAuthenticated } from "contexts/auth/RequireAuth";
+import { useAuthenticated } from "hooks";
 import type { FC } from "react";
 import { type UseFilterMenuOptions, useFilterMenu } from "./menu";
 

diff --git a/site/src/contexts/ProxyContext.tsx b/site/src/contexts/ProxyContext.tsx
@@ -1,7 +1,7 @@
 import { API } from "api/api";
 import { cachedQuery } from "api/queries/util";
 import type { Region, WorkspaceProxy } from "api/typesGenerated";
-import { useAuthenticated } from "contexts/auth/RequireAuth";
+import { useAuthenticated } from "hooks";
 import { useEmbeddedMetadata } from "hooks/useEmbeddedMetadata";
 import {
 	type FC,

diff --git a/site/src/contexts/auth/RequireAuth.test.tsx b/site/src/contexts/auth/RequireAuth.test.tsx
@@ -1,4 +1,5 @@
 import { renderHook, screen } from "@testing-library/react";
+import { useAuthenticated } from "hooks";
 import { http, HttpResponse } from "msw";
 import type { FC, PropsWithChildren } from "react";
 import { QueryClientProvider } from "react-query";
@@ -9,7 +10,6 @@ import {
 } from "testHelpers/renderHelpers";
 import { server } from "testHelpers/server";
 import { AuthContext, type AuthContextValue } from "./AuthProvider";
-import { useAuthenticated } from "./RequireAuth";
 
 describe("RequireAuth", () => {
 	it("redirects to /login if user is not authenticated", async () => {

diff --git a/site/src/contexts/auth/RequireAuth.tsx b/site/src/contexts/auth/RequireAuth.tsx
@@ -6,7 +6,7 @@ import { DashboardProvider as ProductionDashboardProvider } from "modules/dashbo
 import { type FC, useEffect } from "react";
 import { Navigate, Outlet, useLocation } from "react-router-dom";
 import { embedRedirect } from "utils/redirect";
-import { type AuthContextValue, useAuthContext } from "./AuthProvider";
+import { useAuthContext } from "./AuthProvider";
 
 type RequireAuthProps = Readonly<{
 	ProxyProvider?: typeof ProductionProxyProvider;
@@ -81,28 +81,3 @@ export const RequireAuth: FC<RequireAuthProps> = ({
 		</DashboardProvider>
 	);
 };
-
-type RequireKeys<T, R extends keyof T> = Omit<T, R> & {
-	[K in keyof Pick<T, R>]-?: NonNullable<T[K]>;
-};
-
-// We can do some TS magic here but I would rather to be explicit on what
-// values are not undefined when authenticated
-type AuthenticatedAuthContextValue = RequireKeys<
-	AuthContextValue,
-	"user" | "permissions"
->;
-
-export const useAuthenticated = (): AuthenticatedAuthContextValue => {
-	const auth = useAuthContext();
-
-	if (!auth.user) {
-		throw new Error("User is not authenticated.");
-	}
-
-	if (!auth.permissions) {
-		throw new Error("Permissions are not available.");
-	}
-
-	return auth as AuthenticatedAuthContextValue;
-};
diff --git a/site/src/hooks/index.ts b/site/src/hooks/index.ts
@@ -1,3 +1,4 @@
+export * from "./useAuthenticated";
 export * from "./useClickable";
 export * from "./useClickableTableRow";
 export * from "./useClipboard";

diff --git a/site/src/hooks/useAuthenticated.tsx b/site/src/hooks/useAuthenticated.tsx
@@ -0,0 +1,29 @@
+import {
+	type AuthContextValue,
+	useAuthContext,
+} from "contexts/auth/AuthProvider";
+
+type RequireKeys<T, R extends keyof T> = Omit<T, R> & {
+	[K in keyof Pick<T, R>]-?: NonNullable<T[K]>;
+};
+
+// We can do some TS magic here but I would rather to be explicit on what
+// values are not undefined when authenticated
+type AuthenticatedAuthContextValue = RequireKeys<
+	AuthContextValue,
+	"user" | "permissions"
+>;
+
+export const useAuthenticated = (): AuthenticatedAuthContextValue => {
+	const auth = useAuthContext();
+
+	if (!auth.user) {
+		throw new Error("User is not authenticated.");
+	}
+
+	if (!auth.permissions) {
+		throw new Error("Permissions are not available.");
+	}
+
+	return auth as AuthenticatedAuthContextValue;
+};
diff --git a/site/src/modules/dashboard/DashboardLayout.tsx b/site/src/modules/dashboard/DashboardLayout.tsx
@@ -3,7 +3,7 @@ import Link from "@mui/material/Link";
 import Snackbar from "@mui/material/Snackbar";
 import { Button } from "components/Button/Button";
 import { Loader } from "components/Loader/Loader";
-import { useAuthenticated } from "contexts/auth/RequireAuth";
+import { useAuthenticated } from "hooks";
 import { AnnouncementBanners } from "modules/dashboard/AnnouncementBanners/AnnouncementBanners";
 import { LicenseBanner } from "modules/dashboard/LicenseBanner/LicenseBanner";
 import { type FC, type HTMLAttributes, Suspense } from "react";

diff --git a/site/src/modules/dashboard/DashboardProvider.tsx b/site/src/modules/dashboard/DashboardProvider.tsx
@@ -10,7 +10,7 @@ import type {
 } from "api/typesGenerated";
 import { ErrorAlert } from "components/Alert/ErrorAlert";
 import { Loader } from "components/Loader/Loader";
-import { useAuthenticated } from "contexts/auth/RequireAuth";
+import { useAuthenticated } from "hooks";
 import { useEmbeddedMetadata } from "hooks/useEmbeddedMetadata";
 import { canViewAnyOrganization } from "modules/permissions";
 import { type FC, type PropsWithChildren, createContext } from "react";

diff --git a/site/src/modules/dashboard/DeploymentBanner/DeploymentBanner.tsx b/site/src/modules/dashboard/DeploymentBanner/DeploymentBanner.tsx
@@ -1,6 +1,6 @@
 import { health } from "api/queries/debug";
 import { deploymentStats } from "api/queries/deployment";
-import { useAuthenticated } from "contexts/auth/RequireAuth";
+import { useAuthenticated } from "hooks";
 import type { FC } from "react";
 import { useQuery } from "react-query";
 import { DeploymentBannerView } from "./DeploymentBannerView";