From 33dcee35bb067c8542ff56d5c72315d0ece60e63 Mon Sep 17 00:00:00 2001
From: filiptronicek <filip@gitpod.io>
Date: Thu, 15 Jun 2023 14:55:10 +0000
Subject: [PATCH 1/2] Show User ID on Account page
---
components/dashboard/src/user-settings/Account.tsx | 9 +++++++++
1 file changed, 9 insertions(+)
diff --git a/components/dashboard/src/user-settings/Account.tsx b/components/dashboard/src/user-settings/Account.tsx
index fb6262755f8a6c..e2ef1ab46affea 100644
--- a/components/dashboard/src/user-settings/Account.tsx
+++ b/components/dashboard/src/user-settings/Account.tsx
@@ -16,6 +16,7 @@ import Alert from "../components/Alert";
import { TextInputField } from "../components/forms/TextInputField";
import isEmail from "validator/lib/isEmail";
import { useToast } from "../components/toasts/Toasts";
+import { InputWithCopy } from "../components/InputWithCopy";
export default function Account() {
const { user, setUser } = useContext(UserContext);
@@ -103,6 +104,7 @@ export default function Account() {
}}
errorMessage={errorMessage}
emailIsReadonly={!canUpdateEmail}
+ user={user}
>
<div className="flex flex-row mt-8">
<Button htmlType="submit">Update Profile</Button>
@@ -126,6 +128,7 @@ function ProfileInformation(props: {
setProfileState: (newState: User.Profile) => void;
errorMessage: string;
emailIsReadonly?: boolean;
+ user?: User;
children?: React.ReactChild[] | React.ReactChild;
}) {
return (
@@ -164,6 +167,12 @@ function ProfileInformation(props: {
src={props.profileState.avatarURL}
alt={props.profileState.name}
/>
+ {props.user && (
+ <p className={"text-sm text-gray-500 dark:text-gray-500"}>
+ User ID:
+ <InputWithCopy className="max-w-md" value={props.user.id} tip="Copy Token" />
+ </p>
+ )}
</div>
</div>
</div>
From 83a552709e00a94f4d1d1abb43deb6c7690b0dac Mon Sep 17 00:00:00 2001
From: filiptronicek <filip@gitpod.io>
Date: Thu, 15 Jun 2023 15:52:45 +0000
Subject: [PATCH 2/2] Move under other inputs
---
.../dashboard/src/user-settings/Account.tsx | 18 ++++++++++--------
1 file changed, 10 insertions(+), 8 deletions(-)
diff --git a/components/dashboard/src/user-settings/Account.tsx b/components/dashboard/src/user-settings/Account.tsx
index e2ef1ab46affea..60813ff668add6 100644
--- a/components/dashboard/src/user-settings/Account.tsx
+++ b/components/dashboard/src/user-settings/Account.tsx
@@ -144,7 +144,7 @@ function ProfileInformation(props: {
</Alert>
)}
<div className="flex flex-col lg:flex-row">
- <div>
+ <fieldset>
<TextInputField
label="Name"
value={props.profileState.name}
@@ -158,7 +158,15 @@ function ProfileInformation(props: {
props.setProfileState({ ...props.profileState, email: val });
}}
/>
- </div>
+ {props.user && (
+ <div className="flex flex-col space-y-2 mt-4">
+ <label className={"text-md font-semibold dark:text-gray-400 text-gray-600"}>User ID</label>
+ <p className={"text-sm text-gray-500 dark:text-gray-500"}>
+ <InputWithCopy className="max-w-md w-32" value={props.user.id} tip="Copy Token" />
+ </p>
+ </div>
+ )}
+ </fieldset>
<div className="lg:pl-14">
<div className="mt-4">
<Subheading>Avatar</Subheading>
@@ -167,12 +175,6 @@ function ProfileInformation(props: {
src={props.profileState.avatarURL}
alt={props.profileState.name}
/>
- {props.user && (
- <p className={"text-sm text-gray-500 dark:text-gray-500"}>
- User ID:
- <InputWithCopy className="max-w-md" value={props.user.id} tip="Copy Token" />
- </p>
- )}
</div>
</div>
</div>