Skip to content

Commit 9a63cd4

Browse files
committed
[TOOL-4346] Dashboard: Show Project ID in project settings page (#6917)
<!-- ## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes" If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000): ## Notes for the reviewer Anything important to call out? Be sure to also clarify these in your comments. ## How to test Unit tests, playground, etc. --> <!-- start pr-codex --> --- ## PR-Codex overview This PR introduces a new component, `ProjectIdCard`, to display the project ID in the `ProjectGeneralSettingsPage`. This component allows users to copy the project ID easily. ### Detailed summary - Added `ProjectIdCard` component to display project ID. - Integrated `ProjectIdCard` into `ProjectGeneralSettingsPage`. - `ProjectIdCard` includes a `SettingsCard` with a title, description, and a `CopyTextButton` for copying the project ID. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` <!-- end pr-codex -->
1 parent 004f377 commit 9a63cd4

File tree

1 file changed

+27
-0
lines changed

1 file changed

+27
-0
lines changed

apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/settings/ProjectGeneralSettingsPage.tsx

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -358,6 +358,8 @@ export function ProjectGeneralSettingsPageUI(props: {
358358
rotateSecretKey={props.rotateSecretKey}
359359
/>
360360

361+
<ProjectIdCard project={project} />
362+
361363
<AllowedDomainsSetting
362364
form={form}
363365
isUpdatingProject={updateProject.isPending}
@@ -434,6 +436,31 @@ function ProjectNameSetting(props: {
434436
);
435437
}
436438

439+
function ProjectIdCard(props: {
440+
project: Project;
441+
}) {
442+
return (
443+
<SettingsCard
444+
header={{
445+
title: "Project ID",
446+
description: "This is your project's ID on thirdweb",
447+
}}
448+
bottomText="Used when interacting with the thirdweb API"
449+
noPermissionText={undefined}
450+
errorText={undefined}
451+
>
452+
<CopyTextButton
453+
textToCopy={props.project.id}
454+
textToShow={props.project.id}
455+
variant="outline"
456+
className="w-full justify-between truncate bg-background px-3 py-2 font-mono text-muted-foreground lg:w-[450px]"
457+
tooltip="Copy Project ID"
458+
copyIconPosition="right"
459+
/>
460+
</SettingsCard>
461+
);
462+
}
463+
437464
function ProjectImageSetting(props: {
438465
updateProjectImage: (file: File | undefined) => Promise<void>;
439466
avatar: string | null;

0 commit comments

Comments
 (0)