coder · AbhineetJain · Jun 27, 2022 · Jun 27, 2022
diff --git a/site/.prettierrc b/site/.prettierrc
@@ -1,5 +1,5 @@
 {
-  "printWidth": 120,
+  "printWidth": 100,
   "semi": false,
   "trailingComma": "all",
   "overrides": [

diff --git a/site/can-ndjson-stream.d.ts b/site/can-ndjson-stream.d.ts
@@ -1,4 +1,6 @@
 declare module "can-ndjson-stream" {
-  function ndjsonStream<TValueType>(body: ReadableStream<Uint8Array> | null): Promise<ReadableStream<TValueType>>
+  function ndjsonStream<TValueType>(
+    body: ReadableStream<Uint8Array> | null,
+  ): Promise<ReadableStream<TValueType>>
   export default ndjsonStream
 }
diff --git a/site/e2e/playwright.config.ts b/site/e2e/playwright.config.ts
@@ -17,7 +17,10 @@ const config: PlaywrightTestConfig = {
   // https://playwright.dev/docs/test-advanced#launching-a-development-web-server-during-the-tests
   webServer: {
     // Run the coder daemon directly.
-    command: `go run -tags embed ${path.join(__dirname, "../../cmd/coder/main.go")} server --in-memory`,
+    command: `go run -tags embed ${path.join(
+      __dirname,
+      "../../cmd/coder/main.go",
+    )} server --in-memory`,
     port: 3000,
     timeout: 120 * 10000,
     reuseExistingServer: false,

diff --git a/site/e2e/util.ts b/site/e2e/util.ts
@@ -22,7 +22,10 @@ export const timeout = (timeoutInMilliseconds: number): Promise<void> => {
  * @param timeToWaitInMilliseconds  The total time to wait for the condition to be `true`.
  * @returns
  */
-export const waitFor = async (f: () => Promise<boolean>, timeToWaitInMilliseconds = 30000): Promise<void> => {
+export const waitFor = async (
+  f: () => Promise<boolean>,
+  timeToWaitInMilliseconds = 30000,
+): Promise<void> => {
   let elapsedTime = 0
   const timeToWaitPerIteration = 1000
 
@@ -58,7 +61,10 @@ interface WaitForClientSideNavigationOpts {
  * waitForNavigation waits for load events on the DOM (ex: after a page load
  * from the server).
  */
-export const waitForClientSideNavigation = async (page: Page, opts: WaitForClientSideNavigationOpts): Promise<void> => {
+export const waitForClientSideNavigation = async (
+  page: Page,
+  opts: WaitForClientSideNavigationOpts,
+): Promise<void> => {
   console.info(`--- waitForClientSideNavigation: start`)
 
   await Promise.all([

diff --git a/site/htmlTemplates/index.html b/site/htmlTemplates/index.html
@@ -17,7 +17,11 @@
   <meta property="og:type" content="website" />
   <meta property="csp-nonce" content="{{ .CSP.Nonce }}" />
   <meta property="csrf-token" content="{{ .CSRF.Token }}" />
-  <meta id="api-response" data-statuscode="{{ .APIResponse.StatusCode }}" data-message="{{ .APIResponse.Message }}" />
+  <meta
+    id="api-response"
+    data-statuscode="{{ .APIResponse.StatusCode }}"
+    data-message="{{ .APIResponse.Message }}"
+  />
   <link rel="mask-icon" href="/static/favicon.svg" color="#000000" crossorigin="use-credentials" />
   <link rel="alternate icon" type="image/png" href="/favicon.png" />
   <link rel="icon" type="image/svg+xml" href="/favicon.svg" />

diff --git a/site/jest.setup.ts b/site/jest.setup.ts
@@ -46,7 +46,9 @@ CONSOLE_FAIL_TYPES.forEach((logType: string) => {
   const consoleAsAny = global.console as any
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   consoleAsAny[logType] = (format: string, ...args: any[]): void => {
-    throw new Error(`Failing due to console.${logType} while running test!\n\n${util.format(format, ...args)}`)
+    throw new Error(
+      `Failing due to console.${logType} while running test!\n\n${util.format(format, ...args)}`,
+    )
   }
 })
 

diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx
@@ -19,7 +19,9 @@ import { WorkspaceBuildPage } from "./pages/WorkspaceBuildPage/WorkspaceBuildPag
 import { WorkspacePage } from "./pages/WorkspacePage/WorkspacePage"
 import { WorkspaceSchedulePage } from "./pages/WorkspaceSchedulePage/WorkspaceSchedulePage"
 
-const WorkspaceAppErrorPage = lazy(() => import("./pages/WorkspaceAppErrorPage/WorkspaceAppErrorPage"))
+const WorkspaceAppErrorPage = lazy(
+  () => import("./pages/WorkspaceAppErrorPage/WorkspaceAppErrorPage"),
+)
 const TerminalPage = lazy(() => import("./pages/TerminalPage/TerminalPage"))
 const WorkspacesPage = lazy(() => import("./pages/WorkspacesPage/WorkspacesPage"))
 const CreateWorkspacePage = lazy(() => import("./pages/CreateWorkspacePage/CreateWorkspacePage"))

diff --git a/site/src/api/api.ts b/site/src/api/api.ts
@@ -22,15 +22,22 @@ export const provisioners: TypesGen.ProvisionerDaemon[] = [
   },
 ]
 
-export const login = async (email: string, password: string): Promise<TypesGen.LoginWithPasswordResponse> => {
+export const login = async (
+  email: string,
+  password: string,
+): Promise<TypesGen.LoginWithPasswordResponse> => {
   const payload = JSON.stringify({
     email,
     password,
   })
 
-  const response = await axios.post<TypesGen.LoginWithPasswordResponse>("/api/v2/users/login", payload, {
-    headers: { ...CONTENT_TYPE_JSON },
-  })
+  const response = await axios.post<TypesGen.LoginWithPasswordResponse>(
+    "/api/v2/users/login",
+    payload,
+    {
+      headers: { ...CONTENT_TYPE_JSON },
+    },
+  )
 
   return response.data
 }
@@ -53,7 +60,10 @@ export const checkUserPermissions = async (
   userId: string,
   params: TypesGen.UserAuthorizationRequest,
 ): Promise<TypesGen.UserAuthorizationResponse> => {
-  const response = await axios.post<TypesGen.UserAuthorizationResponse>(`/api/v2/users/${userId}/authorization`, params)
+  const response = await axios.post<TypesGen.UserAuthorizationResponse>(
+    `/api/v2/users/${userId}/authorization`,
+    params,
+  )
   return response.data
 }
 
@@ -83,35 +93,54 @@ export const getTemplate = async (templateId: string): Promise<TypesGen.Template
 }
 
 export const getTemplates = async (organizationId: string): Promise<TypesGen.Template[]> => {
-  const response = await axios.get<TypesGen.Template[]>(`/api/v2/organizations/${organizationId}/templates`)
+  const response = await axios.get<TypesGen.Template[]>(
+    `/api/v2/organizations/${organizationId}/templates`,
+  )
   return response.data
 }
 
-export const getTemplateByName = async (organizationId: string, name: string): Promise<TypesGen.Template> => {
-  const response = await axios.get<TypesGen.Template>(`/api/v2/organizations/${organizationId}/templates/${name}`)
+export const getTemplateByName = async (
+  organizationId: string,
+  name: string,
+): Promise<TypesGen.Template> => {
+  const response = await axios.get<TypesGen.Template>(
+    `/api/v2/organizations/${organizationId}/templates/${name}`,
+  )
   return response.data
 }
 
 export const getTemplateVersion = async (versionId: string): Promise<TypesGen.TemplateVersion> => {
-  const response = await axios.get<TypesGen.TemplateVersion>(`/api/v2/templateversions/${versionId}`)
+  const response = await axios.get<TypesGen.TemplateVersion>(
+    `/api/v2/templateversions/${versionId}`,
+  )
   return response.data
 }
 
-export const getTemplateVersionSchema = async (versionId: string): Promise<TypesGen.ParameterSchema[]> => {
-  const response = await axios.get<TypesGen.ParameterSchema[]>(`/api/v2/templateversions/${versionId}/schema`)
+export const getTemplateVersionSchema = async (
+  versionId: string,
+): Promise<TypesGen.ParameterSchema[]> => {
+  const response = await axios.get<TypesGen.ParameterSchema[]>(
+    `/api/v2/templateversions/${versionId}/schema`,
+  )
   return response.data
 }
 
-export const getTemplateVersionResources = async (versionId: string): Promise<TypesGen.WorkspaceResource[]> => {
-  const response = await axios.get<TypesGen.WorkspaceResource[]>(`/api/v2/templateversions/${versionId}/resources`)
+export const getTemplateVersionResources = async (
+  versionId: string,
+): Promise<TypesGen.WorkspaceResource[]> => {
+  const response = await axios.get<TypesGen.WorkspaceResource[]>(
+    `/api/v2/templateversions/${versionId}/resources`,
+  )
   return response.data
 }
 
 export const getWorkspace = async (
   workspaceId: string,
   params?: TypesGen.WorkspaceOptions,
 ): Promise<TypesGen.Workspace> => {
-  const response = await axios.get<TypesGen.Workspace>(`/api/v2/workspaces/${workspaceId}`, { params })
+  const response = await axios.get<TypesGen.Workspace>(`/api/v2/workspaces/${workspaceId}`, {
+    params,
+  })
   return response.data
 }
 
@@ -128,7 +157,9 @@ export const getWorkspacesURL = (filter?: TypesGen.WorkspaceFilter): string => {
   return searchString ? `${basePath}?${searchString}` : basePath
 }
 
-export const getWorkspaces = async (filter?: TypesGen.WorkspaceFilter): Promise<TypesGen.Workspace[]> => {
+export const getWorkspaces = async (
+  filter?: TypesGen.WorkspaceFilter,
+): Promise<TypesGen.Workspace[]> => {
   const url = getWorkspacesURL(filter)
   const response = await axios.get<TypesGen.Workspace[]>(url)
   return response.data
@@ -139,13 +170,18 @@ export const getWorkspaceByOwnerAndName = async (
   workspaceName: string,
   params?: TypesGen.WorkspaceOptions,
 ): Promise<TypesGen.Workspace> => {
-  const response = await axios.get<TypesGen.Workspace>(`/api/v2/users/${username}/workspace/${workspaceName}`, {
-    params,
-  })
+  const response = await axios.get<TypesGen.Workspace>(
+    `/api/v2/users/${username}/workspace/${workspaceName}`,
+    {
+      params,
+    },
+  )
   return response.data
 }
 
-export const getWorkspaceResources = async (workspaceBuildID: string): Promise<TypesGen.WorkspaceResource[]> => {
+export const getWorkspaceResources = async (
+  workspaceBuildID: string,
+): Promise<TypesGen.WorkspaceResource[]> => {
   const response = await axios.get<TypesGen.WorkspaceResource[]>(
     `/api/v2/workspacebuilds/${workspaceBuildID}/resources`,
   )
@@ -167,7 +203,9 @@ export const startWorkspace = postWorkspaceBuild("start")
 export const stopWorkspace = postWorkspaceBuild("stop")
 export const deleteWorkspace = postWorkspaceBuild("delete")
 
-export const cancelWorkspaceBuild = async (workspaceBuildId: TypesGen.WorkspaceBuild["id"]): Promise<Types.Message> => {
+export const cancelWorkspaceBuild = async (
+  workspaceBuildId: TypesGen.WorkspaceBuild["id"],
+): Promise<Types.Message> => {
   const response = await axios.patch(`/api/v2/workspacebuilds/${workspaceBuildId}/cancel`)
   return response.data
 }
@@ -181,7 +219,10 @@ export const createWorkspace = async (
   organizationId: string,
   workspace: TypesGen.CreateWorkspaceRequest,
 ): Promise<TypesGen.Workspace> => {
-  const response = await axios.post<TypesGen.Workspace>(`/api/v2/organizations/${organizationId}/workspaces`, workspace)
+  const response = await axios.post<TypesGen.Workspace>(
+    `/api/v2/organizations/${organizationId}/workspaces`,
+    workspace,
+  )
   return response.data
 }
 
@@ -263,8 +304,12 @@ export const regenerateUserSSHKey = async (userId = "me"): Promise<TypesGen.GitS
   return response.data
 }
 
-export const getWorkspaceBuilds = async (workspaceId: string): Promise<TypesGen.WorkspaceBuild[]> => {
-  const response = await axios.get<TypesGen.WorkspaceBuild[]>(`/api/v2/workspaces/${workspaceId}/builds`)
+export const getWorkspaceBuilds = async (
+  workspaceId: string,
+): Promise<TypesGen.WorkspaceBuild[]> => {
+  const response = await axios.get<TypesGen.WorkspaceBuild[]>(
+    `/api/v2/workspaces/${workspaceId}/builds`,
+  )
   return response.data
 }
 
@@ -279,7 +324,10 @@ export const getWorkspaceBuildByNumber = async (
   return response.data
 }
 
-export const getWorkspaceBuildLogs = async (buildname: string, before: Date): Promise<TypesGen.ProvisionerJobLog[]> => {
+export const getWorkspaceBuildLogs = async (
+  buildname: string,
+  before: Date,
+): Promise<TypesGen.ProvisionerJobLog[]> => {
   const response = await axios.get<TypesGen.ProvisionerJobLog[]>(
     `/api/v2/workspacebuilds/${buildname}/logs?before=${before.getTime()}`,
   )

diff --git a/site/src/api/errors.ts b/site/src/api/errors.ts
@@ -27,7 +27,8 @@ export const isApiError = (err: any): err is ApiError => {
     const response = err.response?.data
 
     return (
-      typeof response.message === "string" && (typeof response.errors === "undefined" || Array.isArray(response.errors))
+      typeof response.message === "string" &&
+      (typeof response.errors === "undefined" || Array.isArray(response.errors))
     )
   }
 
@@ -40,7 +41,8 @@ export const isApiError = (err: any): err is ApiError => {
  * @param error ApiError
  * @returns true if the ApiError contains error messages for specific form fields.
  */
-export const hasApiFieldErrors = (error: ApiError): boolean => Array.isArray(error.response.data.validations)
+export const hasApiFieldErrors = (error: ApiError): boolean =>
+  Array.isArray(error.response.data.validations)
 
 export const mapApiErrorToFieldErrors = (apiErrorResponse: ApiErrorResponse): FieldErrors => {
   const result: FieldErrors = {}
@@ -60,5 +62,12 @@ export const mapApiErrorToFieldErrors = (apiErrorResponse: ApiErrorResponse): Fi
  * @param defaultMessage
  * @returns error's message if ApiError or Error, else defaultMessage
  */
-export const getErrorMessage = (error: Error | ApiError | unknown, defaultMessage: string): string =>
-  isApiError(error) ? error.response.data.message : error instanceof Error ? error.message : defaultMessage
+export const getErrorMessage = (
+  error: Error | ApiError | unknown,
+  defaultMessage: string,
+): string =>
+  isApiError(error)
+    ? error.response.data.message
+    : error instanceof Error
+    ? error.message
+    : defaultMessage
diff --git a/site/src/api/typesGenerated.ts b/site/src/api/typesGenerated.ts
@@ -512,7 +512,13 @@ export type ParameterSourceScheme = "data" | "none"
 export type ParameterTypeSystem = "hcl" | "none"
 
 // From codersdk/provisionerdaemons.go:47:6
-export type ProvisionerJobStatus = "canceled" | "canceling" | "failed" | "pending" | "running" | "succeeded"
+export type ProvisionerJobStatus =
+  | "canceled"
+  | "canceling"
+  | "failed"
+  | "pending"
+  | "running"
+  | "succeeded"
 
 // From codersdk/organizations.go:14:6
 export type ProvisionerStorageMethod = "file"

diff --git a/site/src/components/AvatarData/AvatarData.tsx b/site/src/components/AvatarData/AvatarData.tsx
@@ -22,7 +22,11 @@ export const AvatarData: FC<AvatarDataProps> = ({ title, subtitle, link }) => {
       </Avatar>
 
       {link ? (
-        <Link component={RouterLink} to={link} className={combineClasses([styles.info, styles.link])}>
+        <Link
+          component={RouterLink}
+          to={link}
+          className={combineClasses([styles.info, styles.link])}
+        >
           <b>{title}</b>
           <span>{subtitle}</span>
         </Link>

diff --git a/site/src/components/BorderedMenu/BorderedMenu.stories.tsx b/site/src/components/BorderedMenu/BorderedMenu.stories.tsx
@@ -11,7 +11,12 @@ export default {
 
 const Template: Story<BorderedMenuProps> = (args: BorderedMenuProps) => (
   <BorderedMenu {...args}>
-    <BorderedMenuRow title="Item 1" description="Here's a description" Icon={BuildingIcon} path="/" />
+    <BorderedMenuRow
+      title="Item 1"
+      description="Here's a description"
+      Icon={BuildingIcon}
+      path="/"
+    />
     <BorderedMenuRow
       active
       title="Item 2"

diff --git a/site/src/components/BorderedMenu/BorderedMenu.tsx b/site/src/components/BorderedMenu/BorderedMenu.tsx
@@ -12,7 +12,11 @@ export const BorderedMenu: FC<BorderedMenuProps> = ({ children, variant, ...rest
   const styles = useStyles()
 
   return (
-    <Popover classes={{ root: styles.root, paper: styles.paperRoot }} data-variant={variant} {...rest}>
+    <Popover
+      classes={{ root: styles.root, paper: styles.paperRoot }}
+      data-variant={variant}
+      {...rest}
+    >
       {children}
     </Popover>
   )

diff --git a/site/src/components/BuildsTable/BuildsTable.tsx b/site/src/components/BuildsTable/BuildsTable.tsx
@@ -69,7 +69,9 @@ export const BuildsTable: FC<BuildsTableProps> = ({ builds, className }) => {
               >
                 <TableCellLink to={buildPageLink}>{build.transition}</TableCellLink>
                 <TableCellLink to={buildPageLink}>
-                  <span style={{ color: theme.palette.text.secondary }}>{displayWorkspaceBuildDuration(build)}</span>
+                  <span style={{ color: theme.palette.text.secondary }}>
+                    {displayWorkspaceBuildDuration(build)}
+                  </span>
                 </TableCellLink>
                 <TableCellLink to={buildPageLink}>
                   <span style={{ color: theme.palette.text.secondary }}>

diff --git a/site/src/components/CodeExample/CodeExample.tsx b/site/src/components/CodeExample/CodeExample.tsx
@@ -37,7 +37,12 @@ const useStyles = makeStyles((theme) => ({
     padding: theme.spacing(0.5),
   },
   code: {
-    padding: `${theme.spacing(0.5)}px  ${theme.spacing(0.75)}px ${theme.spacing(0.5)}px ${theme.spacing(2)}px`,
+    padding: `
+      ${theme.spacing(0.5)}px
+      ${theme.spacing(0.75)}px
+      ${theme.spacing(0.5)}px
+      ${theme.spacing(2)}px
+    `,
     whiteSpace: "nowrap",
     width: "100%",
     overflowX: "auto",

diff --git a/site/src/components/ConfirmDialog/ConfirmDialog.tsx b/site/src/components/ConfirmDialog/ConfirmDialog.tsx
@@ -25,7 +25,8 @@ const CONFIRM_DIALOG_DEFAULTS: Record<ConfirmDialogType, ConfirmDialogTypeConfig
   },
 }
 
-export interface ConfirmDialogProps extends Omit<DialogActionButtonsProps, "color" | "confirmDialog" | "onCancel"> {
+export interface ConfirmDialogProps
+  extends Omit<DialogActionButtonsProps, "color" | "confirmDialog" | "onCancel"> {
   readonly description?: React.ReactNode
   /**
    * hideCancel hides the cancel button when set true, and shows the cancel