Skip to content

Commit 2ed4a55

Browse files
samejrsamejr
committed
fix(webapp): make the per-page debug panel ID rows copyable too
The custom rows some pages add to the admin debug panel (Run/Deployment IDs, trace id, env/org ids, image reference, region/branch ids, etc.) were still plain text. Wrap the opaque identifiers in CopyableText across those pages so they match the shared rows and can be copied on hover. Enum/boolean/human-readable rows stay plain (Environment type/paused, deployment Platform, plan name) and the Build Server link is left as-is. Also drop a duplicated project ID that rendered twice in the env settings panel.
1 parent 4993929 commit 2ed4a55

10 files changed

Lines changed: 57 additions & 21 deletions

File tree

  • apps/webapp/app/routes
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.apikeys
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.branches
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.concurrency
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.dev-branches
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.limits
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.regions
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs.$runParam
    • _app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.settings
    • _app.orgs.$organizationSlug.settings.team

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.apikeys/route.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import { BookOpenIcon } from "@heroicons/react/20/solid";
22
import { type MetaFunction } from "@remix-run/react";
33
import { typedjson, useTypedLoaderData } from "remix-typedjson";
44
import { AdminDebugTooltip } from "~/components/admin/debugTooltip";
5+
import { CopyableText } from "~/components/primitives/CopyableText";
56
import { CodeBlock } from "~/components/code/CodeBlock";
67
import { InlineCode } from "~/components/code/InlineCode";
78
import {
@@ -113,7 +114,9 @@ export default function Page() {
113114
<Property.Table>
114115
<Property.Item key={environment.id}>
115116
<Property.Label>{environment.slug}</Property.Label>
116-
<Property.Value>{environment.id}</Property.Value>
117+
<Property.Value>
118+
<CopyableText value={environment.id} asChild />
119+
</Property.Value>
117120
</Property.Item>
118121
</Property.Table>
119122
</AdminDebugTooltip>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.branches/route.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -242,7 +242,9 @@ export default function Page() {
242242
{branches.map((branch) => (
243243
<Property.Item key={branch.id}>
244244
<Property.Label>{branch.branchName}</Property.Label>
245-
<Property.Value>{branch.id}</Property.Value>
245+
<Property.Value>
246+
<CopyableText value={branch.id} asChild />
247+
</Property.Value>
246248
</Property.Item>
247249
))}
248250
</Property.Table>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.concurrency/route.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import { typedjson, useTypedLoaderData } from "remix-typedjson";
2121
import simplur from "simplur";
2222
import { z } from "zod";
2323
import { AdminDebugTooltip } from "~/components/admin/debugTooltip";
24+
import { CopyableText } from "~/components/primitives/CopyableText";
2425
import { EnvironmentCombo } from "~/components/environments/EnvironmentLabel";
2526
import { Feedback } from "~/components/Feedback";
2627
import {
@@ -270,7 +271,9 @@ export default function Page() {
270271
{environment.type}{" "}
271272
{environment.branchName ? ` (${environment.branchName})` : ""}
272273
</Property.Label>
273-
<Property.Value>{environment.id}</Property.Value>
274+
<Property.Value>
275+
<CopyableText value={environment.id} asChild />
276+
</Property.Value>
274277
</Property.Item>
275278
))}
276279
</Property.Table>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx‎

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import { GitMetadata } from "~/components/GitMetadata";
1818
import { VercelLink } from "~/components/integrations/VercelLink";
1919
import { RuntimeIcon } from "~/components/RuntimeIcon";
2020
import { AdminDebugTooltip } from "~/components/admin/debugTooltip";
21+
import { CopyableText } from "~/components/primitives/CopyableText";
2122
import { EnvironmentCombo } from "~/components/environments/EnvironmentLabel";
2223
import { Badge } from "~/components/primitives/Badge";
2324
import { LinkButton } from "~/components/primitives/Buttons";
@@ -283,20 +284,28 @@ export default function Page() {
283284
<Property.Table>
284285
<Property.Item>
285286
<Property.Label>ID</Property.Label>
286-
<Property.Value>{deployment.id}</Property.Value>
287+
<Property.Value>
288+
<CopyableText value={deployment.id} asChild />
289+
</Property.Value>
287290
</Property.Item>
288291
<Property.Item>
289292
<Property.Label>Project ID</Property.Label>
290-
<Property.Value>{deployment.projectId}</Property.Value>
293+
<Property.Value>
294+
<CopyableText value={deployment.projectId} asChild />
295+
</Property.Value>
291296
</Property.Item>
292297
<Property.Item>
293298
<Property.Label>Org ID</Property.Label>
294-
<Property.Value>{deployment.organizationId}</Property.Value>
299+
<Property.Value>
300+
<CopyableText value={deployment.organizationId} asChild />
301+
</Property.Value>
295302
</Property.Item>
296303
{deployment.imageReference && (
297304
<Property.Item>
298305
<Property.Label>Image</Property.Label>
299-
<Property.Value>{deployment.imageReference}</Property.Value>
306+
<Property.Value>
307+
<CopyableText value={deployment.imageReference} asChild />
308+
</Property.Value>
300309
</Property.Item>
301310
)}
302311
<Property.Item>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.dev-branches/route.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,9 @@ export default function Page() {
9595
{branches.map((branch) => (
9696
<Property.Item key={branch.id}>
9797
<Property.Label>{branch.branchName}</Property.Label>
98-
<Property.Value>{branch.id}</Property.Value>
98+
<Property.Value>
99+
<CopyableText value={branch.id} asChild />
100+
</Property.Value>
99101
</Property.Item>
100102
))}
101103
</Property.Table>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.limits/route.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import { Gauge } from "lucide-react";
77
import { typedjson, useTypedLoaderData } from "remix-typedjson";
88
import { ConcurrencyIcon } from "~/assets/icons/ConcurrencyIcon";
99
import { AdminDebugTooltip } from "~/components/admin/debugTooltip";
10+
import { CopyableText } from "~/components/primitives/CopyableText";
1011
import { Feedback } from "~/components/Feedback";
1112
import { PageBody, PageContainer } from "~/components/layout/AppLayout";
1213
import { EnvironmentSelector } from "~/components/navigation/EnvironmentSelector";
@@ -125,7 +126,9 @@ export default function Page() {
125126
</Property.Item>
126127
<Property.Item>
127128
<Property.Label>Organization ID</Property.Label>
128-
<Property.Value>{data.organizationId}</Property.Value>
129+
<Property.Value>
130+
<CopyableText value={data.organizationId} asChild />
131+
</Property.Value>
129132
</Property.Item>
130133
</Property.Table>
131134
</AdminDebugTooltip>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.regions/route.tsx‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -163,7 +163,9 @@ export default function Page() {
163163
{regions.map((region) => (
164164
<Property.Item key={region.id}>
165165
<Property.Label>{region.name}</Property.Label>
166-
<Property.Value>{region.id}</Property.Value>
166+
<Property.Value>
167+
<CopyableText value={region.id} asChild />
168+
</Property.Value>
167169
</Property.Item>
168170
))}
169171
</Property.Table>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.runs.$runParam/route.tsx‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -489,19 +489,27 @@ export default function Page() {
489489
<Property.Table>
490490
<Property.Item>
491491
<Property.Label>ID</Property.Label>
492-
<Property.Value>{run.id}</Property.Value>
492+
<Property.Value>
493+
<CopyableText value={run.id} asChild />
494+
</Property.Value>
493495
</Property.Item>
494496
<Property.Item>
495497
<Property.Label>Trace ID</Property.Label>
496-
<Property.Value>{run.traceId}</Property.Value>
498+
<Property.Value>
499+
<CopyableText value={run.traceId} asChild />
500+
</Property.Value>
497501
</Property.Item>
498502
<Property.Item>
499503
<Property.Label>Env ID</Property.Label>
500-
<Property.Value>{run.environment.id}</Property.Value>
504+
<Property.Value>
505+
<CopyableText value={run.environment.id} asChild />
506+
</Property.Value>
501507
</Property.Item>
502508
<Property.Item>
503509
<Property.Label>Org ID</Property.Label>
504-
<Property.Value>{run.environment.organizationId}</Property.Value>
510+
<Property.Value>
511+
<CopyableText value={run.environment.organizationId} asChild />
512+
</Property.Value>
505513
</Property.Item>
506514
</Property.Table>
507515
</AdminDebugTooltip>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.settings/route.tsx‎

Lines changed: 7 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,9 @@ import { Outlet, type MetaFunction } from "@remix-run/react";
22
import { type LoaderFunctionArgs, redirect } from "@remix-run/server-runtime";
33
import { PageBody, PageContainer } from "~/components/layout/AppLayout";
44
import { NavBar, PageAccessories, PageTitle } from "~/components/primitives/PageHeader";
5-
import { Paragraph } from "~/components/primitives/Paragraph";
65
import * as Property from "~/components/primitives/PropertyTable";
76
import { AdminDebugTooltip } from "~/components/admin/debugTooltip";
7+
import { CopyableText } from "~/components/primitives/CopyableText";
88
import { useProject } from "~/hooks/useProject";
99
import { requireUserId } from "~/services/session.server";
1010
import {
@@ -55,14 +55,15 @@ export default function SettingsLayout() {
5555
<Property.Table>
5656
<Property.Item>
5757
<Property.Label>ID</Property.Label>
58-
<Property.Value>{project.id}</Property.Value>
59-
<div className="flex items-center gap-2">
60-
<Paragraph variant="extra-small/bright/mono">{project.id}</Paragraph>
61-
</div>
58+
<Property.Value>
59+
<CopyableText value={project.id} asChild />
60+
</Property.Value>
6261
</Property.Item>
6362
<Property.Item>
6463
<Property.Label>Org ID</Property.Label>
65-
<Property.Value>{project.organizationId}</Property.Value>
64+
<Property.Value>
65+
<CopyableText value={project.organizationId} asChild />
66+
</Property.Value>
6667
</Property.Item>
6768
</Property.Table>
6869
</AdminDebugTooltip>

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.settings.team/route.tsx‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import { z } from "zod";
1818
import { Feedback } from "~/components/Feedback";
1919
import { UserAvatar } from "~/components/UserProfilePhoto";
2020
import { AdminDebugTooltip } from "~/components/admin/debugTooltip";
21+
import { CopyableText } from "~/components/primitives/CopyableText";
2122
import { PageBody, PageContainer } from "~/components/layout/AppLayout";
2223
import {
2324
Alert,
@@ -372,7 +373,9 @@ export default function Page() {
372373
<Property.Table>
373374
<Property.Item>
374375
<Property.Label>Org ID</Property.Label>
375-
<Property.Value>{organization.id}</Property.Value>
376+
<Property.Value>
377+
<CopyableText value={organization.id} asChild />
378+
</Property.Value>
376379
</Property.Item>
377380

378381
{members.map((member) => (

0 commit comments

Comments
 (0)