From 905d911c1a52e646d1f840443a10f3014af58ebb Mon Sep 17 00:00:00 2001 From: McKayla Washburn Date: Tue, 9 Jan 2024 18:22:06 +0000 Subject: [PATCH 1/3] chore: refactor `Welcome` component --- site/src/components/Welcome/Welcome.tsx | 66 +++++++++---------- .../src/pages/CliAuthPage/CliAuthPageView.tsx | 2 +- .../ExternalAuthPage/ExternalAuthPage.tsx | 3 +- .../ExternalAuthPage/ExternalAuthPageView.tsx | 7 +- 4 files changed, 37 insertions(+), 41 deletions(-) diff --git a/site/src/components/Welcome/Welcome.tsx b/site/src/components/Welcome/Welcome.tsx index 9036717866efd..4863fa15c2c3c 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 { useTheme } from "@emotion/react"; import { CoderIcon } from "../Icons/CoderIcon"; const Language = { @@ -10,43 +10,39 @@ const Language = { ), }; -export const Welcome: FC< - PropsWithChildren<{ message?: JSX.Element | string }> -> = ({ message = Language.defaultMessage }) => { - const theme = useTheme(); - +export const Welcome: FC = ({ children }) => { return (
-
- +
+
-

- {message} -

+

{children || Language.defaultMessage}

); }; + +const styles = { + container: { + display: "flex", + justifyContent: "center", + }, + + icon: (theme) => ({ + color: theme.palette.text.primary, + fontSize: 64, + }), + + header: { + textAlign: "center", + fontSize: 32, + fontWeight: 400, + margin: 0, + marginTop: 16, + marginBottom: 32, + lineHeight: 1.25, + + "& strong": { + fontWeight: 600, + }, + }, +} satisfies Record>; diff --git a/site/src/pages/CliAuthPage/CliAuthPageView.tsx b/site/src/pages/CliAuthPage/CliAuthPageView.tsx index 0c88a394b77ea..5fe488103737a 100644 --- a/site/src/pages/CliAuthPage/CliAuthPageView.tsx +++ b/site/src/pages/CliAuthPage/CliAuthPageView.tsx @@ -20,7 +20,7 @@ export const CliAuthPageView: FC = ({ sessionToken }) => { return ( - + Session token

{ // show an error there? return ( - + Failed to validate oauth access token +

Attempted to validate the user's oauth access token from the authentication flow. This situation may occur as a result of an diff --git a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx index 85195d6659de4..db5146cc9b952 100644 --- a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx +++ b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx @@ -33,7 +33,7 @@ const ExternalAuthPageView: FC = ({ if (!externalAuth.authenticated) { return ( - + Authenticate with {externalAuth.display_name} {externalAuth.device && ( = ({ return ( - + You've authenticated with {externalAuth.display_name}! +

{externalAuth.user?.login && `Hey @${externalAuth.user?.login}! 👋 `} {(!externalAuth.app_installable || From 16448bf7da2176e964f554f3f4343d75391d311a Mon Sep 17 00:00:00 2001 From: McKayla Washburn Date: Tue, 9 Jan 2024 18:26:12 +0000 Subject: [PATCH 2/3] add a story --- site/src/components/Welcome/Welcome.stories.tsx | 14 ++++++++++++++ 1 file changed, 14 insertions(+) create mode 100644 site/src/components/Welcome/Welcome.stories.tsx diff --git a/site/src/components/Welcome/Welcome.stories.tsx b/site/src/components/Welcome/Welcome.stories.tsx new file mode 100644 index 0000000000000..f7f4e2d2bcd09 --- /dev/null +++ b/site/src/components/Welcome/Welcome.stories.tsx @@ -0,0 +1,14 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { Welcome } from "./Welcome"; + +const meta: Meta = { + title: "components/Welcome", + component: Welcome, +}; + +export default meta; +type Story = StoryObj; + +const Example: Story = {}; + +export { Example as Welcome }; From 0b691a3c03e9b7005ebd11d242e1a222fd84ab3e Mon Sep 17 00:00:00 2001 From: McKayla Washburn Date: Tue, 9 Jan 2024 18:58:20 +0000 Subject: [PATCH 3/3] =?UTF-8?q?=F0=9F=A7=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx index db5146cc9b952..893cf8fb69321 100644 --- a/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx +++ b/site/src/pages/ExternalAuthPage/ExternalAuthPageView.tsx @@ -63,7 +63,9 @@ const ExternalAuthPageView: FC = ({ return ( - You've authenticated with {externalAuth.display_name}! + + You've authenticated with {externalAuth.display_name}! +

{externalAuth.user?.login && `Hey @${externalAuth.user?.login}! 👋 `} pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy