Jan 17, 2023 · Jan 17, 2023
diff --git a/site/src/AppRouter.tsx b/site/src/AppRouter.tsx
          <Route element={<DashboardLayout />}>
            <Route index element={<IndexPage />} />

            <Route path="cli-auth" element={<CliAuthenticationPage />} />
            <Route path="gitauth" element={<GitAuthPage />} />

            <Route path="workspaces" element={<WorkspacesPage />} />
            </Route>
          </Route>

          {/* Terminalpage don't have the dashboard layout */}
          {/* Terminaland CLI auth pages don't have the dashboard layout */}
          <Route
            path="/@:username/:workspace/terminal"
            element={<TerminalPage />}
          />
          <Route path="cli-auth" element={<CliAuthenticationPage />} />
        </Route>

        {/* Using path="*"" means "match anything", so this route
diff --git a/site/src/components/SignInLayout/SignInLayout.tsx b/site/src/components/SignInLayout/SignInLayout.tsx
  },
  container: {
    marginTop: theme.spacing(-8),
    minWidth: "320px",
    maxWidth: "320px",
    maxWidth: 385,
  },
  copyright: {
    marginTop: theme.spacing(2),
  footer: {
    fontSize: 12,
    color: theme.palette.text.secondary,
    marginTop: theme.spacing(3),
  },
 }))

    <div className={styles.root}>
      <div className={styles.layout}>
        <div className={styles.container}>{children}</div>
        <div className={styles.copyright}>
        <div className={styles.footer}>
          {`\u00a9 ${new Date().getFullYear()} Coder Technologies, Inc.`}
        </div>
      </div>
diff --git a/site/src/components/Welcome/Welcome.tsx b/site/src/components/Welcome/Welcome.tsx
    justifyContent: "center",
  },
  logo: {
    width: 80,
    height: 56,
    color: theme.palette.text.primary,
    fontSize: theme.spacing(8),
  },
  title: {
    fontSize: 24,
    letterSpacing: -0.3,
    marginBottom: theme.spacing(3),
    marginTop: theme.spacing(6),
    textAlign: "center",
    fontSize: theme.spacing(4),
    fontWeight: 400,
    margin: 0,
    marginBottom: theme.spacing(2),
    marginTop: theme.spacing(2),
    lineHeight: 1,

    "& strong": {
      fontWeight: 600,
    },
  },
 }))
diff --git a/site/src/pages/CliAuthPage/CliAuthPage.tsx b/site/src/pages/CliAuthPage/CliAuthPage.tsx
 import { useActor } from "@xstate/react"
 import { useContext, useEffect, useState, FC, PropsWithChildren } from "react"
 import { useEffect, useState, FC, PropsWithChildren } from "react"
 import { Helmet } from "react-helmet-async"
 import { getApiKey } from "../../api/api"
 import { pageTitle } from "../../util/page"
 import { XServiceContext } from "../../xServices/StateContext"
 import { CliAuthPageView } from "./CliAuthPageView"

 export const CliAuthenticationPage: FC<PropsWithChildren<unknown>> = () => {
  const xServices = useContext(XServiceContext)
  const [authState] = useActor(xServices.authXService)
  const { me } = authState.context
  const [apiKey, setApiKey] = useState<string | null>(null)

  useEffect(() => {
 if (me?.id) {
 void getApiKey().then(({ key }) => {
 getApiKey()
      .then(({ key }) => {
        setApiKey(key)
      })
    }
  }, [me?.id])
      .catch((error) => {
        console.error(error)
      })
  }, [])

  return (
    <>
diff --git a/site/src/pages/CliAuthPage/CliAuthPageView.tsx b/site/src/pages/CliAuthPage/CliAuthPageView.tsx
  return (
    <SignInLayout>
      <Welcome message="Session token" />

      <p className={styles.text}>
        Copy the session token below and{" "}
        <strong className={styles.lineBreak}>paste it in your terminal</strong>.
Original file line number	Diff line number	Diff line change
Expand Up		@@ -142,7 +142,6 @@ export const AppRouter: FC = () => {
		<Route element={<DashboardLayout />}>
		<Route index element={<IndexPage />} />

		<Route path="cli-auth" element={<CliAuthenticationPage />} />
		<Route path="gitauth" element={<GitAuthPage />} />

		<Route path="workspaces" element={<WorkspacesPage />} />
Expand DownExpand Up		@@ -241,11 +240,12 @@ export const AppRouter: FC = () => {
		</Route>
		</Route>

		{/* Terminalpage don't have the dashboard layout */}
		{/* Terminaland CLI auth pages don't have the dashboard layout */}
		<Route
		path="/@:username/:workspace/terminal"
		element={<TerminalPage />}
		/>
		<Route path="cli-auth" element={<CliAuthenticationPage />} />
		</Route>

		{/* Using path="*"" means "match anything", so this route
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -15,11 +15,12 @@ export const useStyles = makeStyles((theme) => ({
		},
		container: {
		marginTop: theme.spacing(-8),
		minWidth: "320px",
		maxWidth: "320px",
		maxWidth: 385,
		},
		copyright: {
		marginTop: theme.spacing(2),
		footer: {
		fontSize: 12,
		color: theme.palette.text.secondary,
		marginTop: theme.spacing(3),
		},
		}))

Expand All		@@ -30,7 +31,7 @@ export const SignInLayout: FC<{ children: ReactNode }> = ({ children }) => {
		<div className={styles.root}>
		<div className={styles.layout}>
		<div className={styles.container}>{children}</div>
		<div className={styles.copyright}>
		<div className={styles.footer}>
		{`\u00a9 ${new Date().getFullYear()} Coder Technologies, Inc.`}
		</div>
		</div>
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -34,15 +34,20 @@ const useStyles = makeStyles((theme) => ({
		justifyContent: "center",
		},
		logo: {
		width: 80,
		height: 56,
		color: theme.palette.text.primary,
		fontSize: theme.spacing(8),
		},
		title: {
		fontSize: 24,
		letterSpacing: -0.3,
		marginBottom: theme.spacing(3),
		marginTop: theme.spacing(6),
		textAlign: "center",
		fontSize: theme.spacing(4),
		fontWeight: 400,
		margin: 0,
		marginBottom: theme.spacing(2),
		marginTop: theme.spacing(2),
		lineHeight: 1,

		"& strong": {
		fontWeight: 600,
		},
		},
		}))
Original file line number	Diff line number	Diff line change
		@@ -1,24 +1,21 @@
		import { useActor } from "@xstate/react"
		import { useContext, useEffect, useState, FC, PropsWithChildren } from "react"
		import { useEffect, useState, FC, PropsWithChildren } from "react"
		import { Helmet } from "react-helmet-async"
		import { getApiKey } from "../../api/api"
		import { pageTitle } from "../../util/page"
		import { XServiceContext } from "../../xServices/StateContext"
		import { CliAuthPageView } from "./CliAuthPageView"

		export const CliAuthenticationPage: FC<PropsWithChildren<unknown>> = () => {
		const xServices = useContext(XServiceContext)
		const [authState] = useActor(xServices.authXService)
		const { me } = authState.context
		const [apiKey, setApiKey] = useState<string \| null>(null)

		useEffect(() => {
		if (me?.id) {
		void getApiKey().then(({ key }) => {
		getApiKey()
		.then(({ key }) => {
		setApiKey(key)
		})
		}
		}, [me?.id])
		.catch((error) => {
		console.error(error)
		})
		}, [])

		return (
		<>
Expand Down
Original file line number	Diff line number	Diff line change
Expand Up		@@ -21,6 +21,7 @@ export const CliAuthPageView: FC<CliAuthPageViewProps> = ({ sessionToken }) => {
		return (
		<SignInLayout>
		<Welcome message="Session token" />

		<p className={styles.text}>
		Copy the session token below and{" "}
		<strong className={styles.lineBreak}>paste it in your terminal</strong>.
Expand Down