Skip to content

Add actor detail pages - #92

Open
sij411 wants to merge 6 commits into
mainfrom
feat/actor-detail-page
Open

sij411 wants to merge 6 commits into
mainfrom
feat/actor-detail-page

Conversation

@sij411

@sij411 sij411 commented Sep 23, 2026

Copy link
Copy Markdown
Member

Closes #78.

Adds links from actor cards to a read-only detail page showing identity information and federation endpoint URLs, with copy buttons and loading/error states. Uses the existing GraphQL API, including the collection fields introduced on main.

Validation: build and repository checks passed; all 226 tests passed outside the sandbox. Automated Chrome checks covered rendering, clipboard copying, desktop/mobile layout, and error states. I also tested the page manually in Chrome.

AI disclosure: I used OpenAI Codex to help plan and implement the page, update it after rebasing, run automated validation, and draft this PR description. Assisted commits include provenance notes and Assisted-by trailers.

P.S. Actors created before main's collection migration may have missing endpoint links because of an existing migration gap.

…or detail page.

I asked Codex to rename ActorDetail.tsx to ActorCard.tsx and update [slug].tsx as well.

Assisted-by: Codex:gpt-6-astra
Link actor cards to a Relay ID route with preloaded actor details, loading and error states, and reusable copy buttons. Add Relay scalar mappings and styles for the detail page and buttons.

AI provenance: I selected ID-based routing and asked Codex to implement the page, then requested the buttons stylesheet rename. Codex implemented the route, fragment component, copy controls, scalar mappings, and styles while preserving the card link I added. Codex ran the build and repository checks successfully before the final stylesheet rename, then checked the renamed import and diff whitespace. A subsequent AI review reported no actionable defects. Human browser verification was not recorded.

Assisted-by: Codex:gpt-6
Place copy buttons to the right of endpoint URLs while allowing long URLs to wrap, and remove the underline from the All instances link.

AI provenance: I requested right-aligned copy buttons and an un-underlined All instances link. Codex updated the endpoint markup and CSS and verified repository checks. Human browser verification was not recorded.

Assisted-by: Codex:gpt-6-astra
Read outbox, followers, following, and featured URLs from the nullable collection fields introduced on main after the rebase.

AI provenance: I asked Codex to update the actor detail page after rebasing and prepare the PR. Codex updated the Relay fragment and endpoint accessors, regenerated artifacts, and verified the build and repository checks. Automated Chrome checks covered actor rendering, endpoint links, clipboard copying, desktop/mobile layout, and error states against a temporary database. Human verification of this compatibility update has not been recorded.

Assisted-by: Codex:gpt-6-astra
@sij411

sij411 commented Sep 23, 2026

Copy link
Copy Markdown
Member Author
image

@sij411
sij411 marked this pull request as ready for review September 23, 2026 13:03
@sij411
sij411 requested a review from dodok8 September 23, 2026 13:03
Comment thread packages/web/src/components/ActorDetail.tsx Outdated
Comment thread packages/web/src/components/CopyButton.tsx Outdated
<section class={styles.panel} aria-labelledby="endpoints-title">
<h2 id="endpoints-title">Federation endpoints</h2>
<dl class={styles.fields}>
<For each={endpoints()}>

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How about using <index /> for here? <For/> is for frequently changed data.

Ref: https://docs.solidjs.com/concepts/control-flow/list-rendering#index-vs-for

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Addressesd in 07a8e0e

@sij411
sij411 requested review from 2chanhaeng and dodok8 September 28, 2026 07:23
Comment on lines +80 to +82
<output class={message() === "Copied." ? styles.srOnly : undefined}>
{message()}
</output>

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

styles.srOnly are applied to this <output> element when copying succeeds. As a result, the button briefly shifts and changes width when clicked to copy. If the <output> element isn’t strictly necessary, it might be better to remove it.

2026-09-28.17.36.53.mov

@sij411 sij411 Sep 28, 2026 •

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fixed in fe2d0c0, but <output> element was not the problem, the reason it got stretched out after the user clicked is that the it adds 0.5 rem when it's not clicked. So I kept the tag, but edited the condition to keep the button size same. Thanks for the attached video to explain the issue, I appreciate your kindness !

Replace endpoint links with keyboard-accessible text-selection controls. Use copy icons that show a checkmark for two seconds after success, preserve accessible status messages, and keep copy failures visible.

AI provenance: I asked Codex to address the PR review comments about selecting endpoint URLs and temporary copy feedback. Codex implemented the component and style changes and ran the build, repository checks, and diff whitespace checks. Automated Chrome inspection through the Tailscale HTTPS origin confirmed that copy icons render and clicking an endpoint selects its full URL.

Assisted-by: Codex:gpt-6-astra
@sij411
sij411 force-pushed the feat/actor-detail-page branch from e5a06f4 to fe2d0c0 Compare September 28, 2026 11:37
@sij411
sij411 requested a review from 2chanhaeng September 28, 2026 11:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Actors list per instance

3 participants