diff --git a/Makefile b/Makefile index 6205bca0e4..2dbff53cf4 100644 --- a/Makefile +++ b/Makefile @@ -382,32 +382,44 @@ install: build/coder_$(VERSION)_$(GOOS)_$(GOARCH)$(GOOS_BIN_EXT) cp "$<" "$$output_file" .PHONY: install -fmt: fmt/prettier fmt/terraform fmt/shfmt fmt/go +BOLD := $(shell tput bold) +GREEN := $(shell tput setaf 2) +RESET := $(shell tput sgr0) + +fmt: fmt/eslint fmt/prettier fmt/terraform fmt/shfmt fmt/go .PHONY: fmt fmt/go: + echo "$(GREEN)==>$(RESET) $(BOLD)fmt/go$(RESET)" # VS Code users should check out # https://github.com/mvdan/gofumpt#visual-studio-code go run mvdan.cc/gofumpt@v0.4.0 -w -l . .PHONY: fmt/go +fmt/eslint: + echo "$(GREEN)==>$(RESET) $(BOLD)fmt/eslint$(RESET)" + cd site + pnpm run lint:fix +.PHONY: fmt/eslint + fmt/prettier: - echo "--- prettier" + echo "$(GREEN)==>$(RESET) $(BOLD)fmt/prettier$(RESET)" cd site # Avoid writing files in CI to reduce file write activity ifdef CI pnpm run format:check else - pnpm run format:write + pnpm run format endif .PHONY: fmt/prettier fmt/terraform: $(wildcard *.tf) + echo "$(GREEN)==>$(RESET) $(BOLD)fmt/terraform$(RESET)" terraform fmt -recursive .PHONY: fmt/terraform fmt/shfmt: $(SHELL_SRC_FILES) - echo "--- shfmt" + echo "$(GREEN)==>$(RESET) $(BOLD)fmt/shfmt$(RESET)" # Only do diff check in CI, errors on diff. ifdef CI shfmt -d $(SHELL_SRC_FILES) @@ -574,7 +586,7 @@ provisionerd/proto/provisionerd.pb.go: provisionerd/proto/provisionerd.proto site/src/api/typesGenerated.ts: $(wildcard scripts/apitypings/*) $(shell find ./codersdk $(FIND_EXCLUSIONS) -type f -name '*.go') go run ./scripts/apitypings/ > $@ - pnpm run format:write:only "$@" + pnpm exec prettier --write "$@" site/e2e/provisionerGenerated.ts: provisionerd/proto/provisionerd.pb.go provisionersdk/proto/provisioner.pb.go cd site @@ -583,7 +595,7 @@ site/e2e/provisionerGenerated.ts: provisionerd/proto/provisionerd.pb.go provisio site/src/theme/icons.json: $(wildcard scripts/gensite/*) $(wildcard site/static/icon/*) go run ./scripts/gensite/ -icons "$@" - pnpm run format:write:only "$@" + pnpm exec prettier --write "$@" examples/examples.gen.json: scripts/examplegen/main.go examples/examples.go $(shell find ./examples/templates) go run ./scripts/examplegen/main.go > examples/examples.gen.json @@ -593,19 +605,19 @@ coderd/rbac/object_gen.go: scripts/rbacgen/main.go coderd/rbac/object.go docs/admin/prometheus.md: scripts/metricsdocgen/main.go scripts/metricsdocgen/metrics go run scripts/metricsdocgen/main.go - pnpm run format:write:only ./docs/admin/prometheus.md + pnpm exec prettier --write ./docs/admin/prometheus.md docs/cli.md: scripts/clidocgen/main.go examples/examples.gen.json $(GO_SRC_FILES) CI=true BASE_PATH="." go run ./scripts/clidocgen - pnpm run format:write:only ./docs/cli.md ./docs/cli/*.md ./docs/manifest.json + pnpm exec prettier --write ./docs/cli.md ./docs/cli/*.md ./docs/manifest.json docs/admin/audit-logs.md: coderd/database/querier.go scripts/auditdocgen/main.go enterprise/audit/table.go coderd/rbac/object_gen.go go run scripts/auditdocgen/main.go - pnpm run format:write:only ./docs/admin/audit-logs.md + pnpm exec prettier --write ./docs/admin/audit-logs.md coderd/apidoc/swagger.json: $(shell find ./scripts/apidocgen $(FIND_EXCLUSIONS) -type f) $(wildcard coderd/*.go) $(wildcard enterprise/coderd/*.go) $(wildcard codersdk/*.go) $(wildcard enterprise/wsproxy/wsproxysdk/*.go) $(DB_GEN_FILES) .swaggo docs/manifest.json coderd/rbac/object_gen.go ./scripts/apidocgen/generate.sh - pnpm run format:write:only ./docs/api ./docs/manifest.json ./coderd/apidoc/swagger.json + pnpm exec prettier --write ./docs/api ./docs/manifest.json ./coderd/apidoc/swagger.json update-golden-files: \ cli/testdata/.gen-golden \ diff --git a/offlinedocs/package.json b/offlinedocs/package.json index 1799d6ce53..e5a9b5fd8e 100644 --- a/offlinedocs/package.json +++ b/offlinedocs/package.json @@ -4,15 +4,14 @@ "private": true, "scripts": { "dev": "pnpm copy-images && next dev", - "build": "pnpm exec next build", - "start": "pnpm exec next start", + "build": "next build", + "start": "next start", "export": "pnpm copy-images && next build", "copy-images": "sh ./scripts/copyImages.sh", "lint": "pnpm run lint:types", - "lint:fix": "FIX=true pnpm lint", - "lint:types": "pnpm exec tsc --noEmit", - "format:check": "pnpm exec prettier --cache --check './**/*.{css,html,js,json,jsx,md,ts,tsx,yaml,yml}'", - "format:write": "pnpm exec prettier --cache --write './**/*.{css,html,js,json,jsx,md,ts,tsx,yaml,yml}'" + "lint:types": "tsc --noEmit", + "format": "prettier --cache --write './**/*.{css,html,js,json,jsx,md,ts,tsx,yaml,yml}'", + "format:check": "prettier --cache --check './**/*.{css,html,js,json,jsx,md,ts,tsx,yaml,yml}'" }, "dependencies": { "@chakra-ui/react": "2.8.0", diff --git a/package.json b/package.json index 2286328d39..e24ef62c3f 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,8 @@ "name": "coder", "version": "0.0.0", "scripts": { - "format:write:only": "prettier --cache --write" + "format": "prettier --cache --write", + "storybook": "pnpm run -C site/ storybook" }, "devDependencies": { "prettier": "3.0.0" diff --git a/site/.eslintrc.yaml b/site/.eslintrc.yaml index 78da4dd93f..b28b1bac77 100644 --- a/site/.eslintrc.yaml +++ b/site/.eslintrc.yaml @@ -52,9 +52,6 @@ overrides: testing-library/prefer-screen-queries: "off" root: true rules: - "@typescript-eslint/brace-style": - ["error", "1tbs", { "allowSingleLine": false }] - "@typescript-eslint/method-signature-style": ["error", "property"] # TODO: Investigate whether to enable this rule & fix and/or disable all its complaints "@typescript-eslint/no-misused-promises": "off" # TODO: Investigate whether to enable this rule & fix and/or disable all its complaints @@ -75,6 +72,14 @@ rules: "@typescript-eslint/restrict-template-expressions": "off" # TODO: Investigate whether to enable this rule & fix and/or disable all its complaints "@typescript-eslint/unbound-method": "off" + + "@typescript-eslint/brace-style": + ["error", "1tbs", { "allowSingleLine": false }] + "@typescript-eslint/consistent-type-imports": + - error + - fixStyle: inline-type-imports + "@typescript-eslint/method-signature-style": ["error", "property"] + "@typescript-eslint/no-import-type-side-effects": "error" # We're disabling the `no-namespace` rule to use a pattern of defining an interface, # and then defining functions that operate on that data via namespace. This is helpful for # dealing with immutable objects. This is a common pattern that shows up in some other @@ -104,6 +109,13 @@ rules: import/no-named-as-default: "off" import/no-named-as-default-member: "off" import/prefer-default-export: "off" + import/order: + - error + - groups: [["builtin", "external"], "internal", "parent"] + newlines-between: never + alphabetize: + order: asc + caseInsensitive: true jest/no-focused-tests: "error" jsx-a11y/label-has-for: "off" jsx-a11y/no-autofocus: "off" diff --git a/site/e2e/global.setup.ts b/site/e2e/global.setup.ts index 2472c85c54..11dc99923a 100644 --- a/site/e2e/global.setup.ts +++ b/site/e2e/global.setup.ts @@ -1,7 +1,7 @@ import { test, expect } from "@playwright/test"; +import { Language } from "pages/CreateUserPage/CreateUserForm"; import * as constants from "./constants"; import { STORAGE_STATE } from "./playwright.config"; -import { Language } from "pages/CreateUserPage/CreateUserForm"; test("setup first user", async ({ page }) => { await page.goto("/", { waitUntil: "domcontentloaded" }); diff --git a/site/e2e/helpers.ts b/site/e2e/helpers.ts index b753226240..d42ab90fb5 100644 --- a/site/e2e/helpers.ts +++ b/site/e2e/helpers.ts @@ -1,30 +1,30 @@ -import { expect, Page } from "@playwright/test"; -import { ChildProcess, exec, spawn } from "child_process"; +import { expect, type Page } from "@playwright/test"; +import axios from "axios"; +import { type ChildProcess, exec, spawn } from "child_process"; import { randomUUID } from "crypto"; -import path from "path"; import express from "express"; -import { TarWriter } from "utils/tar"; -import { - Agent, - App, - AppSharingLevel, - Response, - ParseComplete, - PlanComplete, - ApplyComplete, - Resource, - RichParameter, -} from "./provisionerGenerated"; -import { prometheusPort, agentPProfPort } from "./constants"; -import { port } from "./playwright.config"; +import capitalize from "lodash/capitalize"; +import path from "path"; import * as ssh from "ssh2"; import { Duplex } from "stream"; -import { +import type { WorkspaceBuildParameter, UpdateTemplateMeta, } from "api/typesGenerated"; -import axios from "axios"; -import capitalize from "lodash/capitalize"; +import { TarWriter } from "utils/tar"; +import { prometheusPort, agentPProfPort } from "./constants"; +import { port } from "./playwright.config"; +import { + Agent, + type App, + AppSharingLevel, + type ParseComplete, + type PlanComplete, + type ApplyComplete, + type Resource, + Response, + type RichParameter, +} from "./provisionerGenerated"; // createWorkspace creates a workspace for a template. // It does not wait for it to be running, but it does navigate to the page. diff --git a/site/e2e/hooks.ts b/site/e2e/hooks.ts index c6031bd18a..0fc483319a 100644 --- a/site/e2e/hooks.ts +++ b/site/e2e/hooks.ts @@ -1,4 +1,4 @@ -import { Page } from "@playwright/test"; +import type { Page } from "@playwright/test"; export const beforeCoderTest = async (page: Page) => { // eslint-disable-next-line no-console -- Show everything that was printed with console.log() diff --git a/site/e2e/parameters.ts b/site/e2e/parameters.ts index 47048d3468..f7e02ad20f 100644 --- a/site/e2e/parameters.ts +++ b/site/e2e/parameters.ts @@ -1,4 +1,4 @@ -import { RichParameter } from "./provisionerGenerated"; +import type { RichParameter } from "./provisionerGenerated"; // Rich parameters diff --git a/site/e2e/pom/BasePom.ts b/site/e2e/pom/BasePom.ts index 771181ed5e..8c371637a8 100644 --- a/site/e2e/pom/BasePom.ts +++ b/site/e2e/pom/BasePom.ts @@ -1,4 +1,4 @@ -import { Page } from "@playwright/test"; +import type { Page } from "@playwright/test"; export abstract class BasePom { protected readonly baseURL: string | undefined; diff --git a/site/e2e/pom/SignInPage.ts b/site/e2e/pom/SignInPage.ts index 9b24793f9a..365a3b941b 100644 --- a/site/e2e/pom/SignInPage.ts +++ b/site/e2e/pom/SignInPage.ts @@ -1,4 +1,4 @@ -import { Page } from "@playwright/test"; +import type { Page } from "@playwright/test"; import { BasePom } from "./BasePom"; export class SignInPage extends BasePom { diff --git a/site/e2e/pom/WorkspacesPage.ts b/site/e2e/pom/WorkspacesPage.ts index 9c2bae81d2..1a1fbc0cfe 100644 --- a/site/e2e/pom/WorkspacesPage.ts +++ b/site/e2e/pom/WorkspacesPage.ts @@ -1,4 +1,4 @@ -import { Page } from "@playwright/test"; +import type { Page } from "@playwright/test"; import { BasePom } from "./BasePom"; export class WorkspacesPage extends BasePom { diff --git a/site/e2e/reporter.ts b/site/e2e/reporter.ts index e0cdfa8870..223ea8a34a 100644 --- a/site/e2e/reporter.ts +++ b/site/e2e/reporter.ts @@ -1,5 +1,4 @@ /* eslint-disable no-console -- Logging is sort of the whole point here */ -import * as fs from "fs/promises"; import type { FullConfig, Suite, @@ -10,6 +9,7 @@ import type { TestError, } from "@playwright/test/reporter"; import axios from "axios"; +import * as fs from "fs/promises"; import type { Writable } from "stream"; class CoderReporter implements Reporter { diff --git a/site/e2e/tests/createWorkspace.spec.ts b/site/e2e/tests/createWorkspace.spec.ts index 5e435340f3..6a8b4ab7ad 100644 --- a/site/e2e/tests/createWorkspace.spec.ts +++ b/site/e2e/tests/createWorkspace.spec.ts @@ -5,7 +5,7 @@ import { echoResponsesWithParameters, verifyParameters, } from "../helpers"; - +import { beforeCoderTest } from "../hooks"; import { secondParameter, fourthParameter, @@ -16,8 +16,7 @@ import { sixthParameter, randParamName, } from "../parameters"; -import { RichParameter } from "../provisionerGenerated"; -import { beforeCoderTest } from "../hooks"; +import type { RichParameter } from "../provisionerGenerated"; test.beforeEach(async ({ page }) => await beforeCoderTest(page)); diff --git a/site/e2e/tests/externalAuth.spec.ts b/site/e2e/tests/externalAuth.spec.ts index 5480ad4b59..941fac9914 100644 --- a/site/e2e/tests/externalAuth.spec.ts +++ b/site/e2e/tests/externalAuth.spec.ts @@ -1,7 +1,7 @@ +import type { Endpoints } from "@octokit/types"; import { test } from "@playwright/test"; +import type { ExternalAuthDevice } from "api/typesGenerated"; import { gitAuth } from "../constants"; -import { Endpoints } from "@octokit/types"; -import { ExternalAuthDevice } from "api/typesGenerated"; import { Awaiter, createServer } from "../helpers"; import { beforeCoderTest } from "../hooks"; diff --git a/site/e2e/tests/restartWorkspace.spec.ts b/site/e2e/tests/restartWorkspace.spec.ts index a0710e96fd..1e066aea0b 100644 --- a/site/e2e/tests/restartWorkspace.spec.ts +++ b/site/e2e/tests/restartWorkspace.spec.ts @@ -6,10 +6,9 @@ import { echoResponsesWithParameters, verifyParameters, } from "../helpers"; - -import { firstBuildOption, secondBuildOption } from "../parameters"; -import { RichParameter } from "../provisionerGenerated"; import { beforeCoderTest } from "../hooks"; +import { firstBuildOption, secondBuildOption } from "../parameters"; +import type { RichParameter } from "../provisionerGenerated"; test.beforeEach(async ({ page }) => await beforeCoderTest(page)); diff --git a/site/e2e/tests/startWorkspace.spec.ts b/site/e2e/tests/startWorkspace.spec.ts index be1cc5a5d7..054bbf1721 100644 --- a/site/e2e/tests/startWorkspace.spec.ts +++ b/site/e2e/tests/startWorkspace.spec.ts @@ -7,9 +7,8 @@ import { stopWorkspace, verifyParameters, } from "../helpers"; - import { firstBuildOption, secondBuildOption } from "../parameters"; -import { RichParameter } from "../provisionerGenerated"; +import type { RichParameter } from "../provisionerGenerated"; test("start workspace with ephemeral parameters", async ({ page }) => { const richParameters: RichParameter[] = [firstBuildOption, secondBuildOption]; diff --git a/site/e2e/tests/updateWorkspace.spec.ts b/site/e2e/tests/updateWorkspace.spec.ts index b8e3d51d45..5de1c42e01 100644 --- a/site/e2e/tests/updateWorkspace.spec.ts +++ b/site/e2e/tests/updateWorkspace.spec.ts @@ -1,5 +1,4 @@ import { test } from "@playwright/test"; - import { createTemplate, createWorkspace, @@ -9,7 +8,7 @@ import { updateWorkspaceParameters, verifyParameters, } from "../helpers"; - +import { beforeCoderTest } from "../hooks"; import { fifthParameter, firstParameter, @@ -17,8 +16,7 @@ import { sixthParameter, secondBuildOption, } from "../parameters"; -import { RichParameter } from "../provisionerGenerated"; -import { beforeCoderTest } from "../hooks"; +import type { RichParameter } from "../provisionerGenerated"; test.beforeEach(async ({ page }) => await beforeCoderTest(page)); diff --git a/site/e2e/tests/webTerminal.spec.ts b/site/e2e/tests/webTerminal.spec.ts index fd2a8dd32a..969f659e99 100644 --- a/site/e2e/tests/webTerminal.spec.ts +++ b/site/e2e/tests/webTerminal.spec.ts @@ -1,11 +1,11 @@ import { test } from "@playwright/test"; +import { randomUUID } from "crypto"; import { createTemplate, createWorkspace, startAgent, stopAgent, } from "../helpers"; -import { randomUUID } from "crypto"; import { beforeCoderTest } from "../hooks"; test.beforeEach(async ({ page }) => await beforeCoderTest(page)); diff --git a/site/jest.setup.ts b/site/jest.setup.ts index 6e1da6fb24..b584fb3841 100644 --- a/site/jest.setup.ts +++ b/site/jest.setup.ts @@ -1,14 +1,14 @@ import "@testing-library/jest-dom"; -import { cleanup } from "@testing-library/react"; -import crypto from "crypto"; -import { server } from "testHelpers/server"; import "jest-location-mock"; -import { TextEncoder, TextDecoder } from "util"; +import { cleanup } from "@testing-library/react"; import { Blob } from "buffer"; +import crypto from "crypto"; import jestFetchMock from "jest-fetch-mock"; -import { ProxyLatencyReport } from "contexts/useProxyLatency"; -import { Region } from "api/typesGenerated"; import { useMemo } from "react"; +import { TextEncoder, TextDecoder } from "util"; +import type { Region } from "api/typesGenerated"; +import type { ProxyLatencyReport } from "contexts/useProxyLatency"; +import { server } from "testHelpers/server"; jestFetchMock.enableMocks(); diff --git a/site/package.json b/site/package.json index 96c0702183..d2b3d72824 100644 --- a/site/package.json +++ b/site/package.json @@ -9,11 +9,10 @@ "check:all": "pnpm format:check && pnpm lint && pnpm test", "chromatic": "chromatic", "dev": "vite", + "format": "prettier --cache --write '../**/*.{css,html,js,json,jsx,md,ts,tsx,yaml,yml}'", "format:check": "prettier --cache --check '../**/*.{css,html,js,json,jsx,md,ts,tsx,yaml,yml}'", - "format:write": "prettier --cache --write '../**/*.{css,html,js,json,jsx,md,ts,tsx,yaml,yml}'", - "format:write:only": "prettier --cache --write", - "lint": "pnpm run lint:types && pnpm exec jest --selectProjects lint", - "lint:fix": "FIX=true pnpm lint", + "lint": "pnpm run lint:types && jest --selectProjects lint", + "lint:fix": "eslint --fix e2e/ src/", "lint:types": "tsc -p .", "playwright:install": "playwright install --with-deps chromium", "playwright:test": "playwright test --config=e2e/playwright.config.ts", diff --git a/site/src/@types/storybook.d.ts b/site/src/@types/storybook.d.ts index 8aada49bf9..9015511041 100644 --- a/site/src/@types/storybook.d.ts +++ b/site/src/@types/storybook.d.ts @@ -1,6 +1,6 @@ import * as _storybook_types from "@storybook/react"; -import { Experiments, FeatureName } from "api/typesGenerated"; -import { QueryKey } from "react-query"; +import type { QueryKey } from "react-query"; +import type { Experiments, FeatureName } from "api/typesGenerated"; declare module "@storybook/react" { interface Parameters { diff --git a/site/src/App.tsx b/site/src/App.tsx index 952f7c0920..9b0a554b10 100644 --- a/site/src/App.tsx +++ b/site/src/App.tsx @@ -1,14 +1,14 @@ -import { QueryClient, QueryClientProvider } from "react-query"; -import { type FC, type ReactNode, useEffect, useState } from "react"; -import { HelmetProvider } from "react-helmet-async"; -import { router } from "./router"; -import { ThemeProvider } from "./contexts/ThemeProvider"; -import { AuthProvider } from "./contexts/auth/AuthProvider"; -import { ErrorBoundary } from "./components/ErrorBoundary/ErrorBoundary"; -import { GlobalSnackbar } from "./components/GlobalSnackbar/GlobalSnackbar"; import "./theme/globalFonts"; import { ReactQueryDevtools } from "@tanstack/react-query-devtools"; +import { type FC, type ReactNode, useEffect, useState } from "react"; +import { HelmetProvider } from "react-helmet-async"; +import { QueryClient, QueryClientProvider } from "react-query"; import { RouterProvider } from "react-router-dom"; +import { ErrorBoundary } from "./components/ErrorBoundary/ErrorBoundary"; +import { GlobalSnackbar } from "./components/GlobalSnackbar/GlobalSnackbar"; +import { AuthProvider } from "./contexts/auth/AuthProvider"; +import { ThemeProvider } from "./contexts/ThemeProvider"; +import { router } from "./router"; const defaultQueryClient = new QueryClient({ defaultOptions: { diff --git a/site/src/__mocks__/react-markdown.tsx b/site/src/__mocks__/react-markdown.tsx index 35af964260..1d2f3dad03 100644 --- a/site/src/__mocks__/react-markdown.tsx +++ b/site/src/__mocks__/react-markdown.tsx @@ -1,4 +1,4 @@ -import { FC, PropsWithChildren } from "react"; +import type { FC, PropsWithChildren } from "react"; const ReactMarkdown: FC = ({ children }) => { return
{children}
; diff --git a/site/src/api/api.test.ts b/site/src/api/api.test.ts index 11d00d216f..e755d241cb 100644 --- a/site/src/api/api.test.ts +++ b/site/src/api/api.test.ts @@ -8,7 +8,7 @@ import { MockWorkspaceBuildParameter1, } from "testHelpers/entities"; import * as api from "./api"; -import * as TypesGen from "./typesGenerated"; +import type * as TypesGen from "./typesGenerated"; describe("api.ts", () => { describe("login", () => { diff --git a/site/src/api/api.ts b/site/src/api/api.ts index 4acd2b3f15..c550cdecde 100644 --- a/site/src/api/api.ts +++ b/site/src/api/api.ts @@ -1,10 +1,10 @@ import axios, { isAxiosError } from "axios"; -import dayjs from "dayjs"; +import type dayjs from "dayjs"; +import userAgentParser from "ua-parser-js"; +import { delay } from "utils/delay"; import * as TypesGen from "./typesGenerated"; // This needs to include the `../`, otherwise it breaks when importing into // vscode-coder. -import { delay } from "../utils/delay"; -import userAgentParser from "ua-parser-js"; // Adds 304 for the default axios validateStatus function // https://github.com/axios/axios#handling-errors Check status here diff --git a/site/src/api/errors.ts b/site/src/api/errors.ts index 6b2abbcc47..7773a84efe 100644 --- a/site/src/api/errors.ts +++ b/site/src/api/errors.ts @@ -1,4 +1,4 @@ -import axios, { AxiosError, AxiosResponse } from "axios"; +import axios, { type AxiosError, type AxiosResponse } from "axios"; const Language = { errorsByCode: { diff --git a/site/src/api/queries/appearance.ts b/site/src/api/queries/appearance.ts index 10366b4382..c81e01dbb9 100644 --- a/site/src/api/queries/appearance.ts +++ b/site/src/api/queries/appearance.ts @@ -1,6 +1,6 @@ -import { QueryClient, type UseQueryOptions } from "react-query"; +import type { QueryClient, UseQueryOptions } from "react-query"; import * as API from "api/api"; -import { type AppearanceConfig } from "api/typesGenerated"; +import type { AppearanceConfig } from "api/typesGenerated"; import { getMetadataAsJSON } from "utils/metadata"; const initialAppearanceData = getMetadataAsJSON("appearance"); diff --git a/site/src/api/queries/audits.ts b/site/src/api/queries/audits.ts index b469e7749b..6430767480 100644 --- a/site/src/api/queries/audits.ts +++ b/site/src/api/queries/audits.ts @@ -1,7 +1,7 @@ import { getAuditLogs } from "api/api"; -import { type AuditLogResponse } from "api/typesGenerated"; +import type { AuditLogResponse } from "api/typesGenerated"; import { useFilterParamsKey } from "components/Filter/filter"; -import { type UsePaginatedQueryOptions } from "hooks/usePaginatedQuery"; +import type { UsePaginatedQueryOptions } from "hooks/usePaginatedQuery"; export function paginatedAudits( searchParams: URLSearchParams, diff --git a/site/src/api/queries/authCheck.ts b/site/src/api/queries/authCheck.ts index 415c7676ea..be9e726ae0 100644 --- a/site/src/api/queries/authCheck.ts +++ b/site/src/api/queries/authCheck.ts @@ -1,5 +1,5 @@ -import { AuthorizationRequest } from "api/typesGenerated"; import * as API from "api/api"; +import type { AuthorizationRequest } from "api/typesGenerated"; export const AUTHORIZATION_KEY = "authorization"; diff --git a/site/src/api/queries/buildInfo.ts b/site/src/api/queries/buildInfo.ts index 58e61575ef..b0761f001d 100644 --- a/site/src/api/queries/buildInfo.ts +++ b/site/src/api/queries/buildInfo.ts @@ -1,6 +1,6 @@ -import { type UseQueryOptions } from "react-query"; -import { type BuildInfoResponse } from "api/typesGenerated"; +import type { UseQueryOptions } from "react-query"; import * as API from "api/api"; +import type { BuildInfoResponse } from "api/typesGenerated"; import { getMetadataAsJSON } from "utils/metadata"; const initialBuildInfoData = getMetadataAsJSON("build-info"); diff --git a/site/src/api/queries/debug.ts b/site/src/api/queries/debug.ts index e8a5d447a2..1fba00c172 100644 --- a/site/src/api/queries/debug.ts +++ b/site/src/api/queries/debug.ts @@ -1,6 +1,6 @@ +import type { QueryClient, UseMutationOptions } from "react-query"; import * as API from "api/api"; -import { HealthSettings, UpdateHealthSettings } from "api/typesGenerated"; -import { QueryClient, UseMutationOptions } from "react-query"; +import type { HealthSettings, UpdateHealthSettings } from "api/typesGenerated"; export const HEALTH_QUERY_KEY = ["health"]; export const HEALTH_QUERY_SETTINGS_KEY = ["health", "settings"]; diff --git a/site/src/api/queries/entitlements.ts b/site/src/api/queries/entitlements.ts index 6cb0bf9c25..d92b81cec6 100644 --- a/site/src/api/queries/entitlements.ts +++ b/site/src/api/queries/entitlements.ts @@ -1,6 +1,6 @@ -import { QueryClient, UseQueryOptions } from "react-query"; +import type { QueryClient, UseQueryOptions } from "react-query"; import * as API from "api/api"; -import { Entitlements } from "api/typesGenerated"; +import type { Entitlements } from "api/typesGenerated"; import { getMetadataAsJSON } from "utils/metadata"; const initialEntitlementsData = getMetadataAsJSON("entitlements"); diff --git a/site/src/api/queries/experiments.ts b/site/src/api/queries/experiments.ts index aa12d51524..1f7e04901a 100644 --- a/site/src/api/queries/experiments.ts +++ b/site/src/api/queries/experiments.ts @@ -1,7 +1,7 @@ +import type { UseQueryOptions } from "react-query"; import * as API from "api/api"; +import type { Experiments } from "api/typesGenerated"; import { getMetadataAsJSON } from "utils/metadata"; -import { type Experiments } from "api/typesGenerated"; -import { type UseQueryOptions } from "react-query"; const initialExperimentsData = getMetadataAsJSON("experiments"); const experimentsKey = ["experiments"] as const; diff --git a/site/src/api/queries/externalAuth.ts b/site/src/api/queries/externalAuth.ts index 2a0c664587..18cc95a883 100644 --- a/site/src/api/queries/externalAuth.ts +++ b/site/src/api/queries/externalAuth.ts @@ -1,6 +1,6 @@ +import type { QueryClient, UseMutationOptions } from "react-query"; import * as API from "api/api"; -import { ExternalAuth } from "api/typesGenerated"; -import { QueryClient, UseMutationOptions } from "react-query"; +import type { ExternalAuth } from "api/typesGenerated"; // Returns all configured external auths for a given user. export const externalAuths = () => { diff --git a/site/src/api/queries/groups.ts b/site/src/api/queries/groups.ts index 6dff724772..71cba33354 100644 --- a/site/src/api/queries/groups.ts +++ b/site/src/api/queries/groups.ts @@ -1,7 +1,7 @@ -import { QueryClient, UseQueryOptions } from "react-query"; +import type { QueryClient, UseQueryOptions } from "react-query"; import * as API from "api/api"; import { checkAuthorization } from "api/api"; -import { +import type { CreateGroupRequest, Group, PatchGroupRequest, diff --git a/site/src/api/queries/integrations.ts b/site/src/api/queries/integrations.ts index 72df1752f7..de43a4c8f4 100644 --- a/site/src/api/queries/integrations.ts +++ b/site/src/api/queries/integrations.ts @@ -1,4 +1,4 @@ -import { GetJFrogXRayScanParams } from "api/api"; +import type { GetJFrogXRayScanParams } from "api/api"; import * as API from "api/api"; export const xrayScan = (params: GetJFrogXRayScanParams) => { diff --git a/site/src/api/queries/settings.ts b/site/src/api/queries/settings.ts index c8f9aac16e..4a086cf185 100644 --- a/site/src/api/queries/settings.ts +++ b/site/src/api/queries/settings.ts @@ -1,9 +1,9 @@ +import type { QueryClient, QueryOptions } from "react-query"; import * as API from "api/api"; -import { - type UserQuietHoursScheduleResponse, - type UpdateUserQuietHoursScheduleRequest, +import type { + UpdateUserQuietHoursScheduleRequest, + UserQuietHoursScheduleResponse, } from "api/typesGenerated"; -import { type QueryClient, type QueryOptions } from "react-query"; export const userQuietHoursScheduleKey = (userId: string) => [ "settings", diff --git a/site/src/api/queries/sshKeys.ts b/site/src/api/queries/sshKeys.ts index 07f9963b40..6fc3593c31 100644 --- a/site/src/api/queries/sshKeys.ts +++ b/site/src/api/queries/sshKeys.ts @@ -1,6 +1,6 @@ -import { QueryClient } from "react-query"; +import type { QueryClient } from "react-query"; import * as API from "api/api"; -import { GitSSHKey } from "api/typesGenerated"; +import type { GitSSHKey } from "api/typesGenerated"; const getUserSSHKeyQueryKey = (userId: string) => [userId, "sshKey"]; diff --git a/site/src/api/queries/templates.ts b/site/src/api/queries/templates.ts index 532ba0c9f7..003ade05ad 100644 --- a/site/src/api/queries/templates.ts +++ b/site/src/api/queries/templates.ts @@ -1,19 +1,15 @@ +import type { MutationOptions, QueryClient, QueryOptions } from "react-query"; import * as API from "api/api"; -import { - type Template, - type CreateTemplateVersionRequest, - type ProvisionerJobStatus, - type TemplateVersion, +import type { CreateTemplateRequest, + CreateTemplateVersionRequest, ProvisionerJob, + ProvisionerJobStatus, UsersRequest, + Template, TemplateRole, + TemplateVersion, } from "api/typesGenerated"; -import { - MutationOptions, - type QueryClient, - type QueryOptions, -} from "react-query"; import { delay } from "utils/delay"; import { getTemplateVersionFiles } from "utils/templateVersion"; diff --git a/site/src/api/queries/users.ts b/site/src/api/queries/users.ts index 9299831985..3aa0b009a2 100644 --- a/site/src/api/queries/users.ts +++ b/site/src/api/queries/users.ts @@ -1,8 +1,8 @@ -import { - type UseMutationOptions, - type QueryClient, - type QueryKey, - type UseQueryOptions, +import type { + QueryClient, + QueryKey, + UseMutationOptions, + UseQueryOptions, } from "react-query"; import * as API from "api/api"; import type { @@ -15,10 +15,10 @@ import type { User, GenerateAPIKeyResponse, } from "api/typesGenerated"; -import { getAuthorizationKey } from "./authCheck"; -import { getMetadataAsJSON } from "utils/metadata"; -import { type UsePaginatedQueryOptions } from "hooks/usePaginatedQuery"; +import type { UsePaginatedQueryOptions } from "hooks/usePaginatedQuery"; import { prepareQuery } from "utils/filters"; +import { getMetadataAsJSON } from "utils/metadata"; +import { getAuthorizationKey } from "./authCheck"; export function usersKey(req: UsersRequest) { return ["users", req] as const; diff --git a/site/src/api/queries/workspaceBuilds.ts b/site/src/api/queries/workspaceBuilds.ts index ecace99560..8960068b61 100644 --- a/site/src/api/queries/workspaceBuilds.ts +++ b/site/src/api/queries/workspaceBuilds.ts @@ -1,9 +1,9 @@ -import { QueryOptions, UseInfiniteQueryOptions } from "react-query"; +import type { QueryOptions, UseInfiniteQueryOptions } from "react-query"; import * as API from "api/api"; -import { - type WorkspaceBuild, - type WorkspaceBuildParameter, - type WorkspaceBuildsRequest, +import type { + WorkspaceBuild, + WorkspaceBuildParameter, + WorkspaceBuildsRequest, } from "api/typesGenerated"; export function workspaceBuildParametersKey(workspaceBuildId: string) { diff --git a/site/src/api/queries/workspaceportsharing.ts b/site/src/api/queries/workspaceportsharing.ts index 7f921f90d7..9e341d551a 100644 --- a/site/src/api/queries/workspaceportsharing.ts +++ b/site/src/api/queries/workspaceportsharing.ts @@ -3,7 +3,7 @@ import { getWorkspaceAgentSharedPorts, upsertWorkspaceAgentSharedPort, } from "api/api"; -import { +import type { DeleteWorkspaceAgentPortShareRequest, UpsertWorkspaceAgentPortShareRequest, } from "api/typesGenerated"; diff --git a/site/src/api/queries/workspaces.ts b/site/src/api/queries/workspaces.ts index b1252fe9af..816cc5613e 100644 --- a/site/src/api/queries/workspaces.ts +++ b/site/src/api/queries/workspaces.ts @@ -1,19 +1,19 @@ -import * as API from "api/api"; -import { +import type { Dayjs } from "dayjs"; +import type { QueryClient, + QueryOptions, UseMutationOptions, - type QueryOptions, } from "react-query"; +import * as API from "api/api"; import { putWorkspaceExtension } from "api/api"; -import { Dayjs } from "dayjs"; -import { - type WorkspaceBuildParameter, - type Workspace, - type CreateWorkspaceRequest, - type WorkspacesResponse, - type WorkspacesRequest, - WorkspaceBuild, +import type { + CreateWorkspaceRequest, ProvisionerLogLevel, + Workspace, + WorkspaceBuild, + WorkspaceBuildParameter, + WorkspacesRequest, + WorkspacesResponse, } from "api/typesGenerated"; import { workspaceBuildsKey } from "./workspaceBuilds"; diff --git a/site/src/components/Abbr/Abbr.tsx b/site/src/components/Abbr/Abbr.tsx index 9fba0618a5..d58da3539f 100644 --- a/site/src/components/Abbr/Abbr.tsx +++ b/site/src/components/Abbr/Abbr.tsx @@ -1,4 +1,4 @@ -import { type FC, type HTMLAttributes } from "react"; +import type { FC, HTMLAttributes } from "react"; export type Pronunciation = "shorthand" | "acronym" | "initialism"; diff --git a/site/src/components/ActiveUserChart/ActiveUserChart.tsx b/site/src/components/ActiveUserChart/ActiveUserChart.tsx index c8dd64a7e9..c66f882bf5 100644 --- a/site/src/components/ActiveUserChart/ActiveUserChart.tsx +++ b/site/src/components/ActiveUserChart/ActiveUserChart.tsx @@ -1,7 +1,9 @@ +import "chartjs-adapter-date-fns"; +import { useTheme } from "@emotion/react"; import { CategoryScale, Chart as ChartJS, - ChartOptions, + type ChartOptions, defaults, Filler, Legend, @@ -12,7 +14,10 @@ import { Tooltip, PointElement, } from "chart.js"; -import "chartjs-adapter-date-fns"; +import annotationPlugin from "chartjs-plugin-annotation"; +import dayjs from "dayjs"; +import type { FC } from "react"; +import { Line } from "react-chartjs-2"; import { HelpTooltip, HelpTooltipTitle, @@ -20,11 +25,6 @@ import { HelpTooltipContent, HelpTooltipTrigger, } from "components/HelpTooltip/HelpTooltip"; -import dayjs from "dayjs"; -import { useTheme } from "@emotion/react"; -import { type FC } from "react"; -import { Line } from "react-chartjs-2"; -import annotationPlugin from "chartjs-plugin-annotation"; ChartJS.register( CategoryScale, diff --git a/site/src/components/Alert/Alert.stories.tsx b/site/src/components/Alert/Alert.stories.tsx index 797157de85..f0b0ea82cb 100644 --- a/site/src/components/Alert/Alert.stories.tsx +++ b/site/src/components/Alert/Alert.stories.tsx @@ -1,6 +1,6 @@ -import { Alert } from "./Alert"; import Button from "@mui/material/Button"; import type { Meta, StoryObj } from "@storybook/react"; +import { Alert } from "./Alert"; const meta: Meta = { title: "components/Alert", diff --git a/site/src/components/Alert/Alert.tsx b/site/src/components/Alert/Alert.tsx index 8484a57d1c..9e5c092b27 100644 --- a/site/src/components/Alert/Alert.tsx +++ b/site/src/components/Alert/Alert.tsx @@ -1,15 +1,15 @@ +// eslint-disable-next-line no-restricted-imports -- It is the base component +import MuiAlert, { + type AlertProps as MuiAlertProps, +} from "@mui/material/Alert"; +import Button from "@mui/material/Button"; +import Collapse from "@mui/material/Collapse"; import { useState, type FC, type ReactNode, type PropsWithChildren, } from "react"; -import Collapse from "@mui/material/Collapse"; -// eslint-disable-next-line no-restricted-imports -- It is the base component -import MuiAlert, { - type AlertProps as MuiAlertProps, -} from "@mui/material/Alert"; -import Button from "@mui/material/Button"; export type AlertProps = MuiAlertProps & { actions?: ReactNode; diff --git a/site/src/components/Alert/ErrorAlert.stories.tsx b/site/src/components/Alert/ErrorAlert.stories.tsx index 5ef6f42759..21e63959c6 100644 --- a/site/src/components/Alert/ErrorAlert.stories.tsx +++ b/site/src/components/Alert/ErrorAlert.stories.tsx @@ -1,6 +1,6 @@ import Button from "@mui/material/Button"; -import { mockApiError } from "testHelpers/entities"; import type { Meta, StoryObj } from "@storybook/react"; +import { mockApiError } from "testHelpers/entities"; import { ErrorAlert } from "./ErrorAlert"; const mockError = mockApiError({ diff --git a/site/src/components/Alert/ErrorAlert.tsx b/site/src/components/Alert/ErrorAlert.tsx index 40b125fdf4..ce9247d280 100644 --- a/site/src/components/Alert/ErrorAlert.tsx +++ b/site/src/components/Alert/ErrorAlert.tsx @@ -1,7 +1,7 @@ -import { AlertProps, Alert, AlertDetail } from "./Alert"; import AlertTitle from "@mui/material/AlertTitle"; +import type { FC } from "react"; import { getErrorMessage, getErrorDetail } from "api/errors"; -import { FC } from "react"; +import { Alert, AlertDetail, type AlertProps } from "./Alert"; export const ErrorAlert: FC< Omit & { error: unknown } diff --git a/site/src/components/Avatar/Avatar.stories.tsx b/site/src/components/Avatar/Avatar.stories.tsx index c6f93a5eda..b01f1205be 100644 --- a/site/src/components/Avatar/Avatar.stories.tsx +++ b/site/src/components/Avatar/Avatar.stories.tsx @@ -1,6 +1,6 @@ +import PauseIcon from "@mui/icons-material/PauseOutlined"; import type { Meta, StoryObj } from "@storybook/react"; import { Avatar, AvatarIcon } from "./Avatar"; -import PauseIcon from "@mui/icons-material/PauseOutlined"; const meta: Meta = { title: "components/Avatar", diff --git a/site/src/components/Avatar/Avatar.tsx b/site/src/components/Avatar/Avatar.tsx index 574636da72..5c4e46f6d8 100644 --- a/site/src/components/Avatar/Avatar.tsx +++ b/site/src/components/Avatar/Avatar.tsx @@ -1,11 +1,11 @@ +import { css, type Interpolation, type Theme, useTheme } from "@emotion/react"; // This is the only place MuiAvatar can be used // eslint-disable-next-line no-restricted-imports -- Read above import MuiAvatar, { type AvatarProps as MuiAvatarProps, } from "@mui/material/Avatar"; -import { type FC, useId } from "react"; -import { css, type Interpolation, type Theme, useTheme } from "@emotion/react"; import { visuallyHidden } from "@mui/utils"; +import { type FC, useId } from "react"; import { getExternalImageStylesFromUrl } from "theme/externalImages"; export type AvatarProps = MuiAvatarProps & { diff --git a/site/src/components/AvatarCard/AvatarCard.stories.tsx b/site/src/components/AvatarCard/AvatarCard.stories.tsx index 9f0204a9c8..f1247a1bcc 100644 --- a/site/src/components/AvatarCard/AvatarCard.stories.tsx +++ b/site/src/components/AvatarCard/AvatarCard.stories.tsx @@ -1,4 +1,4 @@ -import { type Meta, type StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { AvatarCard } from "./AvatarCard"; const meta: Meta = { diff --git a/site/src/components/AvatarCard/AvatarCard.tsx b/site/src/components/AvatarCard/AvatarCard.tsx index b55608657d..0f3a880443 100644 --- a/site/src/components/AvatarCard/AvatarCard.tsx +++ b/site/src/components/AvatarCard/AvatarCard.tsx @@ -1,6 +1,6 @@ -import { type FC, type ReactNode } from "react"; -import { Avatar } from "components/Avatar/Avatar"; import { type CSSObject, useTheme } from "@emotion/react"; +import type { FC, ReactNode } from "react"; +import { Avatar } from "components/Avatar/Avatar"; type AvatarCardProps = { header: string; diff --git a/site/src/components/AvatarData/AvatarData.tsx b/site/src/components/AvatarData/AvatarData.tsx index af90ea5f41..0aa02f3629 100644 --- a/site/src/components/AvatarData/AvatarData.tsx +++ b/site/src/components/AvatarData/AvatarData.tsx @@ -1,5 +1,5 @@ -import type { FC, ReactNode } from "react"; import { useTheme } from "@emotion/react"; +import type { FC, ReactNode } from "react"; import { Avatar } from "components/Avatar/Avatar"; import { Stack } from "components/Stack/Stack"; diff --git a/site/src/components/AvatarData/AvatarDataSkeleton.tsx b/site/src/components/AvatarData/AvatarDataSkeleton.tsx index 275bbff156..69f4fc91af 100644 --- a/site/src/components/AvatarData/AvatarDataSkeleton.tsx +++ b/site/src/components/AvatarData/AvatarDataSkeleton.tsx @@ -1,6 +1,6 @@ -import { FC } from "react"; -import { Stack } from "components/Stack/Stack"; import Skeleton from "@mui/material/Skeleton"; +import type { FC } from "react"; +import { Stack } from "components/Stack/Stack"; export const AvatarDataSkeleton: FC = () => { return ( diff --git a/site/src/components/Badges/Badges.tsx b/site/src/components/Badges/Badges.tsx index db2917c616..152e7735fd 100644 --- a/site/src/components/Badges/Badges.tsx +++ b/site/src/components/Badges/Badges.tsx @@ -1,11 +1,11 @@ +import type { Interpolation, Theme } from "@emotion/react"; +import Tooltip from "@mui/material/Tooltip"; import { - type PropsWithChildren, type FC, forwardRef, - HTMLAttributes, + type HTMLAttributes, + type PropsWithChildren, } from "react"; -import Tooltip from "@mui/material/Tooltip"; -import { type Interpolation, type Theme } from "@emotion/react"; import { Stack } from "components/Stack/Stack"; const styles = { diff --git a/site/src/components/BuildAvatar/BuildAvatar.tsx b/site/src/components/BuildAvatar/BuildAvatar.tsx index 4d0cb7097e..4ac90fe669 100644 --- a/site/src/components/BuildAvatar/BuildAvatar.tsx +++ b/site/src/components/BuildAvatar/BuildAvatar.tsx @@ -1,12 +1,12 @@ -import Badge from "@mui/material/Badge"; import { css, cx } from "@emotion/css"; import { useTheme } from "@emotion/react"; -import { type FC } from "react"; +import Badge from "@mui/material/Badge"; +import type { FC } from "react"; import type { WorkspaceBuild } from "api/typesGenerated"; -import { getDisplayWorkspaceBuildStatus } from "utils/workspace"; -import { useClassName } from "hooks/useClassName"; -import { Avatar, AvatarProps } from "components/Avatar/Avatar"; +import { Avatar, type AvatarProps } from "components/Avatar/Avatar"; import { BuildIcon } from "components/BuildIcon/BuildIcon"; +import { useClassName } from "hooks/useClassName"; +import { getDisplayWorkspaceBuildStatus } from "utils/workspace"; export interface BuildAvatarProps { build: WorkspaceBuild; diff --git a/site/src/components/BuildIcon/BuildIcon.tsx b/site/src/components/BuildIcon/BuildIcon.tsx index 41b87f66b6..c5ce4d96f4 100644 --- a/site/src/components/BuildIcon/BuildIcon.tsx +++ b/site/src/components/BuildIcon/BuildIcon.tsx @@ -1,8 +1,8 @@ +import DeleteOutlined from "@mui/icons-material/DeleteOutlined"; import PlayArrowOutlined from "@mui/icons-material/PlayArrowOutlined"; import StopOutlined from "@mui/icons-material/StopOutlined"; -import DeleteOutlined from "@mui/icons-material/DeleteOutlined"; -import { WorkspaceTransition } from "api/typesGenerated"; -import { ComponentProps } from "react"; +import type { ComponentProps } from "react"; +import type { WorkspaceTransition } from "api/typesGenerated"; type SVGIcon = typeof PlayArrowOutlined; diff --git a/site/src/components/CodeExample/CodeExample.tsx b/site/src/components/CodeExample/CodeExample.tsx index 7d6f2c661e..6a01a18eea 100644 --- a/site/src/components/CodeExample/CodeExample.tsx +++ b/site/src/components/CodeExample/CodeExample.tsx @@ -1,8 +1,8 @@ +import type { Interpolation, Theme } from "@emotion/react"; +import { visuallyHidden } from "@mui/utils"; import { type FC, type KeyboardEvent, type MouseEvent, useRef } from "react"; -import { type Interpolation, type Theme } from "@emotion/react"; import { MONOSPACE_FONT_FAMILY } from "theme/constants"; import { CopyButton } from "../CopyButton/CopyButton"; -import { visuallyHidden } from "@mui/utils"; export interface CodeExampleProps { code: string; diff --git a/site/src/components/Conditionals/ChooseOne.stories.tsx b/site/src/components/Conditionals/ChooseOne.stories.tsx index 7330a9bc6a..5dc40249a4 100644 --- a/site/src/components/Conditionals/ChooseOne.stories.tsx +++ b/site/src/components/Conditionals/ChooseOne.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { ChooseOne, Cond } from "./ChooseOne"; const meta: Meta = { diff --git a/site/src/components/CopyButton/CopyButton.tsx b/site/src/components/CopyButton/CopyButton.tsx index 8065fa1e64..37759e12a3 100644 --- a/site/src/components/CopyButton/CopyButton.tsx +++ b/site/src/components/CopyButton/CopyButton.tsx @@ -1,7 +1,7 @@ +import { css, type Interpolation, type Theme } from "@emotion/react"; +import Check from "@mui/icons-material/Check"; import IconButton from "@mui/material/Button"; import Tooltip from "@mui/material/Tooltip"; -import Check from "@mui/icons-material/Check"; -import { css, type Interpolation, type Theme } from "@emotion/react"; import { forwardRef, type ReactNode } from "react"; import { useClipboard } from "hooks/useClipboard"; import { FileCopyIcon } from "../Icons/FileCopyIcon"; diff --git a/site/src/components/CopyableValue/CopyableValue.tsx b/site/src/components/CopyableValue/CopyableValue.tsx index 8c13732699..8ec6bb25bc 100644 --- a/site/src/components/CopyableValue/CopyableValue.tsx +++ b/site/src/components/CopyableValue/CopyableValue.tsx @@ -1,5 +1,5 @@ import Tooltip, { type TooltipProps } from "@mui/material/Tooltip"; -import { type FC, type HTMLAttributes } from "react"; +import type { FC, HTMLAttributes } from "react"; import { useClickable } from "hooks/useClickable"; import { useClipboard } from "hooks/useClipboard"; diff --git a/site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.test.tsx b/site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.test.tsx index 2390ad3aee..8d586047a3 100644 --- a/site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.test.tsx +++ b/site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.test.tsx @@ -1,6 +1,6 @@ import { fireEvent, screen } from "@testing-library/react"; -import { ConfirmDialog } from "./ConfirmDialog"; import { renderComponent } from "testHelpers/renderHelpers"; +import { ConfirmDialog } from "./ConfirmDialog"; describe("ConfirmDialog", () => { it("onClose is called when cancelled", () => { diff --git a/site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.tsx b/site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.tsx index 08b00733ea..8c2d4c4d55 100644 --- a/site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.tsx +++ b/site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.tsx @@ -1,6 +1,6 @@ +import type { Interpolation, Theme } from "@emotion/react"; import DialogActions from "@mui/material/DialogActions"; -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC, type ReactNode } from "react"; +import type { FC, ReactNode } from "react"; import { Dialog, DialogActionButtons, diff --git a/site/src/components/Dialogs/DeleteDialog/DeleteDialog.test.tsx b/site/src/components/Dialogs/DeleteDialog/DeleteDialog.test.tsx index 10f8f9d89e..f7f6acd89a 100644 --- a/site/src/components/Dialogs/DeleteDialog/DeleteDialog.test.tsx +++ b/site/src/components/Dialogs/DeleteDialog/DeleteDialog.test.tsx @@ -1,8 +1,8 @@ import { screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; +import { act } from "react-dom/test-utils"; import { renderComponent } from "testHelpers/renderHelpers"; import { DeleteDialog } from "./DeleteDialog"; -import { act } from "react-dom/test-utils"; const inputTestId = "delete-dialog-name-confirmation"; diff --git a/site/src/components/Dialogs/DeleteDialog/DeleteDialog.tsx b/site/src/components/Dialogs/DeleteDialog/DeleteDialog.tsx index 9d9ada835e..6210cbe14f 100644 --- a/site/src/components/Dialogs/DeleteDialog/DeleteDialog.tsx +++ b/site/src/components/Dialogs/DeleteDialog/DeleteDialog.tsx @@ -1,5 +1,5 @@ +import type { Interpolation, Theme } from "@emotion/react"; import TextField from "@mui/material/TextField"; -import { type Interpolation, type Theme } from "@emotion/react"; import { type FC, type FormEvent, useId, useState } from "react"; import { Stack } from "../../Stack/Stack"; import { ConfirmDialog } from "../ConfirmDialog/ConfirmDialog"; diff --git a/site/src/components/Dialogs/Dialog.tsx b/site/src/components/Dialogs/Dialog.tsx index f9c4c8f8a3..a0abeb74fb 100644 --- a/site/src/components/Dialogs/Dialog.tsx +++ b/site/src/components/Dialogs/Dialog.tsx @@ -1,8 +1,10 @@ -import MuiDialog, { DialogProps as MuiDialogProps } from "@mui/material/Dialog"; -import LoadingButton, { LoadingButtonProps } from "@mui/lab/LoadingButton"; -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC, type ReactNode } from "react"; -import { ConfirmDialogType } from "./types"; +import type { Interpolation, Theme } from "@emotion/react"; +import LoadingButton, { type LoadingButtonProps } from "@mui/lab/LoadingButton"; +import MuiDialog, { + type DialogProps as MuiDialogProps, +} from "@mui/material/Dialog"; +import type { FC, ReactNode } from "react"; +import type { ConfirmDialogType } from "./types"; export interface DialogActionButtonsProps { /** Text to display in the cancel button */ diff --git a/site/src/components/DropdownArrow/DropdownArrow.stories.tsx b/site/src/components/DropdownArrow/DropdownArrow.stories.tsx index b7ef74d0f1..edf2b209a6 100644 --- a/site/src/components/DropdownArrow/DropdownArrow.stories.tsx +++ b/site/src/components/DropdownArrow/DropdownArrow.stories.tsx @@ -1,4 +1,4 @@ -import { type Meta, type StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { chromatic } from "testHelpers/chromatic"; import { DropdownArrow } from "./DropdownArrow"; diff --git a/site/src/components/DropdownArrow/DropdownArrow.tsx b/site/src/components/DropdownArrow/DropdownArrow.tsx index a70b3bf725..e0d79d6b12 100644 --- a/site/src/components/DropdownArrow/DropdownArrow.tsx +++ b/site/src/components/DropdownArrow/DropdownArrow.tsx @@ -1,7 +1,7 @@ +import type { Interpolation, Theme } from "@emotion/react"; import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown"; import KeyboardArrowUp from "@mui/icons-material/KeyboardArrowUp"; -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { FC } from "react"; interface ArrowProps { margin?: boolean; diff --git a/site/src/components/EmptyState/EmptyState.stories.tsx b/site/src/components/EmptyState/EmptyState.stories.tsx index 164cbc3cbf..b8282b12e9 100644 --- a/site/src/components/EmptyState/EmptyState.stories.tsx +++ b/site/src/components/EmptyState/EmptyState.stories.tsx @@ -1,6 +1,6 @@ import Button from "@mui/material/Button"; -import { EmptyState } from "./EmptyState"; import type { Meta, StoryObj } from "@storybook/react"; +import { EmptyState } from "./EmptyState"; const meta: Meta = { title: "components/EmptyState", diff --git a/site/src/components/ErrorBoundary/RuntimeErrorState.tsx b/site/src/components/ErrorBoundary/RuntimeErrorState.tsx index 50741b327d..0e1aefe4e4 100644 --- a/site/src/components/ErrorBoundary/RuntimeErrorState.tsx +++ b/site/src/components/ErrorBoundary/RuntimeErrorState.tsx @@ -1,15 +1,15 @@ +import { css, type Interpolation, type Theme } from "@emotion/react"; +import RefreshOutlined from "@mui/icons-material/RefreshOutlined"; import Button from "@mui/material/Button"; import Link from "@mui/material/Link"; -import RefreshOutlined from "@mui/icons-material/RefreshOutlined"; import { type FC, useEffect, useState } from "react"; import { Helmet } from "react-helmet-async"; -import { css, type Interpolation, type Theme } from "@emotion/react"; import type { BuildInfoResponse } from "api/typesGenerated"; import { CopyButton } from "components/CopyButton/CopyButton"; import { CoderIcon } from "components/Icons/CoderIcon"; import { FullScreenLoader } from "components/Loader/FullScreenLoader"; -import { Stack } from "components/Stack/Stack"; import { Margins } from "components/Margins/Margins"; +import { Stack } from "components/Stack/Stack"; const fetchDynamicallyImportedModuleError = "Failed to fetch dynamically imported module"; diff --git a/site/src/components/Expander/Expander.stories.tsx b/site/src/components/Expander/Expander.stories.tsx index 83f18dccab..047435ef7c 100644 --- a/site/src/components/Expander/Expander.stories.tsx +++ b/site/src/components/Expander/Expander.stories.tsx @@ -1,5 +1,5 @@ -import { Expander } from "./Expander"; import type { Meta, StoryObj } from "@storybook/react"; +import { Expander } from "./Expander"; const meta: Meta = { title: "components/Expander", diff --git a/site/src/components/Expander/Expander.tsx b/site/src/components/Expander/Expander.tsx index 6d3ff6160c..4f6029cfc4 100644 --- a/site/src/components/Expander/Expander.tsx +++ b/site/src/components/Expander/Expander.tsx @@ -1,7 +1,7 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import Collapse from "@mui/material/Collapse"; import Link from "@mui/material/Link"; -import { type FC, type ReactNode } from "react"; +import type { FC, ReactNode } from "react"; import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; export interface ExpanderProps { diff --git a/site/src/components/FileUpload/FileUpload.test.tsx b/site/src/components/FileUpload/FileUpload.test.tsx index 6042d546e9..7e6d544cb5 100644 --- a/site/src/components/FileUpload/FileUpload.test.tsx +++ b/site/src/components/FileUpload/FileUpload.test.tsx @@ -1,6 +1,6 @@ import { fireEvent, render, screen } from "@testing-library/react"; -import { FileUpload } from "./FileUpload"; import { ThemeProvider } from "contexts/ThemeProvider"; +import { FileUpload } from "./FileUpload"; test("accepts files with the correct extension", async () => { const onUpload = jest.fn(); diff --git a/site/src/components/FileUpload/FileUpload.tsx b/site/src/components/FileUpload/FileUpload.tsx index b24cada59c..c6feb07189 100644 --- a/site/src/components/FileUpload/FileUpload.tsx +++ b/site/src/components/FileUpload/FileUpload.tsx @@ -1,12 +1,12 @@ -import { Stack } from "components/Stack/Stack"; -import { type FC, type DragEvent, useRef, type ReactNode } from "react"; +import { css, type Interpolation, type Theme } from "@emotion/react"; import UploadIcon from "@mui/icons-material/CloudUploadOutlined"; -import { useClickable } from "hooks/useClickable"; -import CircularProgress from "@mui/material/CircularProgress"; -import IconButton from "@mui/material/IconButton"; import RemoveIcon from "@mui/icons-material/DeleteOutline"; import FileIcon from "@mui/icons-material/FolderOutlined"; -import { css, type Interpolation, type Theme } from "@emotion/react"; +import CircularProgress from "@mui/material/CircularProgress"; +import IconButton from "@mui/material/IconButton"; +import { type FC, type DragEvent, useRef, type ReactNode } from "react"; +import { Stack } from "components/Stack/Stack"; +import { useClickable } from "hooks/useClickable"; export interface FileUploadProps { isUploading: boolean; diff --git a/site/src/components/Filter/OptionItem.stories.tsx b/site/src/components/Filter/OptionItem.stories.tsx index 471a07912a..d8b223d7b9 100644 --- a/site/src/components/Filter/OptionItem.stories.tsx +++ b/site/src/components/Filter/OptionItem.stories.tsx @@ -1,5 +1,5 @@ -import { OptionItem } from "./filter"; import type { Meta, StoryObj } from "@storybook/react"; +import { OptionItem } from "./filter"; const meta: Meta = { title: "components/Filter/OptionItem", diff --git a/site/src/components/Filter/UserFilter.tsx b/site/src/components/Filter/UserFilter.tsx index 879e2ed53c..eae40953c1 100644 --- a/site/src/components/Filter/UserFilter.tsx +++ b/site/src/components/Filter/UserFilter.tsx @@ -1,10 +1,10 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { getUsers } from "api/api"; import { useMe } from "contexts/auth/useMe"; import { UserAvatar } from "../UserAvatar/UserAvatar"; import { FilterSearchMenu, OptionItem } from "./filter"; -import { UseFilterMenuOptions, useFilterMenu } from "./menu"; -import { BaseOption } from "./options"; +import { type UseFilterMenuOptions, useFilterMenu } from "./menu"; +import type { BaseOption } from "./options"; export type UserOption = BaseOption & { avatarUrl?: string; diff --git a/site/src/components/Filter/filter.tsx b/site/src/components/Filter/filter.tsx index 1a4b40c529..44e2101a16 100644 --- a/site/src/components/Filter/filter.tsx +++ b/site/src/components/Filter/filter.tsx @@ -1,19 +1,19 @@ -import TextField from "@mui/material/TextField"; -import Button, { type ButtonProps } from "@mui/material/Button"; -import Menu, { type MenuProps } from "@mui/material/Menu"; -import MenuItem from "@mui/material/MenuItem"; -import InputAdornment from "@mui/material/InputAdornment"; -import IconButton from "@mui/material/IconButton"; -import Tooltip from "@mui/material/Tooltip"; -import Skeleton, { type SkeletonProps } from "@mui/material/Skeleton"; -import MenuList from "@mui/material/MenuList"; -import Divider from "@mui/material/Divider"; -import OpenInNewOutlined from "@mui/icons-material/OpenInNewOutlined"; +import { useTheme } from "@emotion/react"; import CheckOutlined from "@mui/icons-material/CheckOutlined"; import CloseOutlined from "@mui/icons-material/CloseOutlined"; import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown"; +import OpenInNewOutlined from "@mui/icons-material/OpenInNewOutlined"; import SearchOutlined from "@mui/icons-material/SearchOutlined"; -import { useTheme } from "@emotion/react"; +import Button, { type ButtonProps } from "@mui/material/Button"; +import Divider from "@mui/material/Divider"; +import IconButton from "@mui/material/IconButton"; +import InputAdornment from "@mui/material/InputAdornment"; +import Menu, { type MenuProps } from "@mui/material/Menu"; +import MenuItem from "@mui/material/MenuItem"; +import MenuList from "@mui/material/MenuList"; +import Skeleton, { type SkeletonProps } from "@mui/material/Skeleton"; +import TextField from "@mui/material/TextField"; +import Tooltip from "@mui/material/Tooltip"; import { type FC, type ReactNode, @@ -22,22 +22,22 @@ import { useRef, useState, } from "react"; -import { useSearchParams } from "react-router-dom"; +import type { useSearchParams } from "react-router-dom"; import { getValidationErrorMessage, hasError, isApiValidationError, } from "api/errors"; import { Loader } from "components/Loader/Loader"; -import { useDebouncedFunction } from "hooks/debounce"; -import { useFilterMenu } from "./menu"; -import type { BaseOption } from "./options"; import { Search, SearchEmpty, SearchInput, searchStyles, } from "components/Menu/Search"; +import { useDebouncedFunction } from "hooks/debounce"; +import type { useFilterMenu } from "./menu"; +import type { BaseOption } from "./options"; export type PresetFilter = { name: string; diff --git a/site/src/components/Filter/menu.ts b/site/src/components/Filter/menu.ts index fe8c5632d3..21cfec33ad 100644 --- a/site/src/components/Filter/menu.ts +++ b/site/src/components/Filter/menu.ts @@ -1,6 +1,6 @@ import { useMemo, useRef, useState } from "react"; -import { BaseOption } from "./options"; import { useQuery } from "react-query"; +import type { BaseOption } from "./options"; export type UseFilterMenuOptions = { id: string; diff --git a/site/src/components/Filter/storyHelpers.ts b/site/src/components/Filter/storyHelpers.ts index 6d06cfff99..cc6b33b07f 100644 --- a/site/src/components/Filter/storyHelpers.ts +++ b/site/src/components/Filter/storyHelpers.ts @@ -1,6 +1,6 @@ import { action } from "@storybook/addon-actions"; -import { UseFilterResult } from "./filter"; -import { UseFilterMenuResult } from "./menu"; +import type { UseFilterResult } from "./filter"; +import type { UseFilterMenuResult } from "./menu"; export const MockMenu: UseFilterMenuResult = { initialOption: undefined, diff --git a/site/src/components/Form/Form.tsx b/site/src/components/Form/Form.tsx index eb0b185497..2dbbf58dd9 100644 --- a/site/src/components/Form/Form.tsx +++ b/site/src/components/Form/Form.tsx @@ -1,18 +1,18 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import { + type ComponentProps, createContext, type FC, - type HTMLProps, - useContext, - ReactNode, - ComponentProps, forwardRef, + type HTMLProps, + type ReactNode, + useContext, } from "react"; import { AlphaBadge, DeprecatedBadge } from "components/Badges/Badges"; import { Stack } from "components/Stack/Stack"; import { FormFooter as BaseFormFooter, - FormFooterProps, + type FormFooterProps, type FormFooterStyles, } from "../FormFooter/FormFooter"; diff --git a/site/src/components/FormFooter/FormFooter.stories.tsx b/site/src/components/FormFooter/FormFooter.stories.tsx index a1c18f8c89..41d44250d0 100644 --- a/site/src/components/FormFooter/FormFooter.stories.tsx +++ b/site/src/components/FormFooter/FormFooter.stories.tsx @@ -1,5 +1,5 @@ -import { FormFooter } from "./FormFooter"; import type { Meta, StoryObj } from "@storybook/react"; +import { FormFooter } from "./FormFooter"; const meta: Meta = { title: "components/FormFooter", diff --git a/site/src/components/FormFooter/FormFooter.tsx b/site/src/components/FormFooter/FormFooter.tsx index 9d7496e083..4c672cf8d8 100644 --- a/site/src/components/FormFooter/FormFooter.tsx +++ b/site/src/components/FormFooter/FormFooter.tsx @@ -1,7 +1,7 @@ -import Button from "@mui/material/Button"; -import { type FC } from "react"; -import { Interpolation, Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import LoadingButton from "@mui/lab/LoadingButton"; +import Button from "@mui/material/Button"; +import type { FC } from "react"; export const Language = { cancelLabel: "Cancel", diff --git a/site/src/components/FullPageForm/FullPageForm.stories.tsx b/site/src/components/FullPageForm/FullPageForm.stories.tsx index 9933c61795..09dc7d5bb3 100644 --- a/site/src/components/FullPageForm/FullPageForm.stories.tsx +++ b/site/src/components/FullPageForm/FullPageForm.stories.tsx @@ -1,11 +1,12 @@ import TextField from "@mui/material/TextField"; import { action } from "@storybook/addon-actions"; +import type { Meta, StoryObj } from "@storybook/react"; +import type { FC } from "react"; import { FormFooter } from "../FormFooter/FormFooter"; import { Stack } from "../Stack/Stack"; -import { FullPageForm, FullPageFormProps } from "./FullPageForm"; -import type { Meta, StoryObj } from "@storybook/react"; +import { FullPageForm, type FullPageFormProps } from "./FullPageForm"; -const Template = (props: FullPageFormProps) => ( +const Template: FC = (props) => (
{ diff --git a/site/src/components/FullPageForm/FullPageForm.tsx b/site/src/components/FullPageForm/FullPageForm.tsx index 0d4e8b1b5a..5ccf9a291a 100644 --- a/site/src/components/FullPageForm/FullPageForm.tsx +++ b/site/src/components/FullPageForm/FullPageForm.tsx @@ -1,5 +1,5 @@ +import type { FC, ReactNode } from "react"; import { Margins } from "components/Margins/Margins"; -import { type FC, type ReactNode } from "react"; import { PageHeader, PageHeaderTitle, diff --git a/site/src/components/FullPageForm/FullPageHorizontalForm.tsx b/site/src/components/FullPageForm/FullPageHorizontalForm.tsx index 9bf7c042b4..adbf0d4616 100644 --- a/site/src/components/FullPageForm/FullPageHorizontalForm.tsx +++ b/site/src/components/FullPageForm/FullPageHorizontalForm.tsx @@ -1,5 +1,5 @@ import Button from "@mui/material/Button"; -import { type FC, type ReactNode } from "react"; +import type { FC, ReactNode } from "react"; import { Margins } from "components/Margins/Margins"; import { PageHeader, diff --git a/site/src/components/FullPageLayout/Sidebar.tsx b/site/src/components/FullPageLayout/Sidebar.tsx index 93f782cd20..17db7f0818 100644 --- a/site/src/components/FullPageLayout/Sidebar.tsx +++ b/site/src/components/FullPageLayout/Sidebar.tsx @@ -1,5 +1,5 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; -import { type ComponentProps, type FC, type HTMLAttributes } from "react"; +import type { ComponentProps, FC, HTMLAttributes } from "react"; import { Link, type LinkProps } from "react-router-dom"; import { TopbarIconButton } from "./Topbar"; diff --git a/site/src/components/FullPageLayout/Topbar.tsx b/site/src/components/FullPageLayout/Topbar.tsx index 217cacdb4a..5cdd2deff2 100644 --- a/site/src/components/FullPageLayout/Topbar.tsx +++ b/site/src/components/FullPageLayout/Topbar.tsx @@ -1,16 +1,16 @@ import { css } from "@emotion/css"; -import Button, { ButtonProps } from "@mui/material/Button"; -import IconButton, { IconButtonProps } from "@mui/material/IconButton"; import { useTheme } from "@emotion/react"; -import { AvatarProps, ExternalAvatar } from "components/Avatar/Avatar"; +import Button, { type ButtonProps } from "@mui/material/Button"; +import IconButton, { type IconButtonProps } from "@mui/material/IconButton"; import { + cloneElement, type FC, type ForwardedRef, + forwardRef, type HTMLAttributes, type ReactElement, - cloneElement, - forwardRef, } from "react"; +import { type AvatarProps, ExternalAvatar } from "components/Avatar/Avatar"; export const Topbar: FC> = (props) => { const theme = useTheme(); diff --git a/site/src/components/GlobalSnackbar/EnterpriseSnackbar.stories.tsx b/site/src/components/GlobalSnackbar/EnterpriseSnackbar.stories.tsx index ec5a5b5086..604ed9b830 100644 --- a/site/src/components/GlobalSnackbar/EnterpriseSnackbar.stories.tsx +++ b/site/src/components/GlobalSnackbar/EnterpriseSnackbar.stories.tsx @@ -1,6 +1,5 @@ -import { EnterpriseSnackbar } from "./EnterpriseSnackbar"; - import type { Meta, StoryObj } from "@storybook/react"; +import { EnterpriseSnackbar } from "./EnterpriseSnackbar"; const meta: Meta = { title: "components/EnterpriseSnackbar", diff --git a/site/src/components/GlobalSnackbar/EnterpriseSnackbar.tsx b/site/src/components/GlobalSnackbar/EnterpriseSnackbar.tsx index 7bec0aed35..350e031ba1 100644 --- a/site/src/components/GlobalSnackbar/EnterpriseSnackbar.tsx +++ b/site/src/components/GlobalSnackbar/EnterpriseSnackbar.tsx @@ -1,10 +1,10 @@ +import type { Interpolation, Theme } from "@emotion/react"; +import CloseIcon from "@mui/icons-material/Close"; import IconButton from "@mui/material/IconButton"; import Snackbar, { type SnackbarProps as MuiSnackbarProps, } from "@mui/material/Snackbar"; -import CloseIcon from "@mui/icons-material/Close"; -import { type FC } from "react"; -import { type Interpolation, type Theme } from "@emotion/react"; +import type { FC } from "react"; import { type ClassName, useClassName } from "hooks/useClassName"; type EnterpriseSnackbarVariant = "error" | "info" | "success"; diff --git a/site/src/components/GlobalSnackbar/GlobalSnackbar.tsx b/site/src/components/GlobalSnackbar/GlobalSnackbar.tsx index 0d8be21206..f300ef5fc4 100644 --- a/site/src/components/GlobalSnackbar/GlobalSnackbar.tsx +++ b/site/src/components/GlobalSnackbar/GlobalSnackbar.tsx @@ -1,7 +1,8 @@ +import type { Interpolation, Theme } from "@emotion/react"; import { type FC, useState } from "react"; import { useCustomEvent } from "hooks/events"; -import { EnterpriseSnackbar } from "./EnterpriseSnackbar"; import { ErrorIcon } from "../Icons/ErrorIcon"; +import { EnterpriseSnackbar } from "./EnterpriseSnackbar"; import { type AdditionalMessage, isNotificationList, @@ -11,7 +12,6 @@ import { type NotificationMsg, SnackbarEventType, } from "./utils"; -import { type Interpolation, type Theme } from "@emotion/react"; const variantFromMsgType = (type: MsgType) => { if (type === MsgType.Error) { diff --git a/site/src/components/GlobalSnackbar/utils.test.ts b/site/src/components/GlobalSnackbar/utils.test.ts index 5fae4407e9..eabff82c28 100644 --- a/site/src/components/GlobalSnackbar/utils.test.ts +++ b/site/src/components/GlobalSnackbar/utils.test.ts @@ -3,8 +3,8 @@ import { displaySuccess, isNotificationTextPrefixed, MsgType, - NotificationMsg, - NotificationTextPrefixed, + type NotificationMsg, + type NotificationTextPrefixed, SnackbarEventType, } from "./utils"; diff --git a/site/src/components/GroupAvatar/GroupAvatar.stories.tsx b/site/src/components/GroupAvatar/GroupAvatar.stories.tsx index 9f0d1e2232..6905c53b05 100644 --- a/site/src/components/GroupAvatar/GroupAvatar.stories.tsx +++ b/site/src/components/GroupAvatar/GroupAvatar.stories.tsx @@ -1,5 +1,5 @@ -import { GroupAvatar } from "./GroupAvatar"; import type { Meta, StoryObj } from "@storybook/react"; +import { GroupAvatar } from "./GroupAvatar"; const meta: Meta = { title: "components/GroupAvatar", diff --git a/site/src/components/GroupAvatar/GroupAvatar.tsx b/site/src/components/GroupAvatar/GroupAvatar.tsx index 7083799ca6..8538ccc914 100644 --- a/site/src/components/GroupAvatar/GroupAvatar.tsx +++ b/site/src/components/GroupAvatar/GroupAvatar.tsx @@ -1,8 +1,8 @@ -import Badge from "@mui/material/Badge"; import Group from "@mui/icons-material/Group"; -import { type FC } from "react"; -import { type ClassName, useClassName } from "hooks/useClassName"; +import Badge from "@mui/material/Badge"; +import type { FC } from "react"; import { Avatar } from "components/Avatar/Avatar"; +import { type ClassName, useClassName } from "hooks/useClassName"; export interface GroupAvatarProps { name: string; diff --git a/site/src/components/HelpTooltip/HelpTooltip.stories.tsx b/site/src/components/HelpTooltip/HelpTooltip.stories.tsx index b009727750..89a4b99fe5 100644 --- a/site/src/components/HelpTooltip/HelpTooltip.stories.tsx +++ b/site/src/components/HelpTooltip/HelpTooltip.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { HelpTooltip, HelpTooltipLink, @@ -5,7 +6,6 @@ import { HelpTooltipText, HelpTooltipTitle, } from "./HelpTooltip"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "components/HelpTooltip", diff --git a/site/src/components/HelpTooltip/HelpTooltip.tsx b/site/src/components/HelpTooltip/HelpTooltip.tsx index 14fcd78ac3..31e2fe1fb2 100644 --- a/site/src/components/HelpTooltip/HelpTooltip.tsx +++ b/site/src/components/HelpTooltip/HelpTooltip.tsx @@ -1,6 +1,8 @@ -import Link from "@mui/material/Link"; +import type { CSSObject } from "@emotion/css"; +import { css, type Interpolation, type Theme, useTheme } from "@emotion/react"; import HelpIcon from "@mui/icons-material/HelpOutline"; import OpenInNewIcon from "@mui/icons-material/OpenInNew"; +import Link from "@mui/material/Link"; import { type FC, type PropsWithChildren, @@ -8,9 +10,6 @@ import { type ReactNode, forwardRef, } from "react"; -import { Stack } from "components/Stack/Stack"; -import { type CSSObject } from "@emotion/css"; -import { css, type Interpolation, type Theme, useTheme } from "@emotion/react"; import { Popover, type PopoverProps, @@ -19,6 +18,7 @@ import { PopoverTrigger, usePopover, } from "components/Popover/Popover"; +import { Stack } from "components/Stack/Stack"; type Icon = typeof HelpIcon; diff --git a/site/src/components/IconField/EmojiPicker.tsx b/site/src/components/IconField/EmojiPicker.tsx index 3b39f7b3ac..5a03740b69 100644 --- a/site/src/components/IconField/EmojiPicker.tsx +++ b/site/src/components/IconField/EmojiPicker.tsx @@ -1,6 +1,6 @@ -import EmojiMart, { type EmojiMartProps } from "@emoji-mart/react"; import data from "@emoji-mart/data/sets/14/twitter.json"; -import { type FC } from "react"; +import EmojiMart, { type EmojiMartProps } from "@emoji-mart/react"; +import type { FC } from "react"; import icons from "theme/icons.json"; const custom = [ diff --git a/site/src/components/IconField/IconField.tsx b/site/src/components/IconField/IconField.tsx index d96d65e823..b2bf348d4d 100644 --- a/site/src/components/IconField/IconField.tsx +++ b/site/src/components/IconField/IconField.tsx @@ -4,15 +4,15 @@ import InputAdornment from "@mui/material/InputAdornment"; import TextField, { type TextFieldProps } from "@mui/material/TextField"; import { visuallyHidden } from "@mui/utils"; import { type FC, lazy, Suspense } from "react"; -import { Loader } from "components/Loader/Loader"; import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; -import { Stack } from "components/Stack/Stack"; +import { ExternalImage } from "components/ExternalImage/ExternalImage"; +import { Loader } from "components/Loader/Loader"; import { Popover, PopoverContent, PopoverTrigger, } from "components/Popover/Popover"; -import { ExternalImage } from "components/ExternalImage/ExternalImage"; +import { Stack } from "components/Stack/Stack"; // See: https://github.com/missive/emoji-mart/issues/51#issuecomment-287353222 const urlFromUnifiedCode = (unified: string) => diff --git a/site/src/components/Icons/CoderIcon.tsx b/site/src/components/Icons/CoderIcon.tsx index 65d4e1fc20..36500790f1 100644 --- a/site/src/components/Icons/CoderIcon.tsx +++ b/site/src/components/Icons/CoderIcon.tsx @@ -1,4 +1,4 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; /** * CoderIcon represents the cloud with brackets Coder brand icon. It does not diff --git a/site/src/components/Icons/DockerIcon.tsx b/site/src/components/Icons/DockerIcon.tsx index 4118804ac8..6307b1ed71 100644 --- a/site/src/components/Icons/DockerIcon.tsx +++ b/site/src/components/Icons/DockerIcon.tsx @@ -1,4 +1,4 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; export const DockerIcon = (props: SvgIconProps): JSX.Element => ( diff --git a/site/src/components/Icons/EditSquare.tsx b/site/src/components/Icons/EditSquare.tsx index 7caf89131d..9d6ef812ce 100644 --- a/site/src/components/Icons/EditSquare.tsx +++ b/site/src/components/Icons/EditSquare.tsx @@ -1,4 +1,4 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; export const EditSquare = (props: SvgIconProps): JSX.Element => ( diff --git a/site/src/components/Icons/ErrorIcon.tsx b/site/src/components/Icons/ErrorIcon.tsx index 4d81f5ff3d..1ceb610113 100644 --- a/site/src/components/Icons/ErrorIcon.tsx +++ b/site/src/components/Icons/ErrorIcon.tsx @@ -1,4 +1,4 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; export const ErrorIcon = (props: SvgIconProps): JSX.Element => ( diff --git a/site/src/components/Icons/FileCopyIcon.tsx b/site/src/components/Icons/FileCopyIcon.tsx index 433498cebb..1de5cfe4fc 100644 --- a/site/src/components/Icons/FileCopyIcon.tsx +++ b/site/src/components/Icons/FileCopyIcon.tsx @@ -1,6 +1,6 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; -export const FileCopyIcon = (props: SvgIconProps) => ( +export const FileCopyIcon = (props: SvgIconProps): JSX.Element => ( ( +export const GitIcon = (props: SvgIconProps): JSX.Element => ( diff --git a/site/src/components/Icons/GitlabIcon.tsx b/site/src/components/Icons/GitlabIcon.tsx index ee7b105ac4..aae6d96e1c 100644 --- a/site/src/components/Icons/GitlabIcon.tsx +++ b/site/src/components/Icons/GitlabIcon.tsx @@ -1,4 +1,4 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; export const GitlabIcon = (props: SvgIconProps): JSX.Element => ( diff --git a/site/src/components/Icons/JetBrainsIcon.tsx b/site/src/components/Icons/JetBrainsIcon.tsx index fb551a7e52..676218941c 100644 --- a/site/src/components/Icons/JetBrainsIcon.tsx +++ b/site/src/components/Icons/JetBrainsIcon.tsx @@ -1,6 +1,6 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; -export const JetBrainsIcon = (props: SvgIconProps) => ( +export const JetBrainsIcon = (props: SvgIconProps): JSX.Element => ( ( diff --git a/site/src/components/Icons/RocketIcon.tsx b/site/src/components/Icons/RocketIcon.tsx index 796a59fd94..5279a7dab7 100644 --- a/site/src/components/Icons/RocketIcon.tsx +++ b/site/src/components/Icons/RocketIcon.tsx @@ -1,6 +1,6 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; -export const RocketIcon = (props: SvgIconProps) => ( +export const RocketIcon = (props: SvgIconProps): JSX.Element => ( diff --git a/site/src/components/Icons/TerminalIcon.tsx b/site/src/components/Icons/TerminalIcon.tsx index b4915050c8..5b46f39f86 100644 --- a/site/src/components/Icons/TerminalIcon.tsx +++ b/site/src/components/Icons/TerminalIcon.tsx @@ -1,6 +1,6 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; -export const TerminalIcon = (props: SvgIconProps) => ( +export const TerminalIcon = (props: SvgIconProps): JSX.Element => ( diff --git a/site/src/components/Icons/TerraformIcon.tsx b/site/src/components/Icons/TerraformIcon.tsx index 4fe2c82653..a71d7c3936 100644 --- a/site/src/components/Icons/TerraformIcon.tsx +++ b/site/src/components/Icons/TerraformIcon.tsx @@ -1,4 +1,4 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; export const TerraformIcon = (props: SvgIconProps): JSX.Element => ( diff --git a/site/src/components/Icons/VSCodeIcon.tsx b/site/src/components/Icons/VSCodeIcon.tsx index 7e210c5d01..97e0c130e2 100644 --- a/site/src/components/Icons/VSCodeIcon.tsx +++ b/site/src/components/Icons/VSCodeIcon.tsx @@ -1,6 +1,6 @@ -import SvgIcon, { SvgIconProps } from "@mui/material/SvgIcon"; +import SvgIcon, { type SvgIconProps } from "@mui/material/SvgIcon"; -export const VSCodeIcon = (props: SvgIconProps) => ( +export const VSCodeIcon = (props: SvgIconProps): JSX.Element => ( ( +export const VSCodeInsidersIcon = (props: SvgIconProps): JSX.Element => ( { size?: number; diff --git a/site/src/components/Margins/Margins.tsx b/site/src/components/Margins/Margins.tsx index 04304197a1..9c03d26261 100644 --- a/site/src/components/Margins/Margins.tsx +++ b/site/src/components/Margins/Margins.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { containerWidth, containerWidthMedium, diff --git a/site/src/components/Markdown/Markdown.tsx b/site/src/components/Markdown/Markdown.tsx index e52a307112..d06d2eca7a 100644 --- a/site/src/components/Markdown/Markdown.tsx +++ b/site/src/components/Markdown/Markdown.tsx @@ -1,3 +1,4 @@ +import type { Interpolation, Theme } from "@emotion/react"; import Link from "@mui/material/Link"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; @@ -5,14 +6,13 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import { type Interpolation, type Theme } from "@emotion/react"; import isEqual from "lodash/isEqual"; import { type FC, memo } from "react"; import ReactMarkdown, { type Options } from "react-markdown"; import { Prism as SyntaxHighlighter } from "react-syntax-highlighter"; +import { dracula } from "react-syntax-highlighter/dist/cjs/styles/prism"; import gfm from "remark-gfm"; import colors from "theme/tailwindColors"; -import { dracula } from "react-syntax-highlighter/dist/cjs/styles/prism"; interface MarkdownProps { /** diff --git a/site/src/components/Menu/Search.tsx b/site/src/components/Menu/Search.tsx index bb5cede3b5..19c3ea9733 100644 --- a/site/src/components/Menu/Search.tsx +++ b/site/src/components/Menu/Search.tsx @@ -1,7 +1,7 @@ +import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import SearchOutlined from "@mui/icons-material/SearchOutlined"; // eslint-disable-next-line no-restricted-imports -- use it to have the component prop import Box, { type BoxProps } from "@mui/material/Box"; -import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import visuallyHidden from "@mui/utils/visuallyHidden"; import { type FC, diff --git a/site/src/components/MoreMenu/MoreMenu.tsx b/site/src/components/MoreMenu/MoreMenu.tsx index f1379e2bf3..c1b1a2f7f4 100644 --- a/site/src/components/MoreMenu/MoreMenu.tsx +++ b/site/src/components/MoreMenu/MoreMenu.tsx @@ -1,18 +1,19 @@ +import MoreVertOutlined from "@mui/icons-material/MoreVertOutlined"; +import IconButton, { type IconButtonProps } from "@mui/material/IconButton"; +import Menu, { type MenuProps } from "@mui/material/Menu"; +import MenuItem, { type MenuItemProps } from "@mui/material/MenuItem"; import { + cloneElement, + createContext, + type FC, + forwardRef, + type HTMLProps, + type PropsWithChildren, + type ReactElement, + useContext, useRef, useState, - createContext, - useContext, - ReactNode, - cloneElement, - HTMLProps, - forwardRef, - ReactElement, } from "react"; -import MoreVertOutlined from "@mui/icons-material/MoreVertOutlined"; -import Menu, { MenuProps } from "@mui/material/Menu"; -import MenuItem, { MenuItemProps } from "@mui/material/MenuItem"; -import IconButton, { IconButtonProps } from "@mui/material/IconButton"; type MoreMenuContextValue = { triggerRef: React.RefObject; @@ -25,7 +26,7 @@ const MoreMenuContext = createContext( undefined, ); -export const MoreMenu = (props: { children: ReactNode }) => { +export const MoreMenu: FC = ({ children }) => { const triggerRef = useRef(null); const [isOpen, setIsOpen] = useState(false); @@ -39,7 +40,7 @@ export const MoreMenu = (props: { children: ReactNode }) => { return ( - {props.children} + {children} ); }; @@ -54,10 +55,10 @@ const useMoreMenuContext = () => { return ctx; }; -export const MoreMenuTrigger = ({ +export const MoreMenuTrigger: FC> = ({ children, ...props -}: HTMLProps) => { +}) => { const menu = useMoreMenuContext(); return cloneElement(children as ReactElement, { @@ -83,7 +84,9 @@ export const ThreeDotsButton = forwardRef( }, ); -export const MoreMenuContent = (props: Omit) => { +export const MoreMenuContent: FC> = ( + props, +) => { const menu = useMoreMenuContext(); return ( @@ -98,10 +101,16 @@ export const MoreMenuContent = (props: Omit) => { ); }; -export const MoreMenuItem = ( - props: MenuItemProps & { closeOnClick?: boolean; danger?: boolean }, -) => { - const { closeOnClick = true, danger = false, ...menuItemProps } = props; +interface MoreMenuItemProps extends MenuItemProps { + closeOnClick?: boolean; + danger?: boolean; +} + +export const MoreMenuItem: FC = ({ + closeOnClick = true, + danger = false, + ...menuItemProps +}) => { const ctx = useContext(MoreMenuContext); if (!ctx) { diff --git a/site/src/components/OverflowY/OverflowY.stories.tsx b/site/src/components/OverflowY/OverflowY.stories.tsx index f27e30d8c7..f8b8319bf7 100644 --- a/site/src/components/OverflowY/OverflowY.stories.tsx +++ b/site/src/components/OverflowY/OverflowY.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { OverflowY } from "./OverflowY"; const numbers: number[] = []; diff --git a/site/src/components/OverflowY/OverflowY.tsx b/site/src/components/OverflowY/OverflowY.tsx index fe055df828..bd659540e1 100644 --- a/site/src/components/OverflowY/OverflowY.tsx +++ b/site/src/components/OverflowY/OverflowY.tsx @@ -1,7 +1,7 @@ /** * @file Provides reusable vertical overflow behavior. */ -import { type FC, type ReactNode } from "react"; +import type { FC, ReactNode } from "react"; type OverflowYProps = { children?: ReactNode; diff --git a/site/src/components/PageHeader/FullWidthPageHeader.tsx b/site/src/components/PageHeader/FullWidthPageHeader.tsx index 117e988a81..2dd041642d 100644 --- a/site/src/components/PageHeader/FullWidthPageHeader.tsx +++ b/site/src/components/PageHeader/FullWidthPageHeader.tsx @@ -1,5 +1,5 @@ import { type CSSObject, useTheme } from "@emotion/react"; -import { type FC, type PropsWithChildren, type ReactNode } from "react"; +import type { FC, PropsWithChildren, ReactNode } from "react"; interface FullWidthPageHeaderProps { children?: ReactNode; diff --git a/site/src/components/PageHeader/PageHeader.stories.tsx b/site/src/components/PageHeader/PageHeader.stories.tsx index 9abbf2255e..98ef72e3af 100644 --- a/site/src/components/PageHeader/PageHeader.stories.tsx +++ b/site/src/components/PageHeader/PageHeader.stories.tsx @@ -1,5 +1,5 @@ -import { PageHeader, PageHeaderSubtitle, PageHeaderTitle } from "./PageHeader"; import type { Meta, StoryObj } from "@storybook/react"; +import { PageHeader, PageHeaderSubtitle, PageHeaderTitle } from "./PageHeader"; const meta: Meta = { title: "components/PageHeader", diff --git a/site/src/components/PageHeader/PageHeader.tsx b/site/src/components/PageHeader/PageHeader.tsx index 9c81e3dc4d..036a209d03 100644 --- a/site/src/components/PageHeader/PageHeader.tsx +++ b/site/src/components/PageHeader/PageHeader.tsx @@ -1,4 +1,4 @@ -import { type FC, type PropsWithChildren, type ReactNode } from "react"; +import type { FC, PropsWithChildren, ReactNode } from "react"; import { Stack } from "../Stack/Stack"; export interface PageHeaderProps { diff --git a/site/src/components/PaginationWidget/PageButtons.tsx b/site/src/components/PaginationWidget/PageButtons.tsx index ec93b301f4..0d66c585cd 100644 --- a/site/src/components/PaginationWidget/PageButtons.tsx +++ b/site/src/components/PaginationWidget/PageButtons.tsx @@ -1,6 +1,6 @@ -import Button from "@mui/material/Button"; import { useTheme } from "@emotion/react"; -import { type FC, type ReactNode } from "react"; +import Button from "@mui/material/Button"; +import type { FC, ReactNode } from "react"; type NumberedPageButtonProps = { pageNumber: number; diff --git a/site/src/components/PaginationWidget/PaginationContainer.stories.tsx b/site/src/components/PaginationWidget/PaginationContainer.stories.tsx index 28095eaa26..e77e2d8773 100644 --- a/site/src/components/PaginationWidget/PaginationContainer.stories.tsx +++ b/site/src/components/PaginationWidget/PaginationContainer.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import type { ComponentProps, FC, @@ -5,8 +6,6 @@ import type { PropsWithChildren, } from "react"; import { PaginationContainer } from "./PaginationContainer"; -import type { Meta, StoryObj } from "@storybook/react"; - import { mockPaginationResultBase, mockInitialRenderResult, diff --git a/site/src/components/PaginationWidget/PaginationContainer.tsx b/site/src/components/PaginationWidget/PaginationContainer.tsx index c0467ead6d..79ef148d03 100644 --- a/site/src/components/PaginationWidget/PaginationContainer.tsx +++ b/site/src/components/PaginationWidget/PaginationContainer.tsx @@ -1,7 +1,7 @@ -import { type FC, type HTMLAttributes } from "react"; -import { type PaginationResultInfo } from "hooks/usePaginatedQuery"; -import { PaginationWidgetBase } from "./PaginationWidgetBase"; +import type { FC, HTMLAttributes } from "react"; +import type { PaginationResultInfo } from "hooks/usePaginatedQuery"; import { PaginationHeader } from "./PaginationHeader"; +import { PaginationWidgetBase } from "./PaginationWidgetBase"; export type PaginationResult = PaginationResultInfo & { isPreviousData: boolean; diff --git a/site/src/components/PaginationWidget/PaginationHeader.tsx b/site/src/components/PaginationWidget/PaginationHeader.tsx index cc6c4fafd9..0f0906d83c 100644 --- a/site/src/components/PaginationWidget/PaginationHeader.tsx +++ b/site/src/components/PaginationWidget/PaginationHeader.tsx @@ -1,6 +1,6 @@ -import { type FC } from "react"; import { useTheme } from "@emotion/react"; import Skeleton from "@mui/material/Skeleton"; +import type { FC } from "react"; type PaginationHeaderProps = { paginationUnitLabel: string; diff --git a/site/src/components/PaginationWidget/PaginationNavButton.tsx b/site/src/components/PaginationWidget/PaginationNavButton.tsx index 1bafe67f1f..4a59592f40 100644 --- a/site/src/components/PaginationWidget/PaginationNavButton.tsx +++ b/site/src/components/PaginationWidget/PaginationNavButton.tsx @@ -1,13 +1,12 @@ +import { useTheme } from "@emotion/react"; +import Button from "@mui/material/Button"; +import Tooltip from "@mui/material/Tooltip"; import { type ButtonHTMLAttributes, type ReactNode, useEffect, useState, } from "react"; -import { useTheme } from "@emotion/react"; - -import Button from "@mui/material/Button"; -import Tooltip from "@mui/material/Tooltip"; type PaginationNavButtonProps = Omit< ButtonHTMLAttributes, diff --git a/site/src/components/PaginationWidget/PaginationWidgetBase.stories.tsx b/site/src/components/PaginationWidget/PaginationWidgetBase.stories.tsx index 1ec16432ea..eaf5b5a8e8 100644 --- a/site/src/components/PaginationWidget/PaginationWidgetBase.stories.tsx +++ b/site/src/components/PaginationWidget/PaginationWidgetBase.stories.tsx @@ -1,5 +1,5 @@ -import { PaginationWidgetBase } from "./PaginationWidgetBase"; import type { Meta, StoryObj } from "@storybook/react"; +import { PaginationWidgetBase } from "./PaginationWidgetBase"; const meta: Meta = { title: "components/PaginationWidgetBase", diff --git a/site/src/components/PaginationWidget/PaginationWidgetBase.test.tsx b/site/src/components/PaginationWidget/PaginationWidgetBase.test.tsx index 3cb5fa2ec6..3a47a43307 100644 --- a/site/src/components/PaginationWidget/PaginationWidgetBase.test.tsx +++ b/site/src/components/PaginationWidget/PaginationWidgetBase.test.tsx @@ -1,10 +1,10 @@ import { screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { renderWithAuth } from "testHelpers/renderHelpers"; import { PaginationWidgetBase, - PaginationWidgetBaseProps, + type PaginationWidgetBaseProps, } from "./PaginationWidgetBase"; -import { renderWithAuth } from "testHelpers/renderHelpers"; -import userEvent from "@testing-library/user-event"; type SampleProps = Omit; diff --git a/site/src/components/PaginationWidget/PaginationWidgetBase.tsx b/site/src/components/PaginationWidget/PaginationWidgetBase.tsx index 420b4a024a..b3edcc26e1 100644 --- a/site/src/components/PaginationWidget/PaginationWidgetBase.tsx +++ b/site/src/components/PaginationWidget/PaginationWidgetBase.tsx @@ -1,11 +1,11 @@ -import useMediaQuery from "@mui/material/useMediaQuery"; import { useTheme } from "@emotion/react"; -import { type FC } from "react"; -import { PlaceholderPageButton, NumberedPageButton } from "./PageButtons"; -import { buildPagedList } from "./utils"; -import { PaginationNavButton } from "./PaginationNavButton"; import KeyboardArrowLeft from "@mui/icons-material/KeyboardArrowLeft"; import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight"; +import useMediaQuery from "@mui/material/useMediaQuery"; +import type { FC } from "react"; +import { PlaceholderPageButton, NumberedPageButton } from "./PageButtons"; +import { PaginationNavButton } from "./PaginationNavButton"; +import { buildPagedList } from "./utils"; export type PaginationWidgetBaseProps = { currentPage: number; diff --git a/site/src/components/Paywall/Paywall.tsx b/site/src/components/Paywall/Paywall.tsx index 7dc48d3309..30d1754bdd 100644 --- a/site/src/components/Paywall/Paywall.tsx +++ b/site/src/components/Paywall/Paywall.tsx @@ -1,8 +1,8 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; +import TaskAltIcon from "@mui/icons-material/TaskAlt"; import Button from "@mui/material/Button"; import Link from "@mui/material/Link"; -import TaskAltIcon from "@mui/icons-material/TaskAlt"; -import { type FC, type ReactNode } from "react"; +import type { FC, ReactNode } from "react"; import { EnterpriseBadge } from "components/Badges/Badges"; import { Stack } from "components/Stack/Stack"; import { docs } from "utils/docs"; diff --git a/site/src/components/Pill/Pill.stories.tsx b/site/src/components/Pill/Pill.stories.tsx index 5ee6802538..bf2caf7ca4 100644 --- a/site/src/components/Pill/Pill.stories.tsx +++ b/site/src/components/Pill/Pill.stories.tsx @@ -1,6 +1,6 @@ -import { Pill, PillSpinner } from "./Pill"; -import type { Meta, StoryObj } from "@storybook/react"; import InfoOutlined from "@mui/icons-material/InfoOutlined"; +import type { Meta, StoryObj } from "@storybook/react"; +import { Pill, PillSpinner } from "./Pill"; const meta: Meta = { title: "components/Pill", diff --git a/site/src/components/Pill/Pill.tsx b/site/src/components/Pill/Pill.tsx index aaa01b5287..c281e8463c 100644 --- a/site/src/components/Pill/Pill.tsx +++ b/site/src/components/Pill/Pill.tsx @@ -1,7 +1,7 @@ +import type { Interpolation, Theme } from "@emotion/react"; import CircularProgress, { type CircularProgressProps, } from "@mui/material/CircularProgress"; -import { type Interpolation, type Theme } from "@emotion/react"; import { type FC, forwardRef, diff --git a/site/src/components/Popover/Popover.tsx b/site/src/components/Popover/Popover.tsx index d3af0d98bb..1ed4e90a73 100644 --- a/site/src/components/Popover/Popover.tsx +++ b/site/src/components/Popover/Popover.tsx @@ -1,25 +1,26 @@ -import { - type FC, - type ReactElement, - type ReactNode, - cloneElement, - createContext, - useContext, - useEffect, - useId, - useRef, - useState, - HTMLAttributes, -} from "react"; // This is used as base for the main Popover component // eslint-disable-next-line no-restricted-imports -- Read above import MuiPopover, { type PopoverProps as MuiPopoverProps, } from "@mui/material/Popover"; +import { + cloneElement, + createContext, + type FC, + type HTMLAttributes, + type ReactElement, + type ReactNode, + type RefObject, + useContext, + useEffect, + useId, + useRef, + useState, +} from "react"; type TriggerMode = "hover" | "click"; -type TriggerRef = React.RefObject; +type TriggerRef = RefObject; type TriggerElement = ReactElement<{ ref: TriggerRef; diff --git a/site/src/components/RichParameterInput/MultiTextField.tsx b/site/src/components/RichParameterInput/MultiTextField.tsx index 7adcda6fc1..5415a71b63 100644 --- a/site/src/components/RichParameterInput/MultiTextField.tsx +++ b/site/src/components/RichParameterInput/MultiTextField.tsx @@ -1,7 +1,7 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import Chip from "@mui/material/Chip"; import FormHelperText from "@mui/material/FormHelperText"; -import { type FC } from "react"; +import type { FC } from "react"; export type MultiTextFieldProps = { label: string; diff --git a/site/src/components/RichParameterInput/RichParameterInput.tsx b/site/src/components/RichParameterInput/RichParameterInput.tsx index 751281e428..d7d7a4f2e5 100644 --- a/site/src/components/RichParameterInput/RichParameterInput.tsx +++ b/site/src/components/RichParameterInput/RichParameterInput.tsx @@ -1,20 +1,23 @@ +import type { Interpolation, Theme } from "@emotion/react"; +import ErrorOutline from "@mui/icons-material/ErrorOutline"; +import Button from "@mui/material/Button"; import FormControlLabel from "@mui/material/FormControlLabel"; +import FormHelperText from "@mui/material/FormHelperText"; import Radio from "@mui/material/Radio"; import RadioGroup from "@mui/material/RadioGroup"; -import TextField, { TextFieldProps } from "@mui/material/TextField"; +import TextField, { type TextFieldProps } from "@mui/material/TextField"; import Tooltip from "@mui/material/Tooltip"; -import Button from "@mui/material/Button"; -import FormHelperText from "@mui/material/FormHelperText"; -import { type Interpolation, type Theme } from "@emotion/react"; import { type FC, type ReactNode, useState } from "react"; -import { TemplateVersionParameter } from "api/typesGenerated"; -import { MemoizedMarkdown } from "components/Markdown/Markdown"; -import { Stack } from "components/Stack/Stack"; -import { MultiTextField } from "./MultiTextField"; +import type { TemplateVersionParameter } from "api/typesGenerated"; import { ExternalImage } from "components/ExternalImage/ExternalImage"; -import { AutofillBuildParameter, AutofillSource } from "utils/richParameters"; +import { MemoizedMarkdown } from "components/Markdown/Markdown"; import { Pill } from "components/Pill/Pill"; -import ErrorOutline from "@mui/icons-material/ErrorOutline"; +import { Stack } from "components/Stack/Stack"; +import type { + AutofillBuildParameter, + AutofillSource, +} from "utils/richParameters"; +import { MultiTextField } from "./MultiTextField"; const isBoolean = (parameter: TemplateVersionParameter) => { return parameter.type === "bool"; diff --git a/site/src/components/Sidebar/Sidebar.stories.tsx b/site/src/components/Sidebar/Sidebar.stories.tsx index f642eeb287..0bbe9b1b0a 100644 --- a/site/src/components/Sidebar/Sidebar.stories.tsx +++ b/site/src/components/Sidebar/Sidebar.stories.tsx @@ -1,11 +1,11 @@ -import { Sidebar, SidebarHeader, SidebarNavItem } from "./Sidebar"; +import ScheduleIcon from "@mui/icons-material/EditCalendarOutlined"; +import FingerprintOutlinedIcon from "@mui/icons-material/FingerprintOutlined"; +import SecurityIcon from "@mui/icons-material/LockOutlined"; +import AccountIcon from "@mui/icons-material/Person"; +import VpnKeyOutlined from "@mui/icons-material/VpnKeyOutlined"; import type { Meta, StoryObj } from "@storybook/react"; import { UserAvatar } from "components/UserAvatar/UserAvatar"; -import VpnKeyOutlined from "@mui/icons-material/VpnKeyOutlined"; -import FingerprintOutlinedIcon from "@mui/icons-material/FingerprintOutlined"; -import AccountIcon from "@mui/icons-material/Person"; -import ScheduleIcon from "@mui/icons-material/EditCalendarOutlined"; -import SecurityIcon from "@mui/icons-material/LockOutlined"; +import { Sidebar, SidebarHeader, SidebarNavItem } from "./Sidebar"; const meta: Meta = { title: "components/Sidebar", diff --git a/site/src/components/Sidebar/Sidebar.tsx b/site/src/components/Sidebar/Sidebar.tsx index 396bec9a48..a89170cffd 100644 --- a/site/src/components/Sidebar/Sidebar.tsx +++ b/site/src/components/Sidebar/Sidebar.tsx @@ -1,6 +1,6 @@ import { cx } from "@emotion/css"; -import { type CSSObject, type Interpolation, type Theme } from "@emotion/react"; -import { type ElementType, type FC, type ReactNode } from "react"; +import type { CSSObject, Interpolation, Theme } from "@emotion/react"; +import type { ElementType, FC, ReactNode } from "react"; import { Link, NavLink } from "react-router-dom"; import { Stack } from "components/Stack/Stack"; import { type ClassName, useClassName } from "hooks/useClassName"; diff --git a/site/src/components/SignInLayout/SignInLayout.tsx b/site/src/components/SignInLayout/SignInLayout.tsx index e033a2024a..c17c4c7d75 100644 --- a/site/src/components/SignInLayout/SignInLayout.tsx +++ b/site/src/components/SignInLayout/SignInLayout.tsx @@ -1,5 +1,5 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC, type PropsWithChildren } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC, PropsWithChildren } from "react"; export const SignInLayout: FC = ({ children }) => { return ( diff --git a/site/src/components/Stack/Stack.tsx b/site/src/components/Stack/Stack.tsx index 73f725e267..86477ab7b1 100644 --- a/site/src/components/Stack/Stack.tsx +++ b/site/src/components/Stack/Stack.tsx @@ -1,5 +1,5 @@ -import { forwardRef } from "react"; import type { CSSObject } from "@emotion/react"; +import { forwardRef } from "react"; export type StackProps = { className?: string; diff --git a/site/src/components/SyntaxHighlighter/SyntaxHighlighter.tsx b/site/src/components/SyntaxHighlighter/SyntaxHighlighter.tsx index f52f2523e4..5a13fe0b6d 100644 --- a/site/src/components/SyntaxHighlighter/SyntaxHighlighter.tsx +++ b/site/src/components/SyntaxHighlighter/SyntaxHighlighter.tsx @@ -1,8 +1,8 @@ -import { type ComponentProps, type FC } from "react"; +import { useTheme } from "@emotion/react"; import Editor, { DiffEditor, loader } from "@monaco-editor/react"; import * as monaco from "monaco-editor"; +import type { ComponentProps, FC } from "react"; import { useCoderTheme } from "./coderTheme"; -import { useTheme } from "@emotion/react"; loader.config({ monaco }); diff --git a/site/src/components/SyntaxHighlighter/coderTheme.ts b/site/src/components/SyntaxHighlighter/coderTheme.ts index d543a04111..8d611fdcc9 100644 --- a/site/src/components/SyntaxHighlighter/coderTheme.ts +++ b/site/src/components/SyntaxHighlighter/coderTheme.ts @@ -1,5 +1,5 @@ -import { useMonaco } from "@monaco-editor/react"; import { useTheme } from "@emotion/react"; +import { useMonaco } from "@monaco-editor/react"; import { useEffect, useState } from "react"; export const useCoderTheme = (): { isLoading: boolean; name: string } => { diff --git a/site/src/components/TableEmpty/TableEmpty.stories.tsx b/site/src/components/TableEmpty/TableEmpty.stories.tsx index b9ddec5e88..614b61804c 100644 --- a/site/src/components/TableEmpty/TableEmpty.stories.tsx +++ b/site/src/components/TableEmpty/TableEmpty.stories.tsx @@ -1,7 +1,7 @@ -import type { Meta, StoryObj } from "@storybook/react"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableContainer from "@mui/material/TableContainer"; +import type { Meta, StoryObj } from "@storybook/react"; import { CodeExample } from "components/CodeExample/CodeExample"; import { TableEmpty } from "./TableEmpty"; diff --git a/site/src/components/TableEmpty/TableEmpty.tsx b/site/src/components/TableEmpty/TableEmpty.tsx index be7d0917d0..b314840fa9 100644 --- a/site/src/components/TableEmpty/TableEmpty.tsx +++ b/site/src/components/TableEmpty/TableEmpty.tsx @@ -1,6 +1,6 @@ import TableCell from "@mui/material/TableCell"; import TableRow from "@mui/material/TableRow"; -import { type FC } from "react"; +import type { FC } from "react"; import { EmptyState, type EmptyStateProps, diff --git a/site/src/components/TableLoader/TableLoader.stories.tsx b/site/src/components/TableLoader/TableLoader.stories.tsx index 29d14f1eb0..9662f7468d 100644 --- a/site/src/components/TableLoader/TableLoader.stories.tsx +++ b/site/src/components/TableLoader/TableLoader.stories.tsx @@ -1,7 +1,7 @@ -import type { Meta, StoryObj } from "@storybook/react"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableContainer from "@mui/material/TableContainer"; +import type { Meta, StoryObj } from "@storybook/react"; import { TableLoader } from "./TableLoader"; const meta: Meta = { diff --git a/site/src/components/TableToolbar/TableToolbar.tsx b/site/src/components/TableToolbar/TableToolbar.tsx index bee49cac87..73c95f93c3 100644 --- a/site/src/components/TableToolbar/TableToolbar.tsx +++ b/site/src/components/TableToolbar/TableToolbar.tsx @@ -1,5 +1,5 @@ import Skeleton from "@mui/material/Skeleton"; -import { type FC, type PropsWithChildren } from "react"; +import type { FC, PropsWithChildren } from "react"; export const TableToolbar: FC = ({ children }) => { return ( diff --git a/site/src/components/Tabs/Tabs.stories.tsx b/site/src/components/Tabs/Tabs.stories.tsx index 94466403dd..a36190c476 100644 --- a/site/src/components/Tabs/Tabs.stories.tsx +++ b/site/src/components/Tabs/Tabs.stories.tsx @@ -1,5 +1,5 @@ -import { Tabs, TabLink, TabsList } from "./Tabs"; import type { Meta, StoryObj } from "@storybook/react"; +import { Tabs, TabLink, TabsList } from "./Tabs"; const meta: Meta = { title: "components/Tabs", diff --git a/site/src/components/Tabs/Tabs.tsx b/site/src/components/Tabs/Tabs.tsx index 31e2f722b8..81a7a532f6 100644 --- a/site/src/components/Tabs/Tabs.tsx +++ b/site/src/components/Tabs/Tabs.tsx @@ -1,6 +1,6 @@ -import { HTMLAttributes, type FC, createContext, useContext } from "react"; -import { Link, LinkProps } from "react-router-dom"; -import { Interpolation, Theme, useTheme } from "@emotion/react"; +import { type Interpolation, type Theme, useTheme } from "@emotion/react"; +import { createContext, type FC, type HTMLAttributes, useContext } from "react"; +import { Link, type LinkProps } from "react-router-dom"; export const TAB_PADDING_Y = 12; export const TAB_PADDING_X = 16; diff --git a/site/src/components/Timeline/Timeline.tsx b/site/src/components/Timeline/Timeline.tsx index ad7041d5e9..665f3a7c92 100644 --- a/site/src/components/Timeline/Timeline.tsx +++ b/site/src/components/Timeline/Timeline.tsx @@ -1,5 +1,5 @@ -import { TimelineDateRow } from "components/Timeline/TimelineDateRow"; import { Fragment } from "react"; +import { TimelineDateRow } from "components/Timeline/TimelineDateRow"; type GetDateFn = (data: TData) => Date; diff --git a/site/src/components/Timeline/TimelineDateRow.tsx b/site/src/components/Timeline/TimelineDateRow.tsx index 331ba7e056..706ada1e29 100644 --- a/site/src/components/Timeline/TimelineDateRow.tsx +++ b/site/src/components/Timeline/TimelineDateRow.tsx @@ -1,7 +1,7 @@ +import { css, useTheme } from "@emotion/react"; import TableCell from "@mui/material/TableCell"; import TableRow from "@mui/material/TableRow"; -import { type FC } from "react"; -import { css, useTheme } from "@emotion/react"; +import type { FC } from "react"; import { createDisplayDate } from "./utils"; export interface TimelineDateRow { diff --git a/site/src/components/UserAutocomplete/UserAutocomplete.stories.tsx b/site/src/components/UserAutocomplete/UserAutocomplete.stories.tsx index 9558c14b2d..d173fdca49 100644 --- a/site/src/components/UserAutocomplete/UserAutocomplete.stories.tsx +++ b/site/src/components/UserAutocomplete/UserAutocomplete.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockUser } from "testHelpers/entities"; import { UserAutocomplete } from "./UserAutocomplete"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "components/UserAutocomplete", diff --git a/site/src/components/UserAutocomplete/UserAutocomplete.tsx b/site/src/components/UserAutocomplete/UserAutocomplete.tsx index d5edac6650..c907f2757e 100644 --- a/site/src/components/UserAutocomplete/UserAutocomplete.tsx +++ b/site/src/components/UserAutocomplete/UserAutocomplete.tsx @@ -1,19 +1,19 @@ import { css } from "@emotion/css"; +import Autocomplete from "@mui/material/Autocomplete"; import CircularProgress from "@mui/material/CircularProgress"; import TextField from "@mui/material/TextField"; -import Autocomplete from "@mui/material/Autocomplete"; -import type { User } from "api/typesGenerated"; -import { Avatar } from "components/Avatar/Avatar"; -import { AvatarData } from "components/AvatarData/AvatarData"; import { type ChangeEvent, type ComponentProps, type FC, useState, } from "react"; -import { useDebouncedFunction } from "hooks/debounce"; import { useQuery } from "react-query"; import { users } from "api/queries/users"; +import type { User } from "api/typesGenerated"; +import { Avatar } from "components/Avatar/Avatar"; +import { AvatarData } from "components/AvatarData/AvatarData"; +import { useDebouncedFunction } from "hooks/debounce"; import { prepareQuery } from "utils/filters"; export type UserAutocompleteProps = { diff --git a/site/src/components/UserAvatar/UserAvatar.tsx b/site/src/components/UserAvatar/UserAvatar.tsx index a2d38efcca..1de3e6e368 100644 --- a/site/src/components/UserAvatar/UserAvatar.tsx +++ b/site/src/components/UserAvatar/UserAvatar.tsx @@ -1,5 +1,5 @@ +import type { FC } from "react"; import { Avatar, type AvatarProps } from "components/Avatar/Avatar"; -import { type FC } from "react"; export type UserAvatarProps = { username: string; diff --git a/site/src/components/Welcome/Welcome.tsx b/site/src/components/Welcome/Welcome.tsx index 4863fa15c2..7111a51212 100644 --- a/site/src/components/Welcome/Welcome.tsx +++ b/site/src/components/Welcome/Welcome.tsx @@ -1,5 +1,5 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC, type PropsWithChildren } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC, PropsWithChildren } from "react"; import { CoderIcon } from "../Icons/CoderIcon"; const Language = { diff --git a/site/src/contexts/ProxyContext.test.tsx b/site/src/contexts/ProxyContext.test.tsx index 5b66c89b3f..5378c93a29 100644 --- a/site/src/contexts/ProxyContext.test.tsx +++ b/site/src/contexts/ProxyContext.test.tsx @@ -1,26 +1,26 @@ +import "testHelpers/localStorage"; +import { screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { rest } from "msw"; +import type { Region } from "api/typesGenerated"; import { MockPrimaryWorkspaceProxy, MockWorkspaceProxies, MockHealthyWildWorkspaceProxy, MockUnhealthyWildWorkspaceProxy, } from "testHelpers/entities"; +import { + renderWithAuth, + waitForLoaderToBeRemoved, +} from "testHelpers/renderHelpers"; +import { server } from "testHelpers/server"; import { getPreferredProxy, ProxyProvider, saveUserSelectedProxy, useProxy, } from "./ProxyContext"; -import * as ProxyLatency from "./useProxyLatency"; -import { - renderWithAuth, - waitForLoaderToBeRemoved, -} from "testHelpers/renderHelpers"; -import { screen } from "@testing-library/react"; -import { server } from "testHelpers/server"; -import { rest } from "msw"; -import { Region } from "api/typesGenerated"; -import "testHelpers/localStorage"; -import userEvent from "@testing-library/user-event"; +import type * as ProxyLatency from "./useProxyLatency"; // Mock useProxyLatency to use a hard-coded latency. 'jest.mock' must be called // here and not inside a unit test. diff --git a/site/src/contexts/ProxyContext.tsx b/site/src/contexts/ProxyContext.tsx index 12a6ef9171..fbcd6948d1 100644 --- a/site/src/contexts/ProxyContext.tsx +++ b/site/src/contexts/ProxyContext.tsx @@ -11,7 +11,7 @@ import { useQuery } from "react-query"; import { getWorkspaceProxies, getWorkspaceProxyRegions } from "api/api"; import type { Region, WorkspaceProxy } from "api/typesGenerated"; import { usePermissions } from "contexts/auth/usePermissions"; -import { ProxyLatencyReport, useProxyLatency } from "./useProxyLatency"; +import { type ProxyLatencyReport, useProxyLatency } from "./useProxyLatency"; export interface ProxyContextValue { // proxy is **always** the workspace proxy that should be used. diff --git a/site/src/contexts/auth/AuthProvider.tsx b/site/src/contexts/auth/AuthProvider.tsx index 573c5c20a2..10415e7f1d 100644 --- a/site/src/contexts/auth/AuthProvider.tsx +++ b/site/src/contexts/auth/AuthProvider.tsx @@ -5,6 +5,7 @@ import { useCallback, } from "react"; import { useMutation, useQuery, useQueryClient } from "react-query"; +import { isApiError } from "api/errors"; import { checkAuthorization } from "api/queries/authCheck"; import { authMethods, @@ -14,7 +15,6 @@ import { me, updateProfile as updateProfileOptions, } from "api/queries/users"; -import { isApiError } from "api/errors"; import type { AuthMethods, UpdateUserProfileRequest, diff --git a/site/src/contexts/auth/RequireAuth.tsx b/site/src/contexts/auth/RequireAuth.tsx index 55b78c2a8c..fa9b79068b 100644 --- a/site/src/contexts/auth/RequireAuth.tsx +++ b/site/src/contexts/auth/RequireAuth.tsx @@ -1,11 +1,11 @@ import axios from "axios"; import { type FC, useEffect } from "react"; import { Outlet, Navigate, useLocation } from "react-router-dom"; -import { embedRedirect } from "utils/redirect"; import { isApiError } from "api/errors"; +import { FullScreenLoader } from "components/Loader/FullScreenLoader"; import { ProxyProvider } from "contexts/ProxyContext"; import { DashboardProvider } from "modules/dashboard/DashboardProvider"; -import { FullScreenLoader } from "components/Loader/FullScreenLoader"; +import { embedRedirect } from "utils/redirect"; import { useAuth } from "./useAuth"; export const RequireAuth: FC = () => { diff --git a/site/src/contexts/auth/RequirePermission.tsx b/site/src/contexts/auth/RequirePermission.tsx index 51bdd394f6..cc9701c188 100644 --- a/site/src/contexts/auth/RequirePermission.tsx +++ b/site/src/contexts/auth/RequirePermission.tsx @@ -1,4 +1,4 @@ -import { type FC, type ReactNode } from "react"; +import type { FC, ReactNode } from "react"; import { Navigate } from "react-router-dom"; export interface RequirePermissionProps { diff --git a/site/src/contexts/auth/usePermissions.ts b/site/src/contexts/auth/usePermissions.ts index 8638b19d02..6d27e2a884 100644 --- a/site/src/contexts/auth/usePermissions.ts +++ b/site/src/contexts/auth/usePermissions.ts @@ -1,5 +1,5 @@ -import { useAuth } from "./useAuth"; import type { Permissions } from "./permissions"; +import { useAuth } from "./useAuth"; export const usePermissions = (): Permissions => { const { permissions } = useAuth(); diff --git a/site/src/contexts/useProxyLatency.ts b/site/src/contexts/useProxyLatency.ts index dbf689f368..d50f7ead1d 100644 --- a/site/src/contexts/useProxyLatency.ts +++ b/site/src/contexts/useProxyLatency.ts @@ -1,7 +1,7 @@ -import { Region } from "api/typesGenerated"; -import { useEffect, useReducer, useState } from "react"; import PerformanceObserver from "@fastly/performance-observer-polyfill"; import axios from "axios"; +import { useEffect, useReducer, useState } from "react"; +import type { Region } from "api/typesGenerated"; import { generateRandomString } from "utils/random"; const proxyIntervalSeconds = 30; // seconds diff --git a/site/src/hooks/events.ts b/site/src/hooks/events.ts index 68e6f0c59f..a1fb6da320 100644 --- a/site/src/hooks/events.ts +++ b/site/src/hooks/events.ts @@ -1,6 +1,6 @@ import { useEffect } from "react"; +import type { CustomEventListener } from "utils/events"; import { useEffectEvent } from "./hookPolyfills"; -import { type CustomEventListener } from "utils/events"; /** * Handles a custom event with descriptive type information. diff --git a/site/src/hooks/useClassName.ts b/site/src/hooks/useClassName.ts index 595308dead..0e8f3bee1d 100644 --- a/site/src/hooks/useClassName.ts +++ b/site/src/hooks/useClassName.ts @@ -1,8 +1,8 @@ /* eslint-disable react-hooks/exhaustive-deps -- false positives */ import { css } from "@emotion/css"; -import { type DependencyList, useMemo } from "react"; import { type Theme, useTheme } from "@emotion/react"; +import { type DependencyList, useMemo } from "react"; export type ClassName = (cssFn: typeof css, theme: Theme) => string; diff --git a/site/src/hooks/useClickable.test.tsx b/site/src/hooks/useClickable.test.tsx index cab5e8833a..e622db8e38 100644 --- a/site/src/hooks/useClickable.test.tsx +++ b/site/src/hooks/useClickable.test.tsx @@ -1,13 +1,12 @@ -import { - type ElementType, - type FC, - type MouseEventHandler, - type PropsWithChildren, -} from "react"; - -import { type ClickableAriaRole, useClickable } from "./useClickable"; import { render, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; +import type { + ElementType, + FC, + MouseEventHandler, + PropsWithChildren, +} from "react"; +import { type ClickableAriaRole, useClickable } from "./useClickable"; /** * Since the point of the hook is to take a traditionally non-interactive HTML diff --git a/site/src/hooks/useClickableTableRow.ts b/site/src/hooks/useClickableTableRow.ts index 106dd43ebd..fafcf616c4 100644 --- a/site/src/hooks/useClickableTableRow.ts +++ b/site/src/hooks/useClickableTableRow.ts @@ -13,15 +13,14 @@ * It might not make sense to test this hook until the underlying design * problems are fixed. */ -import { type MouseEventHandler } from "react"; import { type CSSObject, useTheme } from "@emotion/react"; - +import type { TableRowProps } from "@mui/material/TableRow"; +import type { MouseEventHandler } from "react"; import { type ClickableAriaRole, type UseClickableResult, useClickable, } from "./useClickable"; -import { type TableRowProps } from "@mui/material/TableRow"; type UseClickableTableRowResult< TRole extends ClickableAriaRole = ClickableAriaRole, diff --git a/site/src/hooks/useClipboard.test-setup.tsx b/site/src/hooks/useClipboard.test-setup.tsx index 32837598b1..7de7ea7143 100644 --- a/site/src/hooks/useClipboard.test-setup.tsx +++ b/site/src/hooks/useClipboard.test-setup.tsx @@ -41,13 +41,13 @@ * order of operations involving closure, but you have no idea why the code * is working, and it's impossible to debug. */ +import { act, renderHook } from "@testing-library/react"; +import { GlobalSnackbar } from "components/GlobalSnackbar/GlobalSnackbar"; import { type UseClipboardInput, type UseClipboardResult, useClipboard, } from "./useClipboard"; -import { act, renderHook } from "@testing-library/react"; -import { GlobalSnackbar } from "components/GlobalSnackbar/GlobalSnackbar"; const initialExecCommand = global.document.execCommand; beforeAll(() => { diff --git a/site/src/hooks/usePaginatedQuery.test.ts b/site/src/hooks/usePaginatedQuery.test.ts index 8257f8ca69..9bb8c69603 100644 --- a/site/src/hooks/usePaginatedQuery.test.ts +++ b/site/src/hooks/usePaginatedQuery.test.ts @@ -1,6 +1,5 @@ -import { renderHookWithAuth } from "testHelpers/renderHelpers"; import { waitFor } from "@testing-library/react"; - +import { renderHookWithAuth } from "testHelpers/renderHelpers"; import { type PaginatedData, type UsePaginatedQueryOptions, diff --git a/site/src/hooks/usePaginatedQuery.ts b/site/src/hooks/usePaginatedQuery.ts index bc1844e2e3..4a06ac00a0 100644 --- a/site/src/hooks/usePaginatedQuery.ts +++ b/site/src/hooks/usePaginatedQuery.ts @@ -1,8 +1,5 @@ -import { useEffect } from "react"; -import { useEffectEvent } from "./hookPolyfills"; -import { type SetURLSearchParams, useSearchParams } from "react-router-dom"; import clamp from "lodash/clamp"; - +import { useEffect } from "react"; import { type QueryFunctionContext, type QueryKey, @@ -11,6 +8,8 @@ import { useQueryClient, useQuery, } from "react-query"; +import { type SetURLSearchParams, useSearchParams } from "react-router-dom"; +import { useEffectEvent } from "./hookPolyfills"; const DEFAULT_RECORDS_PER_PAGE = 25; diff --git a/site/src/hooks/usePagination.ts b/site/src/hooks/usePagination.ts index 2feee1ac1f..c813706a6b 100644 --- a/site/src/hooks/usePagination.ts +++ b/site/src/hooks/usePagination.ts @@ -1,5 +1,5 @@ +import type { useSearchParams } from "react-router-dom"; import { DEFAULT_RECORDS_PER_PAGE } from "components/PaginationWidget/utils"; -import { useSearchParams } from "react-router-dom"; export const usePagination = ({ searchParamsResult, diff --git a/site/src/hooks/useWorkspaceBuildLogs.ts b/site/src/hooks/useWorkspaceBuildLogs.ts index 21d95d7cbf..84557780f1 100644 --- a/site/src/hooks/useWorkspaceBuildLogs.ts +++ b/site/src/hooks/useWorkspaceBuildLogs.ts @@ -1,7 +1,7 @@ -import { watchBuildLogsByBuildId } from "api/api"; -import { ProvisionerJobLog } from "api/typesGenerated"; -import { displayError } from "components/GlobalSnackbar/utils"; import { useState, useEffect, useRef } from "react"; +import { watchBuildLogsByBuildId } from "api/api"; +import type { ProvisionerJobLog } from "api/typesGenerated"; +import { displayError } from "components/GlobalSnackbar/utils"; export const useWorkspaceBuildLogs = ( // buildId is optional because sometimes the build is not loaded yet diff --git a/site/src/modules/dashboard/DashboardLayout.test.tsx b/site/src/modules/dashboard/DashboardLayout.test.tsx index b580225491..257e26743e 100644 --- a/site/src/modules/dashboard/DashboardLayout.test.tsx +++ b/site/src/modules/dashboard/DashboardLayout.test.tsx @@ -1,8 +1,8 @@ -import { renderWithAuth } from "testHelpers/renderHelpers"; -import { DashboardLayout } from "./DashboardLayout"; import { screen } from "@testing-library/react"; import { rest } from "msw"; +import { renderWithAuth } from "testHelpers/renderHelpers"; import { server } from "testHelpers/server"; +import { DashboardLayout } from "./DashboardLayout"; test("Show the new Coder version notification", async () => { server.use( diff --git a/site/src/modules/dashboard/DashboardLayout.tsx b/site/src/modules/dashboard/DashboardLayout.tsx index 6bf30a22a3..4e105dce59 100644 --- a/site/src/modules/dashboard/DashboardLayout.tsx +++ b/site/src/modules/dashboard/DashboardLayout.tsx @@ -1,17 +1,17 @@ -import Snackbar from "@mui/material/Snackbar"; -import Link from "@mui/material/Link"; -import Button from "@mui/material/Button"; import InfoOutlined from "@mui/icons-material/InfoOutlined"; +import Button from "@mui/material/Button"; +import Link from "@mui/material/Link"; +import Snackbar from "@mui/material/Snackbar"; import { type FC, type HTMLAttributes, Suspense } from "react"; import { Outlet } from "react-router-dom"; +import { Loader } from "components/Loader/Loader"; +import { usePermissions } from "contexts/auth/usePermissions"; import { LicenseBanner } from "modules/dashboard/LicenseBanner/LicenseBanner"; import { ServiceBanner } from "modules/dashboard/ServiceBanner/ServiceBanner"; -import { usePermissions } from "contexts/auth/usePermissions"; -import { Loader } from "components/Loader/Loader"; import { dashboardContentBottomPadding } from "theme/constants"; import { docs } from "utils/docs"; -import { Navbar } from "./Navbar/Navbar"; import { DeploymentBanner } from "./DeploymentBanner/DeploymentBanner"; +import { Navbar } from "./Navbar/Navbar"; import { useUpdateCheck } from "./useUpdateCheck"; export const DashboardLayout: FC = () => { diff --git a/site/src/modules/dashboard/DashboardProvider.tsx b/site/src/modules/dashboard/DashboardProvider.tsx index fcd84f8d2d..88cd74cdb5 100644 --- a/site/src/modules/dashboard/DashboardProvider.tsx +++ b/site/src/modules/dashboard/DashboardProvider.tsx @@ -1,24 +1,24 @@ -import { useQuery } from "react-query"; -import { buildInfo } from "api/queries/buildInfo"; -import { experiments } from "api/queries/experiments"; -import { entitlements } from "api/queries/entitlements"; import { + createContext, + type FC, + type PropsWithChildren, + useCallback, + useState, +} from "react"; +import { useQuery } from "react-query"; +import { appearance } from "api/queries/appearance"; +import { buildInfo } from "api/queries/buildInfo"; +import { entitlements } from "api/queries/entitlements"; +import { experiments } from "api/queries/experiments"; +import type { AppearanceConfig, BuildInfoResponse, Entitlements, Experiments, } from "api/typesGenerated"; -import { FullScreenLoader } from "components/Loader/FullScreenLoader"; -import { - type FC, - type PropsWithChildren, - createContext, - useCallback, - useState, -} from "react"; -import { appearance } from "api/queries/appearance"; -import { hslToHex, isHexColor, isHslColor } from "utils/colors"; import { displayError } from "components/GlobalSnackbar/utils"; +import { FullScreenLoader } from "components/Loader/FullScreenLoader"; +import { hslToHex, isHexColor, isHslColor } from "utils/colors"; interface Appearance { config: AppearanceConfig; diff --git a/site/src/modules/dashboard/DeploymentBanner/DeploymentBanner.tsx b/site/src/modules/dashboard/DeploymentBanner/DeploymentBanner.tsx index 4f32b3a33d..ee37bed62e 100644 --- a/site/src/modules/dashboard/DeploymentBanner/DeploymentBanner.tsx +++ b/site/src/modules/dashboard/DeploymentBanner/DeploymentBanner.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useQuery } from "react-query"; import { health } from "api/queries/debug"; import { deploymentStats } from "api/queries/deployment"; diff --git a/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx b/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx index 3523691550..f446a23b73 100644 --- a/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx +++ b/site/src/modules/dashboard/DeploymentBanner/DeploymentBannerView.tsx @@ -1,29 +1,3 @@ -import type { - DeploymentStats, - HealthcheckReport, - WorkspaceStatus, -} from "api/typesGenerated"; -import { - type FC, - type PropsWithChildren, - useMemo, - useEffect, - useState, -} from "react"; -import prettyBytes from "pretty-bytes"; -import BuildingIcon from "@mui/icons-material/Build"; -import Tooltip from "@mui/material/Tooltip"; -import { Link as RouterLink } from "react-router-dom"; -import Link from "@mui/material/Link"; -import { JetBrainsIcon } from "components/Icons/JetBrainsIcon"; -import { VSCodeIcon } from "components/Icons/VSCodeIcon"; -import DownloadIcon from "@mui/icons-material/CloudDownload"; -import UploadIcon from "@mui/icons-material/CloudUpload"; -import LatencyIcon from "@mui/icons-material/SettingsEthernet"; -import WebTerminalIcon from "@mui/icons-material/WebAsset"; -import CollectedIcon from "@mui/icons-material/Compare"; -import RefreshIcon from "@mui/icons-material/Refresh"; -import Button from "@mui/material/Button"; import { css, type CSSObject, @@ -31,16 +5,42 @@ import { type Interpolation, useTheme, } from "@emotion/react"; -import dayjs from "dayjs"; -import { TerminalIcon } from "components/Icons/TerminalIcon"; -import { RocketIcon } from "components/Icons/RocketIcon"; +import BuildingIcon from "@mui/icons-material/Build"; +import DownloadIcon from "@mui/icons-material/CloudDownload"; +import UploadIcon from "@mui/icons-material/CloudUpload"; +import CollectedIcon from "@mui/icons-material/Compare"; import ErrorIcon from "@mui/icons-material/ErrorOutline"; +import RefreshIcon from "@mui/icons-material/Refresh"; +import LatencyIcon from "@mui/icons-material/SettingsEthernet"; +import WebTerminalIcon from "@mui/icons-material/WebAsset"; +import Button from "@mui/material/Button"; +import Link from "@mui/material/Link"; +import Tooltip from "@mui/material/Tooltip"; +import dayjs from "dayjs"; +import prettyBytes from "pretty-bytes"; +import { + type FC, + type PropsWithChildren, + useMemo, + useEffect, + useState, +} from "react"; +import { Link as RouterLink } from "react-router-dom"; +import type { + DeploymentStats, + HealthcheckReport, + WorkspaceStatus, +} from "api/typesGenerated"; +import { HelpTooltipTitle } from "components/HelpTooltip/HelpTooltip"; +import { JetBrainsIcon } from "components/Icons/JetBrainsIcon"; +import { RocketIcon } from "components/Icons/RocketIcon"; +import { TerminalIcon } from "components/Icons/TerminalIcon"; +import { VSCodeIcon } from "components/Icons/VSCodeIcon"; +import { Stack } from "components/Stack/Stack"; +import { type ClassName, useClassName } from "hooks/useClassName"; import { MONOSPACE_FONT_FAMILY } from "theme/constants"; import colors from "theme/tailwindColors"; import { getDisplayWorkspaceStatus } from "utils/workspace"; -import { HelpTooltipTitle } from "components/HelpTooltip/HelpTooltip"; -import { Stack } from "components/Stack/Stack"; -import { type ClassName, useClassName } from "hooks/useClassName"; export const bannerHeight = 36; diff --git a/site/src/modules/dashboard/LicenseBanner/LicenseBanner.tsx b/site/src/modules/dashboard/LicenseBanner/LicenseBanner.tsx index 1acba81f52..fe3cc6d26b 100644 --- a/site/src/modules/dashboard/LicenseBanner/LicenseBanner.tsx +++ b/site/src/modules/dashboard/LicenseBanner/LicenseBanner.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useDashboard } from "modules/dashboard/useDashboard"; import { LicenseBannerView } from "./LicenseBannerView"; diff --git a/site/src/modules/dashboard/LicenseBanner/LicenseBannerView.tsx b/site/src/modules/dashboard/LicenseBanner/LicenseBannerView.tsx index 4fbdcd3c62..7aab2ebdb0 100644 --- a/site/src/modules/dashboard/LicenseBanner/LicenseBannerView.tsx +++ b/site/src/modules/dashboard/LicenseBanner/LicenseBannerView.tsx @@ -1,4 +1,3 @@ -import Link from "@mui/material/Link"; import { css, type CSSObject, @@ -6,6 +5,7 @@ import { type Theme, useTheme, } from "@emotion/react"; +import Link from "@mui/material/Link"; import { type FC, useState } from "react"; import { Expander } from "components/Expander/Expander"; import { Pill } from "components/Pill/Pill"; diff --git a/site/src/modules/dashboard/Navbar/Navbar.test.tsx b/site/src/modules/dashboard/Navbar/Navbar.test.tsx index c9f9a00301..84251f4348 100644 --- a/site/src/modules/dashboard/Navbar/Navbar.test.tsx +++ b/site/src/modules/dashboard/Navbar/Navbar.test.tsx @@ -1,12 +1,12 @@ import { render, screen, waitFor } from "@testing-library/react"; -import { App } from "App"; -import { Language } from "./NavbarView"; import { rest } from "msw"; +import { App } from "App"; import { MockEntitlementsWithAuditLog, MockMemberPermissions, } from "testHelpers/entities"; import { server } from "testHelpers/server"; +import { Language } from "./NavbarView"; /** * The LicenseBanner, mounted above the AppRouter, fetches entitlements. Thus, to test their diff --git a/site/src/modules/dashboard/Navbar/Navbar.tsx b/site/src/modules/dashboard/Navbar/Navbar.tsx index 3e618bbc87..37d7c75734 100644 --- a/site/src/modules/dashboard/Navbar/Navbar.tsx +++ b/site/src/modules/dashboard/Navbar/Navbar.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useAuth } from "contexts/auth/useAuth"; import { useMe } from "contexts/auth/useMe"; import { usePermissions } from "contexts/auth/usePermissions"; diff --git a/site/src/modules/dashboard/Navbar/NavbarView.test.tsx b/site/src/modules/dashboard/Navbar/NavbarView.test.tsx index a6eae936e3..c881fa3000 100644 --- a/site/src/modules/dashboard/Navbar/NavbarView.test.tsx +++ b/site/src/modules/dashboard/Navbar/NavbarView.test.tsx @@ -1,8 +1,8 @@ import { screen } from "@testing-library/react"; +import type { ProxyContextValue } from "contexts/ProxyContext"; import { MockPrimaryWorkspaceProxy, MockUser } from "testHelpers/entities"; import { renderWithAuth } from "testHelpers/renderHelpers"; import { Language as navLanguage, NavbarView } from "./NavbarView"; -import { ProxyContextValue } from "contexts/ProxyContext"; const proxyContextValue: ProxyContextValue = { proxy: { diff --git a/site/src/modules/dashboard/Navbar/NavbarView.tsx b/site/src/modules/dashboard/Navbar/NavbarView.tsx index 60e6db1fea..bcb3362b8e 100644 --- a/site/src/modules/dashboard/Navbar/NavbarView.tsx +++ b/site/src/modules/dashboard/Navbar/NavbarView.tsx @@ -1,24 +1,24 @@ -import Drawer from "@mui/material/Drawer"; -import IconButton from "@mui/material/IconButton"; -import Divider from "@mui/material/Divider"; -import Skeleton from "@mui/material/Skeleton"; -import Menu from "@mui/material/Menu"; -import Button from "@mui/material/Button"; -import MenuItem from "@mui/material/MenuItem"; +import { css, type Interpolation, type Theme, useTheme } from "@emotion/react"; import KeyboardArrowDownOutlined from "@mui/icons-material/KeyboardArrowDownOutlined"; import MenuIcon from "@mui/icons-material/Menu"; +import Button from "@mui/material/Button"; +import Divider from "@mui/material/Divider"; +import Drawer from "@mui/material/Drawer"; +import IconButton from "@mui/material/IconButton"; +import Menu from "@mui/material/Menu"; +import MenuItem from "@mui/material/MenuItem"; +import Skeleton from "@mui/material/Skeleton"; import { visuallyHidden } from "@mui/utils"; -import { css, type Interpolation, type Theme, useTheme } from "@emotion/react"; import { type FC, type ReactNode, useRef, useState } from "react"; import { NavLink, useLocation, useNavigate } from "react-router-dom"; -import { BUTTON_SM_HEIGHT, navHeight } from "theme/constants"; import type * as TypesGen from "api/typesGenerated"; -import { usePermissions } from "contexts/auth/usePermissions"; -import type { ProxyContextValue } from "contexts/ProxyContext"; import { Abbr } from "components/Abbr/Abbr"; import { displayError } from "components/GlobalSnackbar/utils"; -import { Latency } from "components/Latency/Latency"; import { CoderIcon } from "components/Icons/CoderIcon"; +import { Latency } from "components/Latency/Latency"; +import { usePermissions } from "contexts/auth/usePermissions"; +import type { ProxyContextValue } from "contexts/ProxyContext"; +import { BUTTON_SM_HEIGHT, navHeight } from "theme/constants"; import { UserDropdown } from "./UserDropdown/UserDropdown"; export const USERS_LINK = `/users?filter=${encodeURIComponent( diff --git a/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdown.tsx b/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdown.tsx index f2b45448f8..35f7cbeb0b 100644 --- a/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdown.tsx +++ b/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdown.tsx @@ -1,16 +1,16 @@ -import Badge from "@mui/material/Badge"; -import { type FC, type ReactNode } from "react"; -import type * as TypesGen from "api/typesGenerated"; -import { BUTTON_SM_HEIGHT, navHeight } from "theme/constants"; -import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; -import { UserAvatar } from "components/UserAvatar/UserAvatar"; -import { UserDropdownContent } from "./UserDropdownContent"; import { css, type Interpolation, type Theme, useTheme } from "@emotion/react"; +import Badge from "@mui/material/Badge"; +import type { FC, ReactNode } from "react"; +import type * as TypesGen from "api/typesGenerated"; +import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; import { Popover, PopoverContent, PopoverTrigger, } from "components/Popover/Popover"; +import { UserAvatar } from "components/UserAvatar/UserAvatar"; +import { BUTTON_SM_HEIGHT, navHeight } from "theme/constants"; +import { UserDropdownContent } from "./UserDropdownContent"; export interface UserDropdownProps { user: TypesGen.User; diff --git a/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdownContent.test.tsx b/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdownContent.test.tsx index f9650a60d0..137a5438a8 100644 --- a/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdownContent.test.tsx +++ b/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdownContent.test.tsx @@ -1,8 +1,8 @@ import { screen } from "@testing-library/react"; +import { Popover } from "components/Popover/Popover"; import { MockUser } from "testHelpers/entities"; import { render, waitForLoaderToBeRemoved } from "testHelpers/renderHelpers"; import { Language, UserDropdownContent } from "./UserDropdownContent"; -import { Popover } from "components/Popover/Popover"; describe("UserDropdownContent", () => { it("has the correct link for the account item", async () => { diff --git a/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdownContent.tsx b/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdownContent.tsx index fda9898f6d..bc6cc233d7 100644 --- a/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdownContent.tsx +++ b/site/src/modules/dashboard/Navbar/UserDropdown/UserDropdownContent.tsx @@ -1,23 +1,23 @@ -import Divider from "@mui/material/Divider"; -import MenuItem from "@mui/material/MenuItem"; -import AccountIcon from "@mui/icons-material/AccountCircleOutlined"; -import BugIcon from "@mui/icons-material/BugReportOutlined"; -import ChatIcon from "@mui/icons-material/ChatOutlined"; -import LaunchIcon from "@mui/icons-material/LaunchOutlined"; -import { Stack } from "components/Stack/Stack"; -import { FC } from "react"; -import { Link } from "react-router-dom"; -import * as TypesGen from "api/typesGenerated"; -import DocsIcon from "@mui/icons-material/MenuBook"; -import LogoutIcon from "@mui/icons-material/ExitToAppOutlined"; import { css, type CSSObject, type Interpolation, type Theme, } from "@emotion/react"; -import { usePopover } from "components/Popover/Popover"; +import AccountIcon from "@mui/icons-material/AccountCircleOutlined"; +import BugIcon from "@mui/icons-material/BugReportOutlined"; +import ChatIcon from "@mui/icons-material/ChatOutlined"; +import LogoutIcon from "@mui/icons-material/ExitToAppOutlined"; +import LaunchIcon from "@mui/icons-material/LaunchOutlined"; +import DocsIcon from "@mui/icons-material/MenuBook"; +import Divider from "@mui/material/Divider"; +import MenuItem from "@mui/material/MenuItem"; +import type { FC } from "react"; +import { Link } from "react-router-dom"; +import type * as TypesGen from "api/typesGenerated"; import { ExternalImage } from "components/ExternalImage/ExternalImage"; +import { usePopover } from "components/Popover/Popover"; +import { Stack } from "components/Stack/Stack"; export const Language = { accountLabel: "Account", diff --git a/site/src/modules/dashboard/ServiceBanner/ServiceBanner.tsx b/site/src/modules/dashboard/ServiceBanner/ServiceBanner.tsx index 94e350b89e..cedd4ba4e7 100644 --- a/site/src/modules/dashboard/ServiceBanner/ServiceBanner.tsx +++ b/site/src/modules/dashboard/ServiceBanner/ServiceBanner.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useDashboard } from "modules/dashboard/useDashboard"; import { ServiceBannerView } from "./ServiceBannerView"; diff --git a/site/src/modules/dashboard/ServiceBanner/ServiceBannerView.tsx b/site/src/modules/dashboard/ServiceBanner/ServiceBannerView.tsx index b76b517f9e..c747285550 100644 --- a/site/src/modules/dashboard/ServiceBanner/ServiceBannerView.tsx +++ b/site/src/modules/dashboard/ServiceBanner/ServiceBannerView.tsx @@ -1,5 +1,5 @@ import { css, type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { FC } from "react"; import { InlineMarkdown } from "components/Markdown/Markdown"; import { Pill } from "components/Pill/Pill"; import { readableForegroundColor } from "utils/colors"; diff --git a/site/src/modules/dashboard/useFeatureVisibility.ts b/site/src/modules/dashboard/useFeatureVisibility.ts index 062685c573..fe0aed59bf 100644 --- a/site/src/modules/dashboard/useFeatureVisibility.ts +++ b/site/src/modules/dashboard/useFeatureVisibility.ts @@ -1,4 +1,4 @@ -import { FeatureName } from "api/typesGenerated"; +import type { FeatureName } from "api/typesGenerated"; import { selectFeatureVisibility } from "./entitlements"; import { useDashboard } from "./useDashboard"; diff --git a/site/src/modules/dashboard/useUpdateCheck.test.tsx b/site/src/modules/dashboard/useUpdateCheck.test.tsx index dec292346e..92cb2b5f9f 100644 --- a/site/src/modules/dashboard/useUpdateCheck.test.tsx +++ b/site/src/modules/dashboard/useUpdateCheck.test.tsx @@ -1,7 +1,7 @@ import { act, renderHook, waitFor } from "@testing-library/react"; -import { type FC, type PropsWithChildren } from "react"; -import { QueryClient, QueryClientProvider } from "react-query"; import { rest } from "msw"; +import type { FC, PropsWithChildren } from "react"; +import { QueryClient, QueryClientProvider } from "react-query"; import { MockUpdateCheck } from "testHelpers/entities"; import { server } from "testHelpers/server"; import { useUpdateCheck } from "./useUpdateCheck"; diff --git a/site/src/modules/dashboard/useUpdateCheck.ts b/site/src/modules/dashboard/useUpdateCheck.ts index 7089d87914..3c72a7266b 100644 --- a/site/src/modules/dashboard/useUpdateCheck.ts +++ b/site/src/modules/dashboard/useUpdateCheck.ts @@ -1,6 +1,6 @@ -import { updateCheck } from "api/queries/updateCheck"; import { useMemo, useState } from "react"; import { useQuery } from "react-query"; +import { updateCheck } from "api/queries/updateCheck"; export const useUpdateCheck = (enabled: boolean) => { const [dismissedVersion, setDismissedVersion] = useState(() => diff --git a/site/src/modules/resources/AgentLatency.tsx b/site/src/modules/resources/AgentLatency.tsx index c3963cb15c..0fb367cd18 100644 --- a/site/src/modules/resources/AgentLatency.tsx +++ b/site/src/modules/resources/AgentLatency.tsx @@ -1,5 +1,5 @@ import { type Theme, useTheme } from "@emotion/react"; -import { type FC } from "react"; +import type { FC } from "react"; import type { WorkspaceAgent, DERPRegion } from "api/typesGenerated"; import { HelpTooltipText, @@ -7,9 +7,9 @@ import { HelpTooltipTitle, HelpTooltipContent, } from "components/HelpTooltip/HelpTooltip"; +import { PopoverTrigger } from "components/Popover/Popover"; import { Stack } from "components/Stack/Stack"; import { getLatencyColor } from "utils/latency"; -import { PopoverTrigger } from "components/Popover/Popover"; const getDisplayLatency = (theme: Theme, agent: WorkspaceAgent) => { // Find the right latency to display diff --git a/site/src/modules/resources/AgentLogs.tsx b/site/src/modules/resources/AgentLogs.tsx index c1e2ee5353..16515efb7c 100644 --- a/site/src/modules/resources/AgentLogs.tsx +++ b/site/src/modules/resources/AgentLogs.tsx @@ -1,20 +1,20 @@ +import type { Interpolation, Theme } from "@emotion/react"; import Tooltip from "@mui/material/Tooltip"; -import { FixedSizeList as List } from "react-window"; -import type { WorkspaceAgentLogSource } from "api/typesGenerated"; import { - LogLine, - logLineHeight, -} from "modules/workspaces/WorkspaceBuildLogs/Logs"; -import { - ComponentProps, + type ComponentProps, forwardRef, useEffect, useMemo, useState, } from "react"; -import { LineWithID } from "./AgentRow"; -import { Interpolation, Theme } from "@emotion/react"; +import { FixedSizeList as List } from "react-window"; import * as API from "api/api"; +import type { WorkspaceAgentLogSource } from "api/typesGenerated"; +import { + LogLine, + logLineHeight, +} from "modules/workspaces/WorkspaceBuildLogs/Logs"; +import type { LineWithID } from "./AgentRow"; type AgentLogsProps = Omit< ComponentProps, diff --git a/site/src/modules/resources/AgentMetadata.stories.tsx b/site/src/modules/resources/AgentMetadata.stories.tsx index 7382aac3de..b59cc20fa4 100644 --- a/site/src/modules/resources/AgentMetadata.stories.tsx +++ b/site/src/modules/resources/AgentMetadata.stories.tsx @@ -1,9 +1,9 @@ -import { +import type { Meta, StoryObj } from "@storybook/react"; +import type { WorkspaceAgentMetadataDescription, WorkspaceAgentMetadataResult, } from "api/typesGenerated"; import { AgentMetadataView } from "./AgentMetadata"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "modules/resources/AgentMetadataView", diff --git a/site/src/modules/resources/AgentMetadata.tsx b/site/src/modules/resources/AgentMetadata.tsx index 0e22044c4a..e0413554fe 100644 --- a/site/src/modules/resources/AgentMetadata.tsx +++ b/site/src/modules/resources/AgentMetadata.tsx @@ -1,7 +1,7 @@ -import dayjs from "dayjs"; +import type { Interpolation, Theme } from "@emotion/react"; import Skeleton from "@mui/material/Skeleton"; import Tooltip from "@mui/material/Tooltip"; -import { type Interpolation, type Theme } from "@emotion/react"; +import dayjs from "dayjs"; import { createContext, type FC, diff --git a/site/src/modules/resources/AgentOutdatedTooltip.tsx b/site/src/modules/resources/AgentOutdatedTooltip.tsx index e2432ed279..cd01a15365 100644 --- a/site/src/modules/resources/AgentOutdatedTooltip.tsx +++ b/site/src/modules/resources/AgentOutdatedTooltip.tsx @@ -1,6 +1,7 @@ -import { type FC } from "react"; import { useTheme } from "@emotion/react"; import RefreshIcon from "@mui/icons-material/RefreshOutlined"; +import type { FC } from "react"; +import type { WorkspaceAgent } from "api/typesGenerated"; import { HelpTooltip, HelpTooltipAction, @@ -9,10 +10,9 @@ import { HelpTooltipText, HelpTooltipTitle, } from "components/HelpTooltip/HelpTooltip"; -import type { WorkspaceAgent } from "api/typesGenerated"; +import { PopoverTrigger } from "components/Popover/Popover"; import { Stack } from "components/Stack/Stack"; import { agentVersionStatus } from "../../utils/workspace"; -import { PopoverTrigger } from "components/Popover/Popover"; type AgentOutdatedTooltipProps = { agent: WorkspaceAgent; diff --git a/site/src/modules/resources/AgentRow.stories.tsx b/site/src/modules/resources/AgentRow.stories.tsx index c2cf570344..1d97b129fd 100644 --- a/site/src/modules/resources/AgentRow.stories.tsx +++ b/site/src/modules/resources/AgentRow.stories.tsx @@ -1,30 +1,9 @@ import type { Meta, StoryObj } from "@storybook/react"; -import { chromatic } from "testHelpers/chromatic"; -import { - MockPrimaryWorkspaceProxy, - MockWorkspaceProxies, - MockWorkspace, - MockWorkspaceAgent, - MockWorkspaceAgentConnecting, - MockWorkspaceAgentOff, - MockWorkspaceAgentOutdated, - MockWorkspaceAgentReady, - MockWorkspaceAgentShutdownError, - MockWorkspaceAgentShutdownTimeout, - MockWorkspaceAgentShuttingDown, - MockWorkspaceAgentStartError, - MockWorkspaceAgentStarting, - MockWorkspaceAgentStartTimeout, - MockWorkspaceAgentTimeout, - MockWorkspaceAgentLogSource, - MockWorkspaceAgentDeprecated, - MockWorkspaceApp, - MockProxyLatencies, - MockListeningPortsResponse, -} from "testHelpers/entities"; -import { AgentRow, LineWithID } from "./AgentRow"; import { ProxyContext, getPreferredProxy } from "contexts/ProxyContext"; +import { chromatic } from "testHelpers/chromatic"; +import * as M from "testHelpers/entities"; import { withDashboardProvider } from "testHelpers/storybook"; +import { AgentRow, type LineWithID } from "./AgentRow"; const defaultAgentMetadata = [ { @@ -100,7 +79,7 @@ const storybookLogs: LineWithID[] = [ level: "info", output: line, time: "", - source_id: MockWorkspaceAgentLogSource.id, + source_id: M.MockWorkspaceAgentLogSource.id, })); const meta: Meta = { @@ -109,8 +88,8 @@ const meta: Meta = { chromatic, queries: [ { - key: ["portForward", MockWorkspaceAgent.id], - data: MockListeningPortsResponse, + key: ["portForward", M.MockWorkspaceAgent.id], + data: M.MockListeningPortsResponse, }, ], }, @@ -119,10 +98,10 @@ const meta: Meta = { args: { storybookLogs, agent: { - ...MockWorkspaceAgent, + ...M.MockWorkspaceAgent, logs_length: storybookLogs.length, }, - workspace: MockWorkspace, + workspace: M.MockWorkspace, showApps: true, storybookAgentMetadata: defaultAgentMetadata, }, @@ -130,7 +109,7 @@ const meta: Meta = { (Story) => ( ( { @@ -299,8 +278,8 @@ export const ShowingPortForward: Story = { export const Outdated: Story = { args: { - agent: MockWorkspaceAgentOutdated, - workspace: MockWorkspace, + agent: M.MockWorkspaceAgentOutdated, + workspace: M.MockWorkspace, serverVersion: "v99.999.9999+c1cdf14", serverAPIVersion: "1.0", }, @@ -308,8 +287,8 @@ export const Outdated: Story = { export const Deprecated: Story = { args: { - agent: MockWorkspaceAgentDeprecated, - workspace: MockWorkspace, + agent: M.MockWorkspaceAgentDeprecated, + workspace: M.MockWorkspace, serverVersion: "v99.999.9999+c1cdf14", serverAPIVersion: "2.0", }, @@ -321,11 +300,11 @@ export const WithXRayScan: Story = { { key: [ "xray", - { agentId: MockWorkspaceAgent.id, workspaceId: MockWorkspace.id }, + { agentId: M.MockWorkspaceAgent.id, workspaceId: M.MockWorkspace.id }, ], data: { - workspace_id: MockWorkspace.id, - agent_id: MockWorkspaceAgent.id, + workspace_id: M.MockWorkspace.id, + agent_id: M.MockWorkspaceAgent.id, critical: 10, high: 3, medium: 5, diff --git a/site/src/modules/resources/AgentRow.test.tsx b/site/src/modules/resources/AgentRow.test.tsx index 23907798f2..4ae3f1536b 100644 --- a/site/src/modules/resources/AgentRow.test.tsx +++ b/site/src/modules/resources/AgentRow.test.tsx @@ -1,15 +1,15 @@ +import { screen } from "@testing-library/react"; import { MockTemplate, MockWorkspace, MockWorkspaceAgent, } from "testHelpers/entities"; -import { AgentRow, AgentRowProps } from "./AgentRow"; -import { DisplayAppNameMap } from "./AppLink/AppLink"; -import { screen } from "@testing-library/react"; import { renderWithAuth, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; +import { AgentRow, type AgentRowProps } from "./AgentRow"; +import { DisplayAppNameMap } from "./AppLink/AppLink"; jest.mock("modules/resources/AgentMetadata", () => { const AgentMetadata = () => <>; diff --git a/site/src/modules/resources/AgentRow.tsx b/site/src/modules/resources/AgentRow.tsx index cf5aaca77b..fb299abfb9 100644 --- a/site/src/modules/resources/AgentRow.tsx +++ b/site/src/modules/resources/AgentRow.tsx @@ -1,6 +1,6 @@ +import type { Interpolation, Theme } from "@emotion/react"; import Collapse from "@mui/material/Collapse"; import Skeleton from "@mui/material/Skeleton"; -import { type Interpolation, type Theme } from "@emotion/react"; import { type FC, useCallback, @@ -10,8 +10,10 @@ import { useRef, useState, } from "react"; +import { useQuery } from "react-query"; import AutoSizer from "react-virtualized-auto-sizer"; -import { FixedSizeList as List, ListOnScrollProps } from "react-window"; +import type { FixedSizeList as List, ListOnScrollProps } from "react-window"; +import { xrayScan } from "api/queries/integrations"; import type { Template, Workspace, @@ -19,13 +21,14 @@ import type { WorkspaceAgentMetadata, } from "api/typesGenerated"; import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; +import { Stack } from "components/Stack/Stack"; +import { useProxy } from "contexts/ProxyContext"; import { - Line, + type Line, logLineHeight, } from "modules/workspaces/WorkspaceBuildLogs/Logs"; -import { useProxy } from "contexts/ProxyContext"; -import { Stack } from "components/Stack/Stack"; import { AgentLatency } from "./AgentLatency"; +import { AgentLogs, useAgentLogs } from "./AgentLogs"; import { AgentMetadata } from "./AgentMetadata"; import { AgentStatus } from "./AgentStatus"; import { AgentVersion } from "./AgentVersion"; @@ -34,10 +37,7 @@ import { PortForwardButton } from "./PortForwardButton"; import { SSHButton } from "./SSHButton/SSHButton"; import { TerminalLink } from "./TerminalLink/TerminalLink"; import { VSCodeDesktopButton } from "./VSCodeDesktopButton/VSCodeDesktopButton"; -import { useQuery } from "react-query"; -import { xrayScan } from "api/queries/integrations"; import { XRayScanAlert } from "./XRayScanAlert"; -import { AgentLogs, useAgentLogs } from "./AgentLogs"; // Logs are stored as the Line interface to make rendering // much more efficient. Instead of mapping objects each time, we're diff --git a/site/src/modules/resources/AgentRowPreview.stories.tsx b/site/src/modules/resources/AgentRowPreview.stories.tsx index efb93f474d..87cb37bc30 100644 --- a/site/src/modules/resources/AgentRowPreview.stories.tsx +++ b/site/src/modules/resources/AgentRowPreview.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockWorkspaceAgent, MockWorkspaceApp } from "testHelpers/entities"; import { AgentRowPreview } from "./AgentRowPreview"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "modules/resources/AgentRowPreview", diff --git a/site/src/modules/resources/AgentRowPreview.test.tsx b/site/src/modules/resources/AgentRowPreview.test.tsx index 0fad0ceda0..340aa4a1be 100644 --- a/site/src/modules/resources/AgentRowPreview.test.tsx +++ b/site/src/modules/resources/AgentRowPreview.test.tsx @@ -1,8 +1,12 @@ +import { screen } from "@testing-library/react"; +import { + DisplayApps, + type DisplayApp, + type WorkspaceAgent, +} from "api/typesGenerated"; import { MockWorkspaceAgent } from "testHelpers/entities"; -import { WorkspaceAgent, DisplayApps, DisplayApp } from "api/typesGenerated"; import { renderComponent } from "testHelpers/renderHelpers"; import { AgentRowPreview } from "./AgentRowPreview"; -import { screen } from "@testing-library/react"; import { DisplayAppNameMap } from "./AppLink/AppLink"; const AllDisplayAppsAndModule = MockWorkspaceAgent; diff --git a/site/src/modules/resources/AgentRowPreview.tsx b/site/src/modules/resources/AgentRowPreview.tsx index 6d99f2a6f2..1d2bb4a76e 100644 --- a/site/src/modules/resources/AgentRowPreview.tsx +++ b/site/src/modules/resources/AgentRowPreview.tsx @@ -1,9 +1,9 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC } from "react"; import type { WorkspaceAgent } from "api/typesGenerated"; -import { Stack } from "components/Stack/Stack"; -import { VSCodeIcon } from "components/Icons/VSCodeIcon"; import { TerminalIcon } from "components/Icons/TerminalIcon"; +import { VSCodeIcon } from "components/Icons/VSCodeIcon"; +import { Stack } from "components/Stack/Stack"; import { DisplayAppNameMap } from "./AppLink/AppLink"; import { AppPreview } from "./AppLink/AppPreview"; import { BaseIcon } from "./AppLink/BaseIcon"; diff --git a/site/src/modules/resources/AgentStatus.tsx b/site/src/modules/resources/AgentStatus.tsx index ffb56953ef..c59d315895 100644 --- a/site/src/modules/resources/AgentStatus.tsx +++ b/site/src/modules/resources/AgentStatus.tsx @@ -1,8 +1,8 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import Tooltip from "@mui/material/Tooltip"; +import type { Interpolation, Theme } from "@emotion/react"; import WarningRounded from "@mui/icons-material/WarningRounded"; import Link from "@mui/material/Link"; -import { type FC } from "react"; +import Tooltip from "@mui/material/Tooltip"; +import type { FC } from "react"; import type { WorkspaceAgent } from "api/typesGenerated"; import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; import { diff --git a/site/src/modules/resources/AgentVersion.tsx b/site/src/modules/resources/AgentVersion.tsx index 4b35ca6bae..bba87833f3 100644 --- a/site/src/modules/resources/AgentVersion.tsx +++ b/site/src/modules/resources/AgentVersion.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type { WorkspaceAgent } from "api/typesGenerated"; import { agentVersionStatus, getDisplayVersionStatus } from "utils/workspace"; import { AgentOutdatedTooltip } from "./AgentOutdatedTooltip"; diff --git a/site/src/modules/resources/AppLink/AppLink.stories.tsx b/site/src/modules/resources/AppLink/AppLink.stories.tsx index 7f77c2d879..2dbc377a0d 100644 --- a/site/src/modules/resources/AppLink/AppLink.stories.tsx +++ b/site/src/modules/resources/AppLink/AppLink.stories.tsx @@ -1,3 +1,5 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { ProxyContext, getPreferredProxy } from "contexts/ProxyContext"; import { MockPrimaryWorkspaceProxy, MockWorkspaceProxies, @@ -7,8 +9,6 @@ import { MockProxyLatencies, } from "testHelpers/entities"; import { AppLink } from "./AppLink"; -import { ProxyContext, getPreferredProxy } from "contexts/ProxyContext"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "modules/resources/AppLink", diff --git a/site/src/modules/resources/AppLink/AppLink.tsx b/site/src/modules/resources/AppLink/AppLink.tsx index 86cf0da776..7243d2b1af 100644 --- a/site/src/modules/resources/AppLink/AppLink.tsx +++ b/site/src/modules/resources/AppLink/AppLink.tsx @@ -1,9 +1,9 @@ +import { useTheme } from "@emotion/react"; +import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline"; import CircularProgress from "@mui/material/CircularProgress"; import Link from "@mui/material/Link"; import Tooltip from "@mui/material/Tooltip"; -import ErrorOutlineIcon from "@mui/icons-material/ErrorOutline"; import { type FC, useState } from "react"; -import { useTheme } from "@emotion/react"; import { getApiKey } from "api/api"; import type * as TypesGen from "api/typesGenerated"; import { useProxy } from "contexts/ProxyContext"; diff --git a/site/src/modules/resources/AppLink/AppPreview.tsx b/site/src/modules/resources/AppLink/AppPreview.tsx index 3dc40a40cd..7472245db7 100644 --- a/site/src/modules/resources/AppLink/AppPreview.tsx +++ b/site/src/modules/resources/AppLink/AppPreview.tsx @@ -1,5 +1,5 @@ +import type { FC, PropsWithChildren } from "react"; import { Stack } from "components/Stack/Stack"; -import { type FC, type PropsWithChildren } from "react"; export const AppPreview: FC = ({ children }) => { return ( diff --git a/site/src/modules/resources/AppLink/BaseIcon.tsx b/site/src/modules/resources/AppLink/BaseIcon.tsx index 0d0738b22a..d2ae779c2b 100644 --- a/site/src/modules/resources/AppLink/BaseIcon.tsx +++ b/site/src/modules/resources/AppLink/BaseIcon.tsx @@ -1,5 +1,5 @@ import ComputerIcon from "@mui/icons-material/Computer"; -import { type FC } from "react"; +import type { FC } from "react"; import type { WorkspaceApp } from "api/typesGenerated"; interface BaseIconProps { diff --git a/site/src/modules/resources/AppLink/ShareIcon.tsx b/site/src/modules/resources/AppLink/ShareIcon.tsx index 478509fa09..61c1e8719a 100644 --- a/site/src/modules/resources/AppLink/ShareIcon.tsx +++ b/site/src/modules/resources/AppLink/ShareIcon.tsx @@ -1,8 +1,8 @@ -import PublicOutlinedIcon from "@mui/icons-material/PublicOutlined"; import GroupOutlinedIcon from "@mui/icons-material/GroupOutlined"; import LaunchOutlinedIcon from "@mui/icons-material/LaunchOutlined"; -import * as TypesGen from "api/typesGenerated"; +import PublicOutlinedIcon from "@mui/icons-material/PublicOutlined"; import Tooltip from "@mui/material/Tooltip"; +import type * as TypesGen from "api/typesGenerated"; export interface ShareIconProps { app: TypesGen.WorkspaceApp; diff --git a/site/src/modules/resources/PortForwardButton.stories.tsx b/site/src/modules/resources/PortForwardButton.stories.tsx index ddf683d37b..9dd79d4d03 100644 --- a/site/src/modules/resources/PortForwardButton.stories.tsx +++ b/site/src/modules/resources/PortForwardButton.stories.tsx @@ -1,4 +1,3 @@ -import { PortForwardButton } from "./PortForwardButton"; import type { Meta, StoryObj } from "@storybook/react"; import { MockListeningPortsResponse, @@ -7,6 +6,7 @@ import { MockWorkspaceAgent, } from "testHelpers/entities"; import { withDashboardProvider } from "testHelpers/storybook"; +import { PortForwardButton } from "./PortForwardButton"; const meta: Meta = { title: "modules/resources/PortForwardButton", diff --git a/site/src/modules/resources/PortForwardButton.tsx b/site/src/modules/resources/PortForwardButton.tsx index f7dd36c441..87cb088624 100644 --- a/site/src/modules/resources/PortForwardButton.tsx +++ b/site/src/modules/resources/PortForwardButton.tsx @@ -1,22 +1,37 @@ -import Button from "@mui/material/Button"; -import Link from "@mui/material/Link"; -import CircularProgress from "@mui/material/CircularProgress"; -import OpenInNewOutlined from "@mui/icons-material/OpenInNewOutlined"; import { type Interpolation, type Theme, useTheme } from "@emotion/react"; -import { type FC } from "react"; +import CloseIcon from "@mui/icons-material/Close"; +import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown"; +import LockIcon from "@mui/icons-material/Lock"; +import LockOpenIcon from "@mui/icons-material/LockOpen"; +import OpenInNewOutlined from "@mui/icons-material/OpenInNewOutlined"; +import SensorsIcon from "@mui/icons-material/Sensors"; +import LoadingButton from "@mui/lab/LoadingButton"; +import Button from "@mui/material/Button"; +import CircularProgress from "@mui/material/CircularProgress"; +import FormControl from "@mui/material/FormControl"; +import Link from "@mui/material/Link"; +import MenuItem from "@mui/material/MenuItem"; +import Select from "@mui/material/Select"; +import Stack from "@mui/material/Stack"; +import TextField from "@mui/material/TextField"; +import { type FormikContextType, useFormik } from "formik"; +import type { FC } from "react"; import { useQuery, useMutation } from "react-query"; -import { docs } from "utils/docs"; +import * as Yup from "yup"; import { getAgentListeningPorts } from "api/api"; import { - WorkspaceAppSharingLevels, + deleteWorkspacePortShare, + upsertWorkspacePortShare, + workspacePortShares, +} from "api/queries/workspaceportsharing"; +import { type Template, + type UpsertWorkspaceAgentPortShareRequest, type WorkspaceAgent, type WorkspaceAgentListeningPort, type WorkspaceAgentPortShareLevel, - UpsertWorkspaceAgentPortShareRequest, + WorkspaceAppSharingLevels, } from "api/typesGenerated"; -import { portForwardURL } from "utils/portForward"; -import { type ClassName, useClassName } from "hooks/useClassName"; import { HelpTooltipLink, HelpTooltipText, @@ -27,26 +42,11 @@ import { PopoverContent, PopoverTrigger, } from "components/Popover/Popover"; -import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown"; -import Stack from "@mui/material/Stack"; -import Select from "@mui/material/Select"; -import MenuItem from "@mui/material/MenuItem"; -import FormControl from "@mui/material/FormControl"; -import TextField from "@mui/material/TextField"; -import SensorsIcon from "@mui/icons-material/Sensors"; -import LockIcon from "@mui/icons-material/Lock"; -import LockOpenIcon from "@mui/icons-material/LockOpen"; -import CloseIcon from "@mui/icons-material/Close"; -import { - deleteWorkspacePortShare, - upsertWorkspacePortShare, - workspacePortShares, -} from "api/queries/workspaceportsharing"; +import { type ClassName, useClassName } from "hooks/useClassName"; import { useDashboard } from "modules/dashboard/useDashboard"; -import * as Yup from "yup"; -import { FormikContextType, useFormik } from "formik"; +import { docs } from "utils/docs"; import { getFormHelpers } from "utils/formUtils"; -import { LoadingButton } from "@mui/lab"; +import { portForwardURL } from "utils/portForward"; export interface PortForwardButtonProps { host: string; diff --git a/site/src/modules/resources/PortForwardPopoverView.stories.tsx b/site/src/modules/resources/PortForwardPopoverView.stories.tsx index 94e101e66b..a2dd7bd801 100644 --- a/site/src/modules/resources/PortForwardPopoverView.stories.tsx +++ b/site/src/modules/resources/PortForwardPopoverView.stories.tsx @@ -1,4 +1,3 @@ -import { PortForwardPopoverView } from "./PortForwardButton"; import type { Meta, StoryObj } from "@storybook/react"; import { MockListeningPortsResponse, @@ -7,6 +6,7 @@ import { MockWorkspace, MockWorkspaceAgent, } from "testHelpers/entities"; +import { PortForwardPopoverView } from "./PortForwardButton"; const meta: Meta = { title: "modules/resources/PortForwardPopoverView", diff --git a/site/src/modules/resources/PortForwardPopoverView.test.tsx b/site/src/modules/resources/PortForwardPopoverView.test.tsx index c04cd74b37..7ab9276330 100644 --- a/site/src/modules/resources/PortForwardPopoverView.test.tsx +++ b/site/src/modules/resources/PortForwardPopoverView.test.tsx @@ -1,4 +1,5 @@ import { screen } from "@testing-library/react"; +import { QueryClientProvider, QueryClient } from "react-query"; import { MockListeningPortsResponse, MockTemplate, @@ -7,7 +8,6 @@ import { } from "testHelpers/entities"; import { renderComponent } from "testHelpers/renderHelpers"; import { PortForwardPopoverView } from "./PortForwardButton"; -import { QueryClientProvider, QueryClient } from "react-query"; describe("Port Forward Popover View", () => { it("renders component", async () => { diff --git a/site/src/modules/resources/ResourceAvatar.stories.tsx b/site/src/modules/resources/ResourceAvatar.stories.tsx index 96013aef5d..6b8a419490 100644 --- a/site/src/modules/resources/ResourceAvatar.stories.tsx +++ b/site/src/modules/resources/ResourceAvatar.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockWorkspaceResource } from "testHelpers/entities"; import { ResourceAvatar } from "./ResourceAvatar"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "modules/resources/ResourceAvatar", diff --git a/site/src/modules/resources/ResourceAvatar.tsx b/site/src/modules/resources/ResourceAvatar.tsx index a3a917b2f5..4722892d7a 100644 --- a/site/src/modules/resources/ResourceAvatar.tsx +++ b/site/src/modules/resources/ResourceAvatar.tsx @@ -1,5 +1,5 @@ -import { type FC, useId } from "react"; import { visuallyHidden } from "@mui/utils"; +import { type FC, useId } from "react"; import type { WorkspaceResource } from "api/typesGenerated"; import { Avatar } from "components/Avatar/Avatar"; import { ExternalImage } from "components/ExternalImage/ExternalImage"; diff --git a/site/src/modules/resources/ResourceCard.stories.tsx b/site/src/modules/resources/ResourceCard.stories.tsx index c054223240..b0a23fd04b 100644 --- a/site/src/modules/resources/ResourceCard.stories.tsx +++ b/site/src/modules/resources/ResourceCard.stories.tsx @@ -1,12 +1,12 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import type { WorkspaceAgent } from "api/typesGenerated"; +import { ProxyContext, getPreferredProxy } from "contexts/ProxyContext"; import { MockProxyLatencies, MockWorkspaceResource, } from "testHelpers/entities"; -import { ResourceCard } from "./ResourceCard"; -import { ProxyContext, getPreferredProxy } from "contexts/ProxyContext"; -import type { Meta, StoryObj } from "@storybook/react"; -import { type WorkspaceAgent } from "api/typesGenerated"; import { AgentRowPreview } from "./AgentRowPreview"; +import { ResourceCard } from "./ResourceCard"; const meta: Meta = { title: "modules/resources/ResourceCard", diff --git a/site/src/modules/resources/ResourceCard.tsx b/site/src/modules/resources/ResourceCard.tsx index a379dcc49e..962d428e22 100644 --- a/site/src/modules/resources/ResourceCard.tsx +++ b/site/src/modules/resources/ResourceCard.tsx @@ -1,10 +1,10 @@ +import type { Interpolation, Theme } from "@emotion/react"; import IconButton from "@mui/material/IconButton"; import Tooltip from "@mui/material/Tooltip"; -import { type Interpolation, type Theme } from "@emotion/react"; import { Children, type FC, type PropsWithChildren, useState } from "react"; import type { WorkspaceAgent, WorkspaceResource } from "api/typesGenerated"; -import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; import { CopyableValue } from "components/CopyableValue/CopyableValue"; +import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; import { Stack } from "components/Stack/Stack"; import { ResourceAvatar } from "./ResourceAvatar"; diff --git a/site/src/modules/resources/Resources.stories.tsx b/site/src/modules/resources/Resources.stories.tsx index f9e64f3801..c5f2fe3c55 100644 --- a/site/src/modules/resources/Resources.stories.tsx +++ b/site/src/modules/resources/Resources.stories.tsx @@ -1,13 +1,13 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import type { WorkspaceAgent } from "api/typesGenerated"; +import { ProxyContext, getPreferredProxy } from "contexts/ProxyContext"; import { MockProxyLatencies, MockWorkspaceResource, MockWorkspaceResourceMultipleAgents, } from "testHelpers/entities"; -import { Resources } from "./Resources"; -import { ProxyContext, getPreferredProxy } from "contexts/ProxyContext"; -import type { Meta, StoryObj } from "@storybook/react"; -import { type WorkspaceAgent } from "api/typesGenerated"; import { AgentRowPreview } from "./AgentRowPreview"; +import { Resources } from "./Resources"; const meta: Meta = { title: "modules/resources/Resources", diff --git a/site/src/modules/resources/Resources.tsx b/site/src/modules/resources/Resources.tsx index 114a3eb9d0..f38ffa1658 100644 --- a/site/src/modules/resources/Resources.tsx +++ b/site/src/modules/resources/Resources.tsx @@ -1,5 +1,5 @@ -import Button from "@mui/material/Button"; import { type Interpolation, type Theme, useTheme } from "@emotion/react"; +import Button from "@mui/material/Button"; import { type FC, useState } from "react"; import type { WorkspaceAgent, WorkspaceResource } from "api/typesGenerated"; import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; diff --git a/site/src/modules/resources/SSHButton/SSHButton.stories.tsx b/site/src/modules/resources/SSHButton/SSHButton.stories.tsx index 7bc5f2a396..a27e510274 100644 --- a/site/src/modules/resources/SSHButton/SSHButton.stories.tsx +++ b/site/src/modules/resources/SSHButton/SSHButton.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockWorkspace, MockWorkspaceAgent } from "testHelpers/entities"; import { SSHButton } from "./SSHButton"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "modules/resources/SSHButton", diff --git a/site/src/modules/resources/SSHButton/SSHButton.tsx b/site/src/modules/resources/SSHButton/SSHButton.tsx index d4f8f374f8..d4b8662705 100644 --- a/site/src/modules/resources/SSHButton/SSHButton.tsx +++ b/site/src/modules/resources/SSHButton/SSHButton.tsx @@ -1,21 +1,21 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown"; +import Button from "@mui/material/Button"; +import type { FC } from "react"; +import { CodeExample } from "components/CodeExample/CodeExample"; import { HelpTooltipLink, HelpTooltipLinksGroup, HelpTooltipText, } from "components/HelpTooltip/HelpTooltip"; -import { docs } from "utils/docs"; -import { type ClassName, useClassName } from "hooks/useClassName"; -import { CodeExample } from "components/CodeExample/CodeExample"; import { Popover, PopoverContent, PopoverTrigger, } from "components/Popover/Popover"; import { Stack } from "components/Stack/Stack"; -import Button from "@mui/material/Button"; -import KeyboardArrowDown from "@mui/icons-material/KeyboardArrowDown"; +import { type ClassName, useClassName } from "hooks/useClassName"; +import { docs } from "utils/docs"; export interface SSHButtonProps { workspaceName: string; diff --git a/site/src/modules/resources/SensitiveValue.tsx b/site/src/modules/resources/SensitiveValue.tsx index 738b9a437a..3866fae958 100644 --- a/site/src/modules/resources/SensitiveValue.tsx +++ b/site/src/modules/resources/SensitiveValue.tsx @@ -1,9 +1,9 @@ -import IconButton from "@mui/material/IconButton"; -import Tooltip from "@mui/material/Tooltip"; +import { css, type Interpolation, type Theme } from "@emotion/react"; import VisibilityOffOutlined from "@mui/icons-material/VisibilityOffOutlined"; import VisibilityOutlined from "@mui/icons-material/VisibilityOutlined"; +import IconButton from "@mui/material/IconButton"; +import Tooltip from "@mui/material/Tooltip"; import { type FC, useState } from "react"; -import { css, type Interpolation, type Theme } from "@emotion/react"; import { CopyableValue } from "components/CopyableValue/CopyableValue"; const Language = { diff --git a/site/src/modules/resources/TerminalLink/TerminalLink.stories.tsx b/site/src/modules/resources/TerminalLink/TerminalLink.stories.tsx index 48a4d46d90..9562b479d7 100644 --- a/site/src/modules/resources/TerminalLink/TerminalLink.stories.tsx +++ b/site/src/modules/resources/TerminalLink/TerminalLink.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockWorkspace } from "testHelpers/entities"; import { TerminalLink } from "./TerminalLink"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "modules/resources/TerminalLink", diff --git a/site/src/modules/resources/TerminalLink/TerminalLink.tsx b/site/src/modules/resources/TerminalLink/TerminalLink.tsx index 13bfb5b938..370c5fe1d6 100644 --- a/site/src/modules/resources/TerminalLink/TerminalLink.tsx +++ b/site/src/modules/resources/TerminalLink/TerminalLink.tsx @@ -1,10 +1,10 @@ import Link from "@mui/material/Link"; -import { type FC } from "react"; +import type { FC } from "react"; import type * as TypesGen from "api/typesGenerated"; import { TerminalIcon } from "components/Icons/TerminalIcon"; import { generateRandomString } from "utils/random"; -import { DisplayAppNameMap } from "../AppLink/AppLink"; import { AgentButton } from "../AgentButton"; +import { DisplayAppNameMap } from "../AppLink/AppLink"; export const Language = { terminalTitle: (identifier: string): string => `Terminal - ${identifier}`, diff --git a/site/src/modules/resources/VSCodeDesktopButton/VSCodeDesktopButton.stories.tsx b/site/src/modules/resources/VSCodeDesktopButton/VSCodeDesktopButton.stories.tsx index aef3c3933f..0822288de0 100644 --- a/site/src/modules/resources/VSCodeDesktopButton/VSCodeDesktopButton.stories.tsx +++ b/site/src/modules/resources/VSCodeDesktopButton/VSCodeDesktopButton.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockWorkspace, MockWorkspaceAgent } from "testHelpers/entities"; import { VSCodeDesktopButton } from "./VSCodeDesktopButton"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "modules/resources/VSCodeDesktopButton", diff --git a/site/src/modules/resources/XRayScanAlert.tsx b/site/src/modules/resources/XRayScanAlert.tsx index de8117be5c..e1b28a0e3e 100644 --- a/site/src/modules/resources/XRayScanAlert.tsx +++ b/site/src/modules/resources/XRayScanAlert.tsx @@ -1,6 +1,6 @@ +import type { Interpolation, Theme } from "@emotion/react"; import Button from "@mui/material/Button"; -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { FC } from "react"; import type { JFrogXrayScan } from "api/typesGenerated"; import { ExternalImage } from "components/ExternalImage/ExternalImage"; diff --git a/site/src/modules/templates/TemplateExampleCard/TemplateExampleCard.tsx b/site/src/modules/templates/TemplateExampleCard/TemplateExampleCard.tsx index 80a274adce..0770931d0b 100644 --- a/site/src/modules/templates/TemplateExampleCard/TemplateExampleCard.tsx +++ b/site/src/modules/templates/TemplateExampleCard/TemplateExampleCard.tsx @@ -1,11 +1,11 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import Button from "@mui/material/Button"; import Link from "@mui/material/Link"; +import type { FC, HTMLAttributes } from "react"; +import { Link as RouterLink } from "react-router-dom"; import type { TemplateExample } from "api/typesGenerated"; import { ExternalImage } from "components/ExternalImage/ExternalImage"; import { Pill } from "components/Pill/Pill"; -import { type FC, type HTMLAttributes } from "react"; -import { Link as RouterLink } from "react-router-dom"; type TemplateExampleCardProps = HTMLAttributes & { example: TemplateExample; diff --git a/site/src/modules/templates/TemplateFiles/TemplateFileTree.stories.tsx b/site/src/modules/templates/TemplateFiles/TemplateFileTree.stories.tsx index a1b805681d..1950c0198c 100644 --- a/site/src/modules/templates/TemplateFiles/TemplateFileTree.stories.tsx +++ b/site/src/modules/templates/TemplateFiles/TemplateFileTree.stories.tsx @@ -1,8 +1,8 @@ +import { useTheme } from "@emotion/react"; import type { Meta, StoryObj } from "@storybook/react"; import { chromatic } from "testHelpers/chromatic"; +import type { FileTree } from "utils/filetree"; import { TemplateFileTree } from "./TemplateFileTree"; -import { FileTree } from "utils/filetree"; -import { useTheme } from "@emotion/react"; const fileTree: FileTree = { "main.tf": "resource aws_instance my_instance {}", diff --git a/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx b/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx index 0c7b83e093..a0e3abf149 100644 --- a/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx +++ b/site/src/modules/templates/TemplateFiles/TemplateFileTree.tsx @@ -1,14 +1,14 @@ +import { css } from "@emotion/react"; import ChevronRightIcon from "@mui/icons-material/ChevronRight"; import ExpandMoreIcon from "@mui/icons-material/ExpandMore"; -import TreeView from "@mui/lab/TreeView"; +import FormatAlignLeftOutlined from "@mui/icons-material/FormatAlignLeftOutlined"; import TreeItem from "@mui/lab/TreeItem"; +import TreeView from "@mui/lab/TreeView"; import Menu from "@mui/material/Menu"; import MenuItem from "@mui/material/MenuItem"; import { type CSSProperties, type FC, useState } from "react"; -import { css } from "@emotion/react"; -import { FileTree } from "utils/filetree"; import { DockerIcon } from "components/Icons/DockerIcon"; -import FormatAlignLeftOutlined from "@mui/icons-material/FormatAlignLeftOutlined"; +import type { FileTree } from "utils/filetree"; const sortFileTree = (fileTree: FileTree) => (a: string, b: string) => { const contentA = fileTree[a]; diff --git a/site/src/modules/templates/TemplateFiles/TemplateFiles.tsx b/site/src/modules/templates/TemplateFiles/TemplateFiles.tsx index a46aef5bd7..415feae893 100644 --- a/site/src/modules/templates/TemplateFiles/TemplateFiles.tsx +++ b/site/src/modules/templates/TemplateFiles/TemplateFiles.tsx @@ -1,13 +1,13 @@ import { useTheme, type Interpolation, type Theme } from "@emotion/react"; -import { useMemo, type FC, useCallback } from "react"; -import { SyntaxHighlighter } from "components/SyntaxHighlighter/SyntaxHighlighter"; -import { TemplateVersionFiles } from "utils/templateVersion"; -import RadioButtonCheckedOutlined from "@mui/icons-material/RadioButtonCheckedOutlined"; -import { FileTree } from "utils/filetree"; -import set from "lodash/fp/set"; -import { TemplateFileTree } from "./TemplateFileTree"; -import { Link } from "react-router-dom"; import EditOutlined from "@mui/icons-material/EditOutlined"; +import RadioButtonCheckedOutlined from "@mui/icons-material/RadioButtonCheckedOutlined"; +import set from "lodash/fp/set"; +import { type FC, useCallback, useMemo } from "react"; +import { Link } from "react-router-dom"; +import { SyntaxHighlighter } from "components/SyntaxHighlighter/SyntaxHighlighter"; +import type { FileTree } from "utils/filetree"; +import type { TemplateVersionFiles } from "utils/templateVersion"; +import { TemplateFileTree } from "./TemplateFileTree"; interface TemplateFilesProps { currentFiles: TemplateVersionFiles; diff --git a/site/src/modules/templates/TemplateResourcesTable/TemplateResourcesTable.tsx b/site/src/modules/templates/TemplateResourcesTable/TemplateResourcesTable.tsx index 9d8e95114a..22f613780e 100644 --- a/site/src/modules/templates/TemplateResourcesTable/TemplateResourcesTable.tsx +++ b/site/src/modules/templates/TemplateResourcesTable/TemplateResourcesTable.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type { WorkspaceResource } from "api/typesGenerated"; import { AgentRowPreview } from "modules/resources/AgentRowPreview"; import { Resources } from "modules/resources/Resources"; diff --git a/site/src/modules/templates/TemplateScheduleAutostart/TemplateScheduleAutostart.tsx b/site/src/modules/templates/TemplateScheduleAutostart/TemplateScheduleAutostart.tsx index 21681dafdd..35d26499f8 100644 --- a/site/src/modules/templates/TemplateScheduleAutostart/TemplateScheduleAutostart.tsx +++ b/site/src/modules/templates/TemplateScheduleAutostart/TemplateScheduleAutostart.tsx @@ -1,8 +1,8 @@ -import { type FC } from "react"; -import { TemplateAutostartRequirementDaysValue } from "utils/schedule"; import Button from "@mui/material/Button"; -import { Stack } from "components/Stack/Stack"; import FormHelperText from "@mui/material/FormHelperText"; +import type { FC } from "react"; +import { Stack } from "components/Stack/Stack"; +import type { TemplateAutostartRequirementDaysValue } from "utils/schedule"; export interface TemplateScheduleAutostartProps { allow_user_autostart?: boolean; diff --git a/site/src/modules/templates/TemplateUpdateMessage.tsx b/site/src/modules/templates/TemplateUpdateMessage.tsx index 402bbaf852..a5f181e3cb 100644 --- a/site/src/modules/templates/TemplateUpdateMessage.tsx +++ b/site/src/modules/templates/TemplateUpdateMessage.tsx @@ -1,5 +1,5 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC } from "react"; import { MemoizedMarkdown } from "components/Markdown/Markdown"; interface TemplateUpdateMessageProps { diff --git a/site/src/modules/templates/useWatchVersionLogs.ts b/site/src/modules/templates/useWatchVersionLogs.ts index 62ac4a3a16..ff856171d1 100644 --- a/site/src/modules/templates/useWatchVersionLogs.ts +++ b/site/src/modules/templates/useWatchVersionLogs.ts @@ -1,6 +1,6 @@ -import { watchBuildLogsByTemplateVersionId } from "api/api"; -import { ProvisionerJobLog, TemplateVersion } from "api/typesGenerated"; import { useState, useEffect } from "react"; +import { watchBuildLogsByTemplateVersionId } from "api/api"; +import type { ProvisionerJobLog, TemplateVersion } from "api/typesGenerated"; export const useWatchVersionLogs = ( templateVersion: TemplateVersion | undefined, diff --git a/site/src/modules/workspaces/WorkspaceBuild/WorkspaceBuildData.tsx b/site/src/modules/workspaces/WorkspaceBuild/WorkspaceBuildData.tsx index 2b165cd956..346a58cdaf 100644 --- a/site/src/modules/workspaces/WorkspaceBuild/WorkspaceBuildData.tsx +++ b/site/src/modules/workspaces/WorkspaceBuild/WorkspaceBuildData.tsx @@ -1,6 +1,6 @@ -import { Interpolation, Theme, useTheme } from "@emotion/react"; +import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import Skeleton from "@mui/material/Skeleton"; -import { WorkspaceBuild } from "api/typesGenerated"; +import type { WorkspaceBuild } from "api/typesGenerated"; import { BuildIcon } from "components/BuildIcon/BuildIcon"; import { createDayString } from "utils/createDayString"; import { diff --git a/site/src/modules/workspaces/WorkspaceBuildLogs/Logs.tsx b/site/src/modules/workspaces/WorkspaceBuildLogs/Logs.tsx index cf189dd8d9..6d253e2055 100644 --- a/site/src/modules/workspaces/WorkspaceBuildLogs/Logs.tsx +++ b/site/src/modules/workspaces/WorkspaceBuildLogs/Logs.tsx @@ -1,8 +1,8 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import type { LogLevel } from "api/typesGenerated"; +import type { Interpolation, Theme } from "@emotion/react"; +import AnsiToHTML from "ansi-to-html"; import dayjs from "dayjs"; import { type FC, type ReactNode, useMemo } from "react"; -import AnsiToHTML from "ansi-to-html"; +import type { LogLevel } from "api/typesGenerated"; import { MONOSPACE_FONT_FAMILY } from "theme/constants"; export const DEFAULT_LOG_LINE_SIDE_PADDING = 24; diff --git a/site/src/modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs.tsx b/site/src/modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs.tsx index 3e9490ba1c..647500e920 100644 --- a/site/src/modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs.tsx +++ b/site/src/modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs.tsx @@ -1,9 +1,9 @@ +import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import dayjs from "dayjs"; import { type FC, Fragment, type HTMLAttributes } from "react"; import type { ProvisionerJobLog } from "api/typesGenerated"; import { BODY_FONT_FAMILY, MONOSPACE_FONT_FAMILY } from "theme/constants"; import { DEFAULT_LOG_LINE_SIDE_PADDING, Logs } from "./Logs"; -import { type Interpolation, type Theme, useTheme } from "@emotion/react"; const Language = { seconds: "seconds", diff --git a/site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx b/site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx index 2f2d87ecd0..bafc2b035b 100644 --- a/site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx +++ b/site/src/modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip.tsx @@ -1,10 +1,10 @@ -import RefreshIcon from "@mui/icons-material/Refresh"; -import InfoIcon from "@mui/icons-material/InfoOutlined"; -import Skeleton from "@mui/material/Skeleton"; -import Link from "@mui/material/Link"; -import { type FC } from "react"; -import { useQuery } from "react-query"; import { type Interpolation, type Theme, useTheme } from "@emotion/react"; +import InfoIcon from "@mui/icons-material/InfoOutlined"; +import RefreshIcon from "@mui/icons-material/Refresh"; +import Link from "@mui/material/Link"; +import Skeleton from "@mui/material/Skeleton"; +import type { FC } from "react"; +import { useQuery } from "react-query"; import { templateVersion } from "api/queries/templates"; import { HelpTooltip, diff --git a/site/src/modules/workspaces/WorkspaceStatusBadge/DormantDeletionText.tsx b/site/src/modules/workspaces/WorkspaceStatusBadge/DormantDeletionText.tsx index 3d5e5a3ed5..27aea1359d 100644 --- a/site/src/modules/workspaces/WorkspaceStatusBadge/DormantDeletionText.tsx +++ b/site/src/modules/workspaces/WorkspaceStatusBadge/DormantDeletionText.tsx @@ -1,7 +1,7 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type { Workspace } from "api/typesGenerated"; -import { displayDormantDeletion } from "utils/dormant"; import { useDashboard } from "modules/dashboard/useDashboard"; +import { displayDormantDeletion } from "utils/dormant"; interface DormantDeletionTextProps { workspace: Workspace; diff --git a/site/src/modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge.stories.tsx b/site/src/modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge.stories.tsx index d41703505b..572ac83aae 100644 --- a/site/src/modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge.stories.tsx +++ b/site/src/modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge.stories.tsx @@ -1,3 +1,5 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { DashboardContext } from "modules/dashboard/DashboardProvider"; import { MockCanceledWorkspace, MockCancelingWorkspace, @@ -15,8 +17,6 @@ import { MockAppearanceConfig, } from "testHelpers/entities"; import { WorkspaceStatusBadge } from "./WorkspaceStatusBadge"; -import { DashboardContext } from "modules/dashboard/DashboardProvider"; -import type { Meta, StoryObj } from "@storybook/react"; const MockedAppearance = { config: MockAppearanceConfig, diff --git a/site/src/modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge.tsx b/site/src/modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge.tsx index ad3f1d0649..3be084e572 100644 --- a/site/src/modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge.tsx +++ b/site/src/modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge.tsx @@ -1,18 +1,18 @@ +import AutoDeleteIcon from "@mui/icons-material/AutoDelete"; +import ErrorOutline from "@mui/icons-material/ErrorOutline"; +import RecyclingIcon from "@mui/icons-material/Recycling"; import Tooltip, { type TooltipProps, tooltipClasses, } from "@mui/material/Tooltip"; -import ErrorOutline from "@mui/icons-material/ErrorOutline"; -import RecyclingIcon from "@mui/icons-material/Recycling"; -import AutoDeleteIcon from "@mui/icons-material/AutoDelete"; -import { type FC, type ReactNode } from "react"; -import type { Workspace } from "api/typesGenerated"; -import { Pill } from "components/Pill/Pill"; -import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; -import { DormantDeletionText } from "./DormantDeletionText"; -import { getDisplayWorkspaceStatus } from "utils/workspace"; -import { useClassName } from "hooks/useClassName"; import { formatDistanceToNow } from "date-fns"; +import type { FC, ReactNode } from "react"; +import type { Workspace } from "api/typesGenerated"; +import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; +import { Pill } from "components/Pill/Pill"; +import { useClassName } from "hooks/useClassName"; +import { getDisplayWorkspaceStatus } from "utils/workspace"; +import { DormantDeletionText } from "./DormantDeletionText"; export type WorkspaceStatusBadgeProps = { workspace: Workspace; diff --git a/site/src/pages/404Page/404Page.tsx b/site/src/pages/404Page/404Page.tsx index 3d9fdcdf50..cc0380d10f 100644 --- a/site/src/pages/404Page/404Page.tsx +++ b/site/src/pages/404Page/404Page.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; export const NotFoundPage: FC = () => { return ( diff --git a/site/src/pages/AuditPage/AuditFilter.tsx b/site/src/pages/AuditPage/AuditFilter.tsx index e0e73ff997..e02100e11e 100644 --- a/site/src/pages/AuditPage/AuditFilter.tsx +++ b/site/src/pages/AuditPage/AuditFilter.tsx @@ -1,17 +1,20 @@ import capitalize from "lodash/capitalize"; -import { type FC } from "react"; +import type { FC } from "react"; import { AuditActions, ResourceTypes } from "api/typesGenerated"; -import { UserFilterMenu, UserMenu } from "components/Filter/UserFilter"; import { Filter, FilterMenu, MenuSkeleton, OptionItem, SearchFieldSkeleton, - useFilter, + type useFilter, } from "components/Filter/filter"; -import { UseFilterMenuOptions, useFilterMenu } from "components/Filter/menu"; -import { BaseOption } from "components/Filter/options"; +import { + useFilterMenu, + type UseFilterMenuOptions, +} from "components/Filter/menu"; +import type { BaseOption } from "components/Filter/options"; +import { type UserFilterMenu, UserMenu } from "components/Filter/UserFilter"; import { docs } from "utils/docs"; const PRESET_FILTERS = [ diff --git a/site/src/pages/AuditPage/AuditHelpTooltip.tsx b/site/src/pages/AuditPage/AuditHelpTooltip.tsx index 7118bdd239..a871a4208b 100644 --- a/site/src/pages/AuditPage/AuditHelpTooltip.tsx +++ b/site/src/pages/AuditPage/AuditHelpTooltip.tsx @@ -1,4 +1,4 @@ -import { FC } from "react"; +import type { FC } from "react"; import { HelpTooltip, HelpTooltipContent, diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.stories.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.stories.tsx index ae84490d48..956ef1df1d 100644 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.stories.tsx +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.stories.tsx @@ -1,5 +1,4 @@ import type { Meta, StoryObj } from "@storybook/react"; -import { AuditLogDescription } from "./AuditLogDescription"; import { MockAuditLog, MockAuditLogSuccessfulLogin, @@ -7,6 +6,7 @@ import { MockAuditLogWithWorkspaceBuild, MockWorkspaceCreateAuditLogForDifferentOwner, } from "testHelpers/entities"; +import { AuditLogDescription } from "./AuditLogDescription"; const meta: Meta = { title: "pages/AuditPage/AuditLogDescription", diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.tsx index 9e59cceb4e..3eea4ca12d 100644 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.tsx +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/AuditLogDescription.tsx @@ -1,7 +1,7 @@ -import { type FC } from "react"; -import { AuditLog } from "api/typesGenerated"; -import { Link as RouterLink } from "react-router-dom"; import Link from "@mui/material/Link"; +import type { FC } from "react"; +import { Link as RouterLink } from "react-router-dom"; +import type { AuditLog } from "api/typesGenerated"; import { BuildAuditDescription } from "./BuildAuditDescription"; interface AuditLogDescriptionProps { diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/BuildAuditDescription.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/BuildAuditDescription.tsx index 9be162db6d..36b09b1ffb 100644 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/BuildAuditDescription.tsx +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogDescription/BuildAuditDescription.tsx @@ -1,7 +1,7 @@ -import type { AuditLog } from "api/typesGenerated"; +import Link from "@mui/material/Link"; import { type FC, useMemo } from "react"; import { Link as RouterLink } from "react-router-dom"; -import Link from "@mui/material/Link"; +import type { AuditLog } from "api/typesGenerated"; interface BuildAuditDescriptionProps { auditLog: AuditLog; diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/AuditLogDiff.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/AuditLogDiff.tsx index b72420c2c9..87a8cdc8eb 100644 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/AuditLogDiff.tsx +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/AuditLogDiff.tsx @@ -1,8 +1,8 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC } from "react"; import type { AuditDiff } from "api/typesGenerated"; -import colors from "theme/tailwindColors"; import { MONOSPACE_FONT_FAMILY } from "theme/constants"; +import colors from "theme/tailwindColors"; const getDiffValue = (value: unknown): string => { if (typeof value === "string") { diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/auditUtils.ts b/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/auditUtils.ts index ed3cd917ca..6b6ead3cb7 100644 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/auditUtils.ts +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogDiff/auditUtils.ts @@ -1,4 +1,4 @@ -import { AuditDiff } from "api/typesGenerated"; +import type { AuditDiff } from "api/typesGenerated"; interface GroupMember { user_id: string; diff --git a/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx b/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx index 23724c06bc..15e1a8e825 100644 --- a/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx +++ b/site/src/pages/AuditPage/AuditLogRow/AuditLogRow.tsx @@ -1,17 +1,17 @@ -import { type CSSObject, type Interpolation, type Theme } from "@emotion/react"; +import type { CSSObject, Interpolation, Theme } from "@emotion/react"; import Collapse from "@mui/material/Collapse"; import TableCell from "@mui/material/TableCell"; import { type FC, useState } from "react"; import userAgentParser from "ua-parser-js"; import type { AuditLog } from "api/typesGenerated"; -import { type ThemeRole } from "theme/roles"; import { DropdownArrow } from "components/DropdownArrow/DropdownArrow"; import { Pill } from "components/Pill/Pill"; import { Stack } from "components/Stack/Stack"; import { TimelineEntry } from "components/Timeline/TimelineEntry"; import { UserAvatar } from "components/UserAvatar/UserAvatar"; -import { AuditLogDiff } from "./AuditLogDiff/AuditLogDiff"; +import type { ThemeRole } from "theme/roles"; import { AuditLogDescription } from "./AuditLogDescription/AuditLogDescription"; +import { AuditLogDiff } from "./AuditLogDiff/AuditLogDiff"; import { determineGroupDiff } from "./AuditLogDiff/auditUtils"; const httpStatusColor = (httpStatus: number): ThemeRole => { diff --git a/site/src/pages/AuditPage/AuditPage.test.tsx b/site/src/pages/AuditPage/AuditPage.test.tsx index 8be345bba6..ae7a8a1d93 100644 --- a/site/src/pages/AuditPage/AuditPage.test.tsx +++ b/site/src/pages/AuditPage/AuditPage.test.tsx @@ -1,7 +1,8 @@ import { screen, waitFor } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import * as API from "api/api"; import { rest } from "msw"; +import * as API from "api/api"; +import { DEFAULT_RECORDS_PER_PAGE } from "components/PaginationWidget/utils"; import { MockAuditLog, MockAuditLog2, @@ -12,10 +13,8 @@ import { waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; import { server } from "testHelpers/server"; - import * as CreateDayString from "utils/createDayString"; import AuditPage from "./AuditPage"; -import { DEFAULT_RECORDS_PER_PAGE } from "components/PaginationWidget/utils"; interface RenderPageOptions { filter?: string; diff --git a/site/src/pages/AuditPage/AuditPage.tsx b/site/src/pages/AuditPage/AuditPage.tsx index f9785379f4..d014972ef1 100644 --- a/site/src/pages/AuditPage/AuditPage.tsx +++ b/site/src/pages/AuditPage/AuditPage.tsx @@ -1,13 +1,13 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useSearchParams } from "react-router-dom"; -import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility"; -import { pageTitle } from "utils/page"; import { paginatedAudits } from "api/queries/audits"; -import { usePaginatedQuery } from "hooks/usePaginatedQuery"; +import { useFilter } from "components/Filter/filter"; import { useUserFilterMenu } from "components/Filter/UserFilter"; import { isNonInitialPage } from "components/PaginationWidget/utils"; -import { useFilter } from "components/Filter/filter"; +import { usePaginatedQuery } from "hooks/usePaginatedQuery"; +import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility"; +import { pageTitle } from "utils/page"; import { useActionFilterMenu, useResourceTypeFilterMenu } from "./AuditFilter"; import { AuditPageView } from "./AuditPageView"; diff --git a/site/src/pages/AuditPage/AuditPageView.stories.tsx b/site/src/pages/AuditPage/AuditPageView.stories.tsx index 69aa64977e..fa6ac9f17f 100644 --- a/site/src/pages/AuditPage/AuditPageView.stories.tsx +++ b/site/src/pages/AuditPage/AuditPageView.stories.tsx @@ -1,18 +1,17 @@ -import { Meta, StoryObj } from "@storybook/react"; -import { type ComponentProps } from "react"; -import { chromaticWithTablet } from "testHelpers/chromatic"; -import { MockAuditLog, MockAuditLog2, MockUser } from "testHelpers/entities"; -import { - mockInitialRenderResult, - mockSuccessResult, -} from "components/PaginationWidget/PaginationContainer.mocks"; -import { type UsePaginatedQueryResult } from "hooks/usePaginatedQuery"; -import { AuditPageView } from "./AuditPageView"; - +import type { Meta, StoryObj } from "@storybook/react"; +import type { ComponentProps } from "react"; import { MockMenu, getDefaultFilterProps, } from "components/Filter/storyHelpers"; +import { + mockInitialRenderResult, + mockSuccessResult, +} from "components/PaginationWidget/PaginationContainer.mocks"; +import type { UsePaginatedQueryResult } from "hooks/usePaginatedQuery"; +import { chromaticWithTablet } from "testHelpers/chromatic"; +import { MockAuditLog, MockAuditLog2, MockUser } from "testHelpers/entities"; +import { AuditPageView } from "./AuditPageView"; type FilterProps = ComponentProps["filterProps"]; diff --git a/site/src/pages/AuditPage/AuditPageView.tsx b/site/src/pages/AuditPage/AuditPageView.tsx index 84cabc9d36..a6aa69128a 100644 --- a/site/src/pages/AuditPage/AuditPageView.tsx +++ b/site/src/pages/AuditPage/AuditPageView.tsx @@ -3,7 +3,7 @@ import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableRow from "@mui/material/TableRow"; -import { type ComponentProps, type FC } from "react"; +import type { ComponentProps, FC } from "react"; import type { AuditLog } from "api/typesGenerated"; import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; import { EmptyState } from "components/EmptyState/EmptyState"; @@ -13,17 +13,17 @@ import { PageHeaderSubtitle, PageHeaderTitle, } from "components/PageHeader/PageHeader"; -import { Stack } from "components/Stack/Stack"; -import { TableLoader } from "components/TableLoader/TableLoader"; -import { Timeline } from "components/Timeline/Timeline"; -import { Paywall } from "components/Paywall/Paywall"; import { type PaginationResult, PaginationContainer, } from "components/PaginationWidget/PaginationContainer"; +import { Paywall } from "components/Paywall/Paywall"; +import { Stack } from "components/Stack/Stack"; +import { TableLoader } from "components/TableLoader/TableLoader"; +import { Timeline } from "components/Timeline/Timeline"; import { docs } from "utils/docs"; -import { AuditHelpTooltip } from "./AuditHelpTooltip"; import { AuditFilter } from "./AuditFilter"; +import { AuditHelpTooltip } from "./AuditHelpTooltip"; import { AuditLogRow } from "./AuditLogRow/AuditLogRow"; export const Language = { diff --git a/site/src/pages/CliAuthPage/CliAuthPage.tsx b/site/src/pages/CliAuthPage/CliAuthPage.tsx index 381ff88507..eeb9223f13 100644 --- a/site/src/pages/CliAuthPage/CliAuthPage.tsx +++ b/site/src/pages/CliAuthPage/CliAuthPage.tsx @@ -1,9 +1,9 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; +import { apiKey } from "api/queries/users"; import { pageTitle } from "utils/page"; import { CliAuthPageView } from "./CliAuthPageView"; -import { apiKey } from "api/queries/users"; export const CliAuthenticationPage: FC = () => { const { data } = useQuery(apiKey()); diff --git a/site/src/pages/CliAuthPage/CliAuthPageView.stories.tsx b/site/src/pages/CliAuthPage/CliAuthPageView.stories.tsx index 0108db8907..9f08ad1cd3 100644 --- a/site/src/pages/CliAuthPage/CliAuthPageView.stories.tsx +++ b/site/src/pages/CliAuthPage/CliAuthPageView.stories.tsx @@ -1,5 +1,5 @@ -import { CliAuthPageView } from "./CliAuthPageView"; import type { Meta, StoryObj } from "@storybook/react"; +import { CliAuthPageView } from "./CliAuthPageView"; const meta: Meta = { title: "pages/CliAuthPage", diff --git a/site/src/pages/CliAuthPage/CliAuthPageView.tsx b/site/src/pages/CliAuthPage/CliAuthPageView.tsx index cdcbeabdaa..a157c0bb4d 100644 --- a/site/src/pages/CliAuthPage/CliAuthPageView.tsx +++ b/site/src/pages/CliAuthPage/CliAuthPageView.tsx @@ -1,11 +1,11 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import { visuallyHidden } from "@mui/utils"; +import type { FC } from "react"; import { Link as RouterLink } from "react-router-dom"; import { CodeExample } from "components/CodeExample/CodeExample"; +import { FullScreenLoader } from "components/Loader/FullScreenLoader"; import { SignInLayout } from "components/SignInLayout/SignInLayout"; import { Welcome } from "components/Welcome/Welcome"; -import { FullScreenLoader } from "components/Loader/FullScreenLoader"; -import { visuallyHidden } from "@mui/utils"; export interface CliAuthPageViewProps { sessionToken?: string; diff --git a/site/src/pages/CreateTemplatePage/BuildLogsDrawer.stories.tsx b/site/src/pages/CreateTemplatePage/BuildLogsDrawer.stories.tsx index 8ecd2fe712..c2414cfcd3 100644 --- a/site/src/pages/CreateTemplatePage/BuildLogsDrawer.stories.tsx +++ b/site/src/pages/CreateTemplatePage/BuildLogsDrawer.stories.tsx @@ -1,12 +1,12 @@ -import { JobError } from "api/queries/templates"; -import { BuildLogsDrawer } from "./BuildLogsDrawer"; import type { Meta, StoryObj } from "@storybook/react"; +import { JobError } from "api/queries/templates"; import { MockProvisionerJob, MockTemplateVersion, MockWorkspaceBuildLogs, } from "testHelpers/entities"; import { withWebSocket } from "testHelpers/storybook"; +import { BuildLogsDrawer } from "./BuildLogsDrawer"; const meta: Meta = { title: "pages/CreateTemplatePage/BuildLogsDrawer", diff --git a/site/src/pages/CreateTemplatePage/BuildLogsDrawer.tsx b/site/src/pages/CreateTemplatePage/BuildLogsDrawer.tsx index 19a5fe572f..85d8ad1157 100644 --- a/site/src/pages/CreateTemplatePage/BuildLogsDrawer.tsx +++ b/site/src/pages/CreateTemplatePage/BuildLogsDrawer.tsx @@ -1,17 +1,17 @@ -import Drawer from "@mui/material/Drawer"; +import type { Interpolation, Theme } from "@emotion/react"; import Close from "@mui/icons-material/Close"; +import WarningOutlined from "@mui/icons-material/WarningOutlined"; +import Button from "@mui/material/Button"; +import Drawer from "@mui/material/Drawer"; import IconButton from "@mui/material/IconButton"; import { visuallyHidden } from "@mui/utils"; -import { FC, useLayoutEffect, useRef } from "react"; -import { TemplateVersion } from "api/typesGenerated"; -import { WorkspaceBuildLogs } from "modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs"; -import { Interpolation, Theme } from "@emotion/react"; -import { navHeight } from "theme/constants"; -import { useWatchVersionLogs } from "modules/templates/useWatchVersionLogs"; +import { type FC, useLayoutEffect, useRef } from "react"; import { JobError } from "api/queries/templates"; -import Button from "@mui/material/Button"; +import type { TemplateVersion } from "api/typesGenerated"; import { Loader } from "components/Loader/Loader"; -import WarningOutlined from "@mui/icons-material/WarningOutlined"; +import { useWatchVersionLogs } from "modules/templates/useWatchVersionLogs"; +import { WorkspaceBuildLogs } from "modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs"; +import { navHeight } from "theme/constants"; type BuildLogsDrawerProps = { error: unknown; diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.stories.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.stories.tsx index 583a3e8cc4..e79da49a53 100644 --- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.stories.tsx +++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockTemplate, MockTemplateExample, @@ -8,7 +9,6 @@ import { MockTemplateVersionVariable5, } from "testHelpers/entities"; import { CreateTemplateForm } from "./CreateTemplateForm"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/CreateTemplatePage/CreateTemplateForm", diff --git a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx index b4e5677525..d687fe5e25 100644 --- a/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx +++ b/site/src/pages/CreateTemplatePage/CreateTemplateForm.tsx @@ -1,8 +1,8 @@ import TextField from "@mui/material/TextField"; import { useFormik } from "formik"; -import { type FC } from "react"; import camelCase from "lodash/camelCase"; import capitalize from "lodash/capitalize"; +import type { FC } from "react"; import * as Yup from "yup"; import type { ProvisionerJobLog, @@ -11,6 +11,14 @@ import type { TemplateVersionVariable, VariableValue, } from "api/typesGenerated"; +import { + HorizontalForm, + FormSection, + FormFields, + FormFooter, +} from "components/Form/Form"; +import { IconField } from "components/IconField/IconField"; +import { sortedDays } from "modules/templates/TemplateScheduleAutostart/TemplateScheduleAutostart"; import { SelectedTemplate } from "pages/CreateWorkspacePage/SelectedTemplate"; import { nameValidator, @@ -18,18 +26,10 @@ import { onChangeTrimmed, templateDisplayNameValidator, } from "utils/formUtils"; -import { - type TemplateAutostartRequirementDaysValue, - type TemplateAutostopRequirementDaysValue, +import type { + TemplateAutostartRequirementDaysValue, + TemplateAutostopRequirementDaysValue, } from "utils/schedule"; -import { sortedDays } from "modules/templates/TemplateScheduleAutostart/TemplateScheduleAutostart"; -import { IconField } from "components/IconField/IconField"; -import { - HorizontalForm, - FormSection, - FormFields, - FormFooter, -} from "components/Form/Form"; import { TemplateUpload, type TemplateUploadProps } from "./TemplateUpload"; import { VariableInput } from "./VariableInput"; diff --git a/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx b/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx index 19883db648..38eacc38fd 100644 --- a/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx +++ b/site/src/pages/CreateTemplatePage/CreateTemplatePage.test.tsx @@ -1,5 +1,3 @@ -import { renderWithAuth } from "testHelpers/renderHelpers"; -import CreateTemplatePage from "./CreateTemplatePage"; import { screen, waitFor, within } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import * as API from "api/api"; @@ -12,6 +10,8 @@ import { MockTemplate, MockOrganization, } from "testHelpers/entities"; +import { renderWithAuth } from "testHelpers/renderHelpers"; +import CreateTemplatePage from "./CreateTemplatePage"; const renderPage = async (searchParams: URLSearchParams) => { // Render with the example ID so we don't need to upload a file diff --git a/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx b/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx index 6f260933c1..e427fa6b32 100644 --- a/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx +++ b/site/src/pages/CreateTemplatePage/CreateTemplatePage.tsx @@ -1,16 +1,16 @@ import { useState, type FC, useRef } from "react"; import { Helmet } from "react-helmet-async"; +import { useMutation } from "react-query"; import { useNavigate, useSearchParams } from "react-router-dom"; -import { pageTitle } from "utils/page"; +import { createTemplate } from "api/queries/templates"; +import type { TemplateVersion } from "api/typesGenerated"; import { FullPageHorizontalForm } from "components/FullPageForm/FullPageHorizontalForm"; +import { pageTitle } from "utils/page"; +import { BuildLogsDrawer } from "./BuildLogsDrawer"; import { DuplicateTemplateView } from "./DuplicateTemplateView"; import { ImportStarterTemplateView } from "./ImportStarterTemplateView"; +import type { CreateTemplatePageViewProps } from "./types"; import { UploadTemplateView } from "./UploadTemplateView"; -import { BuildLogsDrawer } from "./BuildLogsDrawer"; -import { useMutation } from "react-query"; -import { createTemplate } from "api/queries/templates"; -import { CreateTemplatePageViewProps } from "./types"; -import { TemplateVersion } from "api/typesGenerated"; const CreateTemplatePage: FC = () => { const navigate = useNavigate(); diff --git a/site/src/pages/CreateTemplatePage/DuplicateTemplateView.tsx b/site/src/pages/CreateTemplatePage/DuplicateTemplateView.tsx index 933b2ef36d..0a965aef2a 100644 --- a/site/src/pages/CreateTemplatePage/DuplicateTemplateView.tsx +++ b/site/src/pages/CreateTemplatePage/DuplicateTemplateView.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useQuery } from "react-query"; import { useNavigate, useSearchParams } from "react-router-dom"; import { @@ -8,13 +8,13 @@ import { templateVersionVariables, JobError, } from "api/queries/templates"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; -import { useDashboard } from "modules/dashboard/useDashboard"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Loader } from "components/Loader/Loader"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { useDashboard } from "modules/dashboard/useDashboard"; import { CreateTemplateForm } from "./CreateTemplateForm"; +import type { CreateTemplatePageViewProps } from "./types"; import { firstVersionFromFile, getFormPermissions, newTemplate } from "./utils"; -import { CreateTemplatePageViewProps } from "./types"; export const DuplicateTemplateView: FC = ({ onCreateTemplate, diff --git a/site/src/pages/CreateTemplatePage/ImportStarterTemplateView.tsx b/site/src/pages/CreateTemplatePage/ImportStarterTemplateView.tsx index ec3e9c1008..1e38865e53 100644 --- a/site/src/pages/CreateTemplatePage/ImportStarterTemplateView.tsx +++ b/site/src/pages/CreateTemplatePage/ImportStarterTemplateView.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useQuery } from "react-query"; import { useNavigate, useSearchParams } from "react-router-dom"; import { @@ -7,17 +7,17 @@ import { templateExamples, templateVersionVariables, } from "api/queries/templates"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; -import { useDashboard } from "modules/dashboard/useDashboard"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Loader } from "components/Loader/Loader"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { useDashboard } from "modules/dashboard/useDashboard"; import { CreateTemplateForm } from "./CreateTemplateForm"; +import type { CreateTemplatePageViewProps } from "./types"; import { firstVersionFromExample, getFormPermissions, newTemplate, } from "./utils"; -import { CreateTemplatePageViewProps } from "./types"; export const ImportStarterTemplateView: FC = ({ onCreateTemplate, diff --git a/site/src/pages/CreateTemplatePage/TemplateUpload.tsx b/site/src/pages/CreateTemplatePage/TemplateUpload.tsx index 298f9e50ae..139a79774f 100644 --- a/site/src/pages/CreateTemplatePage/TemplateUpload.tsx +++ b/site/src/pages/CreateTemplatePage/TemplateUpload.tsx @@ -1,7 +1,7 @@ import Link from "@mui/material/Link"; -import { FileUpload } from "components/FileUpload/FileUpload"; -import { FC } from "react"; +import type { FC } from "react"; import { Link as RouterLink } from "react-router-dom"; +import { FileUpload } from "components/FileUpload/FileUpload"; export interface TemplateUploadProps { isUploading: boolean; diff --git a/site/src/pages/CreateTemplatePage/UploadTemplateView.tsx b/site/src/pages/CreateTemplatePage/UploadTemplateView.tsx index da2b737d75..d409177a07 100644 --- a/site/src/pages/CreateTemplatePage/UploadTemplateView.tsx +++ b/site/src/pages/CreateTemplatePage/UploadTemplateView.tsx @@ -1,17 +1,17 @@ +import type { FC } from "react"; import { useQuery, useMutation } from "react-query"; import { useNavigate } from "react-router-dom"; +import { uploadFile } from "api/queries/files"; import { templateVersionLogs, JobError, templateVersionVariables, } from "api/queries/templates"; -import { uploadFile } from "api/queries/files"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { useDashboard } from "modules/dashboard/useDashboard"; import { CreateTemplateForm } from "./CreateTemplateForm"; +import type { CreateTemplatePageViewProps } from "./types"; import { firstVersionFromFile, getFormPermissions, newTemplate } from "./utils"; -import { FC } from "react"; -import { CreateTemplatePageViewProps } from "./types"; export const UploadTemplateView: FC = ({ onCreateTemplate, diff --git a/site/src/pages/CreateTemplatePage/VariableInput.tsx b/site/src/pages/CreateTemplatePage/VariableInput.tsx index 3a28260c88..71d2ac6d99 100644 --- a/site/src/pages/CreateTemplatePage/VariableInput.tsx +++ b/site/src/pages/CreateTemplatePage/VariableInput.tsx @@ -1,11 +1,11 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import FormControlLabel from "@mui/material/FormControlLabel"; import Radio from "@mui/material/Radio"; import RadioGroup from "@mui/material/RadioGroup"; import TextField from "@mui/material/TextField"; -import { Stack } from "components/Stack/Stack"; -import { type FC } from "react"; +import type { FC } from "react"; import type { TemplateVersionVariable } from "api/typesGenerated"; +import { Stack } from "components/Stack/Stack"; const isBoolean = (variable: TemplateVersionVariable) => { return variable.type === "bool"; diff --git a/site/src/pages/CreateTemplatePage/types.ts b/site/src/pages/CreateTemplatePage/types.ts index d635d66a31..74bf1399b7 100644 --- a/site/src/pages/CreateTemplatePage/types.ts +++ b/site/src/pages/CreateTemplatePage/types.ts @@ -1,4 +1,4 @@ -import { CreateTemplateOptions } from "api/queries/templates"; +import type { CreateTemplateOptions } from "api/queries/templates"; export type CreateTemplatePageViewProps = { onCreateTemplate: (options: CreateTemplateOptions) => Promise; diff --git a/site/src/pages/CreateTemplatePage/utils.ts b/site/src/pages/CreateTemplatePage/utils.ts index b9b9a85bde..811d9979f2 100644 --- a/site/src/pages/CreateTemplatePage/utils.ts +++ b/site/src/pages/CreateTemplatePage/utils.ts @@ -1,11 +1,11 @@ -import { +import type { Entitlements, ProvisionerType, TemplateExample, VariableValue, } from "api/typesGenerated"; import { calculateAutostopRequirementDaysValue } from "utils/schedule"; -import { CreateTemplateData } from "./CreateTemplateForm"; +import type { CreateTemplateData } from "./CreateTemplateForm"; const provisioner: ProvisionerType = // eslint-disable-next-line @typescript-eslint/no-explicit-any -- Playwright needs to use a different provisioner type! diff --git a/site/src/pages/CreateTokenPage/CreateTokenForm.tsx b/site/src/pages/CreateTokenPage/CreateTokenForm.tsx index befb3a3032..649576e3bc 100644 --- a/site/src/pages/CreateTokenPage/CreateTokenForm.tsx +++ b/site/src/pages/CreateTokenPage/CreateTokenForm.tsx @@ -1,9 +1,9 @@ import { css } from "@emotion/css"; -import { type FC, useState, useEffect } from "react"; -import TextField from "@mui/material/TextField"; import MenuItem from "@mui/material/MenuItem"; -import type { FormikContextType } from "formik"; +import TextField from "@mui/material/TextField"; import dayjs from "dayjs"; +import type { FormikContextType } from "formik"; +import { type FC, useState, useEffect } from "react"; import { useNavigate } from "react-router-dom"; import { FormFields, diff --git a/site/src/pages/CreateTokenPage/CreateTokenPage.test.tsx b/site/src/pages/CreateTokenPage/CreateTokenPage.test.tsx index cb16724781..f58eed5d1e 100644 --- a/site/src/pages/CreateTokenPage/CreateTokenPage.test.tsx +++ b/site/src/pages/CreateTokenPage/CreateTokenPage.test.tsx @@ -1,11 +1,11 @@ +import { screen, within } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import * as API from "api/api"; import { renderWithAuth, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; import { CreateTokenPage } from "./CreateTokenPage"; -import * as API from "api/api"; -import { screen, within } from "@testing-library/react"; -import userEvent from "@testing-library/user-event"; describe("TokenPage", () => { it("shows the success modal", async () => { diff --git a/site/src/pages/CreateTokenPage/CreateTokenPage.tsx b/site/src/pages/CreateTokenPage/CreateTokenPage.tsx index e48cba07c5..4ea1f98144 100644 --- a/site/src/pages/CreateTokenPage/CreateTokenPage.tsx +++ b/site/src/pages/CreateTokenPage/CreateTokenPage.tsx @@ -1,18 +1,18 @@ +import { useFormik } from "formik"; import { type FC, useState } from "react"; import { Helmet } from "react-helmet-async"; -import { pageTitle } from "utils/page"; -import { FullPageHorizontalForm } from "components/FullPageForm/FullPageHorizontalForm"; -import { useNavigate } from "react-router-dom"; -import { useFormik } from "formik"; -import { Loader } from "components/Loader/Loader"; -import { displaySuccess, displayError } from "components/GlobalSnackbar/utils"; import { useMutation, useQuery } from "react-query"; +import { useNavigate } from "react-router-dom"; import { createToken, getTokenConfig } from "api/api"; -import { CreateTokenForm } from "./CreateTokenForm"; -import { NANO_HOUR, CreateTokenData } from "./utils"; -import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; -import { CodeExample } from "components/CodeExample/CodeExample"; import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { CodeExample } from "components/CodeExample/CodeExample"; +import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; +import { FullPageHorizontalForm } from "components/FullPageForm/FullPageHorizontalForm"; +import { displaySuccess, displayError } from "components/GlobalSnackbar/utils"; +import { Loader } from "components/Loader/Loader"; +import { pageTitle } from "utils/page"; +import { CreateTokenForm } from "./CreateTokenForm"; +import { type CreateTokenData, NANO_HOUR } from "./utils"; const initialValues: CreateTokenData = { name: "", diff --git a/site/src/pages/CreateTokenPage/utils.test.tsx b/site/src/pages/CreateTokenPage/utils.test.tsx index edbde7ae95..ae097a9efe 100644 --- a/site/src/pages/CreateTokenPage/utils.test.tsx +++ b/site/src/pages/CreateTokenPage/utils.test.tsx @@ -1,8 +1,8 @@ import { - filterByMaxTokenLifetime, determineDefaultLtValue, + filterByMaxTokenLifetime, + type LifetimeDay, lifetimeDayPresets, - LifetimeDay, NANO_HOUR, } from "./utils"; diff --git a/site/src/pages/CreateUserPage/CreateUserForm.stories.tsx b/site/src/pages/CreateUserPage/CreateUserForm.stories.tsx index b4e1a3d535..c87b52a030 100644 --- a/site/src/pages/CreateUserPage/CreateUserForm.stories.tsx +++ b/site/src/pages/CreateUserPage/CreateUserForm.stories.tsx @@ -1,7 +1,7 @@ import { action } from "@storybook/addon-actions"; -import { StoryObj, Meta } from "@storybook/react"; -import { CreateUserForm } from "./CreateUserForm"; +import type { StoryObj, Meta } from "@storybook/react"; import { mockApiError } from "testHelpers/entities"; +import { CreateUserForm } from "./CreateUserForm"; const meta: Meta = { title: "pages/CreateUserPage", diff --git a/site/src/pages/CreateUserPage/CreateUserForm.tsx b/site/src/pages/CreateUserPage/CreateUserForm.tsx index 5a355d031d..135d80a176 100644 --- a/site/src/pages/CreateUserPage/CreateUserForm.tsx +++ b/site/src/pages/CreateUserPage/CreateUserForm.tsx @@ -1,20 +1,20 @@ -import TextField from "@mui/material/TextField"; -import MenuItem from "@mui/material/MenuItem"; import Link from "@mui/material/Link"; -import { FormikContextType, useFormik } from "formik"; -import { FC } from "react"; +import MenuItem from "@mui/material/MenuItem"; +import TextField from "@mui/material/TextField"; +import { type FormikContextType, useFormik } from "formik"; +import type { FC } from "react"; import * as Yup from "yup"; import { hasApiFieldErrors, isApiError } from "api/errors"; -import * as TypesGen from "api/typesGenerated"; +import type * as TypesGen from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { FormFooter } from "components/FormFooter/FormFooter"; +import { FullPageForm } from "components/FullPageForm/FullPageForm"; +import { Stack } from "components/Stack/Stack"; import { getFormHelpers, nameValidator, onChangeTrimmed, } from "utils/formUtils"; -import { FormFooter } from "components/FormFooter/FormFooter"; -import { FullPageForm } from "components/FullPageForm/FullPageForm"; -import { Stack } from "components/Stack/Stack"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; export const Language = { emailLabel: "Email", diff --git a/site/src/pages/CreateUserPage/CreateUserPage.test.tsx b/site/src/pages/CreateUserPage/CreateUserPage.test.tsx index 7662fd7c86..2787b26244 100644 --- a/site/src/pages/CreateUserPage/CreateUserPage.test.tsx +++ b/site/src/pages/CreateUserPage/CreateUserPage.test.tsx @@ -1,11 +1,11 @@ import { fireEvent, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import { Language as FormLanguage } from "./CreateUserForm"; import { Language as FooterLanguage } from "components/FormFooter/FormFooter"; import { renderWithAuth, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; +import { Language as FormLanguage } from "./CreateUserForm"; import { CreateUserPage } from "./CreateUserPage"; const renderCreateUserPage = async () => { diff --git a/site/src/pages/CreateUserPage/CreateUserPage.tsx b/site/src/pages/CreateUserPage/CreateUserPage.tsx index 117bbe4c72..d283c42fbd 100644 --- a/site/src/pages/CreateUserPage/CreateUserPage.tsx +++ b/site/src/pages/CreateUserPage/CreateUserPage.tsx @@ -1,12 +1,12 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQuery, useQueryClient } from "react-query"; import { useNavigate } from "react-router-dom"; -import { pageTitle } from "utils/page"; import { authMethods, createUser } from "api/queries/users"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; -import { Margins } from "components/Margins/Margins"; import { displaySuccess } from "components/GlobalSnackbar/utils"; +import { Margins } from "components/Margins/Margins"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { pageTitle } from "utils/page"; import { CreateUserForm } from "./CreateUserForm"; export const Language = { diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx index 083ad01c74..66395c6747 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePage.tsx @@ -20,13 +20,13 @@ import { Loader } from "components/Loader/Loader"; import { useMe } from "contexts/auth/useMe"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { useEffectEvent } from "hooks/hookPolyfills"; +import { useDashboard } from "modules/dashboard/useDashboard"; +import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName"; import { pageTitle } from "utils/page"; -import { AutofillBuildParameter } from "utils/richParameters"; +import type { AutofillBuildParameter } from "utils/richParameters"; import { paramsUsedToCreateWorkspace } from "utils/workspace"; import { CreateWorkspacePageView } from "./CreateWorkspacePageView"; -import { CreateWSPermissions, createWorkspaceChecks } from "./permissions"; -import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName"; -import { useDashboard } from "modules/dashboard/useDashboard"; +import { createWorkspaceChecks, type CreateWSPermissions } from "./permissions"; export const createWorkspaceModes = ["form", "auto", "duplicate"] as const; export type CreateWorkspaceMode = (typeof createWorkspaceModes)[number]; diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx index d83edb55a3..c205b82333 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { chromatic } from "testHelpers/chromatic"; import { mockApiError, diff --git a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx index 9bff961246..f886d39e85 100644 --- a/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx +++ b/site/src/pages/CreateWorkspacePage/CreateWorkspacePageView.tsx @@ -1,35 +1,22 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import TextField from "@mui/material/TextField"; +import type { Interpolation, Theme } from "@emotion/react"; import Button from "@mui/material/Button"; import FormHelperText from "@mui/material/FormHelperText"; -import { FormikContextType, useFormik } from "formik"; +import TextField from "@mui/material/TextField"; +import { type FormikContextType, useFormik } from "formik"; import { type FC, useEffect, useState, useMemo, useCallback } from "react"; import { useSearchParams } from "react-router-dom"; import * as Yup from "yup"; import type * as TypesGen from "api/typesGenerated"; -import { - getFormHelpers, - nameValidator, - onChangeTrimmed, -} from "utils/formUtils"; +import { Alert } from "components/Alert/Alert"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { Avatar } from "components/Avatar/Avatar"; import { FormFields, FormSection, FormFooter, HorizontalForm, } from "components/Form/Form"; -import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; -import { - type AutofillBuildParameter, - getInitialRichParameterValues, - useValidationSchemaForRichParameters, -} from "utils/richParameters"; -import { ExternalAuthButton } from "./ExternalAuthButton"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { Stack } from "components/Stack/Stack"; -import { Alert } from "components/Alert/Alert"; import { Margins } from "components/Margins/Margins"; -import { Avatar } from "components/Avatar/Avatar"; import { PageHeader, PageHeaderTitle, @@ -37,11 +24,24 @@ import { } from "components/PageHeader/PageHeader"; import { Pill } from "components/Pill/Pill"; import { RichParameterInput } from "components/RichParameterInput/RichParameterInput"; +import { Stack } from "components/Stack/Stack"; +import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; import { generateWorkspaceName } from "modules/workspaces/generateWorkspaceName"; +import { + getFormHelpers, + nameValidator, + onChangeTrimmed, +} from "utils/formUtils"; +import { + type AutofillBuildParameter, + getInitialRichParameterValues, + useValidationSchemaForRichParameters, +} from "utils/richParameters"; import type { CreateWorkspaceMode, ExternalAuthPollingState, } from "./CreateWorkspacePage"; +import { ExternalAuthButton } from "./ExternalAuthButton"; import type { CreateWSPermissions } from "./permissions"; export const Language = { diff --git a/site/src/pages/CreateWorkspacePage/ExternalAuthButton.stories.tsx b/site/src/pages/CreateWorkspacePage/ExternalAuthButton.stories.tsx index 6fe8457d06..a8694af0d2 100644 --- a/site/src/pages/CreateWorkspacePage/ExternalAuthButton.stories.tsx +++ b/site/src/pages/CreateWorkspacePage/ExternalAuthButton.stories.tsx @@ -1,6 +1,6 @@ -import { TemplateVersionExternalAuth } from "api/typesGenerated"; -import { ExternalAuthButton } from "./ExternalAuthButton"; import type { Meta, StoryObj } from "@storybook/react"; +import type { TemplateVersionExternalAuth } from "api/typesGenerated"; +import { ExternalAuthButton } from "./ExternalAuthButton"; const MockExternalAuth: TemplateVersionExternalAuth = { id: "", diff --git a/site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx b/site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx index 331ea0f22f..62487dc228 100644 --- a/site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx +++ b/site/src/pages/CreateWorkspacePage/ExternalAuthButton.tsx @@ -1,9 +1,9 @@ import ReplayIcon from "@mui/icons-material/Replay"; +import LoadingButton from "@mui/lab/LoadingButton"; import Button from "@mui/material/Button"; import Tooltip from "@mui/material/Tooltip"; -import LoadingButton from "@mui/lab/LoadingButton"; import { visuallyHidden } from "@mui/utils"; -import { type FC } from "react"; +import type { FC } from "react"; import type { TemplateVersionExternalAuth } from "api/typesGenerated"; import { ExternalImage } from "components/ExternalImage/ExternalImage"; import { Pill } from "components/Pill/Pill"; diff --git a/site/src/pages/CreateWorkspacePage/SelectedTemplate.stories.tsx b/site/src/pages/CreateWorkspacePage/SelectedTemplate.stories.tsx index 520088a5b1..b4d8c5ff5c 100644 --- a/site/src/pages/CreateWorkspacePage/SelectedTemplate.stories.tsx +++ b/site/src/pages/CreateWorkspacePage/SelectedTemplate.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockTemplate } from "testHelpers/entities"; import { SelectedTemplate } from "./SelectedTemplate"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/CreateWorkspacePage/SelectedTemplate", diff --git a/site/src/pages/CreateWorkspacePage/SelectedTemplate.tsx b/site/src/pages/CreateWorkspacePage/SelectedTemplate.tsx index 08bd2b71c5..4fa1486863 100644 --- a/site/src/pages/CreateWorkspacePage/SelectedTemplate.tsx +++ b/site/src/pages/CreateWorkspacePage/SelectedTemplate.tsx @@ -1,8 +1,8 @@ -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC } from "react"; import type { Template, TemplateExample } from "api/typesGenerated"; import { ExternalAvatar } from "components/Avatar/Avatar"; import { Stack } from "components/Stack/Stack"; -import { type Interpolation, type Theme } from "@emotion/react"; export interface SelectedTemplateProps { template: Template | TemplateExample; diff --git a/site/src/pages/CreateWorkspacePage/useWorkspaceDuplication.test.tsx b/site/src/pages/CreateWorkspacePage/useWorkspaceDuplication.test.tsx index d4a72e694e..9dab4129ec 100644 --- a/site/src/pages/CreateWorkspacePage/useWorkspaceDuplication.test.tsx +++ b/site/src/pages/CreateWorkspacePage/useWorkspaceDuplication.test.tsx @@ -1,10 +1,9 @@ import { waitFor } from "@testing-library/react"; -import * as M from "../../testHelpers/entities"; -import { type Workspace } from "api/typesGenerated"; -import { useWorkspaceDuplication } from "./useWorkspaceDuplication"; -import { MockWorkspace } from "testHelpers/entities"; -import CreateWorkspacePage from "./CreateWorkspacePage"; +import type { Workspace } from "api/typesGenerated"; +import * as M from "testHelpers/entities"; import { renderHookWithAuth } from "testHelpers/renderHelpers"; +import CreateWorkspacePage from "./CreateWorkspacePage"; +import { useWorkspaceDuplication } from "./useWorkspaceDuplication"; function render(workspace?: Workspace) { return renderHookWithAuth( @@ -34,7 +33,7 @@ async function performNavigation( return waitFor(() => { expect(router.state.location.pathname).toEqual( - `/templates/${MockWorkspace.template_name}/workspace`, + `/templates/${M.MockWorkspace.template_name}/workspace`, ); }); } @@ -51,19 +50,19 @@ describe(`${useWorkspaceDuplication.name}`, () => { }); it("Will become ready when workspace is provided and build params are successfully fetched", async () => { - const { result } = await render(MockWorkspace); + const { result } = await render(M.MockWorkspace); expect(result.current.isDuplicationReady).toBe(false); await waitFor(() => expect(result.current.isDuplicationReady).toBe(true)); }); it("Is able to navigate the user to the workspace creation page", async () => { - const { result, router } = await render(MockWorkspace); + const { result, router } = await render(M.MockWorkspace); await performNavigation(result, router); }); test("Navigating populates the URL search params with the workspace's build params", async () => { - const { result, router } = await render(MockWorkspace); + const { result, router } = await render(M.MockWorkspace); await performNavigation(result, router); const parsedParams = new URLSearchParams(router.state.location.search); @@ -82,14 +81,14 @@ describe(`${useWorkspaceDuplication.name}`, () => { }); test("Navigating appends other necessary metadata to the search params", async () => { - const { result, router } = await render(MockWorkspace); + const { result, router } = await render(M.MockWorkspace); await performNavigation(result, router); const parsedParams = new URLSearchParams(router.state.location.search); const extraMetadataEntries = [ ["mode", "duplicate"], - ["name", `${MockWorkspace.name}-copy`], - ["version", MockWorkspace.template_active_version_id], + ["name", `${M.MockWorkspace.name}-copy`], + ["version", M.MockWorkspace.template_active_version_id], ] as const; for (const [key, value] of extraMetadataEntries) { diff --git a/site/src/pages/CreateWorkspacePage/useWorkspaceDuplication.ts b/site/src/pages/CreateWorkspacePage/useWorkspaceDuplication.ts index c1777eb3d2..042eb4f6ce 100644 --- a/site/src/pages/CreateWorkspacePage/useWorkspaceDuplication.ts +++ b/site/src/pages/CreateWorkspacePage/useWorkspaceDuplication.ts @@ -1,9 +1,9 @@ import { useCallback } from "react"; import { useQuery } from "react-query"; import { useNavigate } from "react-router-dom"; -import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated"; import { workspaceBuildParameters } from "api/queries/workspaceBuilds"; -import { type CreateWorkspaceMode } from "./CreateWorkspacePage"; +import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated"; +import type { CreateWorkspaceMode } from "./CreateWorkspacePage"; function getDuplicationUrlParams( workspaceParams: readonly WorkspaceBuildParameter[], diff --git a/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPage.tsx b/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPage.tsx index fe5bd57fc4..2f05eacb9a 100644 --- a/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPage.tsx @@ -1,12 +1,12 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQueryClient } from "react-query"; +import { getErrorMessage } from "api/errors"; +import { updateAppearance } from "api/queries/appearance"; import type { UpdateAppearanceConfig } from "api/typesGenerated"; +import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; import { useDashboard } from "modules/dashboard/useDashboard"; import { pageTitle } from "utils/page"; -import { updateAppearance } from "api/queries/appearance"; -import { getErrorMessage } from "api/errors"; -import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; import { AppearanceSettingsPageView } from "./AppearanceSettingsPageView"; // ServiceBanner is unlike the other Deployment Settings pages because it diff --git a/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.stories.tsx index 92aed8f7d1..60e0581ddc 100644 --- a/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.stories.tsx @@ -1,5 +1,5 @@ -import { AppearanceSettingsPageView } from "./AppearanceSettingsPageView"; import type { Meta, StoryObj } from "@storybook/react"; +import { AppearanceSettingsPageView } from "./AppearanceSettingsPageView"; const meta: Meta = { title: "pages/DeploySettingsPage/AppearanceSettingsPageView", diff --git a/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx index bcfaee2d1c..07203567a0 100644 --- a/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/AppearanceSettingsPage/AppearanceSettingsPageView.tsx @@ -1,13 +1,13 @@ -import InputAdornment from "@mui/material/InputAdornment"; +import { useTheme } from "@emotion/react"; import Button from "@mui/material/Button"; import FormControlLabel from "@mui/material/FormControlLabel"; +import InputAdornment from "@mui/material/InputAdornment"; +import Link from "@mui/material/Link"; import Switch from "@mui/material/Switch"; import TextField from "@mui/material/TextField"; -import Link from "@mui/material/Link"; -import { useTheme } from "@emotion/react"; +import { useFormik } from "formik"; import { type FC, useState } from "react"; import { BlockPicker } from "react-color"; -import { useFormik } from "formik"; import type { UpdateAppearanceConfig } from "api/typesGenerated"; import { Badges, @@ -16,10 +16,10 @@ import { EntitledBadge, } from "components/Badges/Badges"; import { Stack } from "components/Stack/Stack"; -import { getFormHelpers } from "utils/formUtils"; import colors from "theme/tailwindColors"; -import { Header } from "../Header"; +import { getFormHelpers } from "utils/formUtils"; import { Fieldset } from "../Fieldset"; +import { Header } from "../Header"; export type AppearanceSettingsPageViewProps = { appearance: UpdateAppearanceConfig; diff --git a/site/src/pages/DeploySettingsPage/DeploySettingsLayout.tsx b/site/src/pages/DeploySettingsPage/DeploySettingsLayout.tsx index 96a2ab6fcd..e693b4f587 100644 --- a/site/src/pages/DeploySettingsPage/DeploySettingsLayout.tsx +++ b/site/src/pages/DeploySettingsPage/DeploySettingsLayout.tsx @@ -1,13 +1,13 @@ import { createContext, type FC, Suspense, useContext } from "react"; import { useQuery } from "react-query"; import { Outlet } from "react-router-dom"; -import { DeploymentConfig } from "api/api"; +import type { DeploymentConfig } from "api/api"; import { deploymentConfig } from "api/queries/deployment"; -import { RequirePermission } from "contexts/auth/RequirePermission"; -import { usePermissions } from "contexts/auth/usePermissions"; import { Loader } from "components/Loader/Loader"; import { Margins } from "components/Margins/Margins"; import { Stack } from "components/Stack/Stack"; +import { RequirePermission } from "contexts/auth/RequirePermission"; +import { usePermissions } from "contexts/auth/usePermissions"; import { Sidebar } from "./Sidebar"; type DeploySettingsContextValue = { diff --git a/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPage.tsx b/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPage.tsx index 2c214875a9..ada99d128c 100644 --- a/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPage.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { pageTitle } from "utils/page"; import { useDeploySettings } from "../DeploySettingsLayout"; diff --git a/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPageView.stories.tsx index 311d20109e..22a5714051 100644 --- a/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPageView.stories.tsx @@ -1,5 +1,5 @@ -import { ExternalAuthSettingsPageView } from "./ExternalAuthSettingsPageView"; import type { Meta, StoryObj } from "@storybook/react"; +import { ExternalAuthSettingsPageView } from "./ExternalAuthSettingsPageView"; const meta: Meta = { title: "pages/DeploySettingsPage/ExternalAuthSettingsPageView", diff --git a/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPageView.tsx index 6e93f0002d..8edb242860 100644 --- a/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/ExternalAuthSettingsPage/ExternalAuthSettingsPageView.tsx @@ -1,16 +1,16 @@ import { css } from "@emotion/react"; -import { type FC } from "react"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; +import type { FC } from "react"; import type { DeploymentValues, ExternalAuthConfig } from "api/typesGenerated"; import { Alert } from "components/Alert/Alert"; import { EnterpriseBadge } from "components/Badges/Badges"; -import { Header } from "../Header"; import { docs } from "utils/docs"; +import { Header } from "../Header"; export type ExternalAuthSettingsPageViewProps = { config: DeploymentValues; diff --git a/site/src/pages/DeploySettingsPage/Fieldset.tsx b/site/src/pages/DeploySettingsPage/Fieldset.tsx index d3baea71a3..d91ab95f23 100644 --- a/site/src/pages/DeploySettingsPage/Fieldset.tsx +++ b/site/src/pages/DeploySettingsPage/Fieldset.tsx @@ -1,6 +1,6 @@ -import type { FC, ReactNode, FormEventHandler } from "react"; -import Button from "@mui/material/Button"; import { type CSSObject, useTheme } from "@emotion/react"; +import Button from "@mui/material/Button"; +import type { FC, ReactNode, FormEventHandler } from "react"; interface FieldsetProps { children: ReactNode; diff --git a/site/src/pages/DeploySettingsPage/GeneralSettingsPage/ChartSection.tsx b/site/src/pages/DeploySettingsPage/GeneralSettingsPage/ChartSection.tsx index 298681706b..0ee6af26da 100644 --- a/site/src/pages/DeploySettingsPage/GeneralSettingsPage/ChartSection.tsx +++ b/site/src/pages/DeploySettingsPage/GeneralSettingsPage/ChartSection.tsx @@ -1,6 +1,6 @@ import { useTheme } from "@emotion/react"; import Paper from "@mui/material/Paper"; -import { type HTMLProps, type ReactNode, type FC } from "react"; +import type { FC, HTMLProps, ReactNode } from "react"; export interface ChartSectionProps { /** diff --git a/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPage.tsx b/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPage.tsx index dfbff8789d..4f9f627a0b 100644 --- a/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPage.tsx @@ -1,10 +1,10 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; -import { pageTitle } from "utils/page"; import { deploymentDAUs } from "api/queries/deployment"; import { entitlements } from "api/queries/entitlements"; import { availableExperiments } from "api/queries/experiments"; +import { pageTitle } from "utils/page"; import { useDeploySettings } from "../DeploySettingsLayout"; import { GeneralSettingsPageView } from "./GeneralSettingsPageView"; diff --git a/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPageView.stories.tsx index 836ef020c7..c945ef9381 100644 --- a/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPageView.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { mockApiError, MockDeploymentDAUResponse, diff --git a/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPageView.tsx index 9fab366a2a..210c496c39 100644 --- a/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/GeneralSettingsPage/GeneralSettingsPageView.tsx @@ -1,21 +1,21 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type { ClibaseOption, DAUsResponse, Entitlements, Experiments, } from "api/typesGenerated"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; import { ActiveUserChart, ActiveUsersTitle, } from "components/ActiveUserChart/ActiveUserChart"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Stack } from "components/Stack/Stack"; +import { useDeploymentOptions } from "utils/deployOptions"; +import { docs } from "utils/docs"; import { Header } from "../Header"; import OptionsTable from "../OptionsTable"; import { ChartSection } from "./ChartSection"; -import { useDeploymentOptions } from "utils/deployOptions"; -import { docs } from "utils/docs"; export type GeneralSettingsPageViewProps = { deploymentOptions: ClibaseOption[]; diff --git a/site/src/pages/DeploySettingsPage/Header.tsx b/site/src/pages/DeploySettingsPage/Header.tsx index 2fbb31bd02..f84c35d518 100644 --- a/site/src/pages/DeploySettingsPage/Header.tsx +++ b/site/src/pages/DeploySettingsPage/Header.tsx @@ -1,7 +1,7 @@ -import Button from "@mui/material/Button"; -import LaunchOutlined from "@mui/icons-material/LaunchOutlined"; -import type { FC, ReactNode } from "react"; import { useTheme } from "@emotion/react"; +import LaunchOutlined from "@mui/icons-material/LaunchOutlined"; +import Button from "@mui/material/Button"; +import type { FC, ReactNode } from "react"; import { Stack } from "components/Stack/Stack"; interface HeaderProps { diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/AddNewLicensePage.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/AddNewLicensePage.tsx index 1abca04845..98758f22f7 100644 --- a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/AddNewLicensePage.tsx +++ b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/AddNewLicensePage.tsx @@ -1,11 +1,11 @@ +import type { FC } from "react"; +import { Helmet } from "react-helmet-async"; import { useMutation } from "react-query"; +import { useNavigate } from "react-router-dom"; import { createLicense } from "api/api"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; -import { FC } from "react"; -import { useNavigate } from "react-router-dom"; -import { AddNewLicensePageView } from "./AddNewLicensePageView"; import { pageTitle } from "utils/page"; -import { Helmet } from "react-helmet-async"; +import { AddNewLicensePageView } from "./AddNewLicensePageView"; const AddNewLicensePage: FC = () => { const navigate = useNavigate(); diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/AddNewLicensePageView.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/AddNewLicensePageView.tsx index 2da53d75d3..7e7be4aa97 100644 --- a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/AddNewLicensePageView.tsx +++ b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/AddNewLicensePageView.tsx @@ -1,15 +1,15 @@ +import KeyboardArrowLeft from "@mui/icons-material/KeyboardArrowLeft"; import Button from "@mui/material/Button"; import TextField from "@mui/material/TextField"; -import KeyboardArrowLeft from "@mui/icons-material/KeyboardArrowLeft"; -import { type FC } from "react"; +import type { FC } from "react"; import { Link as RouterLink } from "react-router-dom"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { FileUpload } from "components/FileUpload/FileUpload"; import { displayError } from "components/GlobalSnackbar/utils"; import { Stack } from "components/Stack/Stack"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { DividerWithText } from "./DividerWithText"; import { Fieldset } from "../Fieldset"; import { Header } from "../Header"; +import { DividerWithText } from "./DividerWithText"; type AddNewLicenseProps = { onSaveLicenseKey: (license: string) => void; diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/DividerWithText.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/DividerWithText.tsx index 4fd1c5e313..7ee07803b8 100644 --- a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/DividerWithText.tsx +++ b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/DividerWithText.tsx @@ -1,5 +1,5 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC, type PropsWithChildren } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC, PropsWithChildren } from "react"; export const DividerWithText: FC = ({ children }) => { return ( diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.test.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.test.tsx index 8f8a980628..6c5a114eaf 100644 --- a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.test.tsx +++ b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.test.tsx @@ -1,7 +1,7 @@ import { screen } from "@testing-library/react"; +import { MockLicenseResponse } from "testHelpers/entities"; import { render } from "testHelpers/renderHelpers"; import { LicenseCard } from "./LicenseCard"; -import { MockLicenseResponse } from "testHelpers/entities"; describe("LicenseCard", () => { it("renders (smoke test)", async () => { diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.tsx index 07f199a507..e22330e663 100644 --- a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.tsx +++ b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicenseCard.tsx @@ -1,10 +1,10 @@ -import { type CSSObject, type Interpolation, type Theme } from "@emotion/react"; +import type { CSSObject, Interpolation, Theme } from "@emotion/react"; import Button from "@mui/material/Button"; import Paper from "@mui/material/Paper"; +import { compareAsc } from "date-fns"; import dayjs from "dayjs"; import { type FC, useState } from "react"; -import { compareAsc } from "date-fns"; -import { type GetLicensesResponse } from "api/api"; +import type { GetLicensesResponse } from "api/api"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { Pill } from "components/Pill/Pill"; import { Stack } from "components/Stack/Stack"; diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPage.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPage.tsx index 16420749e7..8f172cf115 100644 --- a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPage.tsx @@ -1,14 +1,14 @@ -import { useMutation, useQuery, useQueryClient } from "react-query"; -import { getLicenses, removeLicense } from "api/api"; -import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; -import { FC, useEffect } from "react"; +import { type FC, useEffect } from "react"; import { Helmet } from "react-helmet-async"; +import { useMutation, useQuery, useQueryClient } from "react-query"; import { useSearchParams } from "react-router-dom"; import useToggle from "react-use/lib/useToggle"; -import { pageTitle } from "utils/page"; -import LicensesSettingsPageView from "./LicensesSettingsPageView"; +import { getLicenses, removeLicense } from "api/api"; import { getErrorMessage } from "api/errors"; import { entitlements, refreshEntitlements } from "api/queries/entitlements"; +import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; +import { pageTitle } from "utils/page"; +import LicensesSettingsPageView from "./LicensesSettingsPageView"; const LicensesSettingsPage: FC = () => { const queryClient = useQueryClient(); diff --git a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx index 896417f903..08c2db5862 100644 --- a/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/LicensesSettingsPage/LicensesSettingsPageView.tsx @@ -1,19 +1,19 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; -import Button from "@mui/material/Button"; -import Skeleton from "@mui/material/Skeleton"; import AddIcon from "@mui/icons-material/AddOutlined"; import RefreshIcon from "@mui/icons-material/Refresh"; -import MuiLink from "@mui/material/Link"; -import Tooltip from "@mui/material/Tooltip"; import LoadingButton from "@mui/lab/LoadingButton"; -import { type FC } from "react"; +import Button from "@mui/material/Button"; +import MuiLink from "@mui/material/Link"; +import Skeleton from "@mui/material/Skeleton"; +import Tooltip from "@mui/material/Tooltip"; +import type { FC } from "react"; import Confetti from "react-confetti"; import { Link } from "react-router-dom"; import useWindowSize from "react-use/lib/useWindowSize"; import type { GetLicensesResponse } from "api/api"; import { Stack } from "components/Stack/Stack"; -import { LicenseCard } from "./LicenseCard"; import { Header } from "../Header"; +import { LicenseCard } from "./LicenseCard"; type Props = { showConfetti: boolean; diff --git a/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPage.tsx b/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPage.tsx index cf53427f2d..1c5832f129 100644 --- a/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPage.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { pageTitle } from "utils/page"; import { useDeploySettings } from "../DeploySettingsLayout"; diff --git a/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.stories.tsx index 4934763532..b3e921e01c 100644 --- a/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.stories.tsx @@ -1,6 +1,6 @@ -import { ClibaseGroup } from "api/typesGenerated"; -import { NetworkSettingsPageView } from "./NetworkSettingsPageView"; import type { Meta, StoryObj } from "@storybook/react"; +import type { ClibaseGroup } from "api/typesGenerated"; +import { NetworkSettingsPageView } from "./NetworkSettingsPageView"; const group: ClibaseGroup = { name: "Networking", diff --git a/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.tsx index bc849f5c1d..6b18a73b54 100644 --- a/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/NetworkSettingsPage/NetworkSettingsPageView.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type { ClibaseOption } from "api/typesGenerated"; import { Badges, EnabledBadge, DisabledBadge } from "components/Badges/Badges"; import { Stack } from "components/Stack/Stack"; diff --git a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/CreateOAuth2AppPage.tsx b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/CreateOAuth2AppPage.tsx index c76ce96f34..bcefd0cd31 100644 --- a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/CreateOAuth2AppPage.tsx +++ b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/CreateOAuth2AppPage.tsx @@ -1,11 +1,11 @@ +import type { FC } from "react"; +import { Helmet } from "react-helmet-async"; import { useMutation, useQueryClient } from "react-query"; +import { useNavigate } from "react-router-dom"; import { postApp } from "api/queries/oauth2"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; -import { FC } from "react"; -import { useNavigate } from "react-router-dom"; -import { CreateOAuth2AppPageView } from "./CreateOAuth2AppPageView"; import { pageTitle } from "utils/page"; -import { Helmet } from "react-helmet-async"; +import { CreateOAuth2AppPageView } from "./CreateOAuth2AppPageView"; const CreateOAuth2AppPage: FC = () => { const navigate = useNavigate(); diff --git a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/CreateOAuth2AppPageView.tsx b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/CreateOAuth2AppPageView.tsx index 6215251885..07553c9143 100644 --- a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/CreateOAuth2AppPageView.tsx +++ b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/CreateOAuth2AppPageView.tsx @@ -1,12 +1,12 @@ -import Button from "@mui/material/Button"; import KeyboardArrowLeft from "@mui/icons-material/KeyboardArrowLeft"; -import { type FC } from "react"; +import Button from "@mui/material/Button"; +import type { FC } from "react"; import { Link } from "react-router-dom"; import type * as TypesGen from "api/typesGenerated"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Stack } from "components/Stack/Stack"; -import { OAuth2AppForm } from "./OAuth2AppForm"; import { Header } from "../Header"; +import { OAuth2AppForm } from "./OAuth2AppForm"; type CreateOAuth2AppProps = { isUpdating: boolean; diff --git a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPage.tsx b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPage.tsx index 16e07632ef..c23b76970a 100644 --- a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPage.tsx +++ b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPage.tsx @@ -1,12 +1,12 @@ -import { useMutation, useQuery, useQueryClient } from "react-query"; -import type * as TypesGen from "api/typesGenerated"; -import * as oauth2 from "api/queries/oauth2"; -import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; -import { FC, useState } from "react"; -import { useNavigate, useParams } from "react-router-dom"; -import { EditOAuth2AppPageView } from "./EditOAuth2AppPageView"; -import { pageTitle } from "utils/page"; +import { type FC, useState } from "react"; import { Helmet } from "react-helmet-async"; +import { useMutation, useQuery, useQueryClient } from "react-query"; +import { useNavigate, useParams } from "react-router-dom"; +import * as oauth2 from "api/queries/oauth2"; +import type * as TypesGen from "api/typesGenerated"; +import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; +import { pageTitle } from "utils/page"; +import { EditOAuth2AppPageView } from "./EditOAuth2AppPageView"; const EditOAuth2AppPage: FC = () => { const navigate = useNavigate(); diff --git a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPageView.tsx b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPageView.tsx index 2a28ad668d..1c905deb65 100644 --- a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPageView.tsx +++ b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/EditOAuth2AppPageView.tsx @@ -1,9 +1,9 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import CopyIcon from "@mui/icons-material/FileCopyOutlined"; import KeyboardArrowLeft from "@mui/icons-material/KeyboardArrowLeft"; -import Divider from "@mui/material/Divider"; import LoadingButton from "@mui/lab/LoadingButton"; import Button from "@mui/material/Button"; +import Divider from "@mui/material/Divider"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; @@ -23,8 +23,8 @@ import { Loader } from "components/Loader/Loader"; import { Stack } from "components/Stack/Stack"; import { TableLoader } from "components/TableLoader/TableLoader"; import { createDayString } from "utils/createDayString"; -import { OAuth2AppForm } from "./OAuth2AppForm"; import { Header } from "../Header"; +import { OAuth2AppForm } from "./OAuth2AppForm"; export type MutatingResource = { updateApp: boolean; diff --git a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppForm.tsx b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppForm.tsx index 6cfa546c41..58b77a675a 100644 --- a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppForm.tsx +++ b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppForm.tsx @@ -1,6 +1,6 @@ import LoadingButton from "@mui/lab/LoadingButton"; import TextField from "@mui/material/TextField"; -import { type FC, type ReactNode } from "react"; +import type { FC, ReactNode } from "react"; import { isApiValidationError, mapApiErrorToFieldErrors } from "api/errors"; import type * as TypesGen from "api/typesGenerated"; import { Stack } from "components/Stack/Stack"; diff --git a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPage.tsx b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPage.tsx index 7077d2f2c7..c45a8cd46f 100644 --- a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPage.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { getApps } from "api/queries/oauth2"; diff --git a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPageView.tsx index 39f1ad6e30..fee462f872 100644 --- a/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/OAuth2AppsSettingsPage/OAuth2AppsSettingsPageView.tsx @@ -8,20 +8,20 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import { type FC } from "react"; +import type { FC } from "react"; import { Link, useNavigate } from "react-router-dom"; import type * as TypesGen from "api/typesGenerated"; -import { AvatarData } from "components/AvatarData/AvatarData"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Avatar } from "components/Avatar/Avatar"; +import { AvatarData } from "components/AvatarData/AvatarData"; import { Badges, DisabledBadge, EnterpriseBadge, EntitledBadge, } from "components/Badges/Badges"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { TableLoader } from "components/TableLoader/TableLoader"; import { Stack } from "components/Stack/Stack"; +import { TableLoader } from "components/TableLoader/TableLoader"; import { useClickableTableRow } from "hooks/useClickableTableRow"; import { Header } from "../Header"; diff --git a/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPage.tsx b/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPage.tsx index 520e8a6b25..668d878353 100644 --- a/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPage.tsx @@ -1,7 +1,7 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; -import { pageTitle } from "utils/page"; import { useDashboard } from "modules/dashboard/useDashboard"; +import { pageTitle } from "utils/page"; import { useDeploySettings } from "../DeploySettingsLayout"; import { ObservabilitySettingsPageView } from "./ObservabilitySettingsPageView"; diff --git a/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.stories.tsx index 122f73b7f7..e3c7ed4c12 100644 --- a/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.stories.tsx @@ -1,6 +1,6 @@ -import { ObservabilitySettingsPageView } from "./ObservabilitySettingsPageView"; import type { Meta, StoryObj } from "@storybook/react"; -import { ClibaseGroup } from "api/typesGenerated"; +import type { ClibaseGroup } from "api/typesGenerated"; +import { ObservabilitySettingsPageView } from "./ObservabilitySettingsPageView"; const group: ClibaseGroup = { name: "Introspection", diff --git a/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.tsx b/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.tsx index bd067fd9e7..75dcb09707 100644 --- a/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/ObservabilitySettingsPage/ObservabilitySettingsPageView.tsx @@ -1,7 +1,5 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type { ClibaseOption } from "api/typesGenerated"; -import { deploymentGroupHasParent } from "utils/deployOptions"; -import { docs } from "utils/docs"; import { Badges, DisabledBadge, @@ -9,6 +7,8 @@ import { EnterpriseBadge, } from "components/Badges/Badges"; import { Stack } from "components/Stack/Stack"; +import { deploymentGroupHasParent } from "utils/deployOptions"; +import { docs } from "utils/docs"; import { Header } from "../Header"; import OptionsTable from "../OptionsTable"; diff --git a/site/src/pages/DeploySettingsPage/Option.tsx b/site/src/pages/DeploySettingsPage/Option.tsx index f022f18a92..de9ead5cb9 100644 --- a/site/src/pages/DeploySettingsPage/Option.tsx +++ b/site/src/pages/DeploySettingsPage/Option.tsx @@ -1,8 +1,8 @@ -import CheckCircleOutlined from "@mui/icons-material/CheckCircleOutlined"; import { css, type Interpolation, type Theme, useTheme } from "@emotion/react"; -import { type FC, type HTMLAttributes, type PropsWithChildren } from "react"; -import { MONOSPACE_FONT_FAMILY } from "theme/constants"; +import CheckCircleOutlined from "@mui/icons-material/CheckCircleOutlined"; +import type { FC, HTMLAttributes, PropsWithChildren } from "react"; import { DisabledBadge, EnabledBadge } from "components/Badges/Badges"; +import { MONOSPACE_FONT_FAMILY } from "theme/constants"; export const OptionName: FC = ({ children }) => { return {children}; diff --git a/site/src/pages/DeploySettingsPage/OptionsTable.tsx b/site/src/pages/DeploySettingsPage/OptionsTable.tsx index d027d27367..2bfcf199bd 100644 --- a/site/src/pages/DeploySettingsPage/OptionsTable.tsx +++ b/site/src/pages/DeploySettingsPage/OptionsTable.tsx @@ -1,11 +1,11 @@ +import { css } from "@emotion/react"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import { type FC } from "react"; -import { css } from "@emotion/react"; +import type { FC } from "react"; import type { ClibaseOption } from "api/typesGenerated"; import { OptionConfig, diff --git a/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPage.tsx b/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPage.tsx index e82f00a4b4..9968349dbf 100644 --- a/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPage.tsx @@ -1,9 +1,9 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; -import { pageTitle } from "utils/page"; import { useDashboard } from "modules/dashboard/useDashboard"; -import { SecuritySettingsPageView } from "./SecuritySettingsPageView"; +import { pageTitle } from "utils/page"; import { useDeploySettings } from "../DeploySettingsLayout"; +import { SecuritySettingsPageView } from "./SecuritySettingsPageView"; const SecuritySettingsPage: FC = () => { const { deploymentValues: deploymentValues } = useDeploySettings(); diff --git a/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.stories.tsx index f866e7d139..f98945f25c 100644 --- a/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.stories.tsx @@ -1,6 +1,6 @@ -import { SecuritySettingsPageView } from "./SecuritySettingsPageView"; import type { Meta, StoryObj } from "@storybook/react"; -import { ClibaseGroup, ClibaseOption } from "api/typesGenerated"; +import type { ClibaseGroup, ClibaseOption } from "api/typesGenerated"; +import { SecuritySettingsPageView } from "./SecuritySettingsPageView"; const group: ClibaseGroup = { name: "Networking", diff --git a/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.tsx b/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.tsx index 032f404970..9b702114b8 100644 --- a/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/SecuritySettingsPage/SecuritySettingsPageView.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type { ClibaseOption } from "api/typesGenerated"; import { Badges, diff --git a/site/src/pages/DeploySettingsPage/Sidebar.tsx b/site/src/pages/DeploySettingsPage/Sidebar.tsx index c7f6961676..15cf879e87 100644 --- a/site/src/pages/DeploySettingsPage/Sidebar.tsx +++ b/site/src/pages/DeploySettingsPage/Sidebar.tsx @@ -1,14 +1,13 @@ import Brush from "@mui/icons-material/Brush"; -import LaunchOutlined from "@mui/icons-material/LaunchOutlined"; -import ApprovalIcon from "@mui/icons-material/VerifiedUserOutlined"; -import LockRounded from "@mui/icons-material/LockOutlined"; -import InsertChartIcon from "@mui/icons-material/InsertChart"; -import Globe from "@mui/icons-material/PublicOutlined"; import HubOutlinedIcon from "@mui/icons-material/HubOutlined"; -import VpnKeyOutlined from "@mui/icons-material/VpnKeyOutlined"; +import InsertChartIcon from "@mui/icons-material/InsertChart"; +import LaunchOutlined from "@mui/icons-material/LaunchOutlined"; +import LockRounded from "@mui/icons-material/LockOutlined"; import MonitorHeartOutlined from "@mui/icons-material/MonitorHeartOutlined"; -// import Token from "@mui/icons-material/Token"; -import { type FC } from "react"; +import Globe from "@mui/icons-material/PublicOutlined"; +import ApprovalIcon from "@mui/icons-material/VerifiedUserOutlined"; +import VpnKeyOutlined from "@mui/icons-material/VpnKeyOutlined"; +import type { FC } from "react"; import { GitIcon } from "components/Icons/GitIcon"; import { Sidebar as BaseSidebar, diff --git a/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPage.tsx b/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPage.tsx index 044ccf344c..2e8876abb5 100644 --- a/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPage.tsx +++ b/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPage.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { pageTitle } from "utils/page"; import { useDeploySettings } from "../DeploySettingsLayout"; diff --git a/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.stories.tsx b/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.stories.tsx index 700ec926df..e599945453 100644 --- a/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.stories.tsx +++ b/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.stories.tsx @@ -1,6 +1,6 @@ -import { ClibaseGroup } from "api/typesGenerated"; -import { UserAuthSettingsPageView } from "./UserAuthSettingsPageView"; import type { Meta, StoryObj } from "@storybook/react"; +import type { ClibaseGroup } from "api/typesGenerated"; +import { UserAuthSettingsPageView } from "./UserAuthSettingsPageView"; const oidcGroup: ClibaseGroup = { name: "OIDC", diff --git a/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.tsx b/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.tsx index 5e4349c75c..85f253f5ed 100644 --- a/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.tsx +++ b/site/src/pages/DeploySettingsPage/UserAuthSettingsPage/UserAuthSettingsPageView.tsx @@ -1,13 +1,13 @@ import type { ClibaseOption } from "api/typesGenerated"; import { Badges, DisabledBadge, EnabledBadge } from "components/Badges/Badges"; import { Stack } from "components/Stack/Stack"; -import { Header } from "../Header"; -import OptionsTable from "../OptionsTable"; import { deploymentGroupHasParent, useDeploymentOptions, } from "utils/deployOptions"; import { docs } from "utils/docs"; +import { Header } from "../Header"; +import OptionsTable from "../OptionsTable"; export type UserAuthSettingsPageViewProps = { options: ClibaseOption[]; diff --git a/site/src/pages/DeploySettingsPage/optionValue.test.ts b/site/src/pages/DeploySettingsPage/optionValue.test.ts index 73a17e4bc4..c379c42aff 100644 --- a/site/src/pages/DeploySettingsPage/optionValue.test.ts +++ b/site/src/pages/DeploySettingsPage/optionValue.test.ts @@ -1,5 +1,5 @@ +import type { ClibaseOption } from "api/typesGenerated"; import { optionValue } from "./optionValue"; -import { ClibaseOption } from "api/typesGenerated"; const defaultOption: ClibaseOption = { name: "", diff --git a/site/src/pages/DeploySettingsPage/optionValue.ts b/site/src/pages/DeploySettingsPage/optionValue.ts index 1deb3a4fe1..e632dfab5a 100644 --- a/site/src/pages/DeploySettingsPage/optionValue.ts +++ b/site/src/pages/DeploySettingsPage/optionValue.ts @@ -1,5 +1,5 @@ -import { ClibaseOption } from "api/typesGenerated"; import { intervalToDuration, formatDuration } from "date-fns"; +import type { ClibaseOption } from "api/typesGenerated"; // optionValue is a helper function to format the value of a specific deployment options export function optionValue( diff --git a/site/src/pages/ExternalAuthPage/ExternalAuthPage.tsx b/site/src/pages/ExternalAuthPage/ExternalAuthPage.tsx index ac818cf848..bd8756c3ed 100644 --- a/site/src/pages/ExternalAuthPage/ExternalAuthPage.tsx +++ b/site/src/pages/ExternalAuthPage/ExternalAuthPage.tsx @@ -1,17 +1,17 @@ import Button from "@mui/material/Button"; -import { useQuery, useQueryClient } from "react-query"; import { isAxiosError } from "axios"; -import { type FC } from "react"; +import type { FC } from "react"; +import { useQuery, useQueryClient } from "react-query"; import { useParams, useSearchParams } from "react-router-dom"; -import { ApiErrorResponse } from "api/errors"; +import type { ApiErrorResponse } from "api/errors"; import { externalAuthDevice, externalAuthProvider, exchangeExternalAuthDevice, } from "api/queries/externalAuth"; -import { usePermissions } from "contexts/auth/usePermissions"; import { SignInLayout } from "components/SignInLayout/SignInLayout"; import { Welcome } from "components/Welcome/Welcome"; +import { usePermissions } from "contexts/auth/usePermissions"; import ExternalAuthPageView from "./ExternalAuthPageView"; const ExternalAuthPage: FC = () => { diff --git a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.stories.tsx b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.stories.tsx index eec8dd76c8..676597bdb4 100644 --- a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.stories.tsx +++ b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.stories.tsx @@ -1,6 +1,6 @@ -import { Meta, StoryFn } from "@storybook/react"; +import type { Meta, StoryFn } from "@storybook/react"; import ExternalAuthPageView, { - ExternalAuthPageViewProps, + type ExternalAuthPageViewProps, } from "./ExternalAuthPageView"; export default { diff --git a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx index 95773089cd..59ec57e76e 100644 --- a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx +++ b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx @@ -1,10 +1,11 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import OpenInNewIcon from "@mui/icons-material/OpenInNew"; import RefreshIcon from "@mui/icons-material/Refresh"; import AlertTitle from "@mui/material/AlertTitle"; import CircularProgress from "@mui/material/CircularProgress"; import Link from "@mui/material/Link"; import Tooltip from "@mui/material/Tooltip"; +import type { FC, ReactNode } from "react"; import type { ApiErrorResponse } from "api/errors"; import type { ExternalAuth, ExternalAuthDevice } from "api/typesGenerated"; import { Alert, AlertDetail } from "components/Alert/Alert"; @@ -12,7 +13,6 @@ import { Avatar } from "components/Avatar/Avatar"; import { CopyButton } from "components/CopyButton/CopyButton"; import { SignInLayout } from "components/SignInLayout/SignInLayout"; import { Welcome } from "components/Welcome/Welcome"; -import { type FC, type ReactNode } from "react"; export interface ExternalAuthPageViewProps { externalAuth: ExternalAuth; diff --git a/site/src/pages/GroupsPage/CreateGroupPage.tsx b/site/src/pages/GroupsPage/CreateGroupPage.tsx index 8804773bb7..e014c8537b 100644 --- a/site/src/pages/GroupsPage/CreateGroupPage.tsx +++ b/site/src/pages/GroupsPage/CreateGroupPage.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQueryClient } from "react-query"; import { useNavigate } from "react-router-dom"; diff --git a/site/src/pages/GroupsPage/CreateGroupPageView.stories.tsx b/site/src/pages/GroupsPage/CreateGroupPageView.stories.tsx index 960a510c00..1d6a214d9a 100644 --- a/site/src/pages/GroupsPage/CreateGroupPageView.stories.tsx +++ b/site/src/pages/GroupsPage/CreateGroupPageView.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { mockApiError } from "testHelpers/entities"; import { CreateGroupPageView } from "./CreateGroupPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/GroupsPage/CreateGroupPageView", diff --git a/site/src/pages/GroupsPage/CreateGroupPageView.tsx b/site/src/pages/GroupsPage/CreateGroupPageView.tsx index 79a3b81f72..5e5d044cc6 100644 --- a/site/src/pages/GroupsPage/CreateGroupPageView.tsx +++ b/site/src/pages/GroupsPage/CreateGroupPageView.tsx @@ -1,8 +1,9 @@ import TextField from "@mui/material/TextField"; import { type FormikTouched, useFormik } from "formik"; -import { type FC } from "react"; +import type { FC } from "react"; import { useNavigate } from "react-router-dom"; import * as Yup from "yup"; +import { isApiValidationError } from "api/errors"; import type { CreateGroupRequest } from "api/typesGenerated"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { FormFooter } from "components/FormFooter/FormFooter"; @@ -11,7 +12,6 @@ import { IconField } from "components/IconField/IconField"; import { Margins } from "components/Margins/Margins"; import { Stack } from "components/Stack/Stack"; import { getFormHelpers, onChangeTrimmed } from "utils/formUtils"; -import { isApiValidationError } from "api/errors"; const validationSchema = Yup.object({ name: Yup.string().required().label("Name"), diff --git a/site/src/pages/GroupsPage/GroupPage.tsx b/site/src/pages/GroupsPage/GroupPage.tsx index a27241f370..f1f3a7bd24 100644 --- a/site/src/pages/GroupsPage/GroupPage.tsx +++ b/site/src/pages/GroupsPage/GroupPage.tsx @@ -1,3 +1,8 @@ +import type { Interpolation, Theme } from "@emotion/react"; +import DeleteOutline from "@mui/icons-material/DeleteOutline"; +import PersonAdd from "@mui/icons-material/PersonAdd"; +import SettingsOutlined from "@mui/icons-material/SettingsOutlined"; +import LoadingButton from "@mui/lab/LoadingButton"; import Button from "@mui/material/Button"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; @@ -5,33 +10,11 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import DeleteOutline from "@mui/icons-material/DeleteOutline"; -import PersonAdd from "@mui/icons-material/PersonAdd"; -import SettingsOutlined from "@mui/icons-material/SettingsOutlined"; -import type { Group, ReducedUser, User } from "api/typesGenerated"; -import { AvatarData } from "components/AvatarData/AvatarData"; -import { DeleteDialog } from "components/Dialogs/DeleteDialog/DeleteDialog"; -import { EmptyState } from "components/EmptyState/EmptyState"; -import { Loader } from "components/Loader/Loader"; -import { Margins } from "components/Margins/Margins"; -import { - PageHeader, - PageHeaderSubtitle, - PageHeaderTitle, -} from "components/PageHeader/PageHeader"; -import { Stack } from "components/Stack/Stack"; -import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; import { type FC, useState } from "react"; import { Helmet } from "react-helmet-async"; -import { Link as RouterLink, useNavigate, useParams } from "react-router-dom"; -import { pageTitle } from "utils/page"; -import { - PaginationStatus, - TableToolbar, -} from "components/TableToolbar/TableToolbar"; -import { UserAvatar } from "components/UserAvatar/UserAvatar"; -import { isEveryoneGroup } from "utils/groups"; import { useMutation, useQuery, useQueryClient } from "react-query"; +import { Link as RouterLink, useNavigate, useParams } from "react-router-dom"; +import { getErrorMessage } from "api/errors"; import { addMember, deleteGroup, @@ -39,11 +22,14 @@ import { groupPermissions, removeMember, } from "api/queries/groups"; +import type { Group, ReducedUser, User } from "api/typesGenerated"; +import { AvatarData } from "components/AvatarData/AvatarData"; +import { DeleteDialog } from "components/Dialogs/DeleteDialog/DeleteDialog"; +import { EmptyState } from "components/EmptyState/EmptyState"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; -import { getErrorMessage } from "api/errors"; import { LastSeen } from "components/LastSeen/LastSeen"; -import { type Interpolation, type Theme } from "@emotion/react"; -import LoadingButton from "@mui/lab/LoadingButton"; +import { Loader } from "components/Loader/Loader"; +import { Margins } from "components/Margins/Margins"; import { MoreMenu, MoreMenuContent, @@ -51,6 +37,20 @@ import { MoreMenuTrigger, ThreeDotsButton, } from "components/MoreMenu/MoreMenu"; +import { + PageHeader, + PageHeaderSubtitle, + PageHeaderTitle, +} from "components/PageHeader/PageHeader"; +import { Stack } from "components/Stack/Stack"; +import { + PaginationStatus, + TableToolbar, +} from "components/TableToolbar/TableToolbar"; +import { UserAutocomplete } from "components/UserAutocomplete/UserAutocomplete"; +import { UserAvatar } from "components/UserAvatar/UserAvatar"; +import { isEveryoneGroup } from "utils/groups"; +import { pageTitle } from "utils/page"; export const GroupPage: FC = () => { const { groupId } = useParams() as { groupId: string }; diff --git a/site/src/pages/GroupsPage/GroupsPage.tsx b/site/src/pages/GroupsPage/GroupsPage.tsx index bb809ca1d2..a26d19e3d7 100644 --- a/site/src/pages/GroupsPage/GroupsPage.tsx +++ b/site/src/pages/GroupsPage/GroupsPage.tsx @@ -3,10 +3,10 @@ import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { getErrorMessage } from "api/errors"; import { groups } from "api/queries/groups"; +import { displayError } from "components/GlobalSnackbar/utils"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { usePermissions } from "contexts/auth/usePermissions"; import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility"; -import { displayError } from "components/GlobalSnackbar/utils"; import { pageTitle } from "utils/page"; import GroupsPageView from "./GroupsPageView"; diff --git a/site/src/pages/GroupsPage/GroupsPageView.stories.tsx b/site/src/pages/GroupsPage/GroupsPageView.stories.tsx index 8143a75d71..705ddd07fb 100644 --- a/site/src/pages/GroupsPage/GroupsPageView.stories.tsx +++ b/site/src/pages/GroupsPage/GroupsPageView.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockGroup } from "testHelpers/entities"; import { GroupsPageView } from "./GroupsPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/GroupsPage", diff --git a/site/src/pages/GroupsPage/GroupsPageView.tsx b/site/src/pages/GroupsPage/GroupsPageView.tsx index a71ffe1867..da87bb6e07 100644 --- a/site/src/pages/GroupsPage/GroupsPageView.tsx +++ b/site/src/pages/GroupsPage/GroupsPageView.tsx @@ -1,30 +1,30 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; +import AddOutlined from "@mui/icons-material/AddOutlined"; +import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight"; +import AvatarGroup from "@mui/material/AvatarGroup"; import Button from "@mui/material/Button"; +import Skeleton from "@mui/material/Skeleton"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import Skeleton from "@mui/material/Skeleton"; -import AddOutlined from "@mui/icons-material/AddOutlined"; -import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight"; -import AvatarGroup from "@mui/material/AvatarGroup"; +import type { FC } from "react"; +import { Link as RouterLink, useNavigate } from "react-router-dom"; +import type { Group } from "api/typesGenerated"; import { AvatarData } from "components/AvatarData/AvatarData"; +import { AvatarDataSkeleton } from "components/AvatarData/AvatarDataSkeleton"; import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; import { EmptyState } from "components/EmptyState/EmptyState"; +import { GroupAvatar } from "components/GroupAvatar/GroupAvatar"; +import { Paywall } from "components/Paywall/Paywall"; import { TableLoaderSkeleton, TableRowSkeleton, } from "components/TableLoader/TableLoader"; import { UserAvatar } from "components/UserAvatar/UserAvatar"; -import { type FC } from "react"; -import { Link as RouterLink, useNavigate } from "react-router-dom"; -import { Paywall } from "components/Paywall/Paywall"; -import type { Group } from "api/typesGenerated"; -import { GroupAvatar } from "components/GroupAvatar/GroupAvatar"; import { docs } from "utils/docs"; -import { AvatarDataSkeleton } from "components/AvatarData/AvatarDataSkeleton"; export type GroupsPageViewProps = { groups: Group[] | undefined; diff --git a/site/src/pages/GroupsPage/SettingsGroupPage.tsx b/site/src/pages/GroupsPage/SettingsGroupPage.tsx index c42468062d..a84212079f 100644 --- a/site/src/pages/GroupsPage/SettingsGroupPage.tsx +++ b/site/src/pages/GroupsPage/SettingsGroupPage.tsx @@ -1,12 +1,12 @@ -import { FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; -import { useNavigate, useParams } from "react-router-dom"; -import { pageTitle } from "utils/page"; -import SettingsGroupPageView from "./SettingsGroupPageView"; import { useMutation, useQuery, useQueryClient } from "react-query"; +import { useNavigate, useParams } from "react-router-dom"; +import { getErrorMessage } from "api/errors"; import { group, patchGroup } from "api/queries/groups"; import { displayError } from "components/GlobalSnackbar/utils"; -import { getErrorMessage } from "api/errors"; +import { pageTitle } from "utils/page"; +import SettingsGroupPageView from "./SettingsGroupPageView"; export const SettingsGroupPage: FC = () => { const { groupId } = useParams() as { groupId: string }; diff --git a/site/src/pages/GroupsPage/SettingsGroupPageView.stories.tsx b/site/src/pages/GroupsPage/SettingsGroupPageView.stories.tsx index a40740db73..48463eb1fc 100644 --- a/site/src/pages/GroupsPage/SettingsGroupPageView.stories.tsx +++ b/site/src/pages/GroupsPage/SettingsGroupPageView.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockGroup } from "testHelpers/entities"; import { SettingsGroupPageView } from "./SettingsGroupPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/GroupsPage/SettingsGroupPageView", diff --git a/site/src/pages/GroupsPage/SettingsGroupPageView.tsx b/site/src/pages/GroupsPage/SettingsGroupPageView.tsx index 33410e87b8..6998268ef7 100644 --- a/site/src/pages/GroupsPage/SettingsGroupPageView.tsx +++ b/site/src/pages/GroupsPage/SettingsGroupPageView.tsx @@ -1,19 +1,19 @@ import TextField from "@mui/material/TextField"; -import { Group } from "api/typesGenerated"; +import { useFormik } from "formik"; +import type { FC } from "react"; +import * as Yup from "yup"; +import type { Group } from "api/typesGenerated"; import { FormFooter } from "components/FormFooter/FormFooter"; import { FullPageForm } from "components/FullPageForm/FullPageForm"; -import { Loader } from "components/Loader/Loader"; import { IconField } from "components/IconField/IconField"; +import { Loader } from "components/Loader/Loader"; import { Margins } from "components/Margins/Margins"; -import { useFormik } from "formik"; -import { FC } from "react"; +import { Stack } from "components/Stack/Stack"; import { getFormHelpers, nameValidator, onChangeTrimmed, } from "utils/formUtils"; -import * as Yup from "yup"; -import { Stack } from "components/Stack/Stack"; import { isEveryoneGroup } from "utils/groups"; type FormData = { diff --git a/site/src/pages/HealthPage/AccessURLPage.stories.tsx b/site/src/pages/HealthPage/AccessURLPage.stories.tsx index 9940517a75..5d937a8efc 100644 --- a/site/src/pages/HealthPage/AccessURLPage.stories.tsx +++ b/site/src/pages/HealthPage/AccessURLPage.stories.tsx @@ -1,9 +1,9 @@ -import { StoryObj } from "@storybook/react"; +import type { StoryObj } from "@storybook/react"; +import { HEALTH_QUERY_KEY } from "api/queries/debug"; +import type { HealthcheckReport } from "api/typesGenerated"; +import { MockHealth } from "testHelpers/entities"; import { AccessURLPage } from "./AccessURLPage"; import { generateMeta } from "./storybook"; -import { HEALTH_QUERY_KEY } from "api/queries/debug"; -import { MockHealth } from "testHelpers/entities"; -import { HealthcheckReport } from "api/typesGenerated"; const meta = { title: "pages/Health/AccessURL", diff --git a/site/src/pages/HealthPage/AccessURLPage.tsx b/site/src/pages/HealthPage/AccessURLPage.tsx index 3726c48798..e58b8b5fe5 100644 --- a/site/src/pages/HealthPage/AccessURLPage.tsx +++ b/site/src/pages/HealthPage/AccessURLPage.tsx @@ -1,4 +1,8 @@ +import { Helmet } from "react-helmet-async"; import { useOutletContext } from "react-router-dom"; +import type { HealthcheckReport } from "api/typesGenerated"; +import { Alert } from "components/Alert/Alert"; +import { pageTitle } from "utils/page"; import { Header, HeaderTitle, @@ -9,10 +13,6 @@ import { GridDataValue, HealthyDot, } from "./Content"; -import { HealthcheckReport } from "api/typesGenerated"; -import { Alert } from "components/Alert/Alert"; -import { Helmet } from "react-helmet-async"; -import { pageTitle } from "utils/page"; import { DismissWarningButton } from "./DismissWarningButton"; export const AccessURLPage = () => { diff --git a/site/src/pages/HealthPage/Content.tsx b/site/src/pages/HealthPage/Content.tsx index a55a5f6b51..20e4764151 100644 --- a/site/src/pages/HealthPage/Content.tsx +++ b/site/src/pages/HealthPage/Content.tsx @@ -1,24 +1,25 @@ /* eslint-disable jsx-a11y/heading-has-content -- infer from props */ -import { - ComponentProps, - HTMLAttributes, - ReactElement, - cloneElement, - forwardRef, -} from "react"; -import CheckCircleOutlined from "@mui/icons-material/CheckCircleOutlined"; -import ErrorOutline from "@mui/icons-material/ErrorOutline"; -import { healthyColor } from "./healthyColor"; -import { docs } from "utils/docs"; import { css } from "@emotion/css"; -import DoNotDisturbOnOutlined from "@mui/icons-material/DoNotDisturbOnOutlined"; -import { HealthMessage, HealthSeverity } from "api/typesGenerated"; -import Link from "@mui/material/Link"; import { useTheme } from "@emotion/react"; +import CheckCircleOutlined from "@mui/icons-material/CheckCircleOutlined"; +import DoNotDisturbOnOutlined from "@mui/icons-material/DoNotDisturbOnOutlined"; +import ErrorOutline from "@mui/icons-material/ErrorOutline"; +import Link from "@mui/material/Link"; +import { + cloneElement, + type ComponentProps, + type FC, + forwardRef, + type HTMLAttributes, + type ReactElement, +} from "react"; +import type { HealthCode, HealthSeverity } from "api/typesGenerated"; +import { docs } from "utils/docs"; +import { healthyColor } from "./healthyColor"; const CONTENT_PADDING = 36; -export const Header = (props: HTMLAttributes) => { +export const Header: FC> = (props) => { return (
) => { ); }; -export const HeaderTitle = (props: HTMLAttributes) => { +export const HeaderTitle: FC> = (props) => { return (

) => { ); }; -export const HealthIcon = ({ - size, - severity, -}: { +interface HealthIconProps { size: number; severity: HealthSeverity; -}) => { +} + +export const HealthIcon: FC = ({ size, severity }) => { const theme = useTheme(); const color = healthyColor(theme, severity); const Icon = severity === "error" ? ErrorOutline : CheckCircleOutlined; @@ -63,7 +63,11 @@ export const HealthIcon = ({ return ; }; -export const HealthyDot = ({ severity }: { severity: HealthSeverity }) => { +interface HealthyDotProps { + severity: HealthSeverity; +} + +export const HealthyDot: FC = ({ severity }) => { const theme = useTheme(); return ( @@ -78,7 +82,7 @@ export const HealthyDot = ({ severity }: { severity: HealthSeverity }) => { ); }; -export const Main = (props: HTMLAttributes) => { +export const Main: FC> = (props) => { return (
) => { ); }; -export const GridData = (props: HTMLAttributes) => { +export const GridData: FC> = (props) => { return (
) => { ); }; -export const GridDataLabel = (props: HTMLAttributes) => { +export const GridDataLabel: FC> = (props) => { const theme = useTheme(); return ( ) => { ); }; -export const GridDataValue = (props: HTMLAttributes) => { +export const GridDataValue: FC> = (props) => { const theme = useTheme(); return ( ) => { ); }; -export const SectionLabel = (props: HTMLAttributes) => { +export const SectionLabel: FC> = (props) => { return (

, "icon" | "value"> & { value: boolean; }; -export const BooleanPill = (props: BooleanPillProps) => { - const { value, children, ...divProps } = props; +export const BooleanPill: FC = ({ + value, + children, + ...divProps +}) => { const theme = useTheme(); const color = value ? theme.palette.success.light : theme.palette.error.light; @@ -209,9 +216,8 @@ export const BooleanPill = (props: BooleanPillProps) => { type LogsProps = { lines: string[] } & HTMLAttributes; -export const Logs = (props: LogsProps) => { +export const Logs: FC = ({ lines, ...divProps }) => { const theme = useTheme(); - const { lines, ...divProps } = props; return (
{ ); }; -export const HealthMessageDocsLink = (msg: HealthMessage) => { +interface HealthMessageDocsLinkProps { + code: HealthCode; +} + +export const HealthMessageDocsLink: FC = ({ + code, +}) => { return ( - Docs for {msg.code} + Docs for {code} ); }; diff --git a/site/src/pages/HealthPage/DERPPage.stories.tsx b/site/src/pages/HealthPage/DERPPage.stories.tsx index 194552361f..786f6da859 100644 --- a/site/src/pages/HealthPage/DERPPage.stories.tsx +++ b/site/src/pages/HealthPage/DERPPage.stories.tsx @@ -1,4 +1,4 @@ -import { StoryObj, Meta } from "@storybook/react"; +import type { StoryObj, Meta } from "@storybook/react"; import { DERPPage } from "./DERPPage"; import { generateMeta } from "./storybook"; diff --git a/site/src/pages/HealthPage/DERPPage.tsx b/site/src/pages/HealthPage/DERPPage.tsx index fc6c4e14f8..9f0033bfcf 100644 --- a/site/src/pages/HealthPage/DERPPage.tsx +++ b/site/src/pages/HealthPage/DERPPage.tsx @@ -1,16 +1,16 @@ +import { useTheme } from "@emotion/react"; +import LocationOnOutlined from "@mui/icons-material/LocationOnOutlined"; +import Button from "@mui/material/Button"; +import type { FC } from "react"; +import { Helmet } from "react-helmet-async"; import { Link, useOutletContext } from "react-router-dom"; import type { HealthMessage, HealthSeverity, HealthcheckReport, } from "api/typesGenerated"; -import Button from "@mui/material/Button"; -import LocationOnOutlined from "@mui/icons-material/LocationOnOutlined"; import { Alert } from "components/Alert/Alert"; -import { Helmet } from "react-helmet-async"; import { pageTitle } from "utils/page"; -import { useTheme } from "@emotion/react"; -import { type FC } from "react"; import { Header, HeaderTitle, diff --git a/site/src/pages/HealthPage/DERPRegionPage.stories.tsx b/site/src/pages/HealthPage/DERPRegionPage.stories.tsx index d462403be0..511048bee7 100644 --- a/site/src/pages/HealthPage/DERPRegionPage.stories.tsx +++ b/site/src/pages/HealthPage/DERPRegionPage.stories.tsx @@ -1,6 +1,6 @@ -import { StoryObj, Meta } from "@storybook/react"; -import { DERPRegionPage } from "./DERPRegionPage"; +import type { StoryObj, Meta } from "@storybook/react"; import { MockHealth } from "testHelpers/entities"; +import { DERPRegionPage } from "./DERPRegionPage"; import { generateMeta } from "./storybook"; const firstRegionId = Object.values(MockHealth.derp.regions)[0].region diff --git a/site/src/pages/HealthPage/DERPRegionPage.tsx b/site/src/pages/HealthPage/DERPRegionPage.tsx index 211d8a8f30..39f37b4455 100644 --- a/site/src/pages/HealthPage/DERPRegionPage.tsx +++ b/site/src/pages/HealthPage/DERPRegionPage.tsx @@ -1,9 +1,9 @@ -import Tooltip from "@mui/material/Tooltip"; +import { type Interpolation, type Theme, useTheme } from "@emotion/react"; +import ArrowBackOutlined from "@mui/icons-material/ArrowBackOutlined"; import CodeOutlined from "@mui/icons-material/CodeOutlined"; import TagOutlined from "@mui/icons-material/TagOutlined"; -import ArrowBackOutlined from "@mui/icons-material/ArrowBackOutlined"; -import { Interpolation, Theme, useTheme } from "@emotion/react"; -import { type FC } from "react"; +import Tooltip from "@mui/material/Tooltip"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { Link, useOutletContext, useParams } from "react-router-dom"; import type { @@ -11,8 +11,8 @@ import type { HealthSeverity, HealthcheckReport, } from "api/typesGenerated"; -import { getLatencyColor } from "utils/latency"; import { Alert } from "components/Alert/Alert"; +import { getLatencyColor } from "utils/latency"; import { pageTitle } from "utils/page"; import { Header, diff --git a/site/src/pages/HealthPage/DatabasePage.stories.tsx b/site/src/pages/HealthPage/DatabasePage.stories.tsx index f2ec5c5d0c..c354e501ac 100644 --- a/site/src/pages/HealthPage/DatabasePage.stories.tsx +++ b/site/src/pages/HealthPage/DatabasePage.stories.tsx @@ -1,4 +1,4 @@ -import { StoryObj, Meta } from "@storybook/react"; +import type { StoryObj, Meta } from "@storybook/react"; import { DatabasePage } from "./DatabasePage"; import { generateMeta } from "./storybook"; diff --git a/site/src/pages/HealthPage/DatabasePage.tsx b/site/src/pages/HealthPage/DatabasePage.tsx index 1bd5a0a15e..e094ee6a1a 100644 --- a/site/src/pages/HealthPage/DatabasePage.tsx +++ b/site/src/pages/HealthPage/DatabasePage.tsx @@ -1,4 +1,8 @@ +import { Helmet } from "react-helmet-async"; import { useOutletContext } from "react-router-dom"; +import type { HealthcheckReport } from "api/typesGenerated"; +import { Alert } from "components/Alert/Alert"; +import { pageTitle } from "utils/page"; import { Header, HeaderTitle, @@ -9,10 +13,6 @@ import { GridDataValue, HealthyDot, } from "./Content"; -import { HealthcheckReport } from "api/typesGenerated"; -import { Alert } from "components/Alert/Alert"; -import { Helmet } from "react-helmet-async"; -import { pageTitle } from "utils/page"; import { DismissWarningButton } from "./DismissWarningButton"; export const DatabasePage = () => { diff --git a/site/src/pages/HealthPage/DismissWarningButton.tsx b/site/src/pages/HealthPage/DismissWarningButton.tsx index 558ba04f52..a24a066dda 100644 --- a/site/src/pages/HealthPage/DismissWarningButton.tsx +++ b/site/src/pages/HealthPage/DismissWarningButton.tsx @@ -1,11 +1,11 @@ -import NotificationOutlined from "@mui/icons-material/NotificationsOutlined"; import NotificationsOffOutlined from "@mui/icons-material/NotificationsOffOutlined"; -import { healthSettings, updateHealthSettings } from "api/queries/debug"; -import { useMutation, useQuery, useQueryClient } from "react-query"; -import { displaySuccess } from "components/GlobalSnackbar/utils"; +import NotificationOutlined from "@mui/icons-material/NotificationsOutlined"; import LoadingButton from "@mui/lab/LoadingButton"; import Skeleton from "@mui/material/Skeleton"; -import { HealthSection } from "api/typesGenerated"; +import { useMutation, useQuery, useQueryClient } from "react-query"; +import { healthSettings, updateHealthSettings } from "api/queries/debug"; +import type { HealthSection } from "api/typesGenerated"; +import { displaySuccess } from "components/GlobalSnackbar/utils"; export const DismissWarningButton = (props: { healthcheck: HealthSection }) => { const queryClient = useQueryClient(); diff --git a/site/src/pages/HealthPage/HealthLayout.tsx b/site/src/pages/HealthPage/HealthLayout.tsx index df8b6fa166..4f3cecd574 100644 --- a/site/src/pages/HealthPage/HealthLayout.tsx +++ b/site/src/pages/HealthPage/HealthLayout.tsx @@ -1,22 +1,22 @@ -import IconButton from "@mui/material/IconButton"; -import Tooltip from "@mui/material/Tooltip"; -import CircularProgress from "@mui/material/CircularProgress"; -import ReplayIcon from "@mui/icons-material/Replay"; -import NotificationsOffOutlined from "@mui/icons-material/NotificationsOffOutlined"; import { cx } from "@emotion/css"; import { useTheme } from "@emotion/react"; +import NotificationsOffOutlined from "@mui/icons-material/NotificationsOffOutlined"; +import ReplayIcon from "@mui/icons-material/Replay"; +import CircularProgress from "@mui/material/CircularProgress"; +import IconButton from "@mui/material/IconButton"; +import Tooltip from "@mui/material/Tooltip"; +import kebabCase from "lodash/fp/kebabCase"; import { type FC, Suspense } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQuery, useQueryClient } from "react-query"; import { NavLink, Outlet } from "react-router-dom"; -import kebabCase from "lodash/fp/kebabCase"; import { health, refreshHealth } from "api/queries/debug"; import type { HealthSeverity } from "api/typesGenerated"; -import { type ClassName, useClassName } from "hooks/useClassName"; -import { pageTitle } from "utils/page"; -import { createDayString } from "utils/createDayString"; -import { DashboardFullPage } from "modules/dashboard/DashboardLayout"; import { Loader } from "components/Loader/Loader"; +import { type ClassName, useClassName } from "hooks/useClassName"; +import { DashboardFullPage } from "modules/dashboard/DashboardLayout"; +import { createDayString } from "utils/createDayString"; +import { pageTitle } from "utils/page"; import { HealthIcon } from "./Content"; export const HealthLayout: FC = () => { diff --git a/site/src/pages/HealthPage/ProvisionerDaemonsPage.stories.tsx b/site/src/pages/HealthPage/ProvisionerDaemonsPage.stories.tsx index b80a20c1ed..8dc1af5e56 100644 --- a/site/src/pages/HealthPage/ProvisionerDaemonsPage.stories.tsx +++ b/site/src/pages/HealthPage/ProvisionerDaemonsPage.stories.tsx @@ -1,4 +1,4 @@ -import { StoryObj, Meta } from "@storybook/react"; +import type { StoryObj, Meta } from "@storybook/react"; import { ProvisionerDaemonsPage } from "./ProvisionerDaemonsPage"; import { generateMeta } from "./storybook"; diff --git a/site/src/pages/HealthPage/ProvisionerDaemonsPage.tsx b/site/src/pages/HealthPage/ProvisionerDaemonsPage.tsx index 4788703ebb..63ee928098 100644 --- a/site/src/pages/HealthPage/ProvisionerDaemonsPage.tsx +++ b/site/src/pages/HealthPage/ProvisionerDaemonsPage.tsx @@ -1,3 +1,18 @@ +import { useTheme } from "@emotion/react"; +import Business from "@mui/icons-material/Business"; +import CloseIcon from "@mui/icons-material/Close"; +import Person from "@mui/icons-material/Person"; +import Sell from "@mui/icons-material/Sell"; +import SwapHoriz from "@mui/icons-material/SwapHoriz"; +import IconButton from "@mui/material/IconButton"; +import Tooltip from "@mui/material/Tooltip"; +import type { FC } from "react"; +import { Helmet } from "react-helmet-async"; +import { useOutletContext } from "react-router-dom"; +import type { HealthcheckReport } from "api/typesGenerated"; +import { Alert } from "components/Alert/Alert"; +import { createDayString } from "utils/createDayString"; +import { pageTitle } from "utils/page"; import { BooleanPill, Header, @@ -7,22 +22,7 @@ import { Main, Pill, } from "./Content"; -import { Helmet } from "react-helmet-async"; -import { pageTitle } from "utils/page"; -import { useTheme } from "@emotion/react"; import { DismissWarningButton } from "./DismissWarningButton"; -import { Alert } from "components/Alert/Alert"; -import type { HealthcheckReport } from "api/typesGenerated"; -import { createDayString } from "utils/createDayString"; -import { type FC } from "react"; -import { useOutletContext } from "react-router-dom"; -import Business from "@mui/icons-material/Business"; -import Person from "@mui/icons-material/Person"; -import SwapHoriz from "@mui/icons-material/SwapHoriz"; -import Tooltip from "@mui/material/Tooltip"; -import Sell from "@mui/icons-material/Sell"; -import CloseIcon from "@mui/icons-material/Close"; -import IconButton from "@mui/material/IconButton"; export const ProvisionerDaemonsPage: FC = () => { const healthStatus = useOutletContext(); diff --git a/site/src/pages/HealthPage/WebsocketPage.stories.tsx b/site/src/pages/HealthPage/WebsocketPage.stories.tsx index d8235d74b6..bb82b87e39 100644 --- a/site/src/pages/HealthPage/WebsocketPage.stories.tsx +++ b/site/src/pages/HealthPage/WebsocketPage.stories.tsx @@ -1,9 +1,9 @@ -import { StoryObj } from "@storybook/react"; -import { WebsocketPage } from "./WebsocketPage"; -import { generateMeta } from "./storybook"; +import type { StoryObj } from "@storybook/react"; import { HEALTH_QUERY_KEY } from "api/queries/debug"; -import { HealthcheckReport } from "api/typesGenerated"; +import type { HealthcheckReport } from "api/typesGenerated"; import { MockHealth } from "testHelpers/entities"; +import { generateMeta } from "./storybook"; +import { WebsocketPage } from "./WebsocketPage"; const meta = { title: "pages/Health/Websocket", diff --git a/site/src/pages/HealthPage/WebsocketPage.tsx b/site/src/pages/HealthPage/WebsocketPage.tsx index 0469e8148d..97fac9e867 100644 --- a/site/src/pages/HealthPage/WebsocketPage.tsx +++ b/site/src/pages/HealthPage/WebsocketPage.tsx @@ -1,4 +1,12 @@ +import { useTheme } from "@emotion/react"; +import CodeOutlined from "@mui/icons-material/CodeOutlined"; +import Tooltip from "@mui/material/Tooltip"; +import { Helmet } from "react-helmet-async"; import { useOutletContext } from "react-router-dom"; +import type { HealthcheckReport } from "api/typesGenerated"; +import { Alert } from "components/Alert/Alert"; +import { MONOSPACE_FONT_FAMILY } from "theme/constants"; +import { pageTitle } from "utils/page"; import { Header, HeaderTitle, @@ -7,14 +15,6 @@ import { Pill, SectionLabel, } from "./Content"; -import { HealthcheckReport } from "api/typesGenerated"; -import CodeOutlined from "@mui/icons-material/CodeOutlined"; -import Tooltip from "@mui/material/Tooltip"; -import { useTheme } from "@emotion/react"; -import { MONOSPACE_FONT_FAMILY } from "theme/constants"; -import { Alert } from "components/Alert/Alert"; -import { pageTitle } from "utils/page"; -import { Helmet } from "react-helmet-async"; import { DismissWarningButton } from "./DismissWarningButton"; export const WebsocketPage = () => { diff --git a/site/src/pages/HealthPage/WorkspaceProxyPage.stories.tsx b/site/src/pages/HealthPage/WorkspaceProxyPage.stories.tsx index 408ba7741c..9cc29a0f24 100644 --- a/site/src/pages/HealthPage/WorkspaceProxyPage.stories.tsx +++ b/site/src/pages/HealthPage/WorkspaceProxyPage.stories.tsx @@ -1,9 +1,9 @@ -import { StoryObj } from "@storybook/react"; -import { WorkspaceProxyPage } from "./WorkspaceProxyPage"; -import { generateMeta } from "./storybook"; -import { HealthcheckReport } from "api/typesGenerated"; +import type { StoryObj } from "@storybook/react"; import { HEALTH_QUERY_KEY } from "api/queries/debug"; +import type { HealthcheckReport } from "api/typesGenerated"; import { MockHealth } from "testHelpers/entities"; +import { generateMeta } from "./storybook"; +import { WorkspaceProxyPage } from "./WorkspaceProxyPage"; const meta = { title: "pages/Health/WorkspaceProxy", diff --git a/site/src/pages/HealthPage/WorkspaceProxyPage.tsx b/site/src/pages/HealthPage/WorkspaceProxyPage.tsx index c2058cc364..ae387874e8 100644 --- a/site/src/pages/HealthPage/WorkspaceProxyPage.tsx +++ b/site/src/pages/HealthPage/WorkspaceProxyPage.tsx @@ -1,4 +1,14 @@ +import { useTheme } from "@emotion/react"; +import PublicOutlined from "@mui/icons-material/PublicOutlined"; +import TagOutlined from "@mui/icons-material/TagOutlined"; +import Tooltip from "@mui/material/Tooltip"; +import type { FC } from "react"; +import { Helmet } from "react-helmet-async"; import { useOutletContext } from "react-router-dom"; +import type { HealthcheckReport } from "api/typesGenerated"; +import { Alert } from "components/Alert/Alert"; +import { createDayString } from "utils/createDayString"; +import { pageTitle } from "utils/page"; import { BooleanPill, Header, @@ -8,16 +18,6 @@ import { Main, Pill, } from "./Content"; -import type { HealthcheckReport } from "api/typesGenerated"; -import { useTheme } from "@emotion/react"; -import { createDayString } from "utils/createDayString"; -import PublicOutlined from "@mui/icons-material/PublicOutlined"; -import Tooltip from "@mui/material/Tooltip"; -import TagOutlined from "@mui/icons-material/TagOutlined"; -import { Alert } from "components/Alert/Alert"; -import { type FC } from "react"; -import { Helmet } from "react-helmet-async"; -import { pageTitle } from "utils/page"; import { DismissWarningButton } from "./DismissWarningButton"; export const WorkspaceProxyPage: FC = () => { diff --git a/site/src/pages/HealthPage/storybook.tsx b/site/src/pages/HealthPage/storybook.tsx index 28520aa01f..76f96cfab3 100644 --- a/site/src/pages/HealthPage/storybook.tsx +++ b/site/src/pages/HealthPage/storybook.tsx @@ -2,8 +2,9 @@ import type { Meta } from "@storybook/react"; import { reactRouterParameters, reactRouterOutlet, - RouteDefinition, + type RouteDefinition, } from "storybook-addon-react-router-v6"; +import { HEALTH_QUERY_KEY, HEALTH_QUERY_SETTINGS_KEY } from "api/queries/debug"; import { chromatic } from "testHelpers/chromatic"; import { MockAppearanceConfig, @@ -13,9 +14,8 @@ import { MockHealth, MockHealthSettings, } from "testHelpers/entities"; -import { HEALTH_QUERY_KEY, HEALTH_QUERY_SETTINGS_KEY } from "api/queries/debug"; -import { HealthLayout } from "./HealthLayout"; import { withDashboardProvider } from "testHelpers/storybook"; +import { HealthLayout } from "./HealthLayout"; type MetaOptions = { element: RouteDefinition; diff --git a/site/src/pages/IconsPage/IconsPage.tsx b/site/src/pages/IconsPage/IconsPage.tsx index 53e378f846..aae0aaa5f0 100644 --- a/site/src/pages/IconsPage/IconsPage.tsx +++ b/site/src/pages/IconsPage/IconsPage.tsx @@ -1,11 +1,11 @@ -import TextField from "@mui/material/TextField"; -import InputAdornment from "@mui/material/InputAdornment"; -import Tooltip from "@mui/material/Tooltip"; -import IconButton from "@mui/material/IconButton"; -import Link from "@mui/material/Link"; -import SearchIcon from "@mui/icons-material/SearchOutlined"; -import ClearIcon from "@mui/icons-material/CloseOutlined"; import { useTheme } from "@emotion/react"; +import ClearIcon from "@mui/icons-material/CloseOutlined"; +import SearchIcon from "@mui/icons-material/SearchOutlined"; +import IconButton from "@mui/material/IconButton"; +import InputAdornment from "@mui/material/InputAdornment"; +import Link from "@mui/material/Link"; +import TextField from "@mui/material/TextField"; +import Tooltip from "@mui/material/Tooltip"; import { type FC, type ReactNode, useMemo, useState } from "react"; import { Helmet } from "react-helmet-async"; import uFuzzy from "ufuzzy"; @@ -18,11 +18,11 @@ import { PageHeaderTitle, } from "components/PageHeader/PageHeader"; import { Stack } from "components/Stack/Stack"; -import icons from "theme/icons.json"; import { defaultParametersForBuiltinIcons, parseImageParameters, } from "theme/externalImages"; +import icons from "theme/icons.json"; import { pageTitle } from "utils/page"; const iconsWithoutSuffix = icons.map((icon) => icon.split(".")[0]); diff --git a/site/src/pages/LoginPage/LoginPage.test.tsx b/site/src/pages/LoginPage/LoginPage.test.tsx index 1795a9c701..494db98c22 100644 --- a/site/src/pages/LoginPage/LoginPage.test.tsx +++ b/site/src/pages/LoginPage/LoginPage.test.tsx @@ -2,7 +2,6 @@ import { fireEvent, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { rest } from "msw"; import { createMemoryRouter } from "react-router-dom"; -import { Language } from "./SignInForm"; import { render, renderWithRouter, @@ -10,6 +9,7 @@ import { } from "testHelpers/renderHelpers"; import { server } from "testHelpers/server"; import { LoginPage } from "./LoginPage"; +import { Language } from "./SignInForm"; describe("LoginPage", () => { beforeEach(() => { diff --git a/site/src/pages/LoginPage/LoginPage.tsx b/site/src/pages/LoginPage/LoginPage.tsx index dd34ff9b3a..1836cf6384 100644 --- a/site/src/pages/LoginPage/LoginPage.tsx +++ b/site/src/pages/LoginPage/LoginPage.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { Navigate, useLocation, useNavigate } from "react-router-dom"; import { useAuth } from "contexts/auth/useAuth"; diff --git a/site/src/pages/LoginPage/LoginPageView.stories.tsx b/site/src/pages/LoginPage/LoginPageView.stories.tsx index 503444f49e..48ea6e31d7 100644 --- a/site/src/pages/LoginPage/LoginPageView.stories.tsx +++ b/site/src/pages/LoginPage/LoginPageView.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockAuthMethodsAll, MockAuthMethodsExternal, @@ -5,7 +6,6 @@ import { mockApiError, } from "testHelpers/entities"; import { LoginPageView } from "./LoginPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/LoginPage", diff --git a/site/src/pages/LoginPage/LoginPageView.tsx b/site/src/pages/LoginPage/LoginPageView.tsx index a19401bd6b..b3039e5ad9 100644 --- a/site/src/pages/LoginPage/LoginPageView.tsx +++ b/site/src/pages/LoginPage/LoginPageView.tsx @@ -1,11 +1,11 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC } from "react"; import { useLocation } from "react-router-dom"; import type { AuthMethods } from "api/typesGenerated"; +import { CoderIcon } from "components/Icons/CoderIcon"; +import { Loader } from "components/Loader/Loader"; import { getApplicationName, getLogoURL } from "utils/appearance"; import { retrieveRedirect } from "utils/redirect"; -import { Loader } from "components/Loader/Loader"; -import { CoderIcon } from "components/Icons/CoderIcon"; import { SignInForm } from "./SignInForm"; export interface LoginPageViewProps { diff --git a/site/src/pages/LoginPage/OAuthSignInForm.tsx b/site/src/pages/LoginPage/OAuthSignInForm.tsx index 299040b768..e23467f484 100644 --- a/site/src/pages/LoginPage/OAuthSignInForm.tsx +++ b/site/src/pages/LoginPage/OAuthSignInForm.tsx @@ -1,10 +1,10 @@ -import Button from "@mui/material/Button"; import GitHubIcon from "@mui/icons-material/GitHub"; import KeyIcon from "@mui/icons-material/VpnKey"; -import { type FC, useId } from "react"; -import { Language } from "./SignInForm"; -import type { AuthMethods } from "api/typesGenerated"; +import Button from "@mui/material/Button"; import { visuallyHidden } from "@mui/utils"; +import { type FC, useId } from "react"; +import type { AuthMethods } from "api/typesGenerated"; +import { Language } from "./SignInForm"; const iconStyles = { width: 16, diff --git a/site/src/pages/LoginPage/PasswordSignInForm.tsx b/site/src/pages/LoginPage/PasswordSignInForm.tsx index eb60407f5a..5f1256557b 100644 --- a/site/src/pages/LoginPage/PasswordSignInForm.tsx +++ b/site/src/pages/LoginPage/PasswordSignInForm.tsx @@ -1,11 +1,11 @@ -import { Stack } from "components/Stack/Stack"; +import LoadingButton from "@mui/lab/LoadingButton"; import TextField from "@mui/material/TextField"; +import { useFormik } from "formik"; +import type { FC } from "react"; +import * as Yup from "yup"; +import { Stack } from "components/Stack/Stack"; import { getFormHelpers, onChangeTrimmed } from "utils/formUtils"; import { Language } from "./SignInForm"; -import { useFormik } from "formik"; -import * as Yup from "yup"; -import { FC } from "react"; -import LoadingButton from "@mui/lab/LoadingButton"; type PasswordSignInFormProps = { onSubmit: (credentials: { email: string; password: string }) => void; diff --git a/site/src/pages/LoginPage/SignInForm.stories.tsx b/site/src/pages/LoginPage/SignInForm.stories.tsx index 28c1305ad1..524bcb1303 100644 --- a/site/src/pages/LoginPage/SignInForm.stories.tsx +++ b/site/src/pages/LoginPage/SignInForm.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { mockApiError } from "testHelpers/entities"; import { SignInForm } from "./SignInForm"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/LoginPage/SignInForm", diff --git a/site/src/pages/LoginPage/SignInForm.tsx b/site/src/pages/LoginPage/SignInForm.tsx index 11bdc402ab..4efc0fbf7a 100644 --- a/site/src/pages/LoginPage/SignInForm.tsx +++ b/site/src/pages/LoginPage/SignInForm.tsx @@ -1,11 +1,11 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC, type ReactNode } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC, ReactNode } from "react"; import type { AuthMethods } from "api/typesGenerated"; import { Alert } from "components/Alert/Alert"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { getApplicationName } from "utils/appearance"; -import { PasswordSignInForm } from "./PasswordSignInForm"; import { OAuthSignInForm } from "./OAuthSignInForm"; +import { PasswordSignInForm } from "./PasswordSignInForm"; export const Language = { emailLabel: "Email", diff --git a/site/src/pages/SetupPage/SetupPage.test.tsx b/site/src/pages/SetupPage/SetupPage.test.tsx index f196b2f9b0..5c4f05290d 100644 --- a/site/src/pages/SetupPage/SetupPage.test.tsx +++ b/site/src/pages/SetupPage/SetupPage.test.tsx @@ -2,6 +2,7 @@ import { screen, waitFor } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { rest } from "msw"; import { createMemoryRouter } from "react-router-dom"; +import { MockUser } from "testHelpers/entities"; import { renderWithRouter, waitForLoaderToBeRemoved, @@ -9,7 +10,6 @@ import { import { server } from "testHelpers/server"; import { SetupPage } from "./SetupPage"; import { Language as PageViewLanguage } from "./SetupPageView"; -import { MockUser } from "testHelpers/entities"; const fillForm = async ({ username = "someuser", diff --git a/site/src/pages/SetupPage/SetupPage.tsx b/site/src/pages/SetupPage/SetupPage.tsx index c49256df12..9a7128be2b 100644 --- a/site/src/pages/SetupPage/SetupPage.tsx +++ b/site/src/pages/SetupPage/SetupPage.tsx @@ -1,11 +1,11 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation } from "react-query"; import { Navigate, useNavigate } from "react-router-dom"; -import { pageTitle } from "utils/page"; import { createFirstUser } from "api/queries/users"; -import { useAuth } from "contexts/auth/useAuth"; import { FullScreenLoader } from "components/Loader/FullScreenLoader"; +import { useAuth } from "contexts/auth/useAuth"; +import { pageTitle } from "utils/page"; import { SetupPageView } from "./SetupPageView"; export const SetupPage: FC = () => { diff --git a/site/src/pages/SetupPage/SetupPageView.tsx b/site/src/pages/SetupPage/SetupPageView.tsx index bfd4a3937d..af673acacc 100644 --- a/site/src/pages/SetupPage/SetupPageView.tsx +++ b/site/src/pages/SetupPage/SetupPageView.tsx @@ -1,24 +1,24 @@ +import LoadingButton from "@mui/lab/LoadingButton"; +import Autocomplete from "@mui/material/Autocomplete"; import Checkbox from "@mui/material/Checkbox"; import Link from "@mui/material/Link"; +import MenuItem from "@mui/material/MenuItem"; import TextField from "@mui/material/TextField"; -import LoadingButton from "@mui/lab/LoadingButton"; import { type FormikContextType, useFormik } from "formik"; -import { type FC } from "react"; +import type { FC } from "react"; import * as Yup from "yup"; import type * as TypesGen from "api/typesGenerated"; +import { FormFields, VerticalForm } from "components/Form/Form"; +import { CoderIcon } from "components/Icons/CoderIcon"; +import { SignInLayout } from "components/SignInLayout/SignInLayout"; +import { Stack } from "components/Stack/Stack"; +import { docs } from "utils/docs"; import { getFormHelpers, nameValidator, onChangeTrimmed, } from "utils/formUtils"; -import { docs } from "utils/docs"; -import { SignInLayout } from "components/SignInLayout/SignInLayout"; -import { FormFields, VerticalForm } from "components/Form/Form"; -import { CoderIcon } from "components/Icons/CoderIcon"; -import MenuItem from "@mui/material/MenuItem"; import { countries } from "./countries"; -import Autocomplete from "@mui/material/Autocomplete"; -import { Stack } from "components/Stack/Stack"; export const Language = { emailLabel: "Email", diff --git a/site/src/pages/StarterTemplatePage/StarterTemplatePage.tsx b/site/src/pages/StarterTemplatePage/StarterTemplatePage.tsx index 21f11bea66..676e940160 100644 --- a/site/src/pages/StarterTemplatePage/StarterTemplatePage.tsx +++ b/site/src/pages/StarterTemplatePage/StarterTemplatePage.tsx @@ -1,10 +1,10 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { useParams } from "react-router-dom"; import { templateExamples } from "api/queries/templates"; -import { pageTitle } from "utils/page"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { pageTitle } from "utils/page"; import { StarterTemplatePageView } from "./StarterTemplatePageView"; const StarterTemplatePage: FC = () => { diff --git a/site/src/pages/StarterTemplatePage/StarterTemplatePageView.stories.tsx b/site/src/pages/StarterTemplatePage/StarterTemplatePageView.stories.tsx index 271423f760..d2f4ebf615 100644 --- a/site/src/pages/StarterTemplatePage/StarterTemplatePageView.stories.tsx +++ b/site/src/pages/StarterTemplatePage/StarterTemplatePageView.stories.tsx @@ -1,9 +1,8 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { chromatic } from "testHelpers/chromatic"; import { mockApiError, MockTemplateExample } from "testHelpers/entities"; import { StarterTemplatePageView } from "./StarterTemplatePageView"; -import type { Meta, StoryObj } from "@storybook/react"; - const meta: Meta = { title: "pages/StarterTemplatePage", parameters: { chromatic }, diff --git a/site/src/pages/StarterTemplatePage/StarterTemplatePageView.tsx b/site/src/pages/StarterTemplatePage/StarterTemplatePageView.tsx index 2907f97b5b..4e3a165f34 100644 --- a/site/src/pages/StarterTemplatePage/StarterTemplatePageView.tsx +++ b/site/src/pages/StarterTemplatePage/StarterTemplatePageView.tsx @@ -1,5 +1,12 @@ -import Button from "@mui/material/Button"; import { useTheme } from "@emotion/react"; +import PlusIcon from "@mui/icons-material/AddOutlined"; +import ViewCodeIcon from "@mui/icons-material/OpenInNewOutlined"; +import Button from "@mui/material/Button"; +import type { FC } from "react"; +import { Link } from "react-router-dom"; +import type { TemplateExample } from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { ExternalImage } from "components/ExternalImage/ExternalImage"; import { Loader } from "components/Loader/Loader"; import { Margins } from "components/Margins/Margins"; import { MemoizedMarkdown } from "components/Markdown/Markdown"; @@ -8,14 +15,7 @@ import { PageHeaderSubtitle, PageHeaderTitle, } from "components/PageHeader/PageHeader"; -import { type FC } from "react"; -import ViewCodeIcon from "@mui/icons-material/OpenInNewOutlined"; -import PlusIcon from "@mui/icons-material/AddOutlined"; import { Stack } from "components/Stack/Stack"; -import { Link } from "react-router-dom"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import type { TemplateExample } from "api/typesGenerated"; -import { ExternalImage } from "components/ExternalImage/ExternalImage"; export interface StarterTemplatePageViewProps { starterTemplate?: TemplateExample; diff --git a/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.test.tsx b/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.test.tsx index a1f25f937a..7109f0d287 100644 --- a/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.test.tsx +++ b/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.test.tsx @@ -1,14 +1,14 @@ import { render, screen } from "@testing-library/react"; -import StarterTemplatesPage from "./StarterTemplatesPage"; -import { AppProviders } from "App"; -import { RouterProvider, createMemoryRouter } from "react-router-dom"; -import { RequireAuth } from "contexts/auth/RequireAuth"; import { rest } from "msw"; +import { RouterProvider, createMemoryRouter } from "react-router-dom"; +import { AppProviders } from "App"; +import { RequireAuth } from "contexts/auth/RequireAuth"; import { MockTemplateExample, MockTemplateExample2, } from "testHelpers/entities"; import { server } from "testHelpers/server"; +import StarterTemplatesPage from "./StarterTemplatesPage"; test("does not display the scratch template", async () => { server.use( diff --git a/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.tsx b/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.tsx index e24a370267..342523d81e 100644 --- a/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.tsx +++ b/site/src/pages/StarterTemplatesPage/StarterTemplatesPage.tsx @@ -1,12 +1,12 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { templateExamples } from "api/queries/templates"; +import type { TemplateExample } from "api/typesGenerated"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { pageTitle } from "utils/page"; import { getTemplatesByTag } from "utils/starterTemplates"; import { StarterTemplatesPageView } from "./StarterTemplatesPageView"; -import { TemplateExample } from "api/typesGenerated"; const StarterTemplatesPage: FC = () => { const organizationId = useOrganizationId(); diff --git a/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.stories.tsx b/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.stories.tsx index b57a8b60ee..228e8cae4e 100644 --- a/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.stories.tsx +++ b/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { chromatic } from "testHelpers/chromatic"; import { mockApiError, @@ -6,7 +7,6 @@ import { } from "testHelpers/entities"; import { getTemplatesByTag } from "utils/starterTemplates"; import { StarterTemplatesPageView } from "./StarterTemplatesPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/StarterTemplatesPage", diff --git a/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.tsx b/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.tsx index ffee1751d8..e0a6c4b975 100644 --- a/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.tsx +++ b/site/src/pages/StarterTemplatesPage/StarterTemplatesPageView.tsx @@ -1,5 +1,5 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC } from "react"; import { Link, useSearchParams } from "react-router-dom"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Loader } from "components/Loader/Loader"; diff --git a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.test.tsx b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.test.tsx index d77181f959..580df7f645 100644 --- a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.test.tsx +++ b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.test.tsx @@ -1,17 +1,17 @@ -import { - renderWithAuth, - waitForLoaderToBeRemoved, -} from "testHelpers/renderHelpers"; -import TemplateEmbedPage from "./TemplateEmbedPage"; +import { screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import * as API from "api/api"; import { TemplateLayout } from "pages/TemplatePage/TemplateLayout"; import { MockTemplate, MockTemplateVersionParameter1 as parameter1, MockTemplateVersionParameter2 as parameter2, } from "testHelpers/entities"; -import * as API from "api/api"; -import userEvent from "@testing-library/user-event"; -import { screen } from "@testing-library/react"; +import { + renderWithAuth, + waitForLoaderToBeRemoved, +} from "testHelpers/renderHelpers"; +import TemplateEmbedPage from "./TemplateEmbedPage"; test("Users can fill the parameters and copy the open in coder url", async () => { jest diff --git a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx index 6cf91723ad..57716e0b91 100644 --- a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx +++ b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPage.tsx @@ -4,19 +4,19 @@ import Button from "@mui/material/Button"; import FormControlLabel from "@mui/material/FormControlLabel"; import Radio from "@mui/material/Radio"; import RadioGroup from "@mui/material/RadioGroup"; -import { useQuery } from "react-query"; -import { getTemplateVersionRichParameters } from "api/api"; -import { Template, TemplateVersionParameter } from "api/typesGenerated"; -import { FormSection, VerticalForm } from "components/Form/Form"; -import { Loader } from "components/Loader/Loader"; -import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; -import { useClipboard } from "hooks/useClipboard"; import { type FC, useEffect, useState } from "react"; import { Helmet } from "react-helmet-async"; +import { useQuery } from "react-query"; +import { getTemplateVersionRichParameters } from "api/api"; +import type { Template, TemplateVersionParameter } from "api/typesGenerated"; +import { FormSection, VerticalForm } from "components/Form/Form"; +import { Loader } from "components/Loader/Loader"; +import { RichParameterInput } from "components/RichParameterInput/RichParameterInput"; +import { useClipboard } from "hooks/useClipboard"; +import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; import { pageTitle } from "utils/page"; import { getInitialRichParameterValues } from "utils/richParameters"; import { paramsUsedToCreateWorkspace } from "utils/workspace"; -import { RichParameterInput } from "components/RichParameterInput/RichParameterInput"; type ButtonValues = Record; diff --git a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPageView.stories.tsx b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPageView.stories.tsx index 785d9007eb..2a824caf01 100644 --- a/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPageView.stories.tsx +++ b/site/src/pages/TemplatePage/TemplateEmbedPage/TemplateEmbedPageView.stories.tsx @@ -1,6 +1,4 @@ import type { Meta, StoryObj } from "@storybook/react"; - -import { TemplateEmbedPageView } from "./TemplateEmbedPage"; import { MockTemplate, MockTemplateVersionParameter1, @@ -8,6 +6,7 @@ import { MockTemplateVersionParameter3, MockTemplateVersionParameter4, } from "testHelpers/entities"; +import { TemplateEmbedPageView } from "./TemplateEmbedPage"; const meta: Meta = { title: "pages/TemplatePage/TemplateEmbedPageView", diff --git a/site/src/pages/TemplatePage/TemplateFilesPage/TemplateFilesPage.test.tsx b/site/src/pages/TemplatePage/TemplateFilesPage/TemplateFilesPage.test.tsx index eda7fd600f..c18f2024d0 100644 --- a/site/src/pages/TemplatePage/TemplateFilesPage/TemplateFilesPage.test.tsx +++ b/site/src/pages/TemplatePage/TemplateFilesPage/TemplateFilesPage.test.tsx @@ -1,12 +1,12 @@ import { render, screen } from "@testing-library/react"; +import { rest } from "msw"; +import { RouterProvider, createMemoryRouter } from "react-router-dom"; import { AppProviders } from "App"; import { RequireAuth } from "contexts/auth/RequireAuth"; -import { RouterProvider, createMemoryRouter } from "react-router-dom"; -import { TemplateLayout } from "../TemplateLayout"; -import TemplateFilesPage from "./TemplateFilesPage"; import { MockTemplate } from "testHelpers/entities"; import { server } from "testHelpers/server"; -import { rest } from "msw"; +import { TemplateLayout } from "../TemplateLayout"; +import TemplateFilesPage from "./TemplateFilesPage"; // Occasionally, Jest encounters HTML5 canvas errors. As the SyntaxHighlight is // not required for these tests, we can safely mock it. diff --git a/site/src/pages/TemplatePage/TemplateFilesPage/TemplateFilesPage.tsx b/site/src/pages/TemplatePage/TemplateFilesPage/TemplateFilesPage.tsx index 12600c4cf4..473dafdef4 100644 --- a/site/src/pages/TemplatePage/TemplateFilesPage/TemplateFilesPage.tsx +++ b/site/src/pages/TemplatePage/TemplateFilesPage/TemplateFilesPage.tsx @@ -1,11 +1,11 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { previousTemplateVersion, templateFiles } from "api/queries/templates"; import { Loader } from "components/Loader/Loader"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { TemplateFiles } from "modules/templates/TemplateFiles/TemplateFiles"; import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { getTemplatePageTitle } from "../utils"; const TemplateFilesPage: FC = () => { diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/DateRange.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/DateRange.tsx index b7cf7fa142..65f85d3179 100644 --- a/site/src/pages/TemplatePage/TemplateInsightsPage/DateRange.tsx +++ b/site/src/pages/TemplatePage/TemplateInsightsPage/DateRange.tsx @@ -1,10 +1,8 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import { type ComponentProps, type FC, useRef, useState } from "react"; import "react-date-range/dist/styles.css"; import "react-date-range/dist/theme/default.css"; -import Button from "@mui/material/Button"; +import type { Interpolation, Theme } from "@emotion/react"; import ArrowRightAltOutlined from "@mui/icons-material/ArrowRightAltOutlined"; -import { DateRangePicker, createStaticRanges } from "react-date-range"; +import Button from "@mui/material/Button"; import { addDays, addHours, @@ -14,6 +12,8 @@ import { startOfHour, subDays, } from "date-fns"; +import { type ComponentProps, type FC, useRef, useState } from "react"; +import { DateRangePicker, createStaticRanges } from "react-date-range"; import { Popover, PopoverContent, diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx index 188f5c3a77..b20ec3f370 100644 --- a/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx +++ b/site/src/pages/TemplatePage/TemplateInsightsPage/TemplateInsightsPage.tsx @@ -1,11 +1,35 @@ -import LinearProgress from "@mui/material/LinearProgress"; -import Tooltip from "@mui/material/Tooltip"; -import Link from "@mui/material/Link"; -import CheckCircleOutlined from "@mui/icons-material/CheckCircleOutlined"; +import { useTheme } from "@emotion/react"; import CancelOutlined from "@mui/icons-material/CancelOutlined"; +import CheckCircleOutlined from "@mui/icons-material/CheckCircleOutlined"; import LinkOutlined from "@mui/icons-material/LinkOutlined"; -import { useQuery } from "react-query"; +import LinearProgress from "@mui/material/LinearProgress"; +import Link from "@mui/material/Link"; +import Tooltip from "@mui/material/Tooltip"; +import chroma from "chroma-js"; +import { + subDays, + addWeeks, + format, + startOfDay, + startOfHour, + addHours, +} from "date-fns"; +import { + type FC, + type HTMLAttributes, + type PropsWithChildren, + type ReactNode, + useId, +} from "react"; import { Helmet } from "react-helmet-async"; +import { useQuery } from "react-query"; +import { useSearchParams } from "react-router-dom"; +import { entitlements } from "api/queries/entitlements"; +import { + insightsTemplate, + insightsUserActivity, + insightsUserLatency, +} from "api/queries/insights"; import type { Entitlements, Template, @@ -16,32 +40,10 @@ import type { UserActivityInsightsResponse, UserLatencyInsightsResponse, } from "api/typesGenerated"; -import { useTheme } from "@emotion/react"; -import { - type FC, - type HTMLAttributes, - type PropsWithChildren, - type ReactNode, - useId, -} from "react"; -import chroma from "chroma-js"; -import { - subDays, - addWeeks, - format, - startOfDay, - startOfHour, - addHours, -} from "date-fns"; -import { useSearchParams } from "react-router-dom"; -import "react-date-range/dist/styles.css"; -import "react-date-range/dist/theme/default.css"; - import { ActiveUsersTitle, ActiveUserChart, } from "components/ActiveUserChart/ActiveUserChart"; -import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; import { HelpTooltip, HelpTooltipTitle, @@ -49,19 +51,14 @@ import { HelpTooltipContent, HelpTooltipTrigger, } from "components/HelpTooltip/HelpTooltip"; -import { UserAvatar } from "components/UserAvatar/UserAvatar"; -import { getLatencyColor } from "utils/latency"; import { Loader } from "components/Loader/Loader"; -import { - insightsTemplate, - insightsUserActivity, - insightsUserLatency, -} from "api/queries/insights"; -import { entitlements } from "api/queries/entitlements"; +import { UserAvatar } from "components/UserAvatar/UserAvatar"; +import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; +import { getLatencyColor } from "utils/latency"; import { getTemplatePageTitle } from "../utils"; -import { DateRange as DailyPicker, DateRangeValue } from "./DateRange"; +import { DateRange as DailyPicker, type DateRangeValue } from "./DateRange"; +import { type InsightsInterval, IntervalMenu } from "./IntervalMenu"; import { lastWeeks } from "./utils"; -import { InsightsInterval, IntervalMenu } from "./IntervalMenu"; import { WeekPicker, numberOfWeeksOptions } from "./WeekPicker"; const DEFAULT_NUMBER_OF_WEEKS = numberOfWeeksOptions[0]; diff --git a/site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx b/site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx index 6b4525566e..5e5cde3a9d 100644 --- a/site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx +++ b/site/src/pages/TemplatePage/TemplateInsightsPage/WeekPicker.tsx @@ -3,9 +3,9 @@ import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined"; import Button from "@mui/material/Button"; import Menu from "@mui/material/Menu"; import MenuItem from "@mui/material/MenuItem"; -import { type FC, useState, useRef } from "react"; -import { DateRangeValue } from "./DateRange"; import { differenceInWeeks } from "date-fns"; +import { type FC, useState, useRef } from "react"; +import type { DateRangeValue } from "./DateRange"; import { lastWeeks } from "./utils"; // There is no point in showing the period > 6 months. We prune stats older than diff --git a/site/src/pages/TemplatePage/TemplateLayout.tsx b/site/src/pages/TemplatePage/TemplateLayout.tsx index cfb0f0e1d0..0ba642a590 100644 --- a/site/src/pages/TemplatePage/TemplateLayout.tsx +++ b/site/src/pages/TemplatePage/TemplateLayout.tsx @@ -7,17 +7,17 @@ import { } from "react"; import { useQuery } from "react-query"; import { Outlet, useLocation, useNavigate, useParams } from "react-router-dom"; -import type { AuthorizationRequest } from "api/typesGenerated"; import { checkAuthorization, getTemplateByName, getTemplateVersion, } from "api/api"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import type { AuthorizationRequest } from "api/typesGenerated"; import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { Margins } from "components/Margins/Margins"; import { Loader } from "components/Loader/Loader"; +import { Margins } from "components/Margins/Margins"; import { TAB_PADDING_Y, TabLink, Tabs, TabsList } from "components/Tabs/Tabs"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { TemplatePageHeader } from "./TemplatePageHeader"; const templatePermissions = ( diff --git a/site/src/pages/TemplatePage/TemplatePageHeader.stories.tsx b/site/src/pages/TemplatePage/TemplatePageHeader.stories.tsx index 7def82b032..e17651d3b5 100644 --- a/site/src/pages/TemplatePage/TemplatePageHeader.stories.tsx +++ b/site/src/pages/TemplatePage/TemplatePageHeader.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockTemplate, MockTemplateVersion } from "testHelpers/entities"; import { TemplatePageHeader } from "./TemplatePageHeader"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/TemplatePage/TemplatePageHeader", diff --git a/site/src/pages/TemplatePage/TemplatePageHeader.tsx b/site/src/pages/TemplatePage/TemplatePageHeader.tsx index cfa686d93d..7b74d2924d 100644 --- a/site/src/pages/TemplatePage/TemplatePageHeader.tsx +++ b/site/src/pages/TemplatePage/TemplatePageHeader.tsx @@ -1,31 +1,24 @@ -import { type FC } from "react"; -import { Link as RouterLink, useNavigate } from "react-router-dom"; -import { useDeletionDialogState } from "./useDeletionDialogState"; - +import AddIcon from "@mui/icons-material/AddOutlined"; +import DeleteIcon from "@mui/icons-material/DeleteOutlined"; +import EditIcon from "@mui/icons-material/EditOutlined"; +import CopyIcon from "@mui/icons-material/FileCopyOutlined"; +import SettingsIcon from "@mui/icons-material/SettingsOutlined"; +import Button from "@mui/material/Button"; +import Divider from "@mui/material/Divider"; +import type { FC } from "react"; import { useQuery } from "react-query"; +import { Link as RouterLink, useNavigate } from "react-router-dom"; import { workspaces } from "api/queries/workspaces"; -import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; -import { +import type { AuthorizationResponse, Template, TemplateVersion, } from "api/typesGenerated"; - import { Avatar } from "components/Avatar/Avatar"; +import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { DeleteDialog } from "components/Dialogs/DeleteDialog/DeleteDialog"; -import { Stack } from "components/Stack/Stack"; import { Margins } from "components/Margins/Margins"; -import { - PageHeader, - PageHeaderTitle, - PageHeaderSubtitle, -} from "components/PageHeader/PageHeader"; -import Button from "@mui/material/Button"; -import AddIcon from "@mui/icons-material/AddOutlined"; -import SettingsIcon from "@mui/icons-material/SettingsOutlined"; -import DeleteIcon from "@mui/icons-material/DeleteOutlined"; -import EditIcon from "@mui/icons-material/EditOutlined"; -import CopyIcon from "@mui/icons-material/FileCopyOutlined"; +import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; import { MoreMenu, MoreMenuContent, @@ -33,9 +26,14 @@ import { MoreMenuTrigger, ThreeDotsButton, } from "components/MoreMenu/MoreMenu"; -import Divider from "@mui/material/Divider"; +import { + PageHeader, + PageHeaderTitle, + PageHeaderSubtitle, +} from "components/PageHeader/PageHeader"; import { Pill } from "components/Pill/Pill"; -import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; +import { Stack } from "components/Stack/Stack"; +import { useDeletionDialogState } from "./useDeletionDialogState"; type TemplateMenuProps = { templateName: string; diff --git a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.stories.tsx b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.stories.tsx index 244d2cd2c6..c13a612657 100644 --- a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.stories.tsx +++ b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockTemplate, MockTemplateVersion } from "testHelpers/entities"; import { TemplateStats } from "./TemplateStats"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/TemplatePage/TemplateStats", diff --git a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.tsx b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.tsx index a846698cdc..48be7e55f1 100644 --- a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.tsx +++ b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateStats.tsx @@ -1,12 +1,12 @@ -import { Stats, StatsItem } from "components/Stats/Stats"; -import { FC } from "react"; +import type { FC } from "react"; import { Link } from "react-router-dom"; +import type { Template, TemplateVersion } from "api/typesGenerated"; +import { Stats, StatsItem } from "components/Stats/Stats"; import { createDayString } from "utils/createDayString"; import { formatTemplateBuildTime, formatTemplateActiveDevelopers, } from "utils/templates"; -import { Template, TemplateVersion } from "api/typesGenerated"; const Language = { usedByLabel: "Used by", diff --git a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPage.tsx b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPage.tsx index 69149d3362..c0460c5b59 100644 --- a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPage.tsx +++ b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPage.tsx @@ -1,10 +1,10 @@ -import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; -import { FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; -import { getTemplatePageTitle } from "../utils"; -import { TemplateSummaryPageView } from "./TemplateSummaryPageView"; import { useQuery } from "react-query"; import { getTemplateVersionResources } from "api/api"; +import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; +import { getTemplatePageTitle } from "../utils"; +import { TemplateSummaryPageView } from "./TemplateSummaryPageView"; export const TemplateSummaryPage: FC = () => { const { template, activeVersion } = useTemplateLayoutContext(); diff --git a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPageView.stories.tsx b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPageView.stories.tsx index 0af2aa6488..15f17b0dfe 100644 --- a/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPageView.stories.tsx +++ b/site/src/pages/TemplatePage/TemplateSummaryPage/TemplateSummaryPageView.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { MockTemplate, MockTemplateVersion, diff --git a/site/src/pages/TemplatePage/TemplateVersionsPage/TemplateVersionsPage.tsx b/site/src/pages/TemplatePage/TemplateVersionsPage/TemplateVersionsPage.tsx index 86bed4cf70..5d50f110d0 100644 --- a/site/src/pages/TemplatePage/TemplateVersionsPage/TemplateVersionsPage.tsx +++ b/site/src/pages/TemplatePage/TemplateVersionsPage/TemplateVersionsPage.tsx @@ -1,3 +1,5 @@ +import { useState } from "react"; +import { Helmet } from "react-helmet-async"; import { useMutation, useQuery } from "react-query"; import { archiveTemplateVersion, @@ -8,10 +10,8 @@ import { getErrorMessage } from "api/errors"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; import { useTemplateLayoutContext } from "pages/TemplatePage/TemplateLayout"; -import { VersionsTable } from "./VersionsTable"; -import { useState } from "react"; -import { Helmet } from "react-helmet-async"; import { getTemplatePageTitle } from "../utils"; +import { VersionsTable } from "./VersionsTable"; const TemplateVersionsPage = () => { const { template, permissions } = useTemplateLayoutContext(); diff --git a/site/src/pages/TemplatePage/TemplateVersionsPage/VersionRow.tsx b/site/src/pages/TemplatePage/TemplateVersionsPage/VersionRow.tsx index 15f6c35194..9745689c81 100644 --- a/site/src/pages/TemplatePage/TemplateVersionsPage/VersionRow.tsx +++ b/site/src/pages/TemplatePage/TemplateVersionsPage/VersionRow.tsx @@ -1,14 +1,14 @@ -import { type CSSObject, type Interpolation, type Theme } from "@emotion/react"; +import type { CSSObject, Interpolation, Theme } from "@emotion/react"; import Button from "@mui/material/Button"; import TableCell from "@mui/material/TableCell"; -import { type FC } from "react"; +import type { FC } from "react"; import { useNavigate } from "react-router-dom"; import type { TemplateVersion } from "api/typesGenerated"; +import { InfoTooltip } from "components/InfoTooltip/InfoTooltip"; import { Pill } from "components/Pill/Pill"; import { Stack } from "components/Stack/Stack"; import { TimelineEntry } from "components/Timeline/TimelineEntry"; import { UserAvatar } from "components/UserAvatar/UserAvatar"; -import { InfoTooltip } from "components/InfoTooltip/InfoTooltip"; import { useClickableTableRow } from "hooks/useClickableTableRow"; export interface VersionRowProps { diff --git a/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.stories.tsx b/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.stories.tsx index 44e1feba47..b6067213b6 100644 --- a/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.stories.tsx +++ b/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.stories.tsx @@ -1,4 +1,5 @@ import { action } from "@storybook/addon-actions"; +import type { Meta, StoryObj } from "@storybook/react"; import { MockCanceledProvisionerJob, MockCancelingProvisionerJob, @@ -8,7 +9,6 @@ import { MockTemplateVersion, } from "testHelpers/entities"; import { VersionsTable } from "./VersionsTable"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/TemplatePage/VersionsTable", diff --git a/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.tsx b/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.tsx index 91a724a5d8..3a482b66cc 100644 --- a/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.tsx +++ b/site/src/pages/TemplatePage/TemplateVersionsPage/VersionsTable.tsx @@ -3,11 +3,11 @@ import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableRow from "@mui/material/TableRow"; -import { Timeline } from "components/Timeline/Timeline"; -import { type FC } from "react"; +import type { FC } from "react"; import type * as TypesGen from "api/typesGenerated"; import { EmptyState } from "components/EmptyState/EmptyState"; import { TableLoader } from "components/TableLoader/TableLoader"; +import { Timeline } from "components/Timeline/Timeline"; import { VersionRow } from "./VersionRow"; export const Language = { diff --git a/site/src/pages/TemplatePage/useDeletionDialogState.test.ts b/site/src/pages/TemplatePage/useDeletionDialogState.test.ts index 1858520bff..63a53f3d1b 100644 --- a/site/src/pages/TemplatePage/useDeletionDialogState.test.ts +++ b/site/src/pages/TemplatePage/useDeletionDialogState.test.ts @@ -1,7 +1,7 @@ import { act, renderHook, waitFor } from "@testing-library/react"; +import * as API from "api/api"; import { MockTemplate } from "testHelpers/entities"; import { useDeletionDialogState } from "./useDeletionDialogState"; -import * as API from "api/api"; test("delete dialog starts closed", () => { const { result } = renderHook(() => diff --git a/site/src/pages/TemplatePage/utils.ts b/site/src/pages/TemplatePage/utils.ts index f95c48e13f..dfb07eca79 100644 --- a/site/src/pages/TemplatePage/utils.ts +++ b/site/src/pages/TemplatePage/utils.ts @@ -1,4 +1,4 @@ -import { Template } from "api/typesGenerated"; +import type { Template } from "api/typesGenerated"; import { pageTitle } from "utils/page"; export const getTemplatePageTitle = (title: string, template: Template) => { diff --git a/site/src/pages/TemplateSettingsPage/Sidebar.tsx b/site/src/pages/TemplateSettingsPage/Sidebar.tsx index 1ec5b242ea..c2c22bb75a 100644 --- a/site/src/pages/TemplateSettingsPage/Sidebar.tsx +++ b/site/src/pages/TemplateSettingsPage/Sidebar.tsx @@ -1,8 +1,8 @@ -import ScheduleIcon from "@mui/icons-material/TimerOutlined"; import VariablesIcon from "@mui/icons-material/CodeOutlined"; -import GeneralIcon from "@mui/icons-material/SettingsOutlined"; import SecurityIcon from "@mui/icons-material/LockOutlined"; -import { type FC } from "react"; +import GeneralIcon from "@mui/icons-material/SettingsOutlined"; +import ScheduleIcon from "@mui/icons-material/TimerOutlined"; +import type { FC } from "react"; import type { Template } from "api/typesGenerated"; import { ExternalAvatar } from "components/Avatar/Avatar"; import { diff --git a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsForm.tsx index 3c540c9522..8fec6f6b1a 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsForm.tsx @@ -1,12 +1,30 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; +import Checkbox from "@mui/material/Checkbox"; +import MenuItem from "@mui/material/MenuItem"; import TextField from "@mui/material/TextField"; +import { type FormikContextType, type FormikTouched, useFormik } from "formik"; +import type { FC } from "react"; +import * as Yup from "yup"; import { WorkspaceAppSharingLevels, type Template, type UpdateTemplateMeta, } from "api/typesGenerated"; -import { type FormikContextType, type FormikTouched, useFormik } from "formik"; -import { type FC } from "react"; +import { EnterpriseBadge } from "components/Badges/Badges"; +import { + FormFields, + FormSection, + HorizontalForm, + FormFooter, +} from "components/Form/Form"; +import { + HelpTooltip, + HelpTooltipContent, + HelpTooltipText, + HelpTooltipTrigger, +} from "components/HelpTooltip/HelpTooltip"; +import { IconField } from "components/IconField/IconField"; +import { Stack } from "components/Stack/Stack"; import { getFormHelpers, nameValidator, @@ -14,24 +32,6 @@ import { onChangeTrimmed, iconValidator, } from "utils/formUtils"; -import * as Yup from "yup"; -import { IconField } from "components/IconField/IconField"; -import { - FormFields, - FormSection, - HorizontalForm, - FormFooter, -} from "components/Form/Form"; -import { Stack } from "components/Stack/Stack"; -import Checkbox from "@mui/material/Checkbox"; -import { - HelpTooltip, - HelpTooltipContent, - HelpTooltipText, - HelpTooltipTrigger, -} from "components/HelpTooltip/HelpTooltip"; -import { EnterpriseBadge } from "components/Badges/Badges"; -import MenuItem from "@mui/material/MenuItem"; const MAX_DESCRIPTION_CHAR_LIMIT = 128; const MAX_DESCRIPTION_MESSAGE = diff --git a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPage.test.tsx index a025997c77..a0849dfdd2 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPage.test.tsx @@ -1,7 +1,7 @@ import { screen, waitFor } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import * as API from "api/api"; -import { UpdateTemplateMeta } from "api/typesGenerated"; +import type { UpdateTemplateMeta } from "api/typesGenerated"; import { Language as FooterFormLanguage } from "components/FormFooter/FormFooter"; import { MockTemplate } from "testHelpers/entities"; import { diff --git a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPage.tsx b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPage.tsx index 44cd7eae47..a035e586e1 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPage.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPage.tsx @@ -1,14 +1,14 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQueryClient } from "react-query"; import { useNavigate, useParams } from "react-router-dom"; import { updateTemplateMeta } from "api/api"; -import type { UpdateTemplateMeta } from "api/typesGenerated"; import { templateByNameKey } from "api/queries/templates"; +import type { UpdateTemplateMeta } from "api/typesGenerated"; +import { displaySuccess } from "components/GlobalSnackbar/utils"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { useDashboard } from "modules/dashboard/useDashboard"; import { pageTitle } from "utils/page"; -import { displaySuccess } from "components/GlobalSnackbar/utils"; import { useTemplateSettings } from "../TemplateSettingsLayout"; import { TemplateSettingsPageView } from "./TemplateSettingsPageView"; diff --git a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPageView.tsx b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPageView.tsx index 46222b8de2..40303abf17 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPageView.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateGeneralSettingsPage/TemplateSettingsPageView.tsx @@ -1,4 +1,4 @@ -import { type ComponentProps, type FC } from "react"; +import type { ComponentProps, FC } from "react"; import type { Template, UpdateTemplateMeta } from "api/typesGenerated"; import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { TemplateSettingsForm } from "./TemplateSettingsForm"; diff --git a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPage.tsx b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPage.tsx index 99b3f7efa7..d350829eab 100644 --- a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPage.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPage.tsx @@ -1,13 +1,13 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQuery, useQueryClient } from "react-query"; import { setGroupRole, setUserRole, templateACL } from "api/queries/templates"; -import { Paywall } from "components/Paywall/Paywall"; import { displaySuccess } from "components/GlobalSnackbar/utils"; +import { Paywall } from "components/Paywall/Paywall"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility"; -import { pageTitle } from "utils/page"; import { docs } from "utils/docs"; +import { pageTitle } from "utils/page"; import { useTemplateSettings } from "../TemplateSettingsLayout"; import { TemplatePermissionsPageView } from "./TemplatePermissionsPageView"; diff --git a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.stories.tsx b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.stories.tsx index fb1c43ea2b..618d337492 100644 --- a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.stories.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.stories.tsx @@ -1,10 +1,10 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockOrganization, MockTemplateACL, MockTemplateACLEmpty, } from "testHelpers/entities"; import { TemplatePermissionsPageView } from "./TemplatePermissionsPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/TemplateSettingsPage/TemplatePermissionsPageView", diff --git a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx index 5adc97e678..6f75099bbf 100644 --- a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/TemplatePermissionsPageView.tsx @@ -1,3 +1,6 @@ +import type { Interpolation, Theme } from "@emotion/react"; +import PersonAdd from "@mui/icons-material/PersonAdd"; +import LoadingButton from "@mui/lab/LoadingButton"; import MenuItem from "@mui/material/MenuItem"; import Select, { type SelectProps } from "@mui/material/Select"; import Table from "@mui/material/Table"; @@ -6,9 +9,6 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import PersonAdd from "@mui/icons-material/PersonAdd"; -import LoadingButton from "@mui/lab/LoadingButton"; -import { type Interpolation, type Theme } from "@emotion/react"; import { type FC, useState } from "react"; import type { Group, @@ -18,9 +18,10 @@ import type { TemplateRole, TemplateUser, } from "api/typesGenerated"; -import { getGroupSubtitle } from "utils/groups"; +import { AvatarData } from "components/AvatarData/AvatarData"; +import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; +import { EmptyState } from "components/EmptyState/EmptyState"; import { GroupAvatar } from "components/GroupAvatar/GroupAvatar"; -import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { MoreMenu, MoreMenuContent, @@ -28,14 +29,13 @@ import { MoreMenuTrigger, ThreeDotsButton, } from "components/MoreMenu/MoreMenu"; -import { AvatarData } from "components/AvatarData/AvatarData"; -import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; -import { EmptyState } from "components/EmptyState/EmptyState"; +import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { Stack } from "components/Stack/Stack"; import { TableLoader } from "components/TableLoader/TableLoader"; +import { getGroupSubtitle } from "utils/groups"; import { UserOrGroupAutocomplete, - UserOrGroupAutocompleteValue, + type UserOrGroupAutocompleteValue, } from "./UserOrGroupAutocomplete"; type AddTemplateUserOrGroupProps = { diff --git a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/UserOrGroupAutocomplete.tsx b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/UserOrGroupAutocomplete.tsx index b6e332b11b..31681cb792 100644 --- a/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/UserOrGroupAutocomplete.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplatePermissionsPage/UserOrGroupAutocomplete.tsx @@ -1,15 +1,15 @@ +import { css } from "@emotion/react"; +import Autocomplete from "@mui/material/Autocomplete"; import CircularProgress from "@mui/material/CircularProgress"; import TextField from "@mui/material/TextField"; -import Autocomplete from "@mui/material/Autocomplete"; import { type ChangeEvent, type FC, useState } from "react"; -import { css } from "@emotion/react"; -import type { Group, ReducedUser } from "api/typesGenerated"; -import { AvatarData } from "components/AvatarData/AvatarData"; -import { getGroupSubtitle } from "utils/groups"; -import { useDebouncedFunction } from "hooks/debounce"; import { useQuery } from "react-query"; import { templaceACLAvailable } from "api/queries/templates"; +import type { Group, ReducedUser } from "api/typesGenerated"; +import { AvatarData } from "components/AvatarData/AvatarData"; +import { useDebouncedFunction } from "hooks/debounce"; import { prepareQuery } from "utils/filters"; +import { getGroupSubtitle } from "utils/groups"; export type UserOrGroupAutocompleteValue = ReducedUser | Group | null; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/AutostopRequirementHelperText.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/AutostopRequirementHelperText.tsx index 2ae948bcfc..d51df91339 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/AutostopRequirementHelperText.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/AutostopRequirementHelperText.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type { Template } from "api/typesGenerated"; import type { TemplateAutostopRequirementDaysValue } from "utils/schedule"; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/ScheduleDialog.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/ScheduleDialog.tsx index 08fe8e6b65..357c5c7c53 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/ScheduleDialog.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/ScheduleDialog.tsx @@ -1,11 +1,11 @@ -import DialogActions from "@mui/material/DialogActions"; -import { type FC } from "react"; +import type { Interpolation, Theme } from "@emotion/react"; import Checkbox from "@mui/material/Checkbox"; +import DialogActions from "@mui/material/DialogActions"; import FormControlLabel from "@mui/material/FormControlLabel"; import { Stack } from "@mui/system"; -import { type Interpolation, type Theme } from "@emotion/react"; +import type { FC } from "react"; +import type { ConfirmDialogProps } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { Dialog, DialogActionButtons } from "components/Dialogs/Dialog"; -import { type ConfirmDialogProps } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; export interface ScheduleDialogProps extends ConfirmDialogProps { readonly inactiveWorkspacesToGoDormant: number; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx index 5c95062b7f..9dcee449e0 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateScheduleForm.tsx @@ -1,19 +1,13 @@ -import TextField from "@mui/material/TextField"; -import MenuItem from "@mui/material/MenuItem"; -import Link from "@mui/material/Link"; +import { useTheme } from "@emotion/react"; import Checkbox from "@mui/material/Checkbox"; import FormControlLabel from "@mui/material/FormControlLabel"; +import Link from "@mui/material/Link"; +import MenuItem from "@mui/material/MenuItem"; import Switch from "@mui/material/Switch"; -import { FormikTouched, useFormik } from "formik"; -import { type FC, ChangeEvent, useState, useEffect } from "react"; -import { useTheme } from "@emotion/react"; +import TextField from "@mui/material/TextField"; +import { type FormikTouched, useFormik } from "formik"; +import { type ChangeEvent, type FC, useState, useEffect } from "react"; import type { Template, UpdateTemplateMeta } from "api/typesGenerated"; -import { getFormHelpers } from "utils/formUtils"; -import { docs } from "utils/docs"; -import { - TemplateAutostartRequirementDaysValue, - calculateAutostopRequirementDaysValue, -} from "utils/schedule"; import { FormSection, HorizontalForm, @@ -22,11 +16,22 @@ import { } from "components/Form/Form"; import { Stack } from "components/Stack/Stack"; import { TemplateScheduleAutostart } from "modules/templates/TemplateScheduleAutostart/TemplateScheduleAutostart"; +import { docs } from "utils/docs"; +import { getFormHelpers } from "utils/formUtils"; import { - useWorkspacesToGoDormant, - useWorkspacesToBeDeleted, -} from "./useWorkspacesToBeDeleted"; -import { TemplateScheduleFormValues, getValidationSchema } from "./formHelpers"; + calculateAutostopRequirementDaysValue, + type TemplateAutostartRequirementDaysValue, +} from "utils/schedule"; +import { + AutostopRequirementDaysHelperText, + AutostopRequirementWeeksHelperText, + convertAutostopRequirementDaysValue, +} from "./AutostopRequirementHelperText"; +import { + getValidationSchema, + type TemplateScheduleFormValues, +} from "./formHelpers"; +import { ScheduleDialog } from "./ScheduleDialog"; import { ActivityBumpHelperText, DefaultTTLHelperText, @@ -35,12 +40,10 @@ import { FailureTTLHelperText, MaxTTLHelperText, } from "./TTLHelperText"; -import { ScheduleDialog } from "./ScheduleDialog"; import { - AutostopRequirementDaysHelperText, - AutostopRequirementWeeksHelperText, - convertAutostopRequirementDaysValue, -} from "./AutostopRequirementHelperText"; + useWorkspacesToGoDormant, + useWorkspacesToBeDeleted, +} from "./useWorkspacesToBeDeleted"; const MS_HOUR_CONVERSION = 3600000; const MS_DAY_CONVERSION = 86400000; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.test.tsx index 9322e424a3..b8880f17c4 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.test.tsx @@ -10,7 +10,10 @@ import { renderWithTemplateSettingsLayout, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; -import { TemplateScheduleFormValues, getValidationSchema } from "./formHelpers"; +import { + getValidationSchema, + type TemplateScheduleFormValues, +} from "./formHelpers"; import TemplateSchedulePage from "./TemplateSchedulePage"; const validFormValues: TemplateScheduleFormValues = { diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.tsx index 5c8cff6184..59111ddd4b 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePage.tsx @@ -1,14 +1,14 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQueryClient } from "react-query"; import { useNavigate, useParams } from "react-router-dom"; import { updateTemplateMeta } from "api/api"; -import type { UpdateTemplateMeta } from "api/typesGenerated"; import { templateByNameKey } from "api/queries/templates"; +import type { UpdateTemplateMeta } from "api/typesGenerated"; +import { displaySuccess } from "components/GlobalSnackbar/utils"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { useDashboard } from "modules/dashboard/useDashboard"; import { pageTitle } from "utils/page"; -import { displaySuccess } from "components/GlobalSnackbar/utils"; import { useTemplateSettings } from "../TemplateSettingsLayout"; import { TemplateSchedulePageView } from "./TemplateSchedulePageView"; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.stories.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.stories.tsx index 65b8a36a5c..ec8da157cc 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.stories.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.stories.tsx @@ -1,8 +1,8 @@ import { action } from "@storybook/addon-actions"; -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; +import { QueryClient, QueryClientProvider } from "react-query"; import { MockTemplate } from "testHelpers/entities"; import { TemplateSchedulePageView } from "./TemplateSchedulePageView"; -import { QueryClient, QueryClientProvider } from "react-query"; const queryClient = new QueryClient({ defaultOptions: { diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.tsx index 8ad9c4d139..2ff102d61d 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/TemplateSchedulePageView.tsx @@ -1,4 +1,4 @@ -import { type ComponentProps, type FC } from "react"; +import type { ComponentProps, FC } from "react"; import type { Template, UpdateTemplateMeta } from "api/typesGenerated"; import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { TemplateScheduleForm } from "./TemplateScheduleForm"; diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/formHelpers.tsx b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/formHelpers.tsx index 8c6baa8106..a4be76a254 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/formHelpers.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/formHelpers.tsx @@ -1,9 +1,9 @@ -import { UpdateTemplateMeta } from "api/typesGenerated"; -import { +import * as Yup from "yup"; +import type { UpdateTemplateMeta } from "api/typesGenerated"; +import type { TemplateAutostartRequirementDaysValue, TemplateAutostopRequirementDaysValue, } from "utils/schedule"; -import * as Yup from "yup"; export interface TemplateScheduleFormValues extends Omit< diff --git a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/useWorkspacesToBeDeleted.ts b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/useWorkspacesToBeDeleted.ts index 19164c4810..978825dd00 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/useWorkspacesToBeDeleted.ts +++ b/site/src/pages/TemplateSettingsPage/TemplateSchedulePage/useWorkspacesToBeDeleted.ts @@ -1,7 +1,7 @@ import { compareAsc } from "date-fns"; -import { Workspace, Template } from "api/typesGenerated"; -import { TemplateScheduleFormValues } from "./formHelpers"; +import type { Workspace, Template } from "api/typesGenerated"; import { useWorkspacesData } from "pages/WorkspacesPage/data"; +import type { TemplateScheduleFormValues } from "./formHelpers"; export const useWorkspacesToGoDormant = ( template: Template, diff --git a/site/src/pages/TemplateSettingsPage/TemplateSettingsLayout.tsx b/site/src/pages/TemplateSettingsPage/TemplateSettingsLayout.tsx index 01c4d99716..207b828b1a 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateSettingsLayout.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateSettingsLayout.tsx @@ -2,8 +2,6 @@ import { createContext, type FC, Suspense, useContext } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { Outlet, useParams } from "react-router-dom"; -import { pageTitle } from "utils/page"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { checkAuthorization } from "api/queries/authCheck"; import { templateByName } from "api/queries/templates"; import type { AuthorizationResponse, Template } from "api/typesGenerated"; @@ -11,6 +9,8 @@ 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 { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { pageTitle } from "utils/page"; import { Sidebar } from "./Sidebar"; const TemplateSettings = createContext< diff --git a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariableField.tsx b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariableField.tsx index 1c9cbfacb9..a5de3308e4 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariableField.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariableField.tsx @@ -2,10 +2,10 @@ import FormControlLabel from "@mui/material/FormControlLabel"; import Radio from "@mui/material/Radio"; import RadioGroup from "@mui/material/RadioGroup"; import TextField from "@mui/material/TextField"; -import { TemplateVersionVariable } from "api/typesGenerated"; -import { FC, useState } from "react"; +import { type FC, useState } from "react"; +import type { TemplateVersionVariable } from "api/typesGenerated"; -export const SensitiveVariableHelperText = () => { +export const SensitiveVariableHelperText: FC = () => { return ( This variable is sensitive. The previous value will be used if empty. diff --git a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesForm.tsx b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesForm.tsx index a455b3dae4..ce43d1a20e 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesForm.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesForm.tsx @@ -1,19 +1,19 @@ -import { +import { type FormikContextType, type FormikTouched, useFormik } from "formik"; +import type { FC } from "react"; +import * as Yup from "yup"; +import type { CreateTemplateVersionRequest, TemplateVersion, TemplateVersionVariable, VariableValue, } from "api/typesGenerated"; -import { FormikContextType, FormikTouched, useFormik } from "formik"; -import { FC } from "react"; -import { getFormHelpers } from "utils/formUtils"; -import * as Yup from "yup"; import { FormFields, FormSection, HorizontalForm, FormFooter, } from "components/Form/Form"; +import { getFormHelpers } from "utils/formUtils"; import { SensitiveVariableHelperText, TemplateVariableField, diff --git a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPage.test.tsx b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPage.test.tsx index 2ce13b21fb..c123a31769 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPage.test.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPage.test.tsx @@ -1,11 +1,6 @@ import { screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import { - renderWithTemplateSettingsLayout, - waitForLoaderToBeRemoved, -} from "testHelpers/renderHelpers"; import * as API from "api/api"; -import TemplateVariablesPage from "./TemplateVariablesPage"; import { Language as FooterFormLanguage } from "components/FormFooter/FormFooter"; import { MockTemplate, @@ -14,7 +9,12 @@ import { MockTemplateVersionVariable2, MockTemplateVersion2, } from "testHelpers/entities"; +import { + renderWithTemplateSettingsLayout, + waitForLoaderToBeRemoved, +} from "testHelpers/renderHelpers"; import { delay } from "utils/delay"; +import TemplateVariablesPage from "./TemplateVariablesPage"; const validFormValues = { first_variable: "Hello world", diff --git a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPage.tsx b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPage.tsx index e98bde030a..50e21d83ac 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPage.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPage.tsx @@ -2,22 +2,22 @@ import { useCallback, type FC } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQuery, useQueryClient } from "react-query"; import { useNavigate, useParams } from "react-router-dom"; -import type { - CreateTemplateVersionRequest, - TemplateVersionVariable, - VariableValue, -} from "api/typesGenerated"; -import { displaySuccess } from "components/GlobalSnackbar/utils"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; -import { pageTitle } from "utils/page"; import { createAndBuildTemplateVersion, templateVersion, templateVersionVariables, updateActiveTemplateVersion, } from "api/queries/templates"; +import type { + CreateTemplateVersionRequest, + TemplateVersionVariable, + VariableValue, +} from "api/typesGenerated"; import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { displaySuccess } from "components/GlobalSnackbar/utils"; import { Loader } from "components/Loader/Loader"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { pageTitle } from "utils/page"; import { useTemplateSettings } from "../TemplateSettingsLayout"; import { TemplateVariablesPageView } from "./TemplateVariablesPageView"; diff --git a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx index 4456488379..ee03b8c3f3 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { mockApiError, MockTemplateVersion, @@ -8,7 +9,6 @@ import { MockTemplateVersionVariable5, } from "testHelpers/entities"; import { TemplateVariablesPageView } from "./TemplateVariablesPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/TemplateSettingsPage/TemplateVariablesPageView", diff --git a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.tsx b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.tsx index 5a2f1e9d83..7b1ad61dc0 100644 --- a/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.tsx +++ b/site/src/pages/TemplateSettingsPage/TemplateVariablesPage/TemplateVariablesPageView.tsx @@ -1,12 +1,12 @@ -import { type ComponentProps, type FC } from "react"; +import type { ComponentProps, FC } from "react"; import type { CreateTemplateVersionRequest, TemplateVersion, TemplateVersionVariable, } from "api/typesGenerated"; import { Alert } from "components/Alert/Alert"; -import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { Stack } from "components/Stack/Stack"; import { TemplateVariablesForm } from "./TemplateVariablesForm"; diff --git a/site/src/pages/TemplateVersionEditorPage/FileDialog.tsx b/site/src/pages/TemplateVersionEditorPage/FileDialog.tsx index e9b7e1a245..5611db5ab0 100644 --- a/site/src/pages/TemplateVersionEditorPage/FileDialog.tsx +++ b/site/src/pages/TemplateVersionEditorPage/FileDialog.tsx @@ -1,7 +1,7 @@ import TextField from "@mui/material/TextField"; +import { type ChangeEvent, type FC, useState } from "react"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { Stack } from "components/Stack/Stack"; -import { type ChangeEvent, type FC, useState } from "react"; import { type FileTree, isFolder, validatePath } from "utils/filetree"; interface CreateFileDialogProps { diff --git a/site/src/pages/TemplateVersionEditorPage/MissingTemplateVariablesDialog.tsx b/site/src/pages/TemplateVersionEditorPage/MissingTemplateVariablesDialog.tsx index 2d50c5bb86..289806fa6a 100644 --- a/site/src/pages/TemplateVersionEditorPage/MissingTemplateVariablesDialog.tsx +++ b/site/src/pages/TemplateVersionEditorPage/MissingTemplateVariablesDialog.tsx @@ -1,20 +1,20 @@ import { css } from "@emotion/css"; -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; +import Button from "@mui/material/Button"; import Dialog from "@mui/material/Dialog"; +import DialogActions from "@mui/material/DialogActions"; import DialogContent from "@mui/material/DialogContent"; import DialogContentText from "@mui/material/DialogContentText"; import DialogTitle from "@mui/material/DialogTitle"; -import { type DialogProps } from "components/Dialogs/Dialog"; import { type FC, useEffect, useState } from "react"; -import { FormFields, VerticalForm } from "components/Form/Form"; import type { TemplateVersionVariable, VariableValue, } from "api/typesGenerated"; -import DialogActions from "@mui/material/DialogActions"; -import Button from "@mui/material/Button"; -import { VariableInput } from "pages/CreateTemplatePage/VariableInput"; +import type { DialogProps } from "components/Dialogs/Dialog"; +import { FormFields, VerticalForm } from "components/Form/Form"; import { Loader } from "components/Loader/Loader"; +import { VariableInput } from "pages/CreateTemplatePage/VariableInput"; export type MissingTemplateVariablesDialogProps = Omit< DialogProps, diff --git a/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.stories.tsx b/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.stories.tsx index 818f92fac6..5097d100cd 100644 --- a/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.stories.tsx +++ b/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.stories.tsx @@ -1,5 +1,5 @@ -import type { Meta, StoryObj } from "@storybook/react"; import { useArgs } from "@storybook/preview-api"; +import type { Meta, StoryObj } from "@storybook/react"; import { chromatic } from "testHelpers/chromatic"; import { MockTemplateVersion } from "testHelpers/entities"; import { ProvisionerTagsPopover } from "./ProvisionerTagsPopover"; diff --git a/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.test.tsx b/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.test.tsx index 5db8a90f80..a6b793fe68 100644 --- a/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.test.tsx +++ b/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.test.tsx @@ -1,8 +1,8 @@ +import { fireEvent, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { MockTemplateVersion } from "testHelpers/entities"; import { renderComponent } from "testHelpers/renderHelpers"; import { ProvisionerTagsPopover } from "./ProvisionerTagsPopover"; -import { fireEvent, screen } from "@testing-library/react"; -import { MockTemplateVersion } from "testHelpers/entities"; -import userEvent from "@testing-library/user-event"; let tags = MockTemplateVersion.job.tags; diff --git a/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.tsx b/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.tsx index 07c5f7df07..76022825e0 100644 --- a/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.tsx +++ b/site/src/pages/TemplateVersionEditorPage/ProvisionerTagsPopover.tsx @@ -1,23 +1,23 @@ -import { Stack } from "components/Stack/Stack"; +import AddIcon from "@mui/icons-material/Add"; +import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined"; +import Button from "@mui/material/Button"; +import Link from "@mui/material/Link"; +import TextField from "@mui/material/TextField"; +import useTheme from "@mui/system/useTheme"; +import { useFormik } from "formik"; +import { Fragment, type FC } from "react"; +import * as Yup from "yup"; +import { FormFields, FormSection, VerticalForm } from "components/Form/Form"; import { TopbarButton } from "components/FullPageLayout/Topbar"; import { Popover, PopoverContent, PopoverTrigger, } from "components/Popover/Popover"; +import { Stack } from "components/Stack/Stack"; import { ProvisionerTag } from "pages/HealthPage/ProvisionerDaemonsPage"; -import { Fragment, type FC } from "react"; -import useTheme from "@mui/system/useTheme"; -import { useFormik } from "formik"; -import * as Yup from "yup"; -import { getFormHelpers, onChangeTrimmed } from "utils/formUtils"; -import { FormFields, FormSection, VerticalForm } from "components/Form/Form"; -import TextField from "@mui/material/TextField"; -import Button from "@mui/material/Button"; -import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined"; -import AddIcon from "@mui/icons-material/Add"; -import Link from "@mui/material/Link"; import { docs } from "utils/docs"; +import { getFormHelpers, onChangeTrimmed } from "utils/formUtils"; const initialValues = { key: "", diff --git a/site/src/pages/TemplateVersionEditorPage/PublishTemplateVersionDialog.tsx b/site/src/pages/TemplateVersionEditorPage/PublishTemplateVersionDialog.tsx index d572bcdef2..b4e66480df 100644 --- a/site/src/pages/TemplateVersionEditorPage/PublishTemplateVersionDialog.tsx +++ b/site/src/pages/TemplateVersionEditorPage/PublishTemplateVersionDialog.tsx @@ -1,15 +1,15 @@ -import { DialogProps } from "components/Dialogs/Dialog"; -import { FC } from "react"; -import { getFormHelpers } from "utils/formUtils"; -import { FormFields } from "components/Form/Form"; -import { useFormik } from "formik"; -import * as Yup from "yup"; -import { PublishVersionData } from "pages/TemplateVersionEditorPage/types"; -import TextField from "@mui/material/TextField"; -import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import Checkbox from "@mui/material/Checkbox"; import FormControlLabel from "@mui/material/FormControlLabel"; +import TextField from "@mui/material/TextField"; +import { useFormik } from "formik"; +import type { FC } from "react"; +import * as Yup from "yup"; +import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; +import type { DialogProps } from "components/Dialogs/Dialog"; +import { FormFields } from "components/Form/Form"; import { Stack } from "components/Stack/Stack"; +import type { PublishVersionData } from "pages/TemplateVersionEditorPage/types"; +import { getFormHelpers } from "utils/formUtils"; export const Language = { versionNameLabel: "Version name", diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx index 2a85541d79..4dbff36a1a 100644 --- a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx +++ b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx @@ -1,18 +1,19 @@ +import { type Interpolation, type Theme, useTheme } from "@emotion/react"; +import CreateIcon from "@mui/icons-material/AddOutlined"; +import ArrowBackOutlined from "@mui/icons-material/ArrowBackOutlined"; +import CloseOutlined from "@mui/icons-material/CloseOutlined"; +import PlayArrowOutlined from "@mui/icons-material/PlayArrowOutlined"; +import WarningOutlined from "@mui/icons-material/WarningOutlined"; +import AlertTitle from "@mui/material/AlertTitle"; import Button from "@mui/material/Button"; +import ButtonGroup from "@mui/material/ButtonGroup"; import IconButton from "@mui/material/IconButton"; import Tooltip from "@mui/material/Tooltip"; -import CreateIcon from "@mui/icons-material/AddOutlined"; +import { type FC, useCallback, useEffect, useRef, useState } from "react"; import { Link as RouterLink, unstable_usePrompt as usePrompt, } from "react-router-dom"; -import { type Interpolation, type Theme, useTheme } from "@emotion/react"; -import { type FC, useCallback, useEffect, useRef, useState } from "react"; -import AlertTitle from "@mui/material/AlertTitle"; -import ButtonGroup from "@mui/material/ButtonGroup"; -import ArrowBackOutlined from "@mui/icons-material/ArrowBackOutlined"; -import CloseOutlined from "@mui/icons-material/CloseOutlined"; -import PlayArrowOutlined from "@mui/icons-material/PlayArrowOutlined"; import type { ProvisionerJobLog, Template, @@ -22,13 +23,26 @@ import type { WorkspaceResource, } from "api/typesGenerated"; import { Alert, AlertDetail } from "components/Alert/Alert"; +import { Sidebar } from "components/FullPageLayout/Sidebar"; +import { + Topbar, + TopbarAvatar, + TopbarButton, + TopbarData, + TopbarDivider, + TopbarIconButton, +} from "components/FullPageLayout/Topbar"; +import { Loader } from "components/Loader/Loader"; +import { isBinaryData } from "modules/templates/TemplateFiles/isBinaryData"; +import { TemplateFileTree } from "modules/templates/TemplateFiles/TemplateFileTree"; import { TemplateResourcesTable } from "modules/templates/TemplateResourcesTable/TemplateResourcesTable"; import { WorkspaceBuildLogs } from "modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs"; -import { PublishVersionData } from "pages/TemplateVersionEditorPage/types"; +import type { PublishVersionData } from "pages/TemplateVersionEditorPage/types"; +import { MONOSPACE_FONT_FAMILY } from "theme/constants"; import { createFile, existsFile, - FileTree, + type FileTree, getFileText, isFolder, moveFile, @@ -40,25 +54,11 @@ import { DeleteFileDialog, RenameFileDialog, } from "./FileDialog"; -import { TemplateFileTree } from "modules/templates/TemplateFiles/TemplateFileTree"; import { MissingTemplateVariablesDialog } from "./MissingTemplateVariablesDialog"; import { MonacoEditor } from "./MonacoEditor"; +import { ProvisionerTagsPopover } from "./ProvisionerTagsPopover"; import { PublishTemplateVersionDialog } from "./PublishTemplateVersionDialog"; import { TemplateVersionStatusBadge } from "./TemplateVersionStatusBadge"; -import { MONOSPACE_FONT_FAMILY } from "theme/constants"; -import { Loader } from "components/Loader/Loader"; -import { - Topbar, - TopbarAvatar, - TopbarButton, - TopbarData, - TopbarDivider, - TopbarIconButton, -} from "components/FullPageLayout/Topbar"; -import { Sidebar } from "components/FullPageLayout/Sidebar"; -import { ProvisionerTagsPopover } from "./ProvisionerTagsPopover"; -import WarningOutlined from "@mui/icons-material/WarningOutlined"; -import { isBinaryData } from "modules/templates/TemplateFiles/isBinaryData"; type Tab = "logs" | "resources" | undefined; // Undefined is to hide the tab diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.test.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.test.tsx index ba791f3061..39f44f7d23 100644 --- a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.test.tsx +++ b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.test.tsx @@ -1,11 +1,13 @@ -import { - renderWithAuth, - waitForLoaderToBeRemoved, -} from "testHelpers/renderHelpers"; -import TemplateVersionEditorPage from "./TemplateVersionEditorPage"; import { render, screen, waitFor, within } from "@testing-library/react"; -import userEvent, { UserEvent } from "@testing-library/user-event"; +import userEvent, { type UserEvent } from "@testing-library/user-event"; +import { rest } from "msw"; +import { QueryClient } from "react-query"; +import { RouterProvider, createMemoryRouter } from "react-router-dom"; import * as api from "api/api"; +import { templateVersionVariablesKey } from "api/queries/templates"; +import type { TemplateVersion } from "api/typesGenerated"; +import { AppProviders } from "App"; +import { RequireAuth } from "contexts/auth/RequireAuth"; import { MockTemplate, MockTemplateVersion, @@ -13,16 +15,14 @@ import { MockTemplateVersionVariable2, MockWorkspaceBuildLogs, } from "testHelpers/entities"; -import { Language } from "./PublishTemplateVersionDialog"; -import { QueryClient } from "react-query"; -import { templateVersionVariablesKey } from "api/queries/templates"; -import { RouterProvider, createMemoryRouter } from "react-router-dom"; -import { RequireAuth } from "contexts/auth/RequireAuth"; +import { + renderWithAuth, + waitForLoaderToBeRemoved, +} from "testHelpers/renderHelpers"; import { server } from "testHelpers/server"; -import { rest } from "msw"; -import { AppProviders } from "App"; -import { TemplateVersion } from "api/typesGenerated"; -import { MonacoEditorProps } from "./MonacoEditor"; +import type { MonacoEditorProps } from "./MonacoEditor"; +import { Language } from "./PublishTemplateVersionDialog"; +import TemplateVersionEditorPage from "./TemplateVersionEditorPage"; // For some reason this component in Jest is throwing a MUI style warning so, // since we don't need it for this test, we can mock it out diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.tsx index 2c8abbde51..67af391df3 100644 --- a/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.tsx +++ b/site/src/pages/TemplateVersionEditorPage/TemplateVersionEditorPage.tsx @@ -2,14 +2,8 @@ import { type FC, useEffect, useState } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQuery, useQueryClient } from "react-query"; import { useNavigate, useParams, useSearchParams } from "react-router-dom"; -import { TemplateVersionEditor } from "./TemplateVersionEditor"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; -import { pageTitle } from "utils/page"; import { patchTemplateVersion, updateActiveTemplateVersion } from "api/api"; -import type { - PatchTemplateVersionRequest, - TemplateVersion, -} from "api/typesGenerated"; +import { file, uploadFile } from "api/queries/files"; import { createTemplateVersion, resources, @@ -18,13 +12,19 @@ import { templateVersionByName, templateVersionVariables, } from "api/queries/templates"; -import { file, uploadFile } from "api/queries/files"; -import { TarReader, TarWriter } from "utils/tar"; -import { FileTree, traverse } from "utils/filetree"; -import { createTemplateVersionFileTree } from "utils/templateVersion"; +import type { + PatchTemplateVersionRequest, + TemplateVersion, +} from "api/typesGenerated"; import { displayError } from "components/GlobalSnackbar/utils"; import { FullScreenLoader } from "components/Loader/FullScreenLoader"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { useWatchVersionLogs } from "modules/templates/useWatchVersionLogs"; +import { type FileTree, traverse } from "utils/filetree"; +import { pageTitle } from "utils/page"; +import { TarReader, TarWriter } from "utils/tar"; +import { createTemplateVersionFileTree } from "utils/templateVersion"; +import { TemplateVersionEditor } from "./TemplateVersionEditor"; type Params = { version: string; diff --git a/site/src/pages/TemplateVersionEditorPage/TemplateVersionStatusBadge.tsx b/site/src/pages/TemplateVersionEditorPage/TemplateVersionStatusBadge.tsx index 2ec858e9ee..625927020d 100644 --- a/site/src/pages/TemplateVersionEditorPage/TemplateVersionStatusBadge.tsx +++ b/site/src/pages/TemplateVersionEditorPage/TemplateVersionStatusBadge.tsx @@ -1,9 +1,9 @@ -import { type FC, type ReactNode } from "react"; -import ErrorIcon from "@mui/icons-material/ErrorOutline"; import CheckIcon from "@mui/icons-material/CheckOutlined"; +import ErrorIcon from "@mui/icons-material/ErrorOutline"; +import type { FC, ReactNode } from "react"; import type { TemplateVersion } from "api/typesGenerated"; -import { type ThemeRole } from "theme/roles"; import { Pill, PillSpinner } from "components/Pill/Pill"; +import type { ThemeRole } from "theme/roles"; interface TemplateVersionStatusBadgeProps { version: TemplateVersion; diff --git a/site/src/pages/TemplateVersionPage/TemplateVersionPage.test.tsx b/site/src/pages/TemplateVersionPage/TemplateVersionPage.test.tsx index 6b386ab394..9430866207 100644 --- a/site/src/pages/TemplateVersionPage/TemplateVersionPage.test.tsx +++ b/site/src/pages/TemplateVersionPage/TemplateVersionPage.test.tsx @@ -1,11 +1,11 @@ +import { screen, within } from "@testing-library/react"; import { renderWithAuth, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; -import TemplateVersionPage from "./TemplateVersionPage"; -import * as templateVersionUtils from "utils/templateVersion"; -import { screen, within } from "@testing-library/react"; import * as CreateDayString from "utils/createDayString"; +import * as templateVersionUtils from "utils/templateVersion"; +import TemplateVersionPage from "./TemplateVersionPage"; const TEMPLATE_NAME = "coder-ts"; const VERSION_NAME = "12345"; diff --git a/site/src/pages/TemplateVersionPage/TemplateVersionPage.tsx b/site/src/pages/TemplateVersionPage/TemplateVersionPage.tsx index bb307dac66..917b723e48 100644 --- a/site/src/pages/TemplateVersionPage/TemplateVersionPage.tsx +++ b/site/src/pages/TemplateVersionPage/TemplateVersionPage.tsx @@ -2,16 +2,16 @@ import { type FC, useMemo } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { useParams } from "react-router-dom"; -import { usePermissions } from "contexts/auth/usePermissions"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; -import { pageTitle } from "utils/page"; -import TemplateVersionPageView from "./TemplateVersionPageView"; import { templateByName, templateFiles, templateVersion, templateVersionByName, } from "api/queries/templates"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { usePermissions } from "contexts/auth/usePermissions"; +import { pageTitle } from "utils/page"; +import TemplateVersionPageView from "./TemplateVersionPageView"; type Params = { version: string; diff --git a/site/src/pages/TemplateVersionPage/TemplateVersionPageView.stories.tsx b/site/src/pages/TemplateVersionPage/TemplateVersionPageView.stories.tsx index 8820009bd2..1d04cf5991 100644 --- a/site/src/pages/TemplateVersionPage/TemplateVersionPageView.stories.tsx +++ b/site/src/pages/TemplateVersionPage/TemplateVersionPageView.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { mockApiError, MockTemplate, @@ -6,9 +7,8 @@ import { } from "testHelpers/entities"; import { TemplateVersionPageView, - TemplateVersionPageViewProps, + type TemplateVersionPageViewProps, } from "./TemplateVersionPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const readmeContent = `--- name:Template test diff --git a/site/src/pages/TemplateVersionPage/TemplateVersionPageView.tsx b/site/src/pages/TemplateVersionPage/TemplateVersionPageView.tsx index 13ccb9bb70..c9de8562d5 100644 --- a/site/src/pages/TemplateVersionPage/TemplateVersionPageView.tsx +++ b/site/src/pages/TemplateVersionPage/TemplateVersionPageView.tsx @@ -1,8 +1,10 @@ -import Button from "@mui/material/Button"; import AddIcon from "@mui/icons-material/Add"; import EditIcon from "@mui/icons-material/Edit"; -import { type FC } from "react"; +import Button from "@mui/material/Button"; +import type { FC } from "react"; import { Link as RouterLink } from "react-router-dom"; +import type { TemplateVersion } from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Loader } from "components/Loader/Loader"; import { Margins } from "components/Margins/Margins"; import { @@ -13,11 +15,9 @@ import { import { Stack } from "components/Stack/Stack"; import { Stats, StatsItem } from "components/Stats/Stats"; import { TemplateFiles } from "modules/templates/TemplateFiles/TemplateFiles"; -import type { TemplateVersion } from "api/typesGenerated"; -import { createDayString } from "utils/createDayString"; -import { TemplateVersionFiles } from "utils/templateVersion"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; import { TemplateUpdateMessage } from "modules/templates/TemplateUpdateMessage"; +import { createDayString } from "utils/createDayString"; +import type { TemplateVersionFiles } from "utils/templateVersion"; export interface TemplateVersionPageViewProps { versionName: string; diff --git a/site/src/pages/TemplatesPage/CreateTemplateButton.stories.tsx b/site/src/pages/TemplatesPage/CreateTemplateButton.stories.tsx index c1c965662c..4022fd3b07 100644 --- a/site/src/pages/TemplatesPage/CreateTemplateButton.stories.tsx +++ b/site/src/pages/TemplatesPage/CreateTemplateButton.stories.tsx @@ -1,6 +1,6 @@ -import { CreateTemplateButton } from "./CreateTemplateButton"; import type { Meta, StoryObj } from "@storybook/react"; import { userEvent, screen } from "@storybook/test"; +import { CreateTemplateButton } from "./CreateTemplateButton"; const meta: Meta = { title: "pages/TemplatesPage/CreateTemplateButton", diff --git a/site/src/pages/TemplatesPage/CreateTemplateButton.tsx b/site/src/pages/TemplatesPage/CreateTemplateButton.tsx index 12057045d6..f5b2b68a3e 100644 --- a/site/src/pages/TemplatesPage/CreateTemplateButton.tsx +++ b/site/src/pages/TemplatesPage/CreateTemplateButton.tsx @@ -1,15 +1,15 @@ -import Button from "@mui/material/Button"; import AddIcon from "@mui/icons-material/AddOutlined"; +import Inventory2 from "@mui/icons-material/Inventory2"; +import NoteAddOutlined from "@mui/icons-material/NoteAddOutlined"; +import UploadOutlined from "@mui/icons-material/UploadOutlined"; +import Button from "@mui/material/Button"; +import type { FC } from "react"; import { MoreMenu, MoreMenuContent, MoreMenuItem, MoreMenuTrigger, } from "components/MoreMenu/MoreMenu"; -import NoteAddOutlined from "@mui/icons-material/NoteAddOutlined"; -import UploadOutlined from "@mui/icons-material/UploadOutlined"; -import Inventory2 from "@mui/icons-material/Inventory2"; -import { FC } from "react"; type CreateTemplateButtonProps = { onNavigate: (path: string) => void; diff --git a/site/src/pages/TemplatesPage/EmptyTemplates.tsx b/site/src/pages/TemplatesPage/EmptyTemplates.tsx index 372c3dd326..7bbf168301 100644 --- a/site/src/pages/TemplatesPage/EmptyTemplates.tsx +++ b/site/src/pages/TemplatesPage/EmptyTemplates.tsx @@ -1,8 +1,8 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import Button from "@mui/material/Button"; import Link from "@mui/material/Link"; +import type { FC } from "react"; import { Link as RouterLink } from "react-router-dom"; -import { type FC } from "react"; import type { TemplateExample } from "api/typesGenerated"; import { CodeExample } from "components/CodeExample/CodeExample"; import { Stack } from "components/Stack/Stack"; diff --git a/site/src/pages/TemplatesPage/TemplatesPage.test.tsx b/site/src/pages/TemplatesPage/TemplatesPage.test.tsx index b91c4aa96e..6703624163 100644 --- a/site/src/pages/TemplatesPage/TemplatesPage.test.tsx +++ b/site/src/pages/TemplatesPage/TemplatesPage.test.tsx @@ -1,9 +1,9 @@ import { render, screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; +import { RouterProvider, createMemoryRouter } from "react-router-dom"; import { AppProviders } from "App"; import { RequireAuth } from "contexts/auth/RequireAuth"; -import { RouterProvider, createMemoryRouter } from "react-router-dom"; import TemplatesPage from "./TemplatesPage"; -import userEvent from "@testing-library/user-event"; test("create template from scratch", async () => { const user = userEvent.setup(); diff --git a/site/src/pages/TemplatesPage/TemplatesPage.tsx b/site/src/pages/TemplatesPage/TemplatesPage.tsx index 33ca81fee0..e19c39572f 100644 --- a/site/src/pages/TemplatesPage/TemplatesPage.tsx +++ b/site/src/pages/TemplatesPage/TemplatesPage.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { templateExamples, templates } from "api/queries/templates"; diff --git a/site/src/pages/TemplatesPage/TemplatesPageView.tsx b/site/src/pages/TemplatesPage/TemplatesPageView.tsx index 9b71a3ca3e..fd7be676da 100644 --- a/site/src/pages/TemplatesPage/TemplatesPageView.tsx +++ b/site/src/pages/TemplatesPage/TemplatesPageView.tsx @@ -1,19 +1,30 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; +import ArrowForwardOutlined from "@mui/icons-material/ArrowForwardOutlined"; import Button from "@mui/material/Button"; +import Skeleton from "@mui/material/Skeleton"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import { type FC } from "react"; +import type { FC } from "react"; import { useNavigate } from "react-router-dom"; -import { createDayString } from "utils/createDayString"; -import { - formatTemplateBuildTime, - formatTemplateActiveDevelopers, -} from "utils/templates"; +import type { Template, TemplateExample } from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { ExternalAvatar } from "components/Avatar/Avatar"; import { AvatarData } from "components/AvatarData/AvatarData"; +import { AvatarDataSkeleton } from "components/AvatarData/AvatarDataSkeleton"; +import { DeprecatedBadge } from "components/Badges/Badges"; +import { + HelpTooltip, + HelpTooltipContent, + HelpTooltipLink, + HelpTooltipLinksGroup, + HelpTooltipText, + HelpTooltipTitle, + HelpTooltipTrigger, +} from "components/HelpTooltip/HelpTooltip"; import { Margins } from "components/Margins/Margins"; import { PageHeader, @@ -25,26 +36,15 @@ import { TableLoaderSkeleton, TableRowSkeleton, } from "components/TableLoader/TableLoader"; -import { - HelpTooltip, - HelpTooltipContent, - HelpTooltipLink, - HelpTooltipLinksGroup, - HelpTooltipText, - HelpTooltipTitle, - HelpTooltipTrigger, -} from "components/HelpTooltip/HelpTooltip"; -import { EmptyTemplates } from "./EmptyTemplates"; import { useClickableTableRow } from "hooks/useClickableTableRow"; -import type { Template, TemplateExample } from "api/typesGenerated"; -import ArrowForwardOutlined from "@mui/icons-material/ArrowForwardOutlined"; -import { ExternalAvatar } from "components/Avatar/Avatar"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { createDayString } from "utils/createDayString"; import { docs } from "utils/docs"; -import Skeleton from "@mui/material/Skeleton"; -import { AvatarDataSkeleton } from "components/AvatarData/AvatarDataSkeleton"; -import { DeprecatedBadge } from "components/Badges/Badges"; +import { + formatTemplateBuildTime, + formatTemplateActiveDevelopers, +} from "utils/templates"; import { CreateTemplateButton } from "./CreateTemplateButton"; +import { EmptyTemplates } from "./EmptyTemplates"; export const Language = { developerCount: (activeCount: number): string => { diff --git a/site/src/pages/TerminalPage/TerminalAlerts.tsx b/site/src/pages/TerminalPage/TerminalAlerts.tsx index ba4f8a8470..34cea27881 100644 --- a/site/src/pages/TerminalPage/TerminalAlerts.tsx +++ b/site/src/pages/TerminalPage/TerminalAlerts.tsx @@ -1,7 +1,7 @@ import Button from "@mui/material/Button"; import Link from "@mui/material/Link"; -import { Alert, AlertProps } from "components/Alert/Alert"; import { type FC, useState } from "react"; +import { Alert, type AlertProps } from "components/Alert/Alert"; import { docs } from "utils/docs"; export const ErrorScriptAlert: FC = () => { diff --git a/site/src/pages/TerminalPage/TerminalPage.test.tsx b/site/src/pages/TerminalPage/TerminalPage.test.tsx index c6f9aee136..8978cc257a 100644 --- a/site/src/pages/TerminalPage/TerminalPage.test.tsx +++ b/site/src/pages/TerminalPage/TerminalPage.test.tsx @@ -1,20 +1,20 @@ -import { waitFor } from "@testing-library/react"; import "jest-canvas-mock"; +import { waitFor } from "@testing-library/react"; import WS from "jest-websocket-mock"; import { rest } from "msw"; +import { TextDecoder, TextEncoder } from "util"; +import * as API from "api/api"; import { MockUser, MockWorkspace, MockWorkspaceAgent, } from "testHelpers/entities"; -import { TextDecoder, TextEncoder } from "util"; import { renderWithAuth, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; import { server } from "testHelpers/server"; import TerminalPage, { Language } from "./TerminalPage"; -import * as API from "api/api"; Object.defineProperty(window, "matchMedia", { writable: true, diff --git a/site/src/pages/TerminalPage/TerminalPage.tsx b/site/src/pages/TerminalPage/TerminalPage.tsx index 312200d24d..410c45d1d2 100644 --- a/site/src/pages/TerminalPage/TerminalPage.tsx +++ b/site/src/pages/TerminalPage/TerminalPage.tsx @@ -1,18 +1,23 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import "xterm/css/xterm.css"; +import type { Interpolation, Theme } from "@emotion/react"; import { type FC, useCallback, useEffect, useRef, useState } from "react"; import { Helmet } from "react-helmet-async"; +import { useQuery } from "react-query"; import { useNavigate, useParams, useSearchParams } from "react-router-dom"; import { v4 as uuidv4 } from "uuid"; import * as XTerm from "xterm"; -import { WebglAddon } from "xterm-addon-webgl"; import { CanvasAddon } from "xterm-addon-canvas"; import { FitAddon } from "xterm-addon-fit"; -import { WebLinksAddon } from "xterm-addon-web-links"; import { Unicode11Addon } from "xterm-addon-unicode11"; -import "xterm/css/xterm.css"; +import { WebLinksAddon } from "xterm-addon-web-links"; +import { WebglAddon } from "xterm-addon-webgl"; +import { deploymentConfig } from "api/queries/deployment"; +import { workspaceByOwnerAndName } from "api/queries/workspaces"; +import { useProxy } from "contexts/ProxyContext"; +import { ThemeOverride } from "contexts/ThemeProvider"; +import themes from "theme"; import { MONOSPACE_FONT_FAMILY } from "theme/constants"; import { pageTitle } from "utils/page"; -import { useProxy } from "contexts/ProxyContext"; import { openMaybePortForwardedURL } from "utils/portForward"; import { terminalWebsocketUrl } from "utils/terminal"; import { getMatchingAgentOrFirst } from "utils/workspace"; @@ -22,11 +27,6 @@ import { LoadedScriptsAlert, LoadingScriptsAlert, } from "./TerminalAlerts"; -import { useQuery } from "react-query"; -import { deploymentConfig } from "api/queries/deployment"; -import { workspaceByOwnerAndName } from "api/queries/workspaces"; -import { ThemeOverride } from "contexts/ThemeProvider"; -import themes from "theme"; export const Language = { workspaceErrorMessagePrefix: "Unable to fetch workspace: ", diff --git a/site/src/pages/UserSettingsPage/AccountPage/AccountForm.stories.tsx b/site/src/pages/UserSettingsPage/AccountPage/AccountForm.stories.tsx index aec4862590..d0e2e425b9 100644 --- a/site/src/pages/UserSettingsPage/AccountPage/AccountForm.stories.tsx +++ b/site/src/pages/UserSettingsPage/AccountPage/AccountForm.stories.tsx @@ -1,6 +1,6 @@ import type { Meta, StoryObj } from "@storybook/react"; -import { AccountForm } from "./AccountForm"; import { mockApiError } from "testHelpers/entities"; +import { AccountForm } from "./AccountForm"; const meta: Meta = { title: "pages/UserSettingsPage/AccountForm", diff --git a/site/src/pages/UserSettingsPage/AccountPage/AccountForm.test.tsx b/site/src/pages/UserSettingsPage/AccountPage/AccountForm.test.tsx index b790ac2dfe..253498dc3e 100644 --- a/site/src/pages/UserSettingsPage/AccountPage/AccountForm.test.tsx +++ b/site/src/pages/UserSettingsPage/AccountPage/AccountForm.test.tsx @@ -1,8 +1,8 @@ import { screen } from "@testing-library/react"; +import type { UpdateUserProfileRequest } from "api/typesGenerated"; import { MockUser2 } from "testHelpers/entities"; import { render } from "testHelpers/renderHelpers"; import { AccountForm } from "./AccountForm"; -import { UpdateUserProfileRequest } from "api/typesGenerated"; // NOTE: it does not matter what the role props of MockUser are set to, // only that editable is set to true or false. This is passed from diff --git a/site/src/pages/UserSettingsPage/AccountPage/AccountForm.tsx b/site/src/pages/UserSettingsPage/AccountPage/AccountForm.tsx index e47d862234..28c772620e 100644 --- a/site/src/pages/UserSettingsPage/AccountPage/AccountForm.tsx +++ b/site/src/pages/UserSettingsPage/AccountPage/AccountForm.tsx @@ -1,16 +1,16 @@ +import LoadingButton from "@mui/lab/LoadingButton"; import TextField from "@mui/material/TextField"; -import { FormikTouched, useFormik } from "formik"; -import { FC } from "react"; +import { type FormikTouched, useFormik } from "formik"; +import type { FC } from "react"; import * as Yup from "yup"; +import type { UpdateUserProfileRequest } from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { Form, FormFields } from "components/Form/Form"; import { getFormHelpers, nameValidator, onChangeTrimmed, } from "utils/formUtils"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { Form, FormFields } from "components/Form/Form"; -import { UpdateUserProfileRequest } from "api/typesGenerated"; -import LoadingButton from "@mui/lab/LoadingButton"; export const Language = { usernameLabel: "Username", diff --git a/site/src/pages/UserSettingsPage/AccountPage/AccountPage.test.tsx b/site/src/pages/UserSettingsPage/AccountPage/AccountPage.test.tsx index 3dc3683ae3..4bce60a5fe 100644 --- a/site/src/pages/UserSettingsPage/AccountPage/AccountPage.test.tsx +++ b/site/src/pages/UserSettingsPage/AccountPage/AccountPage.test.tsx @@ -1,9 +1,9 @@ import { fireEvent, screen, waitFor } from "@testing-library/react"; import * as API from "api/api"; -import * as AccountForm from "./AccountForm"; -import { renderWithAuth } from "testHelpers/renderHelpers"; -import { AccountPage } from "./AccountPage"; import { mockApiError } from "testHelpers/entities"; +import { renderWithAuth } from "testHelpers/renderHelpers"; +import * as AccountForm from "./AccountForm"; +import { AccountPage } from "./AccountPage"; const newData = { username: "user", diff --git a/site/src/pages/UserSettingsPage/AccountPage/AccountPage.tsx b/site/src/pages/UserSettingsPage/AccountPage/AccountPage.tsx index c2f1143580..830b59255d 100644 --- a/site/src/pages/UserSettingsPage/AccountPage/AccountPage.tsx +++ b/site/src/pages/UserSettingsPage/AccountPage/AccountPage.tsx @@ -1,15 +1,15 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useQuery } from "react-query"; import { groupsForUser } from "api/queries/groups"; +import { Stack } from "components/Stack/Stack"; import { useAuth } from "contexts/auth/useAuth"; import { useMe } from "contexts/auth/useMe"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { usePermissions } from "contexts/auth/usePermissions"; import { useDashboard } from "modules/dashboard/useDashboard"; -import { Stack } from "components/Stack/Stack"; import { Section } from "../Section"; -import { AccountUserGroups } from "./AccountUserGroups"; import { AccountForm } from "./AccountForm"; +import { AccountUserGroups } from "./AccountUserGroups"; export const AccountPage: FC = () => { const me = useMe(); diff --git a/site/src/pages/UserSettingsPage/AccountPage/AccountUserGroups.stories.tsx b/site/src/pages/UserSettingsPage/AccountPage/AccountUserGroups.stories.tsx index 9ce7df8812..6bdbbbd3d2 100644 --- a/site/src/pages/UserSettingsPage/AccountPage/AccountUserGroups.stories.tsx +++ b/site/src/pages/UserSettingsPage/AccountPage/AccountUserGroups.stories.tsx @@ -1,12 +1,11 @@ -import { type Group } from "api/typesGenerated"; -import { type Meta, type StoryObj } from "@storybook/react"; - -import { AccountUserGroups } from "./AccountUserGroups"; +import type { Meta, StoryObj } from "@storybook/react"; +import type { Group } from "api/typesGenerated"; import { MockGroup as MockGroup1, MockUser, mockApiError, } from "testHelpers/entities"; +import { AccountUserGroups } from "./AccountUserGroups"; const MockGroup2: Group = { ...MockGroup1, diff --git a/site/src/pages/UserSettingsPage/AccountPage/AccountUserGroups.tsx b/site/src/pages/UserSettingsPage/AccountPage/AccountUserGroups.tsx index e023d1bdaf..bc544fe1fa 100644 --- a/site/src/pages/UserSettingsPage/AccountPage/AccountUserGroups.tsx +++ b/site/src/pages/UserSettingsPage/AccountPage/AccountUserGroups.tsx @@ -1,6 +1,6 @@ -import Grid from "@mui/material/Grid"; import { useTheme } from "@emotion/react"; -import { type FC } from "react"; +import Grid from "@mui/material/Grid"; +import type { FC } from "react"; import { isApiError } from "api/errors"; import type { Group } from "api/typesGenerated"; import { ErrorAlert } from "components/Alert/ErrorAlert"; diff --git a/site/src/pages/UserSettingsPage/AppearancePage/AppearanceForm.tsx b/site/src/pages/UserSettingsPage/AppearancePage/AppearanceForm.tsx index b40ca1e72b..ae0d15358e 100644 --- a/site/src/pages/UserSettingsPage/AppearancePage/AppearanceForm.tsx +++ b/site/src/pages/UserSettingsPage/AppearancePage/AppearanceForm.tsx @@ -1,12 +1,12 @@ +import type { Interpolation } from "@emotion/react"; import { visuallyHidden } from "@mui/utils"; -import { type Interpolation } from "@emotion/react"; -import { type FC } from "react"; +import type { FC } from "react"; import type { UpdateUserAppearanceSettingsRequest } from "api/typesGenerated"; -import themes, { DEFAULT_THEME, type Theme } from "theme"; import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { Stack } from "components/Stack/Stack"; import { PreviewBadge } from "components/Badges/Badges"; +import { Stack } from "components/Stack/Stack"; import { ThemeOverride } from "contexts/ThemeProvider"; +import themes, { DEFAULT_THEME, type Theme } from "theme"; export interface AppearanceFormProps { isUpdating?: boolean; diff --git a/site/src/pages/UserSettingsPage/AppearancePage/AppearancePage.test.tsx b/site/src/pages/UserSettingsPage/AppearancePage/AppearancePage.test.tsx index 623faccb0d..01c0ad3add 100644 --- a/site/src/pages/UserSettingsPage/AppearancePage/AppearancePage.test.tsx +++ b/site/src/pages/UserSettingsPage/AppearancePage/AppearancePage.test.tsx @@ -1,9 +1,9 @@ import { screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import * as API from "api/api"; +import { MockUser } from "testHelpers/entities"; import { renderWithAuth } from "testHelpers/renderHelpers"; import { AppearancePage } from "./AppearancePage"; -import { MockUser } from "testHelpers/entities"; describe("appearance page", () => { it("does nothing when selecting current theme", async () => { diff --git a/site/src/pages/UserSettingsPage/AppearancePage/AppearancePage.tsx b/site/src/pages/UserSettingsPage/AppearancePage/AppearancePage.tsx index 0fcaf3c104..9e0821a9a1 100644 --- a/site/src/pages/UserSettingsPage/AppearancePage/AppearancePage.tsx +++ b/site/src/pages/UserSettingsPage/AppearancePage/AppearancePage.tsx @@ -1,5 +1,5 @@ import CircularProgress from "@mui/material/CircularProgress"; -import { type FC } from "react"; +import type { FC } from "react"; import { useMutation, useQueryClient } from "react-query"; import { updateAppearanceSettings } from "api/queries/users"; import { Stack } from "components/Stack/Stack"; diff --git a/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPage.tsx b/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPage.tsx index 44e1728a0b..f69780d852 100644 --- a/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPage.tsx +++ b/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPage.tsx @@ -1,11 +1,11 @@ import { type FC, useState } from "react"; import { useMutation, useQuery, useQueryClient } from "react-query"; +import { getErrorMessage } from "api/errors"; import { externalAuths, unlinkExternalAuths, validateExternalAuth, } from "api/queries/externalAuth"; -import { getErrorMessage } from "api/errors"; import { DeleteDialog } from "components/Dialogs/DeleteDialog/DeleteDialog"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; import { Section } from "../Section"; diff --git a/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.stories.tsx b/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.stories.tsx index abdd999f6a..f5f5cb3e21 100644 --- a/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.stories.tsx +++ b/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.stories.tsx @@ -1,9 +1,9 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockGithubAuthLink, MockGithubExternalProvider, } from "testHelpers/entities"; import { ExternalAuthPageView } from "./ExternalAuthPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/UserSettingsPage/ExternalAuthPageView", diff --git a/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx b/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx index 90d8e5a6f8..4fd19ffb69 100644 --- a/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx +++ b/site/src/pages/UserSettingsPage/ExternalAuthPage/ExternalAuthPageView.tsx @@ -1,3 +1,4 @@ +import LoadingButton from "@mui/lab/LoadingButton"; import Divider from "@mui/material/Divider"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; @@ -5,7 +6,6 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import LoadingButton from "@mui/lab/LoadingButton"; import visuallyHidden from "@mui/utils/visuallyHidden"; import { type FC, useState, useCallback, useEffect } from "react"; import { useQuery } from "react-query"; @@ -26,8 +26,8 @@ import { MoreMenuTrigger, ThreeDotsButton, } from "components/MoreMenu/MoreMenu"; -import { ExternalAuthPollingState } from "pages/CreateWorkspacePage/CreateWorkspacePage"; import { TableEmpty } from "components/TableEmpty/TableEmpty"; +import type { ExternalAuthPollingState } from "pages/CreateWorkspacePage/CreateWorkspacePage"; export type ExternalAuthPageViewProps = { isLoading: boolean; @@ -71,25 +71,24 @@ export const ExternalAuthPageView: FC = ({ - {((auths.providers === null || auths.providers?.length === 0) && ( + {auths.providers === null || auths.providers?.length === 0 ? ( - )) || - auths.providers?.map((app: ExternalAuthLinkProvider) => { - return ( - l.provider_id === app.id)} - onUnlinkExternalAuth={() => { - onUnlinkExternalAuth(app.id); - }} - onValidateExternalAuth={() => { - onValidateExternalAuth(app.id); - }} - /> - ); - })} + ) : ( + auths.providers?.map((app) => ( + l.provider_id === app.id)} + onUnlinkExternalAuth={() => { + onUnlinkExternalAuth(app.id); + }} + onValidateExternalAuth={() => { + onValidateExternalAuth(app.id); + }} + /> + )) + )} diff --git a/site/src/pages/UserSettingsPage/Layout.tsx b/site/src/pages/UserSettingsPage/Layout.tsx index 4d9ae5ce6a..3d015b0879 100644 --- a/site/src/pages/UserSettingsPage/Layout.tsx +++ b/site/src/pages/UserSettingsPage/Layout.tsx @@ -1,11 +1,11 @@ import { type FC, Suspense } from "react"; -import { Outlet } from "react-router-dom"; import { Helmet } from "react-helmet-async"; -import { pageTitle } from "utils/page"; -import { useMe } from "contexts/auth/useMe"; +import { Outlet } from "react-router-dom"; import { Loader } from "components/Loader/Loader"; import { Margins } from "components/Margins/Margins"; import { Stack } from "components/Stack/Stack"; +import { useMe } from "contexts/auth/useMe"; +import { pageTitle } from "utils/page"; import { Sidebar } from "./Sidebar"; const Layout: FC = () => { diff --git a/site/src/pages/UserSettingsPage/OAuth2ProviderPage/OAuth2ProviderPageView.tsx b/site/src/pages/UserSettingsPage/OAuth2ProviderPage/OAuth2ProviderPageView.tsx index efa6d9f362..b1a45703ab 100644 --- a/site/src/pages/UserSettingsPage/OAuth2ProviderPage/OAuth2ProviderPageView.tsx +++ b/site/src/pages/UserSettingsPage/OAuth2ProviderPage/OAuth2ProviderPageView.tsx @@ -5,11 +5,11 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import { type FC } from "react"; +import type { FC } from "react"; import type * as TypesGen from "api/typesGenerated"; -import { AvatarData } from "components/AvatarData/AvatarData"; -import { Avatar } from "components/Avatar/Avatar"; import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { Avatar } from "components/Avatar/Avatar"; +import { AvatarData } from "components/AvatarData/AvatarData"; import { TableLoader } from "components/TableLoader/TableLoader"; export type OAuth2ProviderPageViewProps = { diff --git a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.test.tsx b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.test.tsx index bb0ddb2535..daa03d50ea 100644 --- a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.test.tsx +++ b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.test.tsx @@ -1,8 +1,8 @@ import { fireEvent, screen, within } from "@testing-library/react"; import * as API from "api/api"; +import { MockGitSSHKey, mockApiError } from "testHelpers/entities"; import { renderWithAuth } from "testHelpers/renderHelpers"; import { Language as SSHKeysPageLanguage, SSHKeysPage } from "./SSHKeysPage"; -import { MockGitSSHKey, mockApiError } from "testHelpers/entities"; describe("SSH keys Page", () => { it("shows the SSH key", async () => { diff --git a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.tsx b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.tsx index 7766badb1a..16682479b3 100644 --- a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.tsx +++ b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPage.tsx @@ -1,11 +1,11 @@ import { type FC, useState } from "react"; +import { useMutation, useQuery, useQueryClient } from "react-query"; +import { getErrorMessage } from "api/errors"; +import { regenerateUserSSHKey, userSSHKey } from "api/queries/sshKeys"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; import { Section } from "../Section"; import { SSHKeysPageView } from "./SSHKeysPageView"; -import { regenerateUserSSHKey, userSSHKey } from "api/queries/sshKeys"; -import { useMutation, useQuery, useQueryClient } from "react-query"; -import { getErrorMessage } from "api/errors"; export const Language = { title: "SSH keys", diff --git a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.stories.tsx b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.stories.tsx index a8736defdc..77995a5baa 100644 --- a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.stories.tsx +++ b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { mockApiError } from "testHelpers/entities"; import { SSHKeysPageView } from "./SSHKeysPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/UserSettingsPage/SSHKeysPageView", diff --git a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.tsx b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.tsx index 141d3709f3..95903b45e8 100644 --- a/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.tsx +++ b/site/src/pages/UserSettingsPage/SSHKeysPage/SSHKeysPageView.tsx @@ -1,11 +1,11 @@ +import { useTheme } from "@emotion/react"; import Button from "@mui/material/Button"; import CircularProgress from "@mui/material/CircularProgress"; -import { type FC } from "react"; -import { useTheme } from "@emotion/react"; +import type { FC } from "react"; import type { GitSSHKey } from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { CodeExample } from "components/CodeExample/CodeExample"; import { Stack } from "components/Stack/Stack"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; export interface SSHKeysPageViewProps { isLoading: boolean; diff --git a/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.stories.tsx b/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.stories.tsx index 7e3054212e..3af6ae972f 100644 --- a/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.stories.tsx +++ b/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.stories.tsx @@ -1,7 +1,7 @@ -import type { Meta, StoryObj } from "@storybook/react"; -import { ScheduleForm } from "./ScheduleForm"; -import { mockApiError } from "testHelpers/entities"; import { action } from "@storybook/addon-actions"; +import type { Meta, StoryObj } from "@storybook/react"; +import { mockApiError } from "testHelpers/entities"; +import { ScheduleForm } from "./ScheduleForm"; const defaultArgs = { submitting: false, diff --git a/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx b/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx index 16bb44691f..b9853e6946 100644 --- a/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx +++ b/site/src/pages/UserSettingsPage/SchedulePage/ScheduleForm.tsx @@ -1,18 +1,18 @@ -import TextField from "@mui/material/TextField"; -import MenuItem from "@mui/material/MenuItem"; import LoadingButton from "@mui/lab/LoadingButton"; -import { FormikContextType, useFormik } from "formik"; +import MenuItem from "@mui/material/MenuItem"; +import TextField from "@mui/material/TextField"; +import { type FormikContextType, useFormik } from "formik"; import { type FC, useEffect, useState } from "react"; import * as Yup from "yup"; -import { getFormHelpers } from "utils/formUtils"; import type { UpdateUserQuietHoursScheduleRequest, UserQuietHoursScheduleResponse, } from "api/typesGenerated"; +import { Alert } from "components/Alert/Alert"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Form, FormFields } from "components/Form/Form"; import { Stack } from "components/Stack/Stack"; -import { Alert } from "components/Alert/Alert"; +import { getFormHelpers } from "utils/formUtils"; import { timeToCron, quietHoursDisplay, validTime } from "utils/schedule"; import { timeZones, getPreferredTimezone } from "utils/timeZones"; diff --git a/site/src/pages/UserSettingsPage/SchedulePage/SchedulePage.test.tsx b/site/src/pages/UserSettingsPage/SchedulePage/SchedulePage.test.tsx index 165a34ba20..cad7bde2af 100644 --- a/site/src/pages/UserSettingsPage/SchedulePage/SchedulePage.test.tsx +++ b/site/src/pages/UserSettingsPage/SchedulePage/SchedulePage.test.tsx @@ -1,10 +1,10 @@ import { fireEvent, screen, waitFor, within } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import { renderWithAuth } from "testHelpers/renderHelpers"; -import { SchedulePage } from "./SchedulePage"; -import { server } from "testHelpers/server"; -import { MockUser } from "testHelpers/entities"; import { rest } from "msw"; +import { MockUser } from "testHelpers/entities"; +import { renderWithAuth } from "testHelpers/renderHelpers"; +import { server } from "testHelpers/server"; +import { SchedulePage } from "./SchedulePage"; const fillForm = async ({ hour, diff --git a/site/src/pages/UserSettingsPage/SchedulePage/SchedulePage.tsx b/site/src/pages/UserSettingsPage/SchedulePage/SchedulePage.tsx index f41362232a..9623af4cca 100644 --- a/site/src/pages/UserSettingsPage/SchedulePage/SchedulePage.tsx +++ b/site/src/pages/UserSettingsPage/SchedulePage/SchedulePage.tsx @@ -1,13 +1,13 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useMutation, useQuery, useQueryClient } from "react-query"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { useMe } from "contexts/auth/useMe"; -import { Loader } from "components/Loader/Loader"; import { updateUserQuietHoursSchedule, userQuietHoursSchedule, } from "api/queries/settings"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { displaySuccess } from "components/GlobalSnackbar/utils"; +import { Loader } from "components/Loader/Loader"; +import { useMe } from "contexts/auth/useMe"; import { Section } from "../Section"; import { ScheduleForm } from "./ScheduleForm"; diff --git a/site/src/pages/UserSettingsPage/Section.tsx b/site/src/pages/UserSettingsPage/Section.tsx index 029fb33c28..64fa369ef6 100644 --- a/site/src/pages/UserSettingsPage/Section.tsx +++ b/site/src/pages/UserSettingsPage/Section.tsx @@ -1,5 +1,5 @@ -import { type FC, type ReactNode } from "react"; -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; +import type { FC, ReactNode } from "react"; type SectionLayout = "fixed" | "fluid"; diff --git a/site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.stories.tsx b/site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.stories.tsx index e39f914b3f..820ae0648d 100644 --- a/site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.stories.tsx +++ b/site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.stories.tsx @@ -1,6 +1,6 @@ import type { Meta, StoryObj } from "@storybook/react"; -import { SecurityForm } from "./SecurityForm"; import { mockApiError } from "testHelpers/entities"; +import { SecurityForm } from "./SecurityForm"; const meta: Meta = { title: "pages/UserSettingsPage/SecurityForm", diff --git a/site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.tsx b/site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.tsx index 143e621383..4757476f3a 100644 --- a/site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.tsx +++ b/site/src/pages/UserSettingsPage/SecurityPage/SecurityForm.tsx @@ -1,12 +1,12 @@ +import LoadingButton from "@mui/lab/LoadingButton"; import TextField from "@mui/material/TextField"; -import { FormikContextType, useFormik } from "formik"; -import { FC } from "react"; +import { type FormikContextType, useFormik } from "formik"; +import type { FC } from "react"; import * as Yup from "yup"; +import { Alert } from "components/Alert/Alert"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { Form, FormFields } from "components/Form/Form"; -import { Alert } from "components/Alert/Alert"; import { getFormHelpers } from "utils/formUtils"; -import LoadingButton from "@mui/lab/LoadingButton"; interface SecurityFormValues { old_password: string; diff --git a/site/src/pages/UserSettingsPage/SecurityPage/SecurityPage.test.tsx b/site/src/pages/UserSettingsPage/SecurityPage/SecurityPage.test.tsx index 7a2f4baa29..f2f0c73c4d 100644 --- a/site/src/pages/UserSettingsPage/SecurityPage/SecurityPage.test.tsx +++ b/site/src/pages/UserSettingsPage/SecurityPage/SecurityPage.test.tsx @@ -1,15 +1,15 @@ import { fireEvent, screen, waitFor, within } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; import * as API from "api/api"; -import { Language } from "./SecurityForm"; +import type { OAuthConversionResponse } from "api/typesGenerated"; +import { MockAuthMethodsAll, mockApiError } from "testHelpers/entities"; import { renderWithAuth, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; +import { Language } from "./SecurityForm"; import { SecurityPage } from "./SecurityPage"; -import { MockAuthMethodsAll, mockApiError } from "testHelpers/entities"; -import userEvent from "@testing-library/user-event"; import * as SSO from "./SingleSignOnSection"; -import { OAuthConversionResponse } from "api/typesGenerated"; const renderPage = async () => { const utils = renderWithAuth(); diff --git a/site/src/pages/UserSettingsPage/SecurityPage/SecurityPage.tsx b/site/src/pages/UserSettingsPage/SecurityPage/SecurityPage.tsx index 1d2075f577..527fb875f3 100644 --- a/site/src/pages/UserSettingsPage/SecurityPage/SecurityPage.tsx +++ b/site/src/pages/UserSettingsPage/SecurityPage/SecurityPage.tsx @@ -1,11 +1,11 @@ -import { type ComponentProps, type FC } from "react"; +import type { ComponentProps, FC } from "react"; import { useMutation, useQuery } from "react-query"; import { getUserLoginType } from "api/api"; import { authMethods, updatePassword } from "api/queries/users"; -import { useMe } from "contexts/auth/useMe"; +import { displaySuccess } from "components/GlobalSnackbar/utils"; import { Loader } from "components/Loader/Loader"; import { Stack } from "components/Stack/Stack"; -import { displaySuccess } from "components/GlobalSnackbar/utils"; +import { useMe } from "contexts/auth/useMe"; import { Section } from "../Section"; import { SecurityForm } from "./SecurityForm"; import { diff --git a/site/src/pages/UserSettingsPage/SecurityPage/SecurityPageView.stories.tsx b/site/src/pages/UserSettingsPage/SecurityPage/SecurityPageView.stories.tsx index 888d49d922..6d64beead4 100644 --- a/site/src/pages/UserSettingsPage/SecurityPage/SecurityPageView.stories.tsx +++ b/site/src/pages/UserSettingsPage/SecurityPage/SecurityPageView.stories.tsx @@ -1,12 +1,12 @@ -import type { Meta, StoryObj } from "@storybook/react"; -import { SecurityPageView } from "./SecurityPage"; import { action } from "@storybook/addon-actions"; +import type { Meta, StoryObj } from "@storybook/react"; +import set from "lodash/fp/set"; +import type { ComponentProps } from "react"; import { MockAuthMethodsPasswordOnly, MockAuthMethodsAll, } from "testHelpers/entities"; -import { ComponentProps } from "react"; -import set from "lodash/fp/set"; +import { SecurityPageView } from "./SecurityPage"; const defaultArgs: ComponentProps = { security: { diff --git a/site/src/pages/UserSettingsPage/SecurityPage/SingleSignOnSection.tsx b/site/src/pages/UserSettingsPage/SecurityPage/SingleSignOnSection.tsx index 3f58c43230..6d743594a9 100644 --- a/site/src/pages/UserSettingsPage/SecurityPage/SingleSignOnSection.tsx +++ b/site/src/pages/UserSettingsPage/SecurityPage/SingleSignOnSection.tsx @@ -1,12 +1,12 @@ import { useTheme } from "@emotion/react"; -import { type FC, useState } from "react"; -import { useMutation } from "react-query"; -import Button from "@mui/material/Button"; -import Link from "@mui/material/Link"; -import TextField from "@mui/material/TextField"; import CheckCircleOutlined from "@mui/icons-material/CheckCircleOutlined"; import GitHubIcon from "@mui/icons-material/GitHub"; import KeyIcon from "@mui/icons-material/VpnKey"; +import Button from "@mui/material/Button"; +import Link from "@mui/material/Link"; +import TextField from "@mui/material/TextField"; +import { type FC, useState } from "react"; +import { useMutation } from "react-query"; import { convertToOAUTH } from "api/api"; import { getErrorMessage } from "api/errors"; import type { @@ -15,8 +15,8 @@ import type { OIDCAuthMethod, UserLoginType, } from "api/typesGenerated"; -import { EmptyState } from "components/EmptyState/EmptyState"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; +import { EmptyState } from "components/EmptyState/EmptyState"; import { Stack } from "components/Stack/Stack"; import { docs } from "utils/docs"; import { Section } from "../Section"; diff --git a/site/src/pages/UserSettingsPage/Sidebar.tsx b/site/src/pages/UserSettingsPage/Sidebar.tsx index 827efbc7db..01b2ba8be8 100644 --- a/site/src/pages/UserSettingsPage/Sidebar.tsx +++ b/site/src/pages/UserSettingsPage/Sidebar.tsx @@ -1,18 +1,18 @@ -import { type FC } from "react"; -import VpnKeyOutlined from "@mui/icons-material/VpnKeyOutlined"; -import FingerprintOutlinedIcon from "@mui/icons-material/FingerprintOutlined"; -import AccountIcon from "@mui/icons-material/Person"; import AppearanceIcon from "@mui/icons-material/Brush"; import ScheduleIcon from "@mui/icons-material/EditCalendarOutlined"; +import FingerprintOutlinedIcon from "@mui/icons-material/FingerprintOutlined"; import SecurityIcon from "@mui/icons-material/LockOutlined"; +import AccountIcon from "@mui/icons-material/Person"; +import VpnKeyOutlined from "@mui/icons-material/VpnKeyOutlined"; +import type { FC } from "react"; import type { User } from "api/typesGenerated"; -import { UserAvatar } from "components/UserAvatar/UserAvatar"; +import { GitIcon } from "components/Icons/GitIcon"; import { Sidebar as BaseSidebar, SidebarHeader, SidebarNavItem, } from "components/Sidebar/Sidebar"; -import { GitIcon } from "components/Icons/GitIcon"; +import { UserAvatar } from "components/UserAvatar/UserAvatar"; import { useDashboard } from "modules/dashboard/useDashboard"; interface SidebarProps { diff --git a/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.stories.tsx b/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.stories.tsx index 35cb2193d7..c39bbc9a18 100644 --- a/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.stories.tsx +++ b/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.stories.tsx @@ -1,7 +1,7 @@ import type { Meta, StoryObj } from "@storybook/react"; +import { QueryClient, QueryClientProvider } from "react-query"; import { MockToken } from "testHelpers/entities"; import { ConfirmDeleteDialog } from "./ConfirmDeleteDialog"; -import { QueryClient, QueryClientProvider } from "react-query"; const queryClient = new QueryClient({ defaultOptions: { diff --git a/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.tsx b/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.tsx index 7c588251c4..94debbb37c 100644 --- a/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.tsx +++ b/site/src/pages/UserSettingsPage/TokensPage/ConfirmDeleteDialog.tsx @@ -1,9 +1,9 @@ -import { FC } from "react"; -import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; -import { useDeleteToken } from "./hooks"; -import { displaySuccess, displayError } from "components/GlobalSnackbar/utils"; +import type { FC } from "react"; import { getErrorMessage } from "api/errors"; -import { APIKeyWithOwner } from "api/typesGenerated"; +import type { APIKeyWithOwner } from "api/typesGenerated"; +import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; +import { displaySuccess, displayError } from "components/GlobalSnackbar/utils"; +import { useDeleteToken } from "./hooks"; export interface ConfirmDeleteDialogProps { queryKey: (string | boolean)[]; diff --git a/site/src/pages/UserSettingsPage/TokensPage/TokensPage.tsx b/site/src/pages/UserSettingsPage/TokensPage/TokensPage.tsx index 77fb7aacbc..a349809a7f 100644 --- a/site/src/pages/UserSettingsPage/TokensPage/TokensPage.tsx +++ b/site/src/pages/UserSettingsPage/TokensPage/TokensPage.tsx @@ -1,14 +1,14 @@ import { css, type Interpolation, type Theme } from "@emotion/react"; +import AddIcon from "@mui/icons-material/AddOutlined"; +import Button from "@mui/material/Button"; import { type FC, useState } from "react"; import { Link as RouterLink } from "react-router-dom"; -import Button from "@mui/material/Button"; -import AddIcon from "@mui/icons-material/AddOutlined"; import type { APIKeyWithOwner } from "api/typesGenerated"; import { Stack } from "components/Stack/Stack"; import { Section } from "../Section"; +import { ConfirmDeleteDialog } from "./ConfirmDeleteDialog"; import { useTokensData } from "./hooks"; import { TokensPageView } from "./TokensPageView"; -import { ConfirmDeleteDialog } from "./ConfirmDeleteDialog"; const cliCreateCommand = "coder tokens create"; diff --git a/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.stories.tsx b/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.stories.tsx index c536692dae..1ab7bf6625 100644 --- a/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.stories.tsx +++ b/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.stories.tsx @@ -1,6 +1,6 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { mockApiError, MockTokens } from "testHelpers/entities"; import { TokensPageView } from "./TokensPageView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/UserSettingsPage/TokensPageView", diff --git a/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.tsx b/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.tsx index 2566ba826b..05f8358483 100644 --- a/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.tsx +++ b/site/src/pages/UserSettingsPage/TokensPage/TokensPageView.tsx @@ -1,16 +1,16 @@ +import { useTheme } from "@emotion/react"; +import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline"; +import IconButton from "@mui/material/IconButton"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import IconButton from "@mui/material/IconButton"; -import DeleteOutlineIcon from "@mui/icons-material/DeleteOutline"; import dayjs from "dayjs"; -import { useTheme } from "@emotion/react"; -import { type FC, type ReactNode } from "react"; -import type { APIKeyWithOwner } from "api/typesGenerated"; import relativeTime from "dayjs/plugin/relativeTime"; +import type { FC, ReactNode } from "react"; +import type { APIKeyWithOwner } from "api/typesGenerated"; import { ErrorAlert } from "components/Alert/ErrorAlert"; import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; import { Stack } from "components/Stack/Stack"; diff --git a/site/src/pages/UserSettingsPage/TokensPage/hooks.ts b/site/src/pages/UserSettingsPage/TokensPage/hooks.ts index 923dbda0d8..a92252ecc8 100644 --- a/site/src/pages/UserSettingsPage/TokensPage/hooks.ts +++ b/site/src/pages/UserSettingsPage/TokensPage/hooks.ts @@ -1,6 +1,11 @@ -import { useQuery, useMutation, useQueryClient, QueryKey } from "react-query"; +import { + type QueryKey, + useMutation, + useQuery, + useQueryClient, +} from "react-query"; import { getTokens, deleteToken } from "api/api"; -import { TokensFilter } from "api/typesGenerated"; +import type { TokensFilter } from "api/typesGenerated"; // Load all tokens export const useTokensData = ({ include_all }: TokensFilter) => { diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx index ab47ed2204..e8559c8752 100644 --- a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx +++ b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyPage.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import { useProxy } from "contexts/ProxyContext"; import { Section } from "../Section"; import { WorkspaceProxyView } from "./WorkspaceProxyView"; diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyRow.tsx b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyRow.tsx index 8aad4ef234..9c1998841d 100644 --- a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyRow.tsx +++ b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyRow.tsx @@ -1,10 +1,10 @@ -import type { Region, WorkspaceProxy } from "api/typesGenerated"; -import { AvatarData } from "components/AvatarData/AvatarData"; -import { Avatar } from "components/Avatar/Avatar"; +import { useTheme } from "@emotion/react"; import TableCell from "@mui/material/TableCell"; import TableRow from "@mui/material/TableRow"; -import { useTheme } from "@emotion/react"; import type { FC, ReactNode } from "react"; +import type { Region, WorkspaceProxy } from "api/typesGenerated"; +import { Avatar } from "components/Avatar/Avatar"; +import { AvatarData } from "components/AvatarData/AvatarData"; import { HealthyBadge, NotHealthyBadge, diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyView.tsx b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyView.tsx index d2c467a155..4c45799f2b 100644 --- a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyView.tsx +++ b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorkspaceProxyView.tsx @@ -4,14 +4,14 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import { type FC } from "react"; +import type { FC } from "react"; import type { Region } from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; import { Stack } from "components/Stack/Stack"; import { TableEmpty } from "components/TableEmpty/TableEmpty"; import { TableLoader } from "components/TableLoader/TableLoader"; -import { ProxyLatencyReport } from "contexts/useProxyLatency"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; +import type { ProxyLatencyReport } from "contexts/useProxyLatency"; import { ProxyRow } from "./WorkspaceProxyRow"; export interface WorkspaceProxyViewProps { diff --git a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorspaceProxyView.stories.tsx b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorspaceProxyView.stories.tsx index 9e7d060004..b215cd4a65 100644 --- a/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorspaceProxyView.stories.tsx +++ b/site/src/pages/UserSettingsPage/WorkspaceProxyPage/WorspaceProxyView.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { mockApiError, MockWorkspaceProxies, @@ -6,7 +7,6 @@ import { MockProxyLatencies, } from "testHelpers/entities"; import { WorkspaceProxyView } from "./WorkspaceProxyView"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/UserSettingsPage/WorkspaceProxyView", diff --git a/site/src/pages/UsersPage/ResetPasswordDialog.stories.tsx b/site/src/pages/UsersPage/ResetPasswordDialog.stories.tsx index ffa8a24684..0d3e0f6b91 100644 --- a/site/src/pages/UsersPage/ResetPasswordDialog.stories.tsx +++ b/site/src/pages/UsersPage/ResetPasswordDialog.stories.tsx @@ -1,6 +1,5 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { MockUser } from "testHelpers/entities"; - import { ResetPasswordDialog } from "./ResetPasswordDialog"; const meta: Meta = { diff --git a/site/src/pages/UsersPage/ResetPasswordDialog.tsx b/site/src/pages/UsersPage/ResetPasswordDialog.tsx index 381543ee5a..ccfd39b565 100644 --- a/site/src/pages/UsersPage/ResetPasswordDialog.tsx +++ b/site/src/pages/UsersPage/ResetPasswordDialog.tsx @@ -1,4 +1,4 @@ -import { type FC } from "react"; +import type { FC } from "react"; import type * as TypesGen from "api/typesGenerated"; import { CodeExample } from "components/CodeExample/CodeExample"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; diff --git a/site/src/pages/UsersPage/UsersFilter.tsx b/site/src/pages/UsersPage/UsersFilter.tsx index fa344fb804..45af410368 100644 --- a/site/src/pages/UsersPage/UsersFilter.tsx +++ b/site/src/pages/UsersPage/UsersFilter.tsx @@ -1,18 +1,18 @@ import { useTheme } from "@emotion/react"; -import { type FC } from "react"; +import type { FC } from "react"; import { Filter, FilterMenu, MenuSkeleton, OptionItem, SearchFieldSkeleton, - useFilter, + type useFilter, } from "components/Filter/filter"; -import type { BaseOption } from "components/Filter/options"; import { type UseFilterMenuOptions, useFilterMenu, } from "components/Filter/menu"; +import type { BaseOption } from "components/Filter/options"; import type { ThemeRole } from "theme/roles"; import { docs } from "utils/docs"; diff --git a/site/src/pages/UsersPage/UsersLayout.tsx b/site/src/pages/UsersPage/UsersLayout.tsx index b313aefbd7..7496e09c07 100644 --- a/site/src/pages/UsersPage/UsersLayout.tsx +++ b/site/src/pages/UsersPage/UsersLayout.tsx @@ -1,7 +1,7 @@ -import Button from "@mui/material/Button"; -import Link from "@mui/material/Link"; import GroupAdd from "@mui/icons-material/GroupAddOutlined"; import PersonAdd from "@mui/icons-material/PersonAddOutlined"; +import Button from "@mui/material/Button"; +import Link from "@mui/material/Link"; import { type FC, Suspense } from "react"; import { Link as RouterLink, @@ -9,13 +9,13 @@ import { useNavigate, useLocation, } from "react-router-dom"; +import { Loader } from "components/Loader/Loader"; +import { Margins } from "components/Margins/Margins"; +import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; +import { TAB_PADDING_Y, TabLink, Tabs, TabsList } from "components/Tabs/Tabs"; import { usePermissions } from "contexts/auth/usePermissions"; import { USERS_LINK } from "modules/dashboard/Navbar/NavbarView"; import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility"; -import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; -import { Margins } from "components/Margins/Margins"; -import { TAB_PADDING_Y, TabLink, Tabs, TabsList } from "components/Tabs/Tabs"; -import { Loader } from "components/Loader/Loader"; export const UsersLayout: FC = () => { const { createUser: canCreateUser, createGroup: canCreateGroup } = diff --git a/site/src/pages/UsersPage/UsersPage.test.tsx b/site/src/pages/UsersPage/UsersPage.test.tsx index 56a1f1ac1f..0be617b624 100644 --- a/site/src/pages/UsersPage/UsersPage.test.tsx +++ b/site/src/pages/UsersPage/UsersPage.test.tsx @@ -1,17 +1,17 @@ import { fireEvent, screen, within } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; import { rest } from "msw"; +import * as API from "api/api"; +import type { Role } from "api/typesGenerated"; import { MockUser, MockUser2, SuspendedMockUser, MockAuditorRole, } from "testHelpers/entities"; -import * as API from "api/api"; -import { Role } from "api/typesGenerated"; -import { Language as ResetPasswordDialogLanguage } from "./ResetPasswordDialog"; import { renderWithAuth } from "testHelpers/renderHelpers"; import { server } from "testHelpers/server"; +import { Language as ResetPasswordDialogLanguage } from "./ResetPasswordDialog"; import { UsersPage } from "./UsersPage"; const renderPage = () => { diff --git a/site/src/pages/UsersPage/UsersPage.tsx b/site/src/pages/UsersPage/UsersPage.tsx index e6547824fc..014bf19797 100644 --- a/site/src/pages/UsersPage/UsersPage.tsx +++ b/site/src/pages/UsersPage/UsersPage.tsx @@ -2,11 +2,10 @@ import { type FC, useState } from "react"; import { Helmet } from "react-helmet-async"; import { useMutation, useQuery, useQueryClient } from "react-query"; import { useSearchParams, useNavigate } from "react-router-dom"; -import type { User } from "api/typesGenerated"; -import { roles } from "api/queries/roles"; -import { groupsByUserId } from "api/queries/groups"; import { getErrorMessage } from "api/errors"; import { deploymentConfig } from "api/queries/deployment"; +import { groupsByUserId } from "api/queries/groups"; +import { roles } from "api/queries/roles"; import { paginatedUsers, suspendUser, @@ -16,16 +15,17 @@ import { updateRoles, authMethods, } from "api/queries/users"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; -import { usePermissions } from "contexts/auth/usePermissions"; -import { useMe } from "contexts/auth/useMe"; -import { useDashboard } from "modules/dashboard/useDashboard"; -import { useFilter } from "components/Filter/filter"; -import { DeleteDialog } from "components/Dialogs/DeleteDialog/DeleteDialog"; +import type { User } from "api/typesGenerated"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; +import { DeleteDialog } from "components/Dialogs/DeleteDialog/DeleteDialog"; +import { useFilter } from "components/Filter/filter"; import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; import { isNonInitialPage } from "components/PaginationWidget/utils"; +import { useMe } from "contexts/auth/useMe"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { usePermissions } from "contexts/auth/usePermissions"; import { usePaginatedQuery } from "hooks/usePaginatedQuery"; +import { useDashboard } from "modules/dashboard/useDashboard"; import { pageTitle } from "utils/page"; import { generateRandomString } from "utils/random"; import { ResetPasswordDialog } from "./ResetPasswordDialog"; diff --git a/site/src/pages/UsersPage/UsersPageView.stories.tsx b/site/src/pages/UsersPage/UsersPageView.stories.tsx index 77e1e5566f..84683806fb 100644 --- a/site/src/pages/UsersPage/UsersPageView.stories.tsx +++ b/site/src/pages/UsersPage/UsersPageView.stories.tsx @@ -1,4 +1,11 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; +import type { ComponentProps } from "react"; +import { + MockMenu, + getDefaultFilterProps, +} from "components/Filter/storyHelpers"; +import { mockSuccessResult } from "components/PaginationWidget/PaginationContainer.mocks"; +import type { UsePaginatedQueryResult } from "hooks/usePaginatedQuery"; import { MockUser, MockUser2, @@ -7,14 +14,6 @@ import { MockAuthMethodsPasswordOnly, } from "testHelpers/entities"; import { UsersPageView } from "./UsersPageView"; -import { ComponentProps } from "react"; -import { - MockMenu, - getDefaultFilterProps, -} from "components/Filter/storyHelpers"; - -import { type UsePaginatedQueryResult } from "hooks/usePaginatedQuery"; -import { mockSuccessResult } from "components/PaginationWidget/PaginationContainer.mocks"; type FilterProps = ComponentProps["filterProps"]; diff --git a/site/src/pages/UsersPage/UsersPageView.tsx b/site/src/pages/UsersPage/UsersPageView.tsx index 3216e8c4df..54daa3c2a9 100644 --- a/site/src/pages/UsersPage/UsersPageView.tsx +++ b/site/src/pages/UsersPage/UsersPageView.tsx @@ -1,12 +1,12 @@ -import { type ComponentProps, type FC } from "react"; +import type { ComponentProps, FC } from "react"; +import type { GroupsByUserId } from "api/queries/groups"; import type * as TypesGen from "api/typesGenerated"; -import { type GroupsByUserId } from "api/queries/groups"; import { PaginationContainer, type PaginationResult, } from "components/PaginationWidget/PaginationContainer"; -import { UsersTable } from "./UsersTable/UsersTable"; import { UsersFilter } from "./UsersFilter"; +import { UsersTable } from "./UsersTable/UsersTable"; export interface UsersPageViewProps { users?: TypesGen.User[]; diff --git a/site/src/pages/UsersPage/UsersTable/EditRolesButton.stories.tsx b/site/src/pages/UsersPage/UsersTable/EditRolesButton.stories.tsx index fea9065dcd..1a7ba3654c 100644 --- a/site/src/pages/UsersPage/UsersTable/EditRolesButton.stories.tsx +++ b/site/src/pages/UsersPage/UsersTable/EditRolesButton.stories.tsx @@ -1,10 +1,10 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockOwnerRole, MockSiteRoles, MockUserAdminRole, } from "testHelpers/entities"; import { EditRolesButton } from "./EditRolesButton"; -import type { Meta, StoryObj } from "@storybook/react"; const meta: Meta = { title: "pages/UsersPage/EditRolesButton", diff --git a/site/src/pages/UsersPage/UsersTable/EditRolesButton.tsx b/site/src/pages/UsersPage/UsersTable/EditRolesButton.tsx index 9221cb2339..14075cc754 100644 --- a/site/src/pages/UsersPage/UsersTable/EditRolesButton.tsx +++ b/site/src/pages/UsersPage/UsersTable/EditRolesButton.tsx @@ -1,11 +1,9 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import IconButton from "@mui/material/IconButton"; -import { EditSquare } from "components/Icons/EditSquare"; -import { type FC } from "react"; -import { Stack } from "components/Stack/Stack"; -import Checkbox from "@mui/material/Checkbox"; +import type { Interpolation, Theme } from "@emotion/react"; import UserIcon from "@mui/icons-material/PersonOutline"; -import { Role } from "api/typesGenerated"; +import Checkbox from "@mui/material/Checkbox"; +import IconButton from "@mui/material/IconButton"; +import type { FC } from "react"; +import type { Role } from "api/typesGenerated"; import { HelpTooltip, HelpTooltipContent, @@ -13,11 +11,13 @@ import { HelpTooltipTitle, HelpTooltipTrigger, } from "components/HelpTooltip/HelpTooltip"; +import { EditSquare } from "components/Icons/EditSquare"; import { Popover, PopoverContent, PopoverTrigger, } from "components/Popover/Popover"; +import { Stack } from "components/Stack/Stack"; import { type ClassName, useClassName } from "hooks/useClassName"; const roleDescriptions: Record = { diff --git a/site/src/pages/UsersPage/UsersTable/TableColumnHelpTooltip.tsx b/site/src/pages/UsersPage/UsersTable/TableColumnHelpTooltip.tsx index d26d4a64a9..64b51411bf 100644 --- a/site/src/pages/UsersPage/UsersTable/TableColumnHelpTooltip.tsx +++ b/site/src/pages/UsersPage/UsersTable/TableColumnHelpTooltip.tsx @@ -1,4 +1,4 @@ -import { FC } from "react"; +import type { FC } from "react"; import { HelpTooltip, HelpTooltipContent, diff --git a/site/src/pages/UsersPage/UsersTable/UserGroupsCell.tsx b/site/src/pages/UsersPage/UsersTable/UserGroupsCell.tsx index 695f3e3440..b5d1f799ee 100644 --- a/site/src/pages/UsersPage/UsersTable/UserGroupsCell.tsx +++ b/site/src/pages/UsersPage/UsersTable/UserGroupsCell.tsx @@ -1,18 +1,18 @@ import { useTheme } from "@emotion/react"; -import { type Group } from "api/typesGenerated"; -import { Stack } from "components/Stack/Stack"; -import { Avatar } from "components/Avatar/Avatar"; -import { OverflowY } from "components/OverflowY/OverflowY"; -import TableCell from "@mui/material/TableCell"; +import GroupIcon from "@mui/icons-material/Group"; import Button from "@mui/material/Button"; import List from "@mui/material/List"; import ListItem from "@mui/material/ListItem"; -import GroupIcon from "@mui/icons-material/Group"; +import TableCell from "@mui/material/TableCell"; +import type { Group } from "api/typesGenerated"; +import { Avatar } from "components/Avatar/Avatar"; +import { OverflowY } from "components/OverflowY/OverflowY"; import { Popover, PopoverTrigger, PopoverContent, } from "components/Popover/Popover"; +import { Stack } from "components/Stack/Stack"; type GroupsCellProps = { userGroups: readonly Group[] | undefined; diff --git a/site/src/pages/UsersPage/UsersTable/UserRoleCell.tsx b/site/src/pages/UsersPage/UsersTable/UserRoleCell.tsx index dc8c43a23c..5b95dc8e19 100644 --- a/site/src/pages/UsersPage/UsersTable/UserRoleCell.tsx +++ b/site/src/pages/UsersPage/UsersTable/UserRoleCell.tsx @@ -14,10 +14,10 @@ * users like that, though, know that it will be painful */ import { useTheme } from "@emotion/react"; -import TableCell from "@mui/material/TableCell"; import Stack from "@mui/material/Stack"; -import { type FC } from "react"; -import { type User, type Role } from "api/typesGenerated"; +import TableCell from "@mui/material/TableCell"; +import type { FC } from "react"; +import type { Role, User } from "api/typesGenerated"; import { Pill } from "components/Pill/Pill"; import { Popover, diff --git a/site/src/pages/UsersPage/UsersTable/UsersTable.stories.tsx b/site/src/pages/UsersPage/UsersTable/UsersTable.stories.tsx index ce6b0055ed..29a3bc3d34 100644 --- a/site/src/pages/UsersPage/UsersTable/UsersTable.stories.tsx +++ b/site/src/pages/UsersPage/UsersTable/UsersTable.stories.tsx @@ -1,3 +1,4 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockUser, MockUser2, @@ -10,7 +11,6 @@ import { MockAuditorRole, } from "testHelpers/entities"; import { UsersTable } from "./UsersTable"; -import type { Meta, StoryObj } from "@storybook/react"; const mockGroupsByUserId = new Map([ [MockUser.id, [MockGroup]], diff --git a/site/src/pages/UsersPage/UsersTable/UsersTable.tsx b/site/src/pages/UsersPage/UsersTable/UsersTable.tsx index c552a87e09..ddf7634364 100644 --- a/site/src/pages/UsersPage/UsersTable/UsersTable.tsx +++ b/site/src/pages/UsersPage/UsersTable/UsersTable.tsx @@ -4,9 +4,9 @@ import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import { type FC } from "react"; +import type { FC } from "react"; +import type { GroupsByUserId } from "api/queries/groups"; import type * as TypesGen from "api/typesGenerated"; -import { type GroupsByUserId } from "api/queries/groups"; import { Stack } from "components/Stack/Stack"; import { TableColumnHelpTooltip } from "./TableColumnHelpTooltip"; import { UsersTableBody } from "./UsersTableBody"; diff --git a/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx b/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx index 0e0a45f9f6..cb96cec2ff 100644 --- a/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx +++ b/site/src/pages/UsersPage/UsersTable/UsersTableBody.tsx @@ -1,27 +1,23 @@ -import TableCell from "@mui/material/TableCell"; -import TableRow from "@mui/material/TableRow"; -import Skeleton from "@mui/material/Skeleton"; -import Divider from "@mui/material/Divider"; +import type { Interpolation, Theme } from "@emotion/react"; +import GitHub from "@mui/icons-material/GitHub"; import HideSourceOutlined from "@mui/icons-material/HideSourceOutlined"; import KeyOutlined from "@mui/icons-material/KeyOutlined"; -import GitHub from "@mui/icons-material/GitHub"; import PasswordOutlined from "@mui/icons-material/PasswordOutlined"; import ShieldOutlined from "@mui/icons-material/ShieldOutlined"; -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import Divider from "@mui/material/Divider"; +import Skeleton from "@mui/material/Skeleton"; +import TableCell from "@mui/material/TableCell"; +import TableRow from "@mui/material/TableRow"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; +import type { FC } from "react"; +import type { GroupsByUserId } from "api/queries/groups"; import type * as TypesGen from "api/typesGenerated"; -import { type GroupsByUserId } from "api/queries/groups"; -import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; import { AvatarData } from "components/AvatarData/AvatarData"; import { AvatarDataSkeleton } from "components/AvatarData/AvatarDataSkeleton"; -import { EmptyState } from "components/EmptyState/EmptyState"; -import { - TableLoaderSkeleton, - TableRowSkeleton, -} from "components/TableLoader/TableLoader"; import { EnterpriseBadge } from "components/Badges/Badges"; +import { ChooseOne, Cond } from "components/Conditionals/ChooseOne"; +import { EmptyState } from "components/EmptyState/EmptyState"; import { LastSeen } from "components/LastSeen/LastSeen"; import { MoreMenu, @@ -30,8 +26,12 @@ import { MoreMenuItem, ThreeDotsButton, } from "components/MoreMenu/MoreMenu"; -import { UserRoleCell } from "./UserRoleCell"; +import { + TableLoaderSkeleton, + TableRowSkeleton, +} from "components/TableLoader/TableLoader"; import { UserGroupsCell } from "./UserGroupsCell"; +import { UserRoleCell } from "./UserRoleCell"; dayjs.extend(relativeTime); diff --git a/site/src/pages/WorkspaceBuildPage/Sidebar.tsx b/site/src/pages/WorkspaceBuildPage/Sidebar.tsx index 370d51cdf6..b8d461ebcb 100644 --- a/site/src/pages/WorkspaceBuildPage/Sidebar.tsx +++ b/site/src/pages/WorkspaceBuildPage/Sidebar.tsx @@ -1,4 +1,4 @@ -import { type FC, type HTMLAttributes } from "react"; +import type { FC, HTMLAttributes } from "react"; export const Sidebar: FC> = ({ children, diff --git a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.test.tsx b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.test.tsx index f99cb1db2f..e358c50954 100644 --- a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.test.tsx +++ b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.test.tsx @@ -1,14 +1,14 @@ import { screen, waitFor } from "@testing-library/react"; import WS from "jest-websocket-mock"; -import { renderWithAuth } from "testHelpers/renderHelpers"; -import { WorkspaceBuildPage } from "./WorkspaceBuildPage"; +import * as API from "api/api"; import { MockWorkspace, MockWorkspaceAgent, MockWorkspaceAgentLogs, MockWorkspaceBuild, } from "testHelpers/entities"; -import * as API from "api/api"; +import { renderWithAuth } from "testHelpers/renderHelpers"; +import { WorkspaceBuildPage } from "./WorkspaceBuildPage"; import { LOGS_TAB_KEY } from "./WorkspaceBuildPageView"; afterEach(() => { diff --git a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.tsx b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.tsx index 18264239e4..13ec302824 100644 --- a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.tsx +++ b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPage.tsx @@ -1,13 +1,13 @@ -import { FC } from "react"; -import { Helmet } from "react-helmet-async"; -import { useParams } from "react-router-dom"; -import { pageTitle } from "utils/page"; -import { WorkspaceBuildPageView } from "./WorkspaceBuildPageView"; -import { useQuery } from "react-query"; -import { getWorkspaceBuilds } from "api/api"; import dayjs from "dayjs"; +import type { FC } from "react"; +import { Helmet } from "react-helmet-async"; +import { useQuery } from "react-query"; +import { useParams } from "react-router-dom"; +import { getWorkspaceBuilds } from "api/api"; import { workspaceBuildByNumber } from "api/queries/workspaceBuilds"; import { useWorkspaceBuildLogs } from "hooks/useWorkspaceBuildLogs"; +import { pageTitle } from "utils/page"; +import { WorkspaceBuildPageView } from "./WorkspaceBuildPageView"; export const WorkspaceBuildPage: FC = () => { const params = useParams() as { diff --git a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.stories.tsx b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.stories.tsx index 6be22af0c9..43341b8f6f 100644 --- a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.stories.tsx +++ b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { MockFailedWorkspaceBuild, MockWorkspaceBuild, diff --git a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.tsx b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.tsx index e2349dda9c..e9af7be776 100644 --- a/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.tsx +++ b/site/src/pages/WorkspaceBuildPage/WorkspaceBuildPageView.tsx @@ -1,32 +1,32 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; -import { type FC } from "react"; +import type { FC } from "react"; +import { Link } from "react-router-dom"; import type { ProvisionerJobLog, WorkspaceAgent, WorkspaceBuild, } from "api/typesGenerated"; -import { Link } from "react-router-dom"; -import { displayWorkspaceBuildDuration } from "utils/workspace"; -import { DashboardFullPage } from "modules/dashboard/DashboardLayout"; +import { Alert } from "components/Alert/Alert"; import { BuildAvatar } from "components/BuildAvatar/BuildAvatar"; import { Loader } from "components/Loader/Loader"; -import { Stack } from "components/Stack/Stack"; -import { WorkspaceBuildLogs } from "modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs"; import { FullWidthPageHeader, PageHeaderTitle, PageHeaderSubtitle, } from "components/PageHeader/FullWidthPageHeader"; +import { Stack } from "components/Stack/Stack"; import { Stats, StatsItem } from "components/Stats/Stats"; -import { Alert } from "components/Alert/Alert"; +import { TAB_PADDING_X, TabLink, Tabs, TabsList } from "components/Tabs/Tabs"; +import { useTab } from "hooks"; +import { DashboardFullPage } from "modules/dashboard/DashboardLayout"; +import { AgentLogs, useAgentLogs } from "modules/resources/AgentLogs"; import { WorkspaceBuildData, WorkspaceBuildDataSkeleton, } from "modules/workspaces/WorkspaceBuild/WorkspaceBuildData"; +import { WorkspaceBuildLogs } from "modules/workspaces/WorkspaceBuildLogs/WorkspaceBuildLogs"; +import { displayWorkspaceBuildDuration } from "utils/workspace"; import { Sidebar, SidebarCaption, SidebarItem } from "./Sidebar"; -import { TAB_PADDING_X, TabLink, Tabs, TabsList } from "components/Tabs/Tabs"; -import { useTab } from "hooks"; -import { AgentLogs, useAgentLogs } from "modules/resources/AgentLogs"; export const LOGS_TAB_KEY = "logs"; diff --git a/site/src/pages/WorkspacePage/BuildRow.tsx b/site/src/pages/WorkspacePage/BuildRow.tsx index 1a23baff7b..1ef8c860a9 100644 --- a/site/src/pages/WorkspacePage/BuildRow.tsx +++ b/site/src/pages/WorkspacePage/BuildRow.tsx @@ -1,6 +1,6 @@ +import type { CSSObject, Interpolation, Theme } from "@emotion/react"; import TableCell from "@mui/material/TableCell"; -import { type CSSObject, type Interpolation, type Theme } from "@emotion/react"; -import { type FC } from "react"; +import type { FC } from "react"; import { useNavigate } from "react-router-dom"; import type { WorkspaceBuild } from "api/typesGenerated"; import { BuildAvatar } from "components/BuildAvatar/BuildAvatar"; diff --git a/site/src/pages/WorkspacePage/ChangeVersionDialog.stories.tsx b/site/src/pages/WorkspacePage/ChangeVersionDialog.stories.tsx index d4a7a5376b..387f935a50 100644 --- a/site/src/pages/WorkspacePage/ChangeVersionDialog.stories.tsx +++ b/site/src/pages/WorkspacePage/ChangeVersionDialog.stories.tsx @@ -1,9 +1,9 @@ +import type { Meta, StoryObj } from "@storybook/react"; import { MockTemplate, MockTemplateVersion, MockTemplateVersionWithMarkdownMessage, } from "testHelpers/entities"; -import type { Meta, StoryObj } from "@storybook/react"; import { ChangeVersionDialog } from "./ChangeVersionDialog"; const noMessage = { diff --git a/site/src/pages/WorkspacePage/ChangeVersionDialog.tsx b/site/src/pages/WorkspacePage/ChangeVersionDialog.tsx index b6269ee7be..90872f4201 100644 --- a/site/src/pages/WorkspacePage/ChangeVersionDialog.tsx +++ b/site/src/pages/WorkspacePage/ChangeVersionDialog.tsx @@ -1,22 +1,22 @@ -import { type FC, useRef, useState } from "react"; -import TextField from "@mui/material/TextField"; +import { css } from "@emotion/css"; +import InfoIcon from "@mui/icons-material/InfoOutlined"; +import AlertTitle from "@mui/material/AlertTitle"; import Autocomplete from "@mui/material/Autocomplete"; import CircularProgress from "@mui/material/CircularProgress"; -import AlertTitle from "@mui/material/AlertTitle"; -import InfoIcon from "@mui/icons-material/InfoOutlined"; -import { css } from "@emotion/css"; +import TextField from "@mui/material/TextField"; +import { type FC, useRef, useState } from "react"; import type { Template, TemplateVersion } from "api/typesGenerated"; import { Alert } from "components/Alert/Alert"; -import type { DialogProps } from "components/Dialogs/Dialog"; -import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; -import { FormFields } from "components/Form/Form"; -import { Stack } from "components/Stack/Stack"; -import { Loader } from "components/Loader/Loader"; -import { AvatarData } from "components/AvatarData/AvatarData"; -import { Pill } from "components/Pill/Pill"; import { Avatar } from "components/Avatar/Avatar"; -import { createDayString } from "utils/createDayString"; +import { AvatarData } from "components/AvatarData/AvatarData"; +import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; +import type { DialogProps } from "components/Dialogs/Dialog"; +import { FormFields } from "components/Form/Form"; +import { Loader } from "components/Loader/Loader"; +import { Pill } from "components/Pill/Pill"; +import { Stack } from "components/Stack/Stack"; import { TemplateUpdateMessage } from "modules/templates/TemplateUpdateMessage"; +import { createDayString } from "utils/createDayString"; export type ChangeVersionDialogProps = DialogProps & { template: Template | undefined; diff --git a/site/src/pages/WorkspacePage/HistorySidebar.tsx b/site/src/pages/WorkspacePage/HistorySidebar.tsx index 5e20afc595..089f50208f 100644 --- a/site/src/pages/WorkspacePage/HistorySidebar.tsx +++ b/site/src/pages/WorkspacePage/HistorySidebar.tsx @@ -1,6 +1,6 @@ import ArrowDownwardOutlined from "@mui/icons-material/ArrowDownwardOutlined"; import LoadingButton from "@mui/lab/LoadingButton"; -import { type FC } from "react"; +import type { FC } from "react"; import { useInfiniteQuery } from "react-query"; import { infiniteWorkspaceBuilds } from "api/queries/workspaceBuilds"; import type { Workspace } from "api/typesGenerated"; diff --git a/site/src/pages/WorkspacePage/ResourceMetadata.stories.tsx b/site/src/pages/WorkspacePage/ResourceMetadata.stories.tsx index a8d5bc5113..2ef603c917 100644 --- a/site/src/pages/WorkspacePage/ResourceMetadata.stories.tsx +++ b/site/src/pages/WorkspacePage/ResourceMetadata.stories.tsx @@ -1,5 +1,5 @@ -import { MockWorkspaceResource } from "testHelpers/entities"; import type { Meta, StoryObj } from "@storybook/react"; +import { MockWorkspaceResource } from "testHelpers/entities"; import { ResourceMetadata } from "./ResourceMetadata"; const meta: Meta = { diff --git a/site/src/pages/WorkspacePage/ResourceMetadata.tsx b/site/src/pages/WorkspacePage/ResourceMetadata.tsx index cce0af1760..de6ba96a51 100644 --- a/site/src/pages/WorkspacePage/ResourceMetadata.tsx +++ b/site/src/pages/WorkspacePage/ResourceMetadata.tsx @@ -1,4 +1,4 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import { Children, type FC, @@ -6,9 +6,9 @@ import { type PropsWithChildren, } from "react"; import type { WorkspaceResource } from "api/typesGenerated"; -import { SensitiveValue } from "modules/resources/SensitiveValue"; -import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; import { CopyableValue } from "components/CopyableValue/CopyableValue"; +import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; +import { SensitiveValue } from "modules/resources/SensitiveValue"; type ResourceMetadataProps = Omit, "resource"> & { resource: WorkspaceResource; diff --git a/site/src/pages/WorkspacePage/ResourcesSidebar.tsx b/site/src/pages/WorkspacePage/ResourcesSidebar.tsx index c71d18f0d0..422b6c0497 100644 --- a/site/src/pages/WorkspacePage/ResourcesSidebar.tsx +++ b/site/src/pages/WorkspacePage/ResourcesSidebar.tsx @@ -1,6 +1,6 @@ import { type Interpolation, type Theme, useTheme } from "@emotion/react"; import Skeleton from "@mui/material/Skeleton"; -import { type FC } from "react"; +import type { FC } from "react"; import type { WorkspaceResource } from "api/typesGenerated"; import { Sidebar, diff --git a/site/src/pages/WorkspacePage/ResourcesSidebarContent.tsx b/site/src/pages/WorkspacePage/ResourcesSidebarContent.tsx index 5db9494521..ff8d1e5626 100644 --- a/site/src/pages/WorkspacePage/ResourcesSidebarContent.tsx +++ b/site/src/pages/WorkspacePage/ResourcesSidebarContent.tsx @@ -1,5 +1,5 @@ import { useTheme } from "@emotion/react"; -import { Workspace } from "api/typesGenerated"; +import type { Workspace } from "api/typesGenerated"; import { SidebarLink, SidebarCaption } from "components/FullPageLayout/Sidebar"; export const ResourcesSidebarContent = ({ diff --git a/site/src/pages/WorkspacePage/UpdateBuildParametersDialog.tsx b/site/src/pages/WorkspacePage/UpdateBuildParametersDialog.tsx index ea19d7ed11..67691ccdaa 100644 --- a/site/src/pages/WorkspacePage/UpdateBuildParametersDialog.tsx +++ b/site/src/pages/WorkspacePage/UpdateBuildParametersDialog.tsx @@ -1,22 +1,22 @@ +import { css } from "@emotion/css"; +import type { Interpolation, Theme } from "@emotion/react"; +import Button from "@mui/material/Button"; import Dialog from "@mui/material/Dialog"; +import DialogActions from "@mui/material/DialogActions"; import DialogContent from "@mui/material/DialogContent"; import DialogContentText from "@mui/material/DialogContentText"; import DialogTitle from "@mui/material/DialogTitle"; -import DialogActions from "@mui/material/DialogActions"; -import Button from "@mui/material/Button"; import { useFormik } from "formik"; +import type { FC } from "react"; import * as Yup from "yup"; -import { type FC } from "react"; -import { css } from "@emotion/css"; -import { type Interpolation, type Theme } from "@emotion/react"; -import { getFormHelpers } from "utils/formUtils"; -import type { DialogProps } from "components/Dialogs/Dialog"; -import { FormFields, VerticalForm } from "components/Form/Form"; import type { TemplateVersionParameter, WorkspaceBuildParameter, } from "api/typesGenerated"; +import type { DialogProps } from "components/Dialogs/Dialog"; +import { FormFields, VerticalForm } from "components/Form/Form"; import { RichParameterInput } from "components/RichParameterInput/RichParameterInput"; +import { getFormHelpers } from "utils/formUtils"; import { getInitialRichParameterValues, useValidationSchemaForRichParameters, diff --git a/site/src/pages/WorkspacePage/Workspace.stories.tsx b/site/src/pages/WorkspacePage/Workspace.stories.tsx index cd6cedee0f..609bb68aed 100644 --- a/site/src/pages/WorkspacePage/Workspace.stories.tsx +++ b/site/src/pages/WorkspacePage/Workspace.stories.tsx @@ -1,15 +1,15 @@ import { action } from "@storybook/addon-actions"; -import { Meta, StoryObj } from "@storybook/react"; -import EventSource from "eventsourcemock"; +import type { Meta, StoryObj } from "@storybook/react"; import { withReactContext } from "storybook-react-context"; import type { ProvisionerJobLog } from "api/typesGenerated"; -import * as Mocks from "testHelpers/entities"; import { ProxyContext, getPreferredProxy } from "contexts/ProxyContext"; +import EventSource from "eventsourcemock"; import { DashboardContext } from "modules/dashboard/DashboardProvider"; import { WatchAgentMetadataContext } from "modules/resources/AgentMetadata"; +import * as Mocks from "testHelpers/entities"; +import type { WorkspacePermissions } from "./permissions"; import { Workspace } from "./Workspace"; import { WorkspaceBuildLogsSection } from "./WorkspaceBuildLogsSection"; -import { WorkspacePermissions } from "./permissions"; const MockedAppearance = { config: Mocks.MockAppearanceConfig, diff --git a/site/src/pages/WorkspacePage/Workspace.tsx b/site/src/pages/WorkspacePage/Workspace.tsx index 011b7329fd..2a3caea81a 100644 --- a/site/src/pages/WorkspacePage/Workspace.tsx +++ b/site/src/pages/WorkspacePage/Workspace.tsx @@ -1,26 +1,26 @@ -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; +import { useTheme } from "@emotion/react"; +import HistoryOutlined from "@mui/icons-material/HistoryOutlined"; +import HubOutlined from "@mui/icons-material/HubOutlined"; import AlertTitle from "@mui/material/AlertTitle"; -import { type FC } from "react"; +import type { FC } from "react"; import { useNavigate } from "react-router-dom"; import type * as TypesGen from "api/typesGenerated"; import { Alert, AlertDetail } from "components/Alert/Alert"; -import { AgentRow } from "modules/resources/AgentRow"; +import { SidebarIconButton } from "components/FullPageLayout/Sidebar"; import { useTab } from "hooks"; +import { AgentRow } from "modules/resources/AgentRow"; +import { HistorySidebar } from "./HistorySidebar"; +import type { WorkspacePermissions } from "./permissions"; +import { ResourceMetadata } from "./ResourceMetadata"; +import { ResourcesSidebar } from "./ResourcesSidebar"; +import { resourceOptionValue, useResourcesNav } from "./useResourcesNav"; import { ActiveTransition, WorkspaceBuildProgress, } from "./WorkspaceBuildProgress"; import { WorkspaceDeletedBanner } from "./WorkspaceDeletedBanner"; import { WorkspaceTopbar } from "./WorkspaceTopbar"; -import { HistorySidebar } from "./HistorySidebar"; -import HistoryOutlined from "@mui/icons-material/HistoryOutlined"; -import { useTheme } from "@emotion/react"; -import { SidebarIconButton } from "components/FullPageLayout/Sidebar"; -import HubOutlined from "@mui/icons-material/HubOutlined"; -import { ResourcesSidebar } from "./ResourcesSidebar"; -import { WorkspacePermissions } from "./permissions"; -import { resourceOptionValue, useResourcesNav } from "./useResourcesNav"; -import { ResourceMetadata } from "./ResourceMetadata"; export interface WorkspaceProps { handleStart: (buildParameters?: TypesGen.WorkspaceBuildParameter[]) => void; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/BuildParametersPopover.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/BuildParametersPopover.tsx index 1cad2f77ae..e203ccd671 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/BuildParametersPopover.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/BuildParametersPopover.tsx @@ -1,7 +1,9 @@ +import { useTheme } from "@emotion/react"; import ExpandMoreOutlined from "@mui/icons-material/ExpandMoreOutlined"; import Button from "@mui/material/Button"; -import { useTheme } from "@emotion/react"; -import { type FC } from "react"; +import visuallyHidden from "@mui/utils/visuallyHidden"; +import { useFormik } from "formik"; +import type { FC } from "react"; import { useQuery } from "react-query"; import { getWorkspaceParameters } from "api/api"; import type { @@ -10,29 +12,27 @@ import type { WorkspaceBuildParameter, } from "api/typesGenerated"; import { FormFields } from "components/Form/Form"; -import { Loader } from "components/Loader/Loader"; -import { RichParameterInput } from "components/RichParameterInput/RichParameterInput"; +import { TopbarButton } from "components/FullPageLayout/Topbar"; import { HelpTooltipLink, HelpTooltipLinksGroup, HelpTooltipText, HelpTooltipTitle, } from "components/HelpTooltip/HelpTooltip"; -import { useFormik } from "formik"; -import { docs } from "utils/docs"; -import { getFormHelpers } from "utils/formUtils"; -import { - AutofillBuildParameter, - getInitialRichParameterValues, -} from "utils/richParameters"; +import { Loader } from "components/Loader/Loader"; import { Popover, PopoverContent, PopoverTrigger, usePopover, } from "components/Popover/Popover"; -import { TopbarButton } from "components/FullPageLayout/Topbar"; -import visuallyHidden from "@mui/utils/visuallyHidden"; +import { RichParameterInput } from "components/RichParameterInput/RichParameterInput"; +import { docs } from "utils/docs"; +import { getFormHelpers } from "utils/formUtils"; +import { + type AutofillBuildParameter, + getInitialRichParameterValues, +} from "utils/richParameters"; interface BuildParametersPopoverProps { workspace: Workspace; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/Buttons.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/Buttons.tsx index 43827b68a4..2eb39b04d3 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/Buttons.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/Buttons.tsx @@ -1,18 +1,18 @@ -import Tooltip from "@mui/material/Tooltip"; -import ButtonGroup from "@mui/material/ButtonGroup"; +import BlockIcon from "@mui/icons-material/Block"; +import OutlinedBlockIcon from "@mui/icons-material/BlockOutlined"; import CloudQueueIcon from "@mui/icons-material/CloudQueue"; import CropSquareIcon from "@mui/icons-material/CropSquare"; import PlayCircleOutlineIcon from "@mui/icons-material/PlayCircleOutline"; -import ReplayIcon from "@mui/icons-material/Replay"; -import BlockIcon from "@mui/icons-material/Block"; -import OutlinedBlockIcon from "@mui/icons-material/BlockOutlined"; import PowerSettingsNewIcon from "@mui/icons-material/PowerSettingsNew"; +import ReplayIcon from "@mui/icons-material/Replay"; import Star from "@mui/icons-material/Star"; import StarBorder from "@mui/icons-material/StarBorder"; -import { type FC } from "react"; +import ButtonGroup from "@mui/material/ButtonGroup"; +import Tooltip from "@mui/material/Tooltip"; +import type { FC } from "react"; import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated"; -import { BuildParametersPopover } from "./BuildParametersPopover"; import { TopbarButton } from "components/FullPageLayout/Topbar"; +import { BuildParametersPopover } from "./BuildParametersPopover"; export interface ActionButtonProps { loading?: boolean; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/DebugButton.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/DebugButton.stories.tsx index 870f1bb97b..284fc6d993 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/DebugButton.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/DebugButton.stories.tsx @@ -1,7 +1,7 @@ -import { Meta, StoryObj } from "@storybook/react"; -import { DebugButton } from "./DebugButton"; -import { MockWorkspace } from "testHelpers/entities"; +import type { Meta, StoryObj } from "@storybook/react"; import { userEvent, waitFor, within, expect } from "@storybook/test"; +import { MockWorkspace } from "testHelpers/entities"; +import { DebugButton } from "./DebugButton"; const meta: Meta = { title: "pages/WorkspacePage/DebugButton", diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/DebugButton.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/DebugButton.tsx index d93d7cefc3..33f36027b0 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/DebugButton.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/DebugButton.tsx @@ -1,10 +1,10 @@ -import ButtonGroup from "@mui/material/ButtonGroup"; import DebugIcon from "@mui/icons-material/BugReportOutlined"; -import { type FC } from "react"; +import ButtonGroup from "@mui/material/ButtonGroup"; +import type { FC } from "react"; import type { Workspace } from "api/typesGenerated"; -import { BuildParametersPopover } from "./BuildParametersPopover"; import { TopbarButton } from "components/FullPageLayout/Topbar"; -import { ActionButtonProps } from "./Buttons"; +import { BuildParametersPopover } from "./BuildParametersPopover"; +import type { ActionButtonProps } from "./Buttons"; type DebugButtonProps = Omit & { workspace: Workspace; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.stories.tsx index 25fc7567f1..6d5f7f9c8d 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.stories.tsx @@ -1,7 +1,7 @@ -import { Meta, StoryObj } from "@storybook/react"; -import { RetryButton } from "./RetryButton"; -import { MockWorkspace } from "testHelpers/entities"; +import type { Meta, StoryObj } from "@storybook/react"; import { userEvent, waitFor, within, expect } from "@storybook/test"; +import { MockWorkspace } from "testHelpers/entities"; +import { RetryButton } from "./RetryButton"; const meta: Meta = { title: "pages/WorkspacePage/RetryButton", diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.tsx index 768b505018..bf0db69e9f 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/RetryButton.tsx @@ -1,10 +1,10 @@ -import ButtonGroup from "@mui/material/ButtonGroup"; import RetryIcon from "@mui/icons-material/CachedOutlined"; -import { type FC } from "react"; +import ButtonGroup from "@mui/material/ButtonGroup"; +import type { FC } from "react"; import type { Workspace } from "api/typesGenerated"; -import { BuildParametersPopover } from "./BuildParametersPopover"; import { TopbarButton } from "components/FullPageLayout/Topbar"; -import { ActionButtonProps } from "./Buttons"; +import { BuildParametersPopover } from "./BuildParametersPopover"; +import type { ActionButtonProps } from "./Buttons"; type RetryButtonProps = Omit & { enableBuildParameters: boolean; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx index d14e26a585..ce03863b69 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import * as Mocks from "testHelpers/entities"; import { WorkspaceActions } from "./WorkspaceActions"; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx index 7d573d9600..e90d844dbd 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceActions/WorkspaceActions.tsx @@ -1,8 +1,20 @@ +import DeleteIcon from "@mui/icons-material/DeleteOutlined"; +import DuplicateIcon from "@mui/icons-material/FileCopyOutlined"; +import HistoryIcon from "@mui/icons-material/HistoryOutlined"; +import MoreVertOutlined from "@mui/icons-material/MoreVertOutlined"; +import SettingsIcon from "@mui/icons-material/SettingsOutlined"; +import Divider from "@mui/material/Divider"; import { type FC, type ReactNode, Fragment } from "react"; -import { Workspace, WorkspaceBuildParameter } from "api/typesGenerated"; +import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated"; +import { TopbarIconButton } from "components/FullPageLayout/Topbar"; +import { + MoreMenu, + MoreMenuContent, + MoreMenuItem, + MoreMenuTrigger, +} from "components/MoreMenu/MoreMenu"; import { useWorkspaceDuplication } from "pages/CreateWorkspacePage/useWorkspaceDuplication"; import { mustUpdateWorkspace } from "utils/workspace"; -import { type ActionType, abilitiesByWorkspaceStatus } from "./constants"; import { CancelButton, DisabledButton, @@ -13,22 +25,9 @@ import { ActivateButton, FavoriteButton, } from "./Buttons"; - -import Divider from "@mui/material/Divider"; -import DuplicateIcon from "@mui/icons-material/FileCopyOutlined"; -import SettingsIcon from "@mui/icons-material/SettingsOutlined"; -import HistoryIcon from "@mui/icons-material/HistoryOutlined"; -import DeleteIcon from "@mui/icons-material/DeleteOutlined"; -import { - MoreMenu, - MoreMenuContent, - MoreMenuItem, - MoreMenuTrigger, -} from "components/MoreMenu/MoreMenu"; -import { TopbarIconButton } from "components/FullPageLayout/Topbar"; -import MoreVertOutlined from "@mui/icons-material/MoreVertOutlined"; -import { RetryButton } from "./RetryButton"; +import { type ActionType, abilitiesByWorkspaceStatus } from "./constants"; import { DebugButton } from "./DebugButton"; +import { RetryButton } from "./RetryButton"; export interface WorkspaceActionsProps { workspace: Workspace; diff --git a/site/src/pages/WorkspacePage/WorkspaceActions/constants.ts b/site/src/pages/WorkspacePage/WorkspaceActions/constants.ts index b86736dd4e..3c7347cc52 100644 --- a/site/src/pages/WorkspacePage/WorkspaceActions/constants.ts +++ b/site/src/pages/WorkspacePage/WorkspaceActions/constants.ts @@ -1,4 +1,4 @@ -import { type Workspace, type WorkspaceStatus } from "api/typesGenerated"; +import type { Workspace, WorkspaceStatus } from "api/typesGenerated"; /** * An iterable of all action types supported by the workspace UI diff --git a/site/src/pages/WorkspacePage/WorkspaceBuildProgress.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceBuildProgress.stories.tsx index b65a9ee74f..68424259ff 100644 --- a/site/src/pages/WorkspacePage/WorkspaceBuildProgress.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceBuildProgress.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import dayjs from "dayjs"; import { MockStartingWorkspace, diff --git a/site/src/pages/WorkspacePage/WorkspaceBuildProgress.tsx b/site/src/pages/WorkspacePage/WorkspaceBuildProgress.tsx index 2eb8ea449b..b9d844385f 100644 --- a/site/src/pages/WorkspacePage/WorkspaceBuildProgress.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceBuildProgress.tsx @@ -1,12 +1,11 @@ import { css } from "@emotion/css"; -import { type Interpolation, type Theme } from "@emotion/react"; +import type { Interpolation, Theme } from "@emotion/react"; import LinearProgress from "@mui/material/LinearProgress"; -import type { TransitionStats, Template, Workspace } from "api/typesGenerated"; import dayjs, { type Dayjs } from "dayjs"; -import { type FC, useEffect, useState } from "react"; -import capitalize from "lodash/capitalize"; - import duration from "dayjs/plugin/duration"; +import capitalize from "lodash/capitalize"; +import { type FC, useEffect, useState } from "react"; +import type { TransitionStats, Template, Workspace } from "api/typesGenerated"; dayjs.extend(duration); diff --git a/site/src/pages/WorkspacePage/WorkspaceDeleteDialog/WorkspaceDeleteDialog.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceDeleteDialog/WorkspaceDeleteDialog.stories.tsx index 700e0f824a..ec8e4beeb0 100644 --- a/site/src/pages/WorkspacePage/WorkspaceDeleteDialog/WorkspaceDeleteDialog.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceDeleteDialog/WorkspaceDeleteDialog.stories.tsx @@ -1,6 +1,6 @@ -import { Meta, StoryObj } from "@storybook/react"; -import { WorkspaceDeleteDialog } from "./WorkspaceDeleteDialog"; +import type { Meta, StoryObj } from "@storybook/react"; import { MockWorkspace, MockFailedWorkspace } from "testHelpers/entities"; +import { WorkspaceDeleteDialog } from "./WorkspaceDeleteDialog"; const meta: Meta = { title: "pages/WorkspacePage/WorkspaceDeleteDialog", diff --git a/site/src/pages/WorkspacePage/WorkspaceDeleteDialog/WorkspaceDeleteDialog.tsx b/site/src/pages/WorkspacePage/WorkspaceDeleteDialog/WorkspaceDeleteDialog.tsx index ec2e71657f..e60384fb5f 100644 --- a/site/src/pages/WorkspacePage/WorkspaceDeleteDialog/WorkspaceDeleteDialog.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceDeleteDialog/WorkspaceDeleteDialog.tsx @@ -1,11 +1,14 @@ -import { Workspace, CreateWorkspaceBuildRequest } from "api/typesGenerated"; -import { type FC, type FormEvent, useId, useState } from "react"; -import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; -import { type Interpolation, type Theme } from "@emotion/react"; -import TextField from "@mui/material/TextField"; -import { docs } from "utils/docs"; -import Link from "@mui/material/Link"; +import type { Interpolation, Theme } from "@emotion/react"; import Checkbox from "@mui/material/Checkbox"; +import Link from "@mui/material/Link"; +import TextField from "@mui/material/TextField"; +import { type FC, type FormEvent, useId, useState } from "react"; +import type { + Workspace, + CreateWorkspaceBuildRequest, +} from "api/typesGenerated"; +import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; +import { docs } from "utils/docs"; interface WorkspaceDeleteDialogProps { workspace: Workspace; diff --git a/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.stories.tsx index bc81e1b7c9..081f3e90cd 100644 --- a/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { WorkspaceDeletedBanner } from "./WorkspaceDeletedBanner"; const meta: Meta = { diff --git a/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.tsx b/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.tsx index 8001319b48..4ea3c32e6a 100644 --- a/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceDeletedBanner.tsx @@ -1,5 +1,5 @@ import Button from "@mui/material/Button"; -import { type FC } from "react"; +import type { FC } from "react"; import { Alert } from "components/Alert/Alert"; export interface WorkspaceDeletedBannerProps { diff --git a/site/src/pages/WorkspacePage/WorkspaceNotifications/Notifications.tsx b/site/src/pages/WorkspacePage/WorkspaceNotifications/Notifications.tsx index 79907806b8..238477408b 100644 --- a/site/src/pages/WorkspacePage/WorkspaceNotifications/Notifications.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceNotifications/Notifications.tsx @@ -1,7 +1,7 @@ -import Button, { type ButtonProps } from "@mui/material/Button"; import { type Interpolation, type Theme, useTheme } from "@emotion/react"; -import { type FC, type ReactNode } from "react"; -import { type ThemeRole } from "theme/roles"; +import Button, { type ButtonProps } from "@mui/material/Button"; +import type { FC, ReactNode } from "react"; +import type { AlertProps } from "components/Alert/Alert"; import { Pill } from "components/Pill/Pill"; import { Popover, @@ -9,7 +9,7 @@ import { PopoverTrigger, usePopover, } from "components/Popover/Popover"; -import { type AlertProps } from "components/Alert/Alert"; +import type { ThemeRole } from "theme/roles"; export type NotificationItem = { title: string; diff --git a/site/src/pages/WorkspacePage/WorkspaceNotifications/WorkspaceNotifications.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceNotifications/WorkspaceNotifications.stories.tsx index 644d39dd11..34db0fd783 100644 --- a/site/src/pages/WorkspacePage/WorkspaceNotifications/WorkspaceNotifications.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceNotifications/WorkspaceNotifications.stories.tsx @@ -1,5 +1,6 @@ import type { Meta, StoryObj } from "@storybook/react"; import { expect, userEvent, waitFor, within } from "@storybook/test"; +import { getWorkspaceResolveAutostartQueryKey } from "api/queries/workspaceQuota"; import { MockOutdatedWorkspace, MockTemplate, @@ -7,7 +8,6 @@ import { MockTemplateVersionWithMarkdownMessage, MockWorkspace, } from "testHelpers/entities"; -import { getWorkspaceResolveAutostartQueryKey } from "api/queries/workspaceQuota"; import { withDashboardProvider } from "testHelpers/storybook"; import { WorkspaceNotifications } from "./WorkspaceNotifications"; diff --git a/site/src/pages/WorkspacePage/WorkspaceNotifications/WorkspaceNotifications.tsx b/site/src/pages/WorkspacePage/WorkspaceNotifications/WorkspaceNotifications.tsx index 4d967cc2ab..87b01932c7 100644 --- a/site/src/pages/WorkspacePage/WorkspaceNotifications/WorkspaceNotifications.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceNotifications/WorkspaceNotifications.tsx @@ -1,21 +1,21 @@ -import { workspaceResolveAutostart } from "api/queries/workspaceQuota"; -import { Template, TemplateVersion, Workspace } from "api/typesGenerated"; -import { type Interpolation, type Theme } from "@emotion/react"; -import { type FC, useEffect, useState } from "react"; -import { useQuery } from "react-query"; -import dayjs from "dayjs"; -import { useDashboard } from "modules/dashboard/useDashboard"; -import formatDistanceToNow from "date-fns/formatDistanceToNow"; +import type { Interpolation, Theme } from "@emotion/react"; import InfoOutlined from "@mui/icons-material/InfoOutlined"; import WarningRounded from "@mui/icons-material/WarningRounded"; +import formatDistanceToNow from "date-fns/formatDistanceToNow"; +import dayjs from "dayjs"; +import { type FC, useEffect, useState } from "react"; +import { useQuery } from "react-query"; +import { workspaceResolveAutostart } from "api/queries/workspaceQuota"; +import type { Template, TemplateVersion, Workspace } from "api/typesGenerated"; import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; +import { useDashboard } from "modules/dashboard/useDashboard"; +import { TemplateUpdateMessage } from "modules/templates/TemplateUpdateMessage"; import type { WorkspacePermissions } from "../permissions"; import { NotificationActionButton, - NotificationItem, + type NotificationItem, Notifications, } from "./Notifications"; -import { TemplateUpdateMessage } from "modules/templates/TemplateUpdateMessage"; type WorkspaceNotificationsProps = { workspace: Workspace; diff --git a/site/src/pages/WorkspacePage/WorkspacePage.test.tsx b/site/src/pages/WorkspacePage/WorkspacePage.test.tsx index 1b262907bf..548fb777e4 100644 --- a/site/src/pages/WorkspacePage/WorkspacePage.test.tsx +++ b/site/src/pages/WorkspacePage/WorkspacePage.test.tsx @@ -1,8 +1,9 @@ -import { TemplateVersionParameter, type Workspace } from "api/typesGenerated"; import { screen, waitFor, within } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import EventSourceMock from "eventsourcemock"; import { rest } from "msw"; +import * as api from "api/api"; +import type { TemplateVersionParameter, Workspace } from "api/typesGenerated"; +import EventSourceMock from "eventsourcemock"; import { MockTemplate, MockWorkspace, @@ -17,7 +18,6 @@ import { MockDeploymentConfig, MockWorkspaceBuildDelete, } from "testHelpers/entities"; -import * as api from "api/api"; import { renderWithAuth } from "testHelpers/renderHelpers"; import { server } from "testHelpers/server"; import { WorkspacePage } from "./WorkspacePage"; diff --git a/site/src/pages/WorkspacePage/WorkspacePage.tsx b/site/src/pages/WorkspacePage/WorkspacePage.tsx index f89b0d2d7f..d96fb36efc 100644 --- a/site/src/pages/WorkspacePage/WorkspacePage.tsx +++ b/site/src/pages/WorkspacePage/WorkspacePage.tsx @@ -2,19 +2,19 @@ import { type FC, useEffect } from "react"; import { useQuery, useQueryClient } from "react-query"; import { useParams } from "react-router-dom"; import { watchWorkspace } from "api/api"; -import type { Workspace } from "api/typesGenerated"; -import { workspaceBuildsKey } from "api/queries/workspaceBuilds"; -import { templateByName } from "api/queries/templates"; -import { workspaceByOwnerAndName } from "api/queries/workspaces"; import { checkAuthorization } from "api/queries/authCheck"; -import { useEffectEvent } from "hooks/hookPolyfills"; -import { useOrganizationId } from "contexts/auth/useOrganizationId"; -import { Navbar } from "modules/dashboard/Navbar/Navbar"; -import { ServiceBanner } from "modules/dashboard/ServiceBanner/ServiceBanner"; +import { templateByName } from "api/queries/templates"; +import { workspaceBuildsKey } from "api/queries/workspaceBuilds"; +import { workspaceByOwnerAndName } 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 { WorkspacePermissions, workspaceChecks } from "./permissions"; +import { useOrganizationId } from "contexts/auth/useOrganizationId"; +import { useEffectEvent } from "hooks/hookPolyfills"; +import { Navbar } from "modules/dashboard/Navbar/Navbar"; +import { ServiceBanner } from "modules/dashboard/ServiceBanner/ServiceBanner"; +import { workspaceChecks, type WorkspacePermissions } from "./permissions"; import { WorkspaceReadyPage } from "./WorkspaceReadyPage"; export const WorkspacePage: FC = () => { diff --git a/site/src/pages/WorkspacePage/WorkspaceReadyPage.tsx b/site/src/pages/WorkspacePage/WorkspaceReadyPage.tsx index 37eee8b991..a959cf0edb 100644 --- a/site/src/pages/WorkspacePage/WorkspaceReadyPage.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceReadyPage.tsx @@ -5,14 +5,8 @@ import { useMutation, useQuery, useQueryClient } from "react-query"; import { useNavigate } from "react-router-dom"; import { MissingBuildParameters, restartWorkspace } from "api/api"; import { getErrorMessage } from "api/errors"; -import type * as TypesGen from "api/typesGenerated"; -import { templateVersion, templateVersions } from "api/queries/templates"; import { deploymentConfig, deploymentSSHConfig } from "api/queries/deployment"; -import { useMe } from "contexts/auth/useMe"; -import { useWorkspaceBuildLogs } from "hooks/useWorkspaceBuildLogs"; -import { useDashboard } from "modules/dashboard/useDashboard"; -import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility"; -import { pageTitle } from "utils/page"; +import { templateVersion, templateVersions } from "api/queries/templates"; import { activate, changeVersion, @@ -23,15 +17,21 @@ import { toggleFavorite, cancelBuild, } from "api/queries/workspaces"; -import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; -import { Stack } from "components/Stack/Stack"; +import type * as TypesGen from "api/typesGenerated"; import { ConfirmDialog, - ConfirmDialogProps, + type ConfirmDialogProps, } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { displayError } from "components/GlobalSnackbar/utils"; +import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; +import { Stack } from "components/Stack/Stack"; +import { useMe } from "contexts/auth/useMe"; +import { useWorkspaceBuildLogs } from "hooks/useWorkspaceBuildLogs"; +import { useDashboard } from "modules/dashboard/useDashboard"; +import { useFeatureVisibility } from "modules/dashboard/useFeatureVisibility"; +import { pageTitle } from "utils/page"; import { ChangeVersionDialog } from "./ChangeVersionDialog"; -import { WorkspacePermissions } from "./permissions"; +import type { WorkspacePermissions } from "./permissions"; import { UpdateBuildParametersDialog } from "./UpdateBuildParametersDialog"; import { Workspace } from "./Workspace"; import { WorkspaceBuildLogsSection } from "./WorkspaceBuildLogsSection"; diff --git a/site/src/pages/WorkspacePage/WorkspaceScheduleControls.test.tsx b/site/src/pages/WorkspacePage/WorkspaceScheduleControls.test.tsx index c13d3ffe5b..7a46607293 100644 --- a/site/src/pages/WorkspacePage/WorkspaceScheduleControls.test.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceScheduleControls.test.tsx @@ -1,16 +1,16 @@ import { render, screen } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import { type FC } from "react"; -import { QueryClient, QueryClientProvider, useQuery } from "react-query"; -import { RouterProvider, createMemoryRouter } from "react-router-dom"; import dayjs from "dayjs"; import { rest } from "msw"; +import type { FC } from "react"; +import { QueryClient, QueryClientProvider, useQuery } from "react-query"; +import { RouterProvider, createMemoryRouter } from "react-router-dom"; import * as API from "api/api"; import { workspaceByOwnerAndName } from "api/queries/workspaces"; +import { GlobalSnackbar } from "components/GlobalSnackbar/GlobalSnackbar"; import { ThemeProvider } from "contexts/ThemeProvider"; import { MockTemplate, MockWorkspace } from "testHelpers/entities"; import { server } from "testHelpers/server"; -import { GlobalSnackbar } from "components/GlobalSnackbar/GlobalSnackbar"; import { WorkspaceScheduleControls } from "./WorkspaceScheduleControls"; const Wrapper: FC = () => { diff --git a/site/src/pages/WorkspacePage/WorkspaceScheduleControls.tsx b/site/src/pages/WorkspacePage/WorkspaceScheduleControls.tsx index 7b027e9e36..6b156c8fca 100644 --- a/site/src/pages/WorkspacePage/WorkspaceScheduleControls.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceScheduleControls.tsx @@ -1,18 +1,26 @@ -import { type Interpolation, type Theme } from "@emotion/react"; -import Link, { type LinkProps } from "@mui/material/Link"; -import IconButton from "@mui/material/IconButton"; +import type { Interpolation, Theme } from "@emotion/react"; import AddIcon from "@mui/icons-material/AddOutlined"; import RemoveIcon from "@mui/icons-material/RemoveOutlined"; import ScheduleOutlined from "@mui/icons-material/ScheduleOutlined"; +import IconButton from "@mui/material/IconButton"; +import Link, { type LinkProps } from "@mui/material/Link"; import Tooltip from "@mui/material/Tooltip"; import { visuallyHidden } from "@mui/utils"; import dayjs, { type Dayjs } from "dayjs"; -import { forwardRef, type FC, useRef, useState, ReactNode } from "react"; +import { type FC, forwardRef, type ReactNode, useRef, useState } from "react"; import { useMutation, useQueryClient } from "react-query"; import { Link as RouterLink } from "react-router-dom"; -import { useTime } from "hooks/useTime"; -import { isWorkspaceOn } from "utils/workspace"; +import { getErrorMessage } from "api/errors"; +import { + updateDeadline, + workspaceByOwnerAndNameKey, +} from "api/queries/workspaces"; import type { Template, Workspace } from "api/typesGenerated"; +import { TopbarData, TopbarIcon } from "components/FullPageLayout/Topbar"; +import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; +import { Pill } from "components/Pill/Pill"; +import { useTime } from "hooks/useTime"; +import { getWorkspaceActivityStatus } from "modules/workspaces/activity"; import { autostartDisplay, autostopDisplay, @@ -21,15 +29,7 @@ import { getMaxDeadlineChange, getMinDeadline, } from "utils/schedule"; -import { getErrorMessage } from "api/errors"; -import { - updateDeadline, - workspaceByOwnerAndNameKey, -} from "api/queries/workspaces"; -import { TopbarData, TopbarIcon } from "components/FullPageLayout/Topbar"; -import { displayError, displaySuccess } from "components/GlobalSnackbar/utils"; -import { getWorkspaceActivityStatus } from "modules/workspaces/activity"; -import { Pill } from "components/Pill/Pill"; +import { isWorkspaceOn } from "utils/workspace"; export interface WorkspaceScheduleContainerProps { children?: ReactNode; diff --git a/site/src/pages/WorkspacePage/WorkspaceTopbar.stories.tsx b/site/src/pages/WorkspacePage/WorkspaceTopbar.stories.tsx index 3671801fa4..739ecd699e 100644 --- a/site/src/pages/WorkspacePage/WorkspaceTopbar.stories.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceTopbar.stories.tsx @@ -1,15 +1,15 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { expect, userEvent, waitFor, within, screen } from "@storybook/test"; +import { addDays, addHours, addMinutes } from "date-fns"; +import { getWorkspaceQuotaQueryKey } from "api/queries/workspaceQuota"; import { MockTemplate, MockTemplateVersion, MockUser, MockWorkspace, } from "testHelpers/entities"; -import { WorkspaceTopbar } from "./WorkspaceTopbar"; import { withDashboardProvider } from "testHelpers/storybook"; -import { addDays, addHours, addMinutes } from "date-fns"; -import { getWorkspaceQuotaQueryKey } from "api/queries/workspaceQuota"; +import { WorkspaceTopbar } from "./WorkspaceTopbar"; // We want a workspace without a deadline to not pollute the screenshot const baseWorkspace = { diff --git a/site/src/pages/WorkspacePage/WorkspaceTopbar.tsx b/site/src/pages/WorkspacePage/WorkspaceTopbar.tsx index 2298b5d73a..23cfba1d9a 100644 --- a/site/src/pages/WorkspacePage/WorkspaceTopbar.tsx +++ b/site/src/pages/WorkspacePage/WorkspaceTopbar.tsx @@ -1,17 +1,16 @@ -import Tooltip from "@mui/material/Tooltip"; -import Link from "@mui/material/Link"; -import MonetizationOnOutlined from "@mui/icons-material/MonetizationOnOutlined"; -import DeleteOutline from "@mui/icons-material/DeleteOutline"; -import ArrowBackOutlined from "@mui/icons-material/ArrowBackOutlined"; import { useTheme } from "@emotion/react"; -import { type FC } from "react"; +import ArrowBackOutlined from "@mui/icons-material/ArrowBackOutlined"; +import DeleteOutline from "@mui/icons-material/DeleteOutline"; +import MonetizationOnOutlined from "@mui/icons-material/MonetizationOnOutlined"; +import Link from "@mui/material/Link"; +import Tooltip from "@mui/material/Tooltip"; +import type { FC } from "react"; import { useQuery } from "react-query"; import { Link as RouterLink } from "react-router-dom"; -import type * as TypesGen from "api/typesGenerated"; import { workspaceQuota } from "api/queries/workspaceQuota"; -import { WorkspaceStatusBadge } from "modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge"; -import { useDashboard } from "modules/dashboard/useDashboard"; -import { displayDormantDeletion } from "utils/dormant"; +import type * as TypesGen from "api/typesGenerated"; +import { ExternalAvatar } from "components/Avatar/Avatar"; +import { AvatarData } from "components/AvatarData/AvatarData"; import { Topbar, TopbarAvatar, @@ -20,14 +19,15 @@ import { TopbarIcon, TopbarIconButton, } from "components/FullPageLayout/Topbar"; -import { Popover, PopoverTrigger } from "components/Popover/Popover"; import { HelpTooltipContent } from "components/HelpTooltip/HelpTooltip"; -import { AvatarData } from "components/AvatarData/AvatarData"; -import { ExternalAvatar } from "components/Avatar/Avatar"; +import { Popover, PopoverTrigger } from "components/Popover/Popover"; import { UserAvatar } from "components/UserAvatar/UserAvatar"; +import { useDashboard } from "modules/dashboard/useDashboard"; +import { WorkspaceStatusBadge } from "modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge"; +import { displayDormantDeletion } from "utils/dormant"; +import type { WorkspacePermissions } from "./permissions"; import { WorkspaceActions } from "./WorkspaceActions/WorkspaceActions"; import { WorkspaceNotifications } from "./WorkspaceNotifications/WorkspaceNotifications"; -import { WorkspacePermissions } from "./permissions"; import { WorkspaceScheduleControls } from "./WorkspaceScheduleControls"; export type WorkspaceError = diff --git a/site/src/pages/WorkspacePage/permissions.ts b/site/src/pages/WorkspacePage/permissions.ts index 043a5de708..343396dee1 100644 --- a/site/src/pages/WorkspacePage/permissions.ts +++ b/site/src/pages/WorkspacePage/permissions.ts @@ -1,4 +1,4 @@ -import { Workspace, Template } from "api/typesGenerated"; +import type { Workspace, Template } from "api/typesGenerated"; export const workspaceChecks = (workspace: Workspace, template: Template) => ({ diff --git a/site/src/pages/WorkspacePage/useResourcesNav.test.tsx b/site/src/pages/WorkspacePage/useResourcesNav.test.tsx index a08fa6b726..32ae3dea9d 100644 --- a/site/src/pages/WorkspacePage/useResourcesNav.test.tsx +++ b/site/src/pages/WorkspacePage/useResourcesNav.test.tsx @@ -1,8 +1,8 @@ import { renderHook } from "@testing-library/react"; -import { resourceOptionValue, useResourcesNav } from "./useResourcesNav"; -import { WorkspaceResource } from "api/typesGenerated"; -import { MockWorkspaceResource } from "testHelpers/entities"; import { RouterProvider, createMemoryRouter } from "react-router-dom"; +import type { WorkspaceResource } from "api/typesGenerated"; +import { MockWorkspaceResource } from "testHelpers/entities"; +import { resourceOptionValue, useResourcesNav } from "./useResourcesNav"; describe("useResourcesNav", () => { it("selects the first resource if it has agents and no resource is selected", () => { diff --git a/site/src/pages/WorkspacePage/useResourcesNav.ts b/site/src/pages/WorkspacePage/useResourcesNav.ts index 313c5558a0..f4611a13a6 100644 --- a/site/src/pages/WorkspacePage/useResourcesNav.ts +++ b/site/src/pages/WorkspacePage/useResourcesNav.ts @@ -1,7 +1,7 @@ -import { WorkspaceResource } from "api/typesGenerated"; +import { useCallback, useEffect } from "react"; +import type { WorkspaceResource } from "api/typesGenerated"; import { useTab } from "hooks"; import { useEffectEvent } from "hooks/hookPolyfills"; -import { useCallback, useEffect } from "react"; export const resourceOptionValue = (resource: WorkspaceResource) => { return `${resource.type}_${resource.name}`; diff --git a/site/src/pages/WorkspaceSettingsPage/Sidebar.tsx b/site/src/pages/WorkspaceSettingsPage/Sidebar.tsx index c80f65069c..b2c374121d 100644 --- a/site/src/pages/WorkspaceSettingsPage/Sidebar.tsx +++ b/site/src/pages/WorkspaceSettingsPage/Sidebar.tsx @@ -1,8 +1,8 @@ -import ScheduleIcon from "@mui/icons-material/TimerOutlined"; -import type { Workspace } from "api/typesGenerated"; -import { type FC } from "react"; -import GeneralIcon from "@mui/icons-material/SettingsOutlined"; import ParameterIcon from "@mui/icons-material/CodeOutlined"; +import GeneralIcon from "@mui/icons-material/SettingsOutlined"; +import ScheduleIcon from "@mui/icons-material/TimerOutlined"; +import type { FC } from "react"; +import type { Workspace } from "api/typesGenerated"; import { Avatar } from "components/Avatar/Avatar"; import { Sidebar as BaseSidebar, diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersForm.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersForm.tsx index 481053c1b7..3c4e68075c 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersForm.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersForm.tsx @@ -1,6 +1,11 @@ import { useFormik } from "formik"; -import { type FC } from "react"; +import type { FC } from "react"; import * as Yup from "yup"; +import type { + TemplateVersionParameter, + Workspace, + WorkspaceBuildParameter, +} from "api/typesGenerated"; import { Alert } from "components/Alert/Alert"; import { FormFields, @@ -9,17 +14,12 @@ import { HorizontalForm, } from "components/Form/Form"; import { RichParameterInput } from "components/RichParameterInput/RichParameterInput"; +import { getFormHelpers } from "utils/formUtils"; import { - AutofillBuildParameter, + type AutofillBuildParameter, getInitialRichParameterValues, useValidationSchemaForRichParameters, } from "utils/richParameters"; -import { getFormHelpers } from "utils/formUtils"; -import type { - TemplateVersionParameter, - Workspace, - WorkspaceBuildParameter, -} from "api/typesGenerated"; export type WorkspaceParametersFormValues = { rich_parameter_values: WorkspaceBuildParameter[]; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.stories.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.stories.tsx index d27a5fa3d7..0314fa177a 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.stories.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.stories.tsx @@ -1,5 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; -import { WorkspaceParametersPageView } from "./WorkspaceParametersPage"; +import type { Meta, StoryObj } from "@storybook/react"; import { MockWorkspaceBuildParameter1, MockWorkspaceBuildParameter2, @@ -10,6 +9,7 @@ import { MockWorkspace, MockOutdatedStoppedWorkspaceRequireActiveVersion, } from "testHelpers/entities"; +import { WorkspaceParametersPageView } from "./WorkspaceParametersPage"; const meta: Meta = { title: "pages/WorkspaceSettingsPage/WorkspaceParametersPageView", diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.test.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.test.tsx index 18267f7a8f..99b4f692d1 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.test.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.test.tsx @@ -1,10 +1,5 @@ -import userEvent from "@testing-library/user-event"; -import { - renderWithWorkspaceSettingsLayout, - waitForLoaderToBeRemoved, -} from "testHelpers/renderHelpers"; -import WorkspaceParametersPage from "./WorkspaceParametersPage"; import { screen, waitFor, within } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; import * as api from "api/api"; import { MockWorkspace, @@ -16,6 +11,11 @@ import { MockTemplateVersionParameter4, MockWorkspaceBuildParameter4, } from "testHelpers/entities"; +import { + renderWithWorkspaceSettingsLayout, + waitForLoaderToBeRemoved, +} from "testHelpers/renderHelpers"; +import WorkspaceParametersPage from "./WorkspaceParametersPage"; test("Submit the workspace settings page successfully", async () => { // Mock the API calls that loads data diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.tsx index d98f67f33c..c10accb30e 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceParametersPage/WorkspaceParametersPage.tsx @@ -1,29 +1,29 @@ -import Button from "@mui/material/Button"; import OpenInNewOutlined from "@mui/icons-material/OpenInNewOutlined"; +import Button from "@mui/material/Button"; +import type { FC } from "react"; import { Helmet } from "react-helmet-async"; +import { useMutation, useQuery } from "react-query"; +import { useNavigate } from "react-router-dom"; import { getWorkspaceParameters, postWorkspaceBuild } from "api/api"; +import { isApiValidationError } from "api/errors"; +import { checkAuthorization } from "api/queries/authCheck"; +import { templateByName } from "api/queries/templates"; +import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { EmptyState } from "components/EmptyState/EmptyState"; +import { Loader } from "components/Loader/Loader"; +import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; +import { docs } from "utils/docs"; import { pageTitle } from "utils/page"; import { - WorkspacePermissions, workspaceChecks, + type WorkspacePermissions, } from "../../WorkspacePage/permissions"; -import { checkAuthorization } from "api/queries/authCheck"; import { useWorkspaceSettings } from "../WorkspaceSettingsLayout"; -import { templateByName } from "api/queries/templates"; -import { useMutation, useQuery } from "react-query"; -import { Loader } from "components/Loader/Loader"; import { type WorkspaceParametersFormValues, WorkspaceParametersForm, } from "./WorkspaceParametersForm"; -import { useNavigate } from "react-router-dom"; -import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; -import { type FC } from "react"; -import { isApiValidationError } from "api/errors"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import type { Workspace, WorkspaceBuildParameter } from "api/typesGenerated"; -import { docs } from "utils/docs"; const WorkspaceParametersPage: FC = () => { const workspace = useWorkspaceSettings(); diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx index d45e265c42..a67f17bb07 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import dayjs from "dayjs"; import advancedFormat from "dayjs/plugin/advancedFormat"; import timezone from "dayjs/plugin/timezone"; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.test.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.test.tsx index 41cbe7f373..22d6eaa4df 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.test.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.test.tsx @@ -1,17 +1,17 @@ +import { screen } from "@testing-library/react"; +import * as API from "api/api"; +import { defaultSchedule } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule"; +import { MockTemplate } from "testHelpers/entities"; +import { render } from "testHelpers/renderHelpers"; +import { timeZones } from "utils/timeZones"; import { Language, ttlShutdownAt, validationSchema, - WorkspaceScheduleFormValues, WorkspaceScheduleForm, - WorkspaceScheduleFormProps, + type WorkspaceScheduleFormProps, + type WorkspaceScheduleFormValues, } from "./WorkspaceScheduleForm"; -import { timeZones } from "utils/timeZones"; -import * as API from "api/api"; -import { MockTemplate } from "testHelpers/entities"; -import { render } from "testHelpers/renderHelpers"; -import { defaultSchedule } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule"; -import { screen } from "@testing-library/react"; const valid: WorkspaceScheduleFormValues = { autostartEnabled: true, diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.tsx index 2c2970a306..15a58bf423 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceScheduleForm.tsx @@ -7,6 +7,19 @@ import FormLabel from "@mui/material/FormLabel"; import MenuItem from "@mui/material/MenuItem"; import Switch from "@mui/material/Switch"; import TextField from "@mui/material/TextField"; +import Tooltip from "@mui/material/Tooltip"; +import { formatDuration, intervalToDuration } from "date-fns"; +import dayjs from "dayjs"; +import advancedFormat from "dayjs/plugin/advancedFormat"; +import duration from "dayjs/plugin/duration"; +import relativeTime from "dayjs/plugin/relativeTime"; +import timezone from "dayjs/plugin/timezone"; +import utc from "dayjs/plugin/utc"; +import { type FormikTouched, useFormik } from "formik"; +import type { ChangeEvent, FC } from "react"; +import * as Yup from "yup"; +import type { Template } from "api/typesGenerated"; +import { DisabledBadge } from "components/Badges/Badges"; import { HorizontalForm, FormFooter, @@ -14,25 +27,12 @@ import { FormFields, } from "components/Form/Form"; import { Stack } from "components/Stack/Stack"; -import dayjs from "dayjs"; -import advancedFormat from "dayjs/plugin/advancedFormat"; -import duration from "dayjs/plugin/duration"; -import relativeTime from "dayjs/plugin/relativeTime"; -import timezone from "dayjs/plugin/timezone"; -import utc from "dayjs/plugin/utc"; -import { FormikTouched, useFormik } from "formik"; import { defaultSchedule, emptySchedule, } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule"; -import { type ChangeEvent, type FC } from "react"; -import * as Yup from "yup"; import { getFormHelpers } from "utils/formUtils"; import { timeZones } from "utils/timeZones"; -import Tooltip from "@mui/material/Tooltip"; -import { formatDuration, intervalToDuration } from "date-fns"; -import { DisabledBadge } from "components/Badges/Badges"; -import { Template } from "api/typesGenerated"; // REMARK: some plugins depend on utc, so it's listed first. Otherwise they're // sorted alphabetically. diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx index e91dc02ba0..6803e2c16a 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.test.tsx @@ -1,9 +1,9 @@ -import { renderWithWorkspaceSettingsLayout } from "testHelpers/renderHelpers"; -import userEvent from "@testing-library/user-event"; import { screen } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; import { rest } from "msw"; -import { server } from "testHelpers/server"; import { MockUser, MockWorkspace } from "testHelpers/entities"; +import { renderWithWorkspaceSettingsLayout } from "testHelpers/renderHelpers"; +import { server } from "testHelpers/server"; import { formValuesToAutostartRequest, formValuesToTTLRequest, @@ -11,8 +11,8 @@ import { import { scheduleToAutostart } from "./schedule"; import { ttlMsToAutostop } from "./ttl"; import { - WorkspaceScheduleFormValues, Language as FormLanguage, + type WorkspaceScheduleFormValues, } from "./WorkspaceScheduleForm"; import { WorkspaceSchedulePage } from "./WorkspaceSchedulePage"; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx index 6dae6ab01e..2cb2e4cabc 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/WorkspaceSchedulePage.tsx @@ -1,34 +1,34 @@ +import dayjs from "dayjs"; +import { type FC, useState } from "react"; +import { Helmet } from "react-helmet-async"; +import { useMutation, useQuery, useQueryClient } from "react-query"; +import { useNavigate, useParams } from "react-router-dom"; +import { + putWorkspaceAutostart, + putWorkspaceAutostop, + startWorkspace, +} from "api/api"; +import { checkAuthorization } from "api/queries/authCheck"; +import { templateByName } from "api/queries/templates"; +import { workspaceByOwnerAndNameKey } from "api/queries/workspaces"; +import type * as TypesGen from "api/typesGenerated"; import { Alert } from "components/Alert/Alert"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { Loader } from "components/Loader/Loader"; import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; -import dayjs from "dayjs"; import { scheduleToAutostart, scheduleChanged, } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule"; import { ttlMsToAutostop } from "pages/WorkspaceSettingsPage/WorkspaceSchedulePage/ttl"; import { useWorkspaceSettings } from "pages/WorkspaceSettingsPage/WorkspaceSettingsLayout"; -import { FC, useState } from "react"; -import { Helmet } from "react-helmet-async"; -import { useNavigate, useParams } from "react-router-dom"; import { pageTitle } from "utils/page"; -import * as TypesGen from "api/typesGenerated"; -import { workspaceByOwnerAndNameKey } from "api/queries/workspaces"; -import { WorkspaceScheduleForm } from "./WorkspaceScheduleForm"; import { formValuesToAutostartRequest, formValuesToTTLRequest, } from "./formToRequest"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { useMutation, useQuery, useQueryClient } from "react-query"; -import { checkAuthorization } from "api/queries/authCheck"; -import { templateByName } from "api/queries/templates"; -import { - putWorkspaceAutostart, - putWorkspaceAutostop, - startWorkspace, -} from "api/api"; +import { WorkspaceScheduleForm } from "./WorkspaceScheduleForm"; const permissionsToCheck = (workspace: TypesGen.Workspace) => ({ diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/formToRequest.ts b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/formToRequest.ts index 8096512e97..da045d7a44 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/formToRequest.ts +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/formToRequest.ts @@ -1,5 +1,5 @@ -import * as TypesGen from "api/typesGenerated"; -import { WorkspaceScheduleFormValues } from "./WorkspaceScheduleForm"; +import type * as TypesGen from "api/typesGenerated"; +import type { WorkspaceScheduleFormValues } from "./WorkspaceScheduleForm"; export const formValuesToAutostartRequest = ( values: WorkspaceScheduleFormValues, diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule.ts b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule.ts index 72dbfb9bff..995d4018a4 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule.ts +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSchedulePage/schedule.ts @@ -2,11 +2,11 @@ import * as cronParser from "cron-parser"; import dayjs from "dayjs"; import timezone from "dayjs/plugin/timezone"; import utc from "dayjs/plugin/utc"; -import { extractTimezone, stripTimezone } from "utils/schedule"; -import { Autostop } from "./ttl"; -import { WorkspaceScheduleFormValues } from "./WorkspaceScheduleForm"; import map from "lodash/map"; import some from "lodash/some"; +import { extractTimezone, stripTimezone } from "utils/schedule"; +import type { Autostop } from "./ttl"; +import type { WorkspaceScheduleFormValues } from "./WorkspaceScheduleForm"; // REMARK: timezone plugin depends on UTC // diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsForm.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsForm.tsx index 132e54aaeb..8ef7386f01 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsForm.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsForm.tsx @@ -1,26 +1,26 @@ +import type { Theme } from "@emotion/react"; +import MenuItem from "@mui/material/MenuItem"; import TextField from "@mui/material/TextField"; +import { useFormik } from "formik"; +import upperFirst from "lodash/upperFirst"; +import type { FC } from "react"; +import * as Yup from "yup"; +import { + type AutomaticUpdates, + AutomaticUpdateses, + type Workspace, +} from "api/typesGenerated"; import { FormFields, FormFooter, FormSection, HorizontalForm, } from "components/Form/Form"; -import { useFormik } from "formik"; -import { type FC } from "react"; -import * as Yup from "yup"; import { nameValidator, getFormHelpers, onChangeTrimmed, } from "utils/formUtils"; -import { - AutomaticUpdates, - AutomaticUpdateses, - Workspace, -} from "api/typesGenerated"; -import MenuItem from "@mui/material/MenuItem"; -import upperFirst from "lodash/upperFirst"; -import { type Theme } from "@emotion/react"; export type WorkspaceSettingsFormValues = { name: string; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsLayout.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsLayout.tsx index debd303678..815275d8c4 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsLayout.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsLayout.tsx @@ -1,9 +1,9 @@ import { createContext, type FC, Suspense, useContext } from "react"; import { Helmet } from "react-helmet-async"; -import { Outlet, useParams } from "react-router-dom"; import { useQuery } from "react-query"; -import type { Workspace } from "api/typesGenerated"; +import { Outlet, useParams } from "react-router-dom"; import { workspaceByOwnerAndName } 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"; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.test.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.test.tsx index d6d8c9a11c..4fa1bc8a4d 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.test.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.test.tsx @@ -1,12 +1,12 @@ +import { screen, waitFor, within } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; +import * as api from "api/api"; +import { MockWorkspace } from "testHelpers/entities"; import { renderWithWorkspaceSettingsLayout, waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; import WorkspaceSettingsPage from "./WorkspaceSettingsPage"; -import { screen, waitFor, within } from "@testing-library/react"; -import * as api from "api/api"; -import { MockWorkspace } from "testHelpers/entities"; test("Submit the workspace settings page successfully", async () => { // Mock the API calls that loads data diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.tsx index bf4b06e00b..af05809a9a 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPage.tsx @@ -1,12 +1,12 @@ import { Helmet } from "react-helmet-async"; +import { useMutation } from "react-query"; import { useNavigate, useParams } from "react-router-dom"; +import { patchWorkspace, updateWorkspaceAutomaticUpdates } from "api/api"; +import { displaySuccess } from "components/GlobalSnackbar/utils"; import { pageTitle } from "utils/page"; +import type { WorkspaceSettingsFormValues } from "./WorkspaceSettingsForm"; import { useWorkspaceSettings } from "./WorkspaceSettingsLayout"; import { WorkspaceSettingsPageView } from "./WorkspaceSettingsPageView"; -import { useMutation } from "react-query"; -import { displaySuccess } from "components/GlobalSnackbar/utils"; -import { patchWorkspace, updateWorkspaceAutomaticUpdates } from "api/api"; -import { WorkspaceSettingsFormValues } from "./WorkspaceSettingsForm"; const WorkspaceSettingsPage = () => { const params = useParams() as { diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.stories.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.stories.tsx index 18b2e69754..b45281c0f4 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.stories.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.stories.tsx @@ -1,4 +1,4 @@ -import { Meta, StoryObj } from "@storybook/react"; +import type { Meta, StoryObj } from "@storybook/react"; import { MockWorkspace } from "testHelpers/entities"; import { WorkspaceSettingsPageView } from "./WorkspaceSettingsPageView"; diff --git a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.tsx b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.tsx index 571888ab34..bbd35a2c0d 100644 --- a/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.tsx +++ b/site/src/pages/WorkspaceSettingsPage/WorkspaceSettingsPageView.tsx @@ -1,7 +1,7 @@ +import type { ComponentProps, FC } from "react"; +import type { Workspace } from "api/typesGenerated"; import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; -import { ComponentProps, FC } from "react"; import { WorkspaceSettingsForm } from "./WorkspaceSettingsForm"; -import { Workspace } from "api/typesGenerated"; export type WorkspaceSettingsPageViewProps = { error: unknown; diff --git a/site/src/pages/WorkspacesPage/BatchDeleteConfirmation.tsx b/site/src/pages/WorkspacesPage/BatchDeleteConfirmation.tsx index 8eddd9b637..3159ac5b0d 100644 --- a/site/src/pages/WorkspacesPage/BatchDeleteConfirmation.tsx +++ b/site/src/pages/WorkspacesPage/BatchDeleteConfirmation.tsx @@ -1,9 +1,9 @@ +import { useTheme, type Interpolation, type Theme } from "@emotion/react"; import PersonOutlinedIcon from "@mui/icons-material/PersonOutlined"; import ScheduleIcon from "@mui/icons-material/Schedule"; import { visuallyHidden } from "@mui/utils"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; -import { useTheme, type Interpolation, type Theme } from "@emotion/react"; import { type FC, type ReactNode, useState } from "react"; import type { Workspace } from "api/typesGenerated"; import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; diff --git a/site/src/pages/WorkspacesPage/BatchUpdateConfirmation.tsx b/site/src/pages/WorkspacesPage/BatchUpdateConfirmation.tsx index ba37c14025..fd7ff519de 100644 --- a/site/src/pages/WorkspacesPage/BatchUpdateConfirmation.tsx +++ b/site/src/pages/WorkspacesPage/BatchUpdateConfirmation.tsx @@ -1,19 +1,19 @@ +import type { Interpolation, Theme } from "@emotion/react"; +import InstallDesktopIcon from "@mui/icons-material/InstallDesktop"; import PersonOutlinedIcon from "@mui/icons-material/PersonOutlined"; import ScheduleIcon from "@mui/icons-material/Schedule"; -import InstallDesktopIcon from "@mui/icons-material/InstallDesktop"; import SettingsSuggestIcon from "@mui/icons-material/SettingsSuggest"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; -import { type Interpolation, type Theme } from "@emotion/react"; import { type FC, type ReactNode, useMemo, useState, useEffect } from "react"; import { useQueries } from "react-query"; import { getTemplateVersion } from "api/api"; import type { TemplateVersion, Workspace } from "api/typesGenerated"; -import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; -import { Stack } from "components/Stack/Stack"; import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { ConfirmDialog } from "components/Dialogs/ConfirmDialog/ConfirmDialog"; import { Loader } from "components/Loader/Loader"; import { MemoizedInlineMarkdown } from "components/Markdown/Markdown"; +import { Stack } from "components/Stack/Stack"; dayjs.extend(relativeTime); diff --git a/site/src/pages/WorkspacesPage/LastUsed.tsx b/site/src/pages/WorkspacesPage/LastUsed.tsx index 92fc549ab6..386f158671 100644 --- a/site/src/pages/WorkspacesPage/LastUsed.tsx +++ b/site/src/pages/WorkspacesPage/LastUsed.tsx @@ -1,7 +1,7 @@ import { useTheme } from "@emotion/react"; -import { type FC } from "react"; import dayjs from "dayjs"; import relativeTime from "dayjs/plugin/relativeTime"; +import type { FC } from "react"; import { Stack } from "components/Stack/Stack"; import { useTime } from "hooks/useTime"; diff --git a/site/src/pages/WorkspacesPage/WorkspaceHelpTooltip.tsx b/site/src/pages/WorkspacesPage/WorkspaceHelpTooltip.tsx index e5b1db60b6..678c926eb9 100644 --- a/site/src/pages/WorkspacesPage/WorkspaceHelpTooltip.tsx +++ b/site/src/pages/WorkspacesPage/WorkspaceHelpTooltip.tsx @@ -1,4 +1,4 @@ -import { FC } from "react"; +import type { FC } from "react"; import { HelpTooltip, HelpTooltipContent, diff --git a/site/src/pages/WorkspacesPage/WorkspacesButton.tsx b/site/src/pages/WorkspacesPage/WorkspacesButton.tsx index ce61aaddca..b8e03a2582 100644 --- a/site/src/pages/WorkspacesPage/WorkspacesButton.tsx +++ b/site/src/pages/WorkspacesPage/WorkspacesButton.tsx @@ -1,24 +1,24 @@ -import { type FC, type ReactNode, useState } from "react"; -import { type Template } from "api/typesGenerated"; -import { type UseQueryResult } from "react-query"; -import { - Link as RouterLink, - LinkProps as RouterLinkProps, -} from "react-router-dom"; -import Button from "@mui/material/Button"; -import Link from "@mui/material/Link"; import AddIcon from "@mui/icons-material/AddOutlined"; import OpenIcon from "@mui/icons-material/OpenInNewOutlined"; -import { Loader } from "components/Loader/Loader"; -import { OverflowY } from "components/OverflowY/OverflowY"; +import Button from "@mui/material/Button"; +import Link from "@mui/material/Link"; +import { type FC, type ReactNode, useState } from "react"; +import type { UseQueryResult } from "react-query"; +import { + Link as RouterLink, + type LinkProps as RouterLinkProps, +} from "react-router-dom"; +import type { Template } from "api/typesGenerated"; import { Avatar } from "components/Avatar/Avatar"; -import { SearchBox } from "./WorkspacesSearchBox"; +import { Loader } from "components/Loader/Loader"; +import { SearchEmpty, searchStyles } from "components/Menu/Search"; +import { OverflowY } from "components/OverflowY/OverflowY"; import { Popover, PopoverContent, PopoverTrigger, } from "components/Popover/Popover"; -import { SearchEmpty, searchStyles } from "components/Menu/Search"; +import { SearchBox } from "./WorkspacesSearchBox"; const ICON_SIZE = 18; diff --git a/site/src/pages/WorkspacesPage/WorkspacesEmpty.tsx b/site/src/pages/WorkspacesPage/WorkspacesEmpty.tsx index 3ba4893b6a..f836d1fa73 100644 --- a/site/src/pages/WorkspacesPage/WorkspacesEmpty.tsx +++ b/site/src/pages/WorkspacesPage/WorkspacesEmpty.tsx @@ -1,9 +1,9 @@ import ArrowForwardOutlined from "@mui/icons-material/ArrowForwardOutlined"; import Button from "@mui/material/Button"; +import { Link } from "react-router-dom"; import type { Template } from "api/typesGenerated"; import { Avatar } from "components/Avatar/Avatar"; import { TableEmpty } from "components/TableEmpty/TableEmpty"; -import { Link } from "react-router-dom"; export const WorkspacesEmpty = (props: { isUsingFilter: boolean; diff --git a/site/src/pages/WorkspacesPage/WorkspacesPage.test.tsx b/site/src/pages/WorkspacesPage/WorkspacesPage.test.tsx index 16afb576f8..103f8be66a 100644 --- a/site/src/pages/WorkspacesPage/WorkspacesPage.test.tsx +++ b/site/src/pages/WorkspacesPage/WorkspacesPage.test.tsx @@ -1,6 +1,8 @@ import { screen, waitFor, within } from "@testing-library/react"; +import userEvent from "@testing-library/user-event"; import { rest } from "msw"; -import * as CreateDayString from "utils/createDayString"; +import * as API from "api/api"; +import type { Workspace } from "api/typesGenerated"; import { MockStoppedWorkspace, MockWorkspace, @@ -15,10 +17,8 @@ import { waitForLoaderToBeRemoved, } from "testHelpers/renderHelpers"; import { server } from "testHelpers/server"; +import * as CreateDayString from "utils/createDayString"; import WorkspacesPage from "./WorkspacesPage"; -import userEvent from "@testing-library/user-event"; -import * as API from "api/api"; -import { Workspace } from "api/typesGenerated"; describe("WorkspacesPage", () => { beforeEach(() => { diff --git a/site/src/pages/WorkspacesPage/WorkspacesPage.tsx b/site/src/pages/WorkspacesPage/WorkspacesPage.tsx index d6ac151966..1e507d5ed5 100644 --- a/site/src/pages/WorkspacesPage/WorkspacesPage.tsx +++ b/site/src/pages/WorkspacesPage/WorkspacesPage.tsx @@ -2,21 +2,21 @@ import { type FC, useEffect, useState } from "react"; import { Helmet } from "react-helmet-async"; import { useQuery } from "react-query"; import { useSearchParams } from "react-router-dom"; -import type { Workspace } from "api/typesGenerated"; import { templates } from "api/queries/templates"; +import type { Workspace } from "api/typesGenerated"; +import { useFilter } from "components/Filter/filter"; +import { useUserFilterMenu } from "components/Filter/UserFilter"; import { useOrganizationId } from "contexts/auth/useOrganizationId"; import { usePermissions } from "contexts/auth/usePermissions"; import { useEffectEvent } from "hooks/hookPolyfills"; import { usePagination } from "hooks/usePagination"; import { useDashboard } from "modules/dashboard/useDashboard"; import { pageTitle } from "utils/page"; -import { useFilter } from "components/Filter/filter"; -import { useUserFilterMenu } from "components/Filter/UserFilter"; import { useBatchActions } from "./batchActions"; -import { useWorkspacesData, useWorkspaceUpdate } from "./data"; -import { useTemplateFilterMenu, useStatusFilterMenu } from "./filter/menus"; import { BatchDeleteConfirmation } from "./BatchDeleteConfirmation"; import { BatchUpdateConfirmation } from "./BatchUpdateConfirmation"; +import { useWorkspacesData, useWorkspaceUpdate } from "./data"; +import { useTemplateFilterMenu, useStatusFilterMenu } from "./filter/menus"; import { WorkspacesPageView } from "./WorkspacesPageView"; function useSafeSearchParams() { diff --git a/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx b/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx index 73f5ac74da..69578553cd 100644 --- a/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx +++ b/site/src/pages/WorkspacesPage/WorkspacesPageView.stories.tsx @@ -1,12 +1,18 @@ -import { Meta, StoryObj } from "@storybook/react"; -import { DEFAULT_RECORDS_PER_PAGE } from "components/PaginationWidget/utils"; +import type { Meta, StoryObj } from "@storybook/react"; import dayjs from "dayjs"; import uniqueId from "lodash/uniqueId"; +import type { ComponentProps } from "react"; import { - Workspace, - WorkspaceStatus, + type Workspace, + type WorkspaceStatus, WorkspaceStatuses, } from "api/typesGenerated"; +import { + MockMenu, + getDefaultFilterProps, +} from "components/Filter/storyHelpers"; +import { DEFAULT_RECORDS_PER_PAGE } from "components/PaginationWidget/utils"; +import { DashboardContext } from "modules/dashboard/DashboardProvider"; import { MockWorkspace, MockAppearanceConfig, @@ -19,12 +25,6 @@ import { MockTemplate, } from "testHelpers/entities"; import { WorkspacesPageView } from "./WorkspacesPageView"; -import { DashboardContext } from "modules/dashboard/DashboardProvider"; -import { ComponentProps } from "react"; -import { - MockMenu, - getDefaultFilterProps, -} from "components/Filter/storyHelpers"; const createWorkspace = ( status: WorkspaceStatus, diff --git a/site/src/pages/WorkspacesPage/WorkspacesPageView.tsx b/site/src/pages/WorkspacesPage/WorkspacesPageView.tsx index 3ddc041120..98a20004d1 100644 --- a/site/src/pages/WorkspacesPage/WorkspacesPageView.tsx +++ b/site/src/pages/WorkspacesPage/WorkspacesPageView.tsx @@ -1,32 +1,32 @@ -import { Template, Workspace } from "api/typesGenerated"; -import { PaginationWidgetBase } from "components/PaginationWidget/PaginationWidgetBase"; -import { ComponentProps } from "react"; -import { Margins } from "components/Margins/Margins"; -import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; -import { Stack } from "components/Stack/Stack"; -import { WorkspaceHelpTooltip } from "./WorkspaceHelpTooltip"; -import { WorkspacesTable } from "pages/WorkspacesPage/WorkspacesTable"; -import { ErrorAlert } from "components/Alert/ErrorAlert"; -import { WorkspacesFilter } from "./filter/filter"; -import { hasError, isApiValidationError } from "api/errors"; -import { TableToolbar } from "components/TableToolbar/TableToolbar"; -import DeleteOutlined from "@mui/icons-material/DeleteOutlined"; -import { WorkspacesButton } from "./WorkspacesButton"; -import { UseQueryResult } from "react-query"; -import StopOutlined from "@mui/icons-material/StopOutlined"; -import PlayArrowOutlined from "@mui/icons-material/PlayArrowOutlined"; import CloudQueue from "@mui/icons-material/CloudQueue"; +import DeleteOutlined from "@mui/icons-material/DeleteOutlined"; +import KeyboardArrowDownOutlined from "@mui/icons-material/KeyboardArrowDownOutlined"; +import PlayArrowOutlined from "@mui/icons-material/PlayArrowOutlined"; +import StopOutlined from "@mui/icons-material/StopOutlined"; +import LoadingButton from "@mui/lab/LoadingButton"; +import Divider from "@mui/material/Divider"; +import type { ComponentProps } from "react"; +import type { UseQueryResult } from "react-query"; +import { hasError, isApiValidationError } from "api/errors"; +import type { Template, Workspace } from "api/typesGenerated"; +import { ErrorAlert } from "components/Alert/ErrorAlert"; +import { Margins } from "components/Margins/Margins"; import { MoreMenu, MoreMenuContent, MoreMenuItem, MoreMenuTrigger, } from "components/MoreMenu/MoreMenu"; -import KeyboardArrowDownOutlined from "@mui/icons-material/KeyboardArrowDownOutlined"; -import Divider from "@mui/material/Divider"; -import LoadingButton from "@mui/lab/LoadingButton"; +import { PageHeader, PageHeaderTitle } from "components/PageHeader/PageHeader"; import { PaginationHeader } from "components/PaginationWidget/PaginationHeader"; +import { PaginationWidgetBase } from "components/PaginationWidget/PaginationWidgetBase"; +import { Stack } from "components/Stack/Stack"; +import { TableToolbar } from "components/TableToolbar/TableToolbar"; +import { WorkspacesTable } from "pages/WorkspacesPage/WorkspacesTable"; import { mustUpdateWorkspace } from "utils/workspace"; +import { WorkspacesFilter } from "./filter/filter"; +import { WorkspaceHelpTooltip } from "./WorkspaceHelpTooltip"; +import { WorkspacesButton } from "./WorkspacesButton"; export const Language = { pageTitle: "Workspaces", diff --git a/site/src/pages/WorkspacesPage/WorkspacesTable.tsx b/site/src/pages/WorkspacesPage/WorkspacesTable.tsx index f5a43babc2..66d958bd3e 100644 --- a/site/src/pages/WorkspacesPage/WorkspacesTable.tsx +++ b/site/src/pages/WorkspacesPage/WorkspacesTable.tsx @@ -1,34 +1,34 @@ +import { useTheme } from "@emotion/react"; +import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight"; +import Star from "@mui/icons-material/Star"; +import Checkbox from "@mui/material/Checkbox"; +import Skeleton from "@mui/material/Skeleton"; import Table from "@mui/material/Table"; import TableBody from "@mui/material/TableBody"; import TableCell from "@mui/material/TableCell"; import TableContainer from "@mui/material/TableContainer"; import TableHead from "@mui/material/TableHead"; import TableRow from "@mui/material/TableRow"; -import Checkbox from "@mui/material/Checkbox"; -import Skeleton from "@mui/material/Skeleton"; -import KeyboardArrowRight from "@mui/icons-material/KeyboardArrowRight"; -import Star from "@mui/icons-material/Star"; -import { useTheme } from "@emotion/react"; -import { type FC, type ReactNode } from "react"; +import type { FC, ReactNode } from "react"; import { useNavigate } from "react-router-dom"; import type { Template, Workspace } from "api/typesGenerated"; +import { ExternalAvatar } from "components/Avatar/Avatar"; +import { AvatarData } from "components/AvatarData/AvatarData"; +import { AvatarDataSkeleton } from "components/AvatarData/AvatarDataSkeleton"; +import { InfoTooltip } from "components/InfoTooltip/InfoTooltip"; +import { Stack } from "components/Stack/Stack"; import { TableLoaderSkeleton, TableRowSkeleton, } from "components/TableLoader/TableLoader"; import { useClickableTableRow } from "hooks/useClickableTableRow"; -import { AvatarData } from "components/AvatarData/AvatarData"; -import { ExternalAvatar } from "components/Avatar/Avatar"; -import { Stack } from "components/Stack/Stack"; -import { LastUsed } from "pages/WorkspacesPage/LastUsed"; import { WorkspaceOutdatedTooltip } from "modules/workspaces/WorkspaceOutdatedTooltip/WorkspaceOutdatedTooltip"; import { DormantStatusBadge, WorkspaceStatusBadge, } from "modules/workspaces/WorkspaceStatusBadge/WorkspaceStatusBadge"; +import { LastUsed } from "pages/WorkspacesPage/LastUsed"; import { getDisplayWorkspaceTemplateName } from "utils/workspace"; -import { AvatarDataSkeleton } from "components/AvatarData/AvatarDataSkeleton"; -import { InfoTooltip } from "components/InfoTooltip/InfoTooltip"; import { WorkspacesEmpty } from "./WorkspacesEmpty"; export interface WorkspacesTableProps { diff --git a/site/src/pages/WorkspacesPage/data.ts b/site/src/pages/WorkspacesPage/data.ts index 8bbda6c417..a785d00d03 100644 --- a/site/src/pages/WorkspacesPage/data.ts +++ b/site/src/pages/WorkspacesPage/data.ts @@ -1,13 +1,18 @@ -import { QueryKey, useMutation, useQuery, useQueryClient } from "react-query"; +import { useState } from "react"; +import { + type QueryKey, + useMutation, + useQuery, + useQueryClient, +} from "react-query"; import { getWorkspaces, updateWorkspaceVersion } from "api/api"; import { getErrorMessage } from "api/errors"; -import { +import type { Workspace, WorkspaceBuild, WorkspacesResponse, } from "api/typesGenerated"; import { displayError } from "components/GlobalSnackbar/utils"; -import { useState } from "react"; type UseWorkspacesDataParams = { page: number; diff --git a/site/src/pages/WorkspacesPage/filter/filter.tsx b/site/src/pages/WorkspacesPage/filter/filter.tsx index 1886ca818a..74b534d5d5 100644 --- a/site/src/pages/WorkspacesPage/filter/filter.tsx +++ b/site/src/pages/WorkspacesPage/filter/filter.tsx @@ -1,6 +1,5 @@ import { useTheme } from "@emotion/react"; -import { type FC } from "react"; -import { useDashboard } from "modules/dashboard/useDashboard"; +import type { FC } from "react"; import { Avatar, type AvatarProps } from "components/Avatar/Avatar"; import { Filter, @@ -9,9 +8,10 @@ import { MenuSkeleton, OptionItem, SearchFieldSkeleton, - useFilter, + type useFilter, } from "components/Filter/filter"; import { type UserFilterMenu, UserMenu } from "components/Filter/UserFilter"; +import { useDashboard } from "modules/dashboard/useDashboard"; import { docs } from "utils/docs"; import type { TemplateFilterMenu, StatusFilterMenu } from "./menus"; import type { TemplateOption, StatusOption } from "./options"; diff --git a/site/src/pages/WorkspacesPage/filter/menus.ts b/site/src/pages/WorkspacesPage/filter/menus.ts index 3e805ad229..8c469cf85a 100644 --- a/site/src/pages/WorkspacesPage/filter/menus.ts +++ b/site/src/pages/WorkspacesPage/filter/menus.ts @@ -1,8 +1,11 @@ -import { StatusOption, TemplateOption } from "./options"; import { getTemplates } from "api/api"; -import { WorkspaceStatus } from "api/typesGenerated"; +import type { WorkspaceStatus } from "api/typesGenerated"; +import { + useFilterMenu, + type UseFilterMenuOptions, +} from "components/Filter/menu"; import { getDisplayWorkspaceStatus } from "utils/workspace"; -import { UseFilterMenuOptions, useFilterMenu } from "components/Filter/menu"; +import type { StatusOption, TemplateOption } from "./options"; export const useTemplateFilterMenu = ({ value, diff --git a/site/src/pages/WorkspacesPage/filter/options.ts b/site/src/pages/WorkspacesPage/filter/options.ts index a6be19e40f..329e5b4861 100644 --- a/site/src/pages/WorkspacesPage/filter/options.ts +++ b/site/src/pages/WorkspacesPage/filter/options.ts @@ -1,4 +1,4 @@ -import { BaseOption } from "components/Filter/options"; +import type { BaseOption } from "components/Filter/options"; import type { ThemeRole } from "theme/roles"; export type StatusOption = BaseOption & { diff --git a/site/src/router.tsx b/site/src/router.tsx index c37f1007e3..114d53e7a2 100644 --- a/site/src/router.tsx +++ b/site/src/router.tsx @@ -1,27 +1,27 @@ import { Suspense, lazy } from "react"; import { - Route, createBrowserRouter, - Navigate, createRoutesFromChildren, + Navigate, Outlet, + Route, } from "react-router-dom"; -import { DashboardLayout } from "./modules/dashboard/DashboardLayout"; +import { FullScreenLoader } from "./components/Loader/FullScreenLoader"; import { RequireAuth } from "./contexts/auth/RequireAuth"; +import { DashboardLayout } from "./modules/dashboard/DashboardLayout"; import AuditPage from "./pages/AuditPage/AuditPage"; import { DeploySettingsLayout } from "./pages/DeploySettingsPage/DeploySettingsLayout"; +import { HealthLayout } from "./pages/HealthPage/HealthLayout"; import LoginPage from "./pages/LoginPage/LoginPage"; import { SetupPage } from "./pages/SetupPage/SetupPage"; import { TemplateLayout } from "./pages/TemplatePage/TemplateLayout"; -import { HealthLayout } from "./pages/HealthPage/HealthLayout"; +import { TemplateSettingsLayout } from "./pages/TemplateSettingsPage/TemplateSettingsLayout"; import TemplatesPage from "./pages/TemplatesPage/TemplatesPage"; +import UserSettingsLayout from "./pages/UserSettingsPage/Layout"; import { UsersLayout } from "./pages/UsersPage/UsersLayout"; import UsersPage from "./pages/UsersPage/UsersPage"; -import WorkspacesPage from "./pages/WorkspacesPage/WorkspacesPage"; -import UserSettingsLayout from "./pages/UserSettingsPage/Layout"; -import { TemplateSettingsLayout } from "./pages/TemplateSettingsPage/TemplateSettingsLayout"; import { WorkspaceSettingsLayout } from "./pages/WorkspaceSettingsPage/WorkspaceSettingsLayout"; -import { FullScreenLoader } from "components/Loader/FullScreenLoader"; +import WorkspacesPage from "./pages/WorkspacesPage/WorkspacesPage"; // Lazy load pages // - Pages that are secondary, not in the main navigation or not usually accessed diff --git a/site/src/testHelpers/entities.ts b/site/src/testHelpers/entities.ts index 18beaf4677..6419843509 100644 --- a/site/src/testHelpers/entities.ts +++ b/site/src/testHelpers/entities.ts @@ -1,15 +1,15 @@ +import range from "lodash/range"; import { withDefaultFeatures, type GetLicensesResponse, type DeploymentConfig, } from "api/api"; -import { FieldError } from "api/errors"; -import * as TypesGen from "api/typesGenerated"; -import range from "lodash/range"; +import type { FieldError } from "api/errors"; +import type * as TypesGen from "api/typesGenerated"; import type { Permissions } from "contexts/auth/permissions"; -import { TemplateVersionFiles } from "utils/templateVersion"; -import { FileTree } from "utils/filetree"; -import { ProxyLatencyReport } from "contexts/useProxyLatency"; +import type { ProxyLatencyReport } from "contexts/useProxyLatency"; +import type { FileTree } from "utils/filetree"; +import type { TemplateVersionFiles } from "utils/templateVersion"; export const MockOrganization: TypesGen.Organization = { id: "fc0774ce-cc9e-48d4-80ae-88f7a4d4a8b0", diff --git a/site/src/testHelpers/handlers.ts b/site/src/testHelpers/handlers.ts index 77ab2ec61f..1edf82c2ca 100644 --- a/site/src/testHelpers/handlers.ts +++ b/site/src/testHelpers/handlers.ts @@ -1,10 +1,10 @@ +import fs from "fs"; import { rest } from "msw"; -import { CreateWorkspaceBuildRequest } from "api/typesGenerated"; +import path from "path"; +import type { CreateWorkspaceBuildRequest } from "api/typesGenerated"; import { permissionsToCheck } from "contexts/auth/permissions"; import * as M from "./entities"; import { MockGroup, MockWorkspaceQuota } from "./entities"; -import fs from "fs"; -import path from "path"; export const handlers = [ rest.get("/api/v2/templates/:templateId/daus", async (req, res, ctx) => { diff --git a/site/src/testHelpers/renderHelpers.tsx b/site/src/testHelpers/renderHelpers.tsx index 3a58557aca..aa96f38f4a 100644 --- a/site/src/testHelpers/renderHelpers.tsx +++ b/site/src/testHelpers/renderHelpers.tsx @@ -6,17 +6,17 @@ import { } from "@testing-library/react"; import { type ReactNode, useState } from "react"; import { QueryClient } from "react-query"; +import { + createMemoryRouter, + RouterProvider, + type RouteObject, +} from "react-router-dom"; import { AppProviders } from "App"; import { RequireAuth } from "contexts/auth/RequireAuth"; import { ThemeProvider } from "contexts/ThemeProvider"; import { DashboardLayout } from "modules/dashboard/DashboardLayout"; import { TemplateSettingsLayout } from "pages/TemplateSettingsPage/TemplateSettingsLayout"; import { WorkspaceSettingsLayout } from "pages/WorkspaceSettingsPage/WorkspaceSettingsLayout"; -import { - createMemoryRouter, - RouterProvider, - type RouteObject, -} from "react-router-dom"; import { MockUser } from "./entities"; function createTestQueryClient() { diff --git a/site/src/testHelpers/storybook.tsx b/site/src/testHelpers/storybook.tsx index 47bea51065..232ffb82aa 100644 --- a/site/src/testHelpers/storybook.tsx +++ b/site/src/testHelpers/storybook.tsx @@ -1,5 +1,5 @@ -import { type FC } from "react"; import type { StoryContext } from "@storybook/react"; +import type { FC } from "react"; import { withDefaultFeatures } from "api/api"; import type { Entitlements } from "api/typesGenerated"; import { DashboardContext } from "modules/dashboard/DashboardProvider"; diff --git a/site/src/theme/dark/experimental.ts b/site/src/theme/dark/experimental.ts index 21bb98c69d..4fd064fcd1 100644 --- a/site/src/theme/dark/experimental.ts +++ b/site/src/theme/dark/experimental.ts @@ -1,4 +1,4 @@ -import { type NewTheme } from "../experimental"; +import type { NewTheme } from "../experimental"; import colors from "../tailwindColors"; export default { diff --git a/site/src/theme/dark/index.ts b/site/src/theme/dark/index.ts index 88d961782d..d953c9133c 100644 --- a/site/src/theme/dark/index.ts +++ b/site/src/theme/dark/index.ts @@ -1,7 +1,7 @@ -import muiTheme from "./mui"; import { forDarkThemes } from "../externalImages"; import experimental from "./experimental"; import monaco from "./monaco"; +import muiTheme from "./mui"; import roles from "./roles"; export default { diff --git a/site/src/theme/dark/monaco.ts b/site/src/theme/dark/monaco.ts index ae020bdd1b..377d77cd70 100644 --- a/site/src/theme/dark/monaco.ts +++ b/site/src/theme/dark/monaco.ts @@ -1,5 +1,5 @@ -import muiTheme from "./mui"; import type * as monaco from "monaco-editor"; +import muiTheme from "./mui"; export default { base: "vs-dark", diff --git a/site/src/theme/dark/mui.ts b/site/src/theme/dark/mui.ts index 310c116579..0a2cda9435 100644 --- a/site/src/theme/dark/mui.ts +++ b/site/src/theme/dark/mui.ts @@ -1,7 +1,7 @@ import { createTheme } from "@mui/material/styles"; import { BODY_FONT_FAMILY, borderRadius } from "../constants"; -import tw from "../tailwindColors"; import { components } from "../mui"; +import tw from "../tailwindColors"; const muiTheme = createTheme({ palette: { diff --git a/site/src/theme/darkBlue/experimental.ts b/site/src/theme/darkBlue/experimental.ts index a1d3b069bb..ab395a684b 100644 --- a/site/src/theme/darkBlue/experimental.ts +++ b/site/src/theme/darkBlue/experimental.ts @@ -1,4 +1,4 @@ -import { type NewTheme } from "../experimental"; +import type { NewTheme } from "../experimental"; import colors from "../tailwindColors"; export default { diff --git a/site/src/theme/darkBlue/index.ts b/site/src/theme/darkBlue/index.ts index 88d961782d..d953c9133c 100644 --- a/site/src/theme/darkBlue/index.ts +++ b/site/src/theme/darkBlue/index.ts @@ -1,7 +1,7 @@ -import muiTheme from "./mui"; import { forDarkThemes } from "../externalImages"; import experimental from "./experimental"; import monaco from "./monaco"; +import muiTheme from "./mui"; import roles from "./roles"; export default { diff --git a/site/src/theme/darkBlue/monaco.ts b/site/src/theme/darkBlue/monaco.ts index ae020bdd1b..377d77cd70 100644 --- a/site/src/theme/darkBlue/monaco.ts +++ b/site/src/theme/darkBlue/monaco.ts @@ -1,5 +1,5 @@ -import muiTheme from "./mui"; import type * as monaco from "monaco-editor"; +import muiTheme from "./mui"; export default { base: "vs-dark", diff --git a/site/src/theme/darkBlue/mui.ts b/site/src/theme/darkBlue/mui.ts index 65da18b772..654d5a3fb9 100644 --- a/site/src/theme/darkBlue/mui.ts +++ b/site/src/theme/darkBlue/mui.ts @@ -1,7 +1,7 @@ import { createTheme } from "@mui/material/styles"; import { BODY_FONT_FAMILY, borderRadius } from "../constants"; -import tw from "../tailwindColors"; import { components } from "../mui"; +import tw from "../tailwindColors"; const muiTheme = createTheme({ palette: { diff --git a/site/src/theme/externalImages.ts b/site/src/theme/externalImages.ts index 9d55cd20d4..f2e5cca580 100644 --- a/site/src/theme/externalImages.ts +++ b/site/src/theme/externalImages.ts @@ -1,4 +1,4 @@ -import { type CSSObject } from "@emotion/react"; +import type { CSSObject } from "@emotion/react"; export type ExternalImageMode = keyof ExternalImageModeStyles; diff --git a/site/src/theme/index.ts b/site/src/theme/index.ts index 49bd61cef3..8ff38211a8 100644 --- a/site/src/theme/index.ts +++ b/site/src/theme/index.ts @@ -1,12 +1,12 @@ // eslint-disable-next-line no-restricted-imports -- we still use `Theme` as a basis for our actual theme, for now. import type { Theme as MuiTheme } from "@mui/material/styles"; import type * as monaco from "monaco-editor"; -import type { NewTheme } from "./experimental"; -import type { ExternalImageModeStyles } from "./externalImages"; -import type { Roles } from "./roles"; import dark from "./dark"; import darkBlue from "./darkBlue"; +import type { NewTheme } from "./experimental"; +import type { ExternalImageModeStyles } from "./externalImages"; import light from "./light"; +import type { Roles } from "./roles"; export interface Theme extends MuiTheme { experimental: NewTheme; diff --git a/site/src/theme/light/experimental.ts b/site/src/theme/light/experimental.ts index 25a6929266..60028c4d7b 100644 --- a/site/src/theme/light/experimental.ts +++ b/site/src/theme/light/experimental.ts @@ -1,4 +1,4 @@ -import { type NewTheme } from "../experimental"; +import type { NewTheme } from "../experimental"; import colors from "../tailwindColors"; export default { diff --git a/site/src/theme/light/index.ts b/site/src/theme/light/index.ts index cf8b29896c..f230727e0a 100644 --- a/site/src/theme/light/index.ts +++ b/site/src/theme/light/index.ts @@ -1,7 +1,7 @@ -import muiTheme from "./mui"; import { forLightThemes } from "../externalImages"; import experimental from "./experimental"; import monaco from "./monaco"; +import muiTheme from "./mui"; import roles from "./roles"; export default { diff --git a/site/src/theme/light/monaco.ts b/site/src/theme/light/monaco.ts index 6dc38d2be7..37c3ea3f5d 100644 --- a/site/src/theme/light/monaco.ts +++ b/site/src/theme/light/monaco.ts @@ -1,5 +1,5 @@ -import muiTheme from "./mui"; import type * as monaco from "monaco-editor"; +import muiTheme from "./mui"; export default { base: "vs", diff --git a/site/src/theme/mui.ts b/site/src/theme/mui.ts index 900e1a8f02..555aa23e64 100644 --- a/site/src/theme/mui.ts +++ b/site/src/theme/mui.ts @@ -1,8 +1,8 @@ /* eslint-disable @typescript-eslint/no-explicit-any -- we need to hack around the MUI types a little */ -import { type ThemeOptions } from "@mui/material/styles"; // eslint-disable-next-line no-restricted-imports -- we use the classes for customization import { alertClasses } from "@mui/material/Alert"; +import type { ThemeOptions } from "@mui/material/styles"; import { BODY_FONT_FAMILY, borderRadius, diff --git a/site/src/utils/apps.test.ts b/site/src/utils/apps.test.ts index 9223668f65..d6c3645c77 100644 --- a/site/src/utils/apps.test.ts +++ b/site/src/utils/apps.test.ts @@ -1,9 +1,9 @@ -import { createAppLinkHref } from "./apps"; import { MockWorkspace, MockWorkspaceAgent, MockWorkspaceApp, } from "testHelpers/entities"; +import { createAppLinkHref } from "./apps"; describe("create app link", () => { it("with external URL", () => { diff --git a/site/src/utils/apps.ts b/site/src/utils/apps.ts index b412984172..08a37d45ea 100644 --- a/site/src/utils/apps.ts +++ b/site/src/utils/apps.ts @@ -1,4 +1,4 @@ -import * as TypesGen from "api/typesGenerated"; +import type * as TypesGen from "api/typesGenerated"; export const createAppLinkHref = ( protocol: string, diff --git a/site/src/utils/deployOptions.ts b/site/src/utils/deployOptions.ts index 039fa9a03d..567281e223 100644 --- a/site/src/utils/deployOptions.ts +++ b/site/src/utils/deployOptions.ts @@ -1,5 +1,5 @@ -import { ClibaseGroup, ClibaseOption } from "api/typesGenerated"; import { useMemo } from "react"; +import type { ClibaseGroup, ClibaseOption } from "api/typesGenerated"; const deploymentOptions = ( options: ClibaseOption[], diff --git a/site/src/utils/dormant.test.ts b/site/src/utils/dormant.test.ts index babbb5ef69..3e5e5d28bc 100644 --- a/site/src/utils/dormant.test.ts +++ b/site/src/utils/dormant.test.ts @@ -1,4 +1,4 @@ -import * as TypesGen from "api/typesGenerated"; +import type * as TypesGen from "api/typesGenerated"; import * as Mocks from "testHelpers/entities"; import { displayDormantDeletion } from "./dormant"; diff --git a/site/src/utils/dormant.ts b/site/src/utils/dormant.ts index 1265647878..8abec8bc50 100644 --- a/site/src/utils/dormant.ts +++ b/site/src/utils/dormant.ts @@ -1,4 +1,4 @@ -import { Workspace } from "api/typesGenerated"; +import type { Workspace } from "api/typesGenerated"; // This const dictates how far out we alert the user that a workspace // has an impending deletion (due to template.InactivityTTL being set) diff --git a/site/src/utils/ellipsizeText.test.ts b/site/src/utils/ellipsizeText.test.ts index 4c563a8e24..49d31b917c 100644 --- a/site/src/utils/ellipsizeText.test.ts +++ b/site/src/utils/ellipsizeText.test.ts @@ -1,5 +1,5 @@ import { ellipsizeText } from "./ellipsizeText"; -import { Nullable } from "./nullable"; +import type { Nullable } from "./nullable"; describe("ellipsizeText", () => { it.each([ diff --git a/site/src/utils/ellipsizeText.ts b/site/src/utils/ellipsizeText.ts index 3d66ad9ed9..38d56cef0e 100644 --- a/site/src/utils/ellipsizeText.ts +++ b/site/src/utils/ellipsizeText.ts @@ -1,4 +1,4 @@ -import { Nullable } from "./nullable"; +import type { Nullable } from "./nullable"; /** Truncates and ellipsizes text if it's longer than maxLength */ export const ellipsizeText = ( diff --git a/site/src/utils/filetree.test.ts b/site/src/utils/filetree.test.ts index 77e2c0febc..a89a990637 100644 --- a/site/src/utils/filetree.test.ts +++ b/site/src/utils/filetree.test.ts @@ -1,6 +1,6 @@ import { existsFile, - FileTree, + type FileTree, getFileContent, isFolder, moveFile, diff --git a/site/src/utils/filetree.ts b/site/src/utils/filetree.ts index ba56d893bc..bcc74730f0 100644 --- a/site/src/utils/filetree.ts +++ b/site/src/utils/filetree.ts @@ -1,7 +1,7 @@ -import set from "lodash/set"; -import has from "lodash/has"; -import unset from "lodash/unset"; import get from "lodash/get"; +import has from "lodash/has"; +import set from "lodash/set"; +import unset from "lodash/unset"; export type FileTree = { [key: string]: FileTree | string; diff --git a/site/src/utils/formUtils.stories.tsx b/site/src/utils/formUtils.stories.tsx index f1cb43ce51..96e7031896 100644 --- a/site/src/utils/formUtils.stories.tsx +++ b/site/src/utils/formUtils.stories.tsx @@ -1,10 +1,10 @@ -import type { Meta, StoryObj } from "@storybook/react"; -import { type FC } from "react"; import TextField from "@mui/material/TextField"; +import { action } from "@storybook/addon-actions"; +import type { Meta, StoryObj } from "@storybook/react"; +import { useFormik } from "formik"; +import type { FC } from "react"; import { Form } from "components/Form/Form"; import { getFormHelpers } from "./formUtils"; -import { useFormik } from "formik"; -import { action } from "@storybook/addon-actions"; interface ExampleFormProps { value?: string; diff --git a/site/src/utils/formUtils.test.ts b/site/src/utils/formUtils.test.ts index 2460512947..632dca1312 100644 --- a/site/src/utils/formUtils.test.ts +++ b/site/src/utils/formUtils.test.ts @@ -1,6 +1,6 @@ -import { FormikContextType } from "formik/dist/types"; -import { getFormHelpers, nameValidator, onChangeTrimmed } from "./formUtils"; +import type { FormikContextType } from "formik/dist/types"; import { mockApiError } from "testHelpers/entities"; +import { getFormHelpers, nameValidator, onChangeTrimmed } from "./formUtils"; interface TestType { untouchedGoodField: string; diff --git a/site/src/utils/formUtils.ts b/site/src/utils/formUtils.ts index 12eb5ea341..c48eeb3013 100644 --- a/site/src/utils/formUtils.ts +++ b/site/src/utils/formUtils.ts @@ -1,12 +1,12 @@ -import { isApiValidationError, mapApiErrorToFieldErrors } from "api/errors"; -import { FormikContextType, FormikErrors, getIn } from "formik"; -import { +import { type FormikContextType, type FormikErrors, getIn } from "formik"; +import type { ChangeEvent, ChangeEventHandler, FocusEventHandler, ReactNode, } from "react"; import * as Yup from "yup"; +import { isApiValidationError, mapApiErrorToFieldErrors } from "api/errors"; const Language = { nameRequired: (name: string): string => { diff --git a/site/src/utils/groups.ts b/site/src/utils/groups.ts index a5321d6e61..a5e7ea2078 100644 --- a/site/src/utils/groups.ts +++ b/site/src/utils/groups.ts @@ -1,4 +1,4 @@ -import { Group } from "api/typesGenerated"; +import type { Group } from "api/typesGenerated"; /** * Returns true if the provided group is the 'Everyone' group. diff --git a/site/src/utils/richParameters.ts b/site/src/utils/richParameters.ts index 12182c1c89..3d4a032f32 100644 --- a/site/src/utils/richParameters.ts +++ b/site/src/utils/richParameters.ts @@ -1,8 +1,8 @@ -import { +import * as Yup from "yup"; +import type { TemplateVersionParameter, WorkspaceBuildParameter, } from "api/typesGenerated"; -import * as Yup from "yup"; export type AutofillSource = "user_history" | "url" | "active_build"; diff --git a/site/src/utils/schedule.test.ts b/site/src/utils/schedule.test.ts index 595971828e..116b0448d0 100644 --- a/site/src/utils/schedule.test.ts +++ b/site/src/utils/schedule.test.ts @@ -1,6 +1,6 @@ import dayjs from "dayjs"; import duration from "dayjs/plugin/duration"; -import { Workspace } from "api/typesGenerated"; +import type { Workspace } from "api/typesGenerated"; import * as Mocks from "testHelpers/entities"; import { deadlineExtensionMax, diff --git a/site/src/utils/schedule.tsx b/site/src/utils/schedule.tsx index d1990932e3..e252cd87f7 100644 --- a/site/src/utils/schedule.tsx +++ b/site/src/utils/schedule.tsx @@ -1,12 +1,12 @@ import Link from "@mui/material/Link"; -import cronstrue from "cronstrue"; import cronParser from "cron-parser"; +import cronstrue from "cronstrue"; import dayjs, { type Dayjs } from "dayjs"; import duration from "dayjs/plugin/duration"; import relativeTime from "dayjs/plugin/relativeTime"; import timezone from "dayjs/plugin/timezone"; import utc from "dayjs/plugin/utc"; -import { type ReactNode } from "react"; +import type { ReactNode } from "react"; import { Link as RouterLink } from "react-router-dom"; import type { Template, Workspace } from "api/typesGenerated"; import { HelpTooltipTitle } from "components/HelpTooltip/HelpTooltip"; diff --git a/site/src/utils/starterTemplates.ts b/site/src/utils/starterTemplates.ts index 0caddfb9a8..edbc690eba 100644 --- a/site/src/utils/starterTemplates.ts +++ b/site/src/utils/starterTemplates.ts @@ -1,4 +1,4 @@ -import { TemplateExample } from "api/typesGenerated"; +import type { TemplateExample } from "api/typesGenerated"; export type StarterTemplatesByTag = Record; diff --git a/site/src/utils/tar.test.ts b/site/src/utils/tar.test.ts index 4ed8b32876..cdd337adf6 100644 --- a/site/src/utils/tar.test.ts +++ b/site/src/utils/tar.test.ts @@ -1,4 +1,9 @@ -import { TarReader, TarWriter, ITarFileInfo, TarFileTypeCodes } from "./tar"; +import { + type ITarFileInfo, + TarFileTypeCodes, + TarReader, + TarWriter, +} from "./tar"; const mtime = 1666666666666; diff --git a/site/src/utils/templateVersion.ts b/site/src/utils/templateVersion.ts index c43ad8715c..5f6028cab7 100644 --- a/site/src/utils/templateVersion.ts +++ b/site/src/utils/templateVersion.ts @@ -1,7 +1,7 @@ import set from "lodash/set"; -import { FileTree } from "./filetree"; -import { TarFileTypeCodes, TarReader } from "./tar"; import { isBinaryData } from "modules/templates/TemplateFiles/isBinaryData"; +import type { FileTree } from "./filetree"; +import { TarFileTypeCodes, TarReader } from "./tar"; // Content by filename export type TemplateVersionFiles = Record; diff --git a/site/src/utils/workspace.test.ts b/site/src/utils/workspace.test.ts index 3d267acf5f..6d0d24e9ed 100644 --- a/site/src/utils/workspace.test.ts +++ b/site/src/utils/workspace.test.ts @@ -1,5 +1,5 @@ import dayjs from "dayjs"; -import * as TypesGen from "api/typesGenerated"; +import type * as TypesGen from "api/typesGenerated"; import * as Mocks from "testHelpers/entities"; import { agentVersionStatus, diff --git a/site/src/utils/workspace.tsx b/site/src/utils/workspace.tsx index 35a57c8ad6..2bc789e0d0 100644 --- a/site/src/utils/workspace.tsx +++ b/site/src/utils/workspace.tsx @@ -1,12 +1,12 @@ +import type { Theme } from "@emotion/react"; +import ErrorIcon from "@mui/icons-material/ErrorOutline"; +import QueuedIcon from "@mui/icons-material/HourglassEmpty"; +import PlayIcon from "@mui/icons-material/PlayArrowOutlined"; +import StopIcon from "@mui/icons-material/StopOutlined"; import dayjs from "dayjs"; import duration from "dayjs/plugin/duration"; import minMax from "dayjs/plugin/minMax"; import utc from "dayjs/plugin/utc"; -import ErrorIcon from "@mui/icons-material/ErrorOutline"; -import StopIcon from "@mui/icons-material/StopOutlined"; -import PlayIcon from "@mui/icons-material/PlayArrowOutlined"; -import QueuedIcon from "@mui/icons-material/HourglassEmpty"; -import { type Theme } from "@emotion/react"; import semver from "semver"; import type * as TypesGen from "api/typesGenerated"; import { PillSpinner } from "components/Pill/Pill"; diff --git a/site/vite.config.ts b/site/vite.config.ts index 1ca3de51cb..542278416d 100644 --- a/site/vite.config.ts +++ b/site/vite.config.ts @@ -1,7 +1,7 @@ import react from "@vitejs/plugin-react"; import path from "path"; -import { defineConfig, PluginOption } from "vite"; import { visualizer } from "rollup-plugin-visualizer"; +import { defineConfig, type PluginOption } from "vite"; import checker from "vite-plugin-checker"; const plugins: PluginOption[] = [