feat(claim-node): implement node claiming functionality for publishers #90

snomiao · 2025-05-28T23:38:04Z

Add a new route for GitHub OAuth device flow to facilitate node claiming.
Create ClaimNodePage for users to select a publisher and claim a node.
Implement ClaimMyNodePage for verifying GitHub repository ownership.
Introduce custom hooks for claiming nodes via API.
Enhance NodeDetails component to allow users to claim unclaimed nodes.
Ensure proper loading states and error handling during the claiming process.

this pr solves:
comfyanonymous/ComfyUI#821
Comfy-Org/ComfyUI-Manager#1820

providing a stage view

- Add a new route for GitHub OAuth device flow to facilitate node claiming. - Create ClaimNodePage for users to select a publisher and claim a node. - Implement ClaimMyNodePage for verifying GitHub repository ownership. - Introduce custom hooks for claiming nodes via API. - Enhance NodeDetails component to allow users to claim unclaimed nodes. - Ensure proper loading states and error handling during the claiming process.

vercel · 2025-05-28T23:38:08Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
registry-web	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jun 28, 2025 2:49am

github-actions · 2025-05-28T23:39:43Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…le for better configurability

…bility by breaking it into multiple lines

… by adjusting spacing and line breaks feat(claim.tsx): wrap ClaimNodePage component with withAuth for authentication protection

…im-my-node

github-actions · 2025-06-16T11:01:37Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…ties to Customer and Node interfaces to enhance API functionality feat(generated.ts): add claimMyNode endpoint to allow publishers to claim unclaimed nodes they own, improving node management capabilities

…t support with Next.js chore(tsconfig.json): update tsconfig structure and include next-env.d.ts for better type definitions in Next.js projects

…o clean up code and improve readability

…ith new endpoints and callback handling refactor(claim): replace custom hook for claiming nodes with generated API hook for improved functionality delete(api): remove outdated GitHub device flow endpoint and related custom hooks to streamline codebase

github-actions · 2025-06-18T07:36:31Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…GitHub OAuth integration feat(github callback): update redirect logic to handle query parameters correctly for error and token feat(github route): allow custom scope for GitHub OAuth and improve redirect URL construction feat(CreatePublisherForm): add onSuccess and onCancel props for better handling of publisher creation feat(CreatePublisherModal): create a modal component for publisher creation feat(ClaimMyNodePage): implement GitHub verification process for claiming nodes refactor(ClaimMyNodePage): streamline state management and error handling during the claiming process chore(package): add octokit dependency for GitHub API interactions delete(publishers claim-my-node page): remove old claim my node page in favor of the new implementation

github-actions · 2025-06-23T08:49:46Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…ts for displaying user, node, and publisher information with tooltips and click navigation feat(claim-my-node): integrate new span components into ClaimMyNodePage for improved user experience and navigation to GitHub profiles and node/publisher details

socket-security · 2025-06-23T16:38:03Z

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	@tsconfig/next@2.0.3

View full report

github-actions · 2025-06-23T16:39:15Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…n can edit nodes owned by them (#124) fix(NodeDetails): update warningForAdminEdit logic to show warning if admin edits a node not owned by them

* refactor(app.tsx): remove dehydrateOptions for query persistence to simplify code and improve maintainability * feat(_app.tsx): add build versioning using NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA to manage cache invalidation effectively * feat(_app.tsx): add maxAge option to cache configuration to set cache duration to 1 day for improved performance and cache management * chore(axios-instance.ts): remove Firebase authentication interceptor to simplify Axios instance configuration and reduce dependencies * feat(NodeDetails): add useListPublishersForUser hook to check if admin can edit nodes owned by them fix(NodeDetails): update warningForAdminEdit logic to show warning if admin edits a node not owned by them * feat(AuthUI): integrate useAuthState to manage user authentication state and redirect users upon login refactor(Logout): simplify logout process by clearing query cache and storage before signing out refactor(Header): update login and signup button handlers to use router.push for better navigation refactor(ProfileDropdown): enhance sign-out functionality to clear user data from cache and storage fix(authAdmin): improve user redirection logic to handle authentication state more effectively feat(getFromUrlSearchParam): add utility function to retrieve the current URL for redirection purposes refactor(withAuth): streamline authentication check and loading state handling in HOC * feat(_app.tsx): add Firebase JWT token interceptor to Axios instance for authenticated requests refactor(_app.tsx): improve persistEffect function structure for better readability and maintainability * docs(_app.tsx): add comments explaining the usage of NEXT_PUBLIC_VERCEL_GIT_COMMIT_SHA for cache busting and fallback behavior * feat(AuthUI): replace div with Link component for logo navigation to improve accessibility and semantics * feat(Logout.tsx): refactor logout functionality into a custom hook for better reusability and separation of concerns fix(Logout.tsx): handle logout errors with toast notifications to improve user experience refactor(ProfileDropdown.tsx): utilize the new useLogout hook for sign-out functionality to streamline code and enhance maintainability * style(Header.tsx): change button color from light to dark for better visibility and consistency * format: Apply prettier --fix changes * fix(NodeDetails.tsx): refactor repository button to use onClick instead of anchor tag for better event handling feat(NodeDetails.tsx): prevent default action and open repository link in a new tab for improved user experience * style(NodeDetails.tsx): replace span with div for better semantic structure and accessibility in version changelog display * Squashed commit of the following: commit d75737c Author: snomiao <[email protected]> Date: Tue Jun 3 13:12:21 2025 +0900 Update OpenAPI (#102) * chore(api-gen): update cron schedule to run daily at midnight UTC for API type definitions chore(api-gen): refactor workflow steps to use bun for dependency management and API definition update chore(package): update orval dependency to version 7.9.0 for improved features and fixes refactor(orval.config.ts): adjust dotenv loading logic to be compatible with bun environment * chore: update lockfile * chore(package.json): update orval command to use bunx for better compatibility with package management * chore: generate backend API static type * Update orval.config.ts Co-authored-by: Copilot <[email protected]> --------- Co-authored-by: Copilot <[email protected]> commit 6afd1f0 Author: snomiao <[email protected]> Date: Tue Jun 3 13:05:42 2025 +0900 chore(ci): update CI workflow to use bunx for prettier and add sort-package-json step for better package.json formatting (#103) * chore(ci): update CI workflow to use bunx for prettier and add sort-package-json step for better package.json formatting * Update .github/workflows/react-ci.yml Co-authored-by: Copilot <[email protected]> --------- Co-authored-by: Copilot <[email protected]> * chore(api-gen.yml): remove unnecessary blank line to improve workflow file readability * chore(_app.tsx): remove commented-out code for user data persistence to clean up the codebase and improve readability * docs(_app.tsx): update comment to clarify the purpose of query persistence in localStorage for better understanding * format: Apply prettier --fix changes * docs(_app.tsx): add comments to clarify the purpose of persistQueryClient and buster configuration for better understanding of the code * format: Apply prettier --fix changes

…nd colors to streamline configuration and avoid unnecessary imports (#126)

* Fix: Remove legacyBehavior from Link components * refactor(SearchHit.tsx): simplify JSX structure by removing unnecessary anchor tag and using React fragments for cleaner code * format: Apply prettier --fix changes

* Add breadcrumb navigation to all admin pages * Update components/common/Breadcrumb.tsx Co-authored-by: Copilot <[email protected]> * format: Apply prettier --fix changes * Add breadcrumbs to all pages using Flowbite Breadcrumb component * Fix import order and formatting in breadcrumb components * Replace Button components with Link components in admin dashboard for better accessibility * Fix build errors: update component naming convention and string template usage * Update breadcrumbs: rename to 'Your Nodes', make 'Nodes' non-clickable in node detail page, simplify publisher breadcrumbs * style(admin): add "dark" class to Breadcrumb.Item components for consistent styling across admin pages style(pages): apply "dark" class to Breadcrumb.Item components for improved visual consistency in navigation elements * format: Apply prettier --fix changes --------- Co-authored-by: Copilot <[email protected]>

github-actions · 2025-06-24T07:50:29Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

… clarity

github-actions · 2025-06-24T08:24:42Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…_ID and GITHUB_CLIENT_SECRET usage

…users in creating and configuring the OAuth app

github-actions · 2025-06-24T08:52:42Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

github-actions · 2025-06-24T08:52:46Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…on environment variable configuration

github-actions · 2025-06-24T08:58:18Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…quiring authentication

github-actions · 2025-06-24T09:35:16Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…im-my-node

github-actions · 2025-06-25T08:13:41Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

…eme prop to suppress type checking error

github-actions · 2025-06-25T08:23:30Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

- Add useNextTranslation to all user-facing components - Translate hardcoded strings in CreatePublisherModal - Translate NodeClaimModal error messages and UI text - Complete translation of claim-my-node page with step indicators - Translate node claim selection page with publisher options - Ensure all toast messages, form labels, and status text use t() - Maintain translation key consistency with existing patterns

github-actions · 2025-06-28T02:46:29Z

🎨 Chromatic Visual Testing Results

Resource	URL
🔍 Build Results	Chromatic Build
📚 Storybook	View Storybook

Check the visual changes and approve or request changes as needed.

Copilot

Pull Request Overview

This PR implements the node-claiming feature via GitHub OAuth, allowing publishers to verify repo ownership and claim unclaimed nodes. Key changes include:

New API types, hooks, and mutation (claimMyNode, useClaimMyNode) for claiming nodes.
Two new pages (ClaimNodePage, ClaimMyNodePage) guiding users through publisher selection and OAuth verification.
UI updates across NodeDetails, modals, and translation files to support claim flow.

Reviewed Changes

Copilot reviewed 22 out of 24 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
src/api/generated.ts	Generated API types & hooks for node-claiming endpoints
public/locales/zh/common.json	Added Chinese translations for claim flow
public/locales/ja/common.json	Added Japanese translations for claim flow
public/locales/en/common.json	Added English translations for claim flow
pages/publishers/[publisherId]/claim-my-node.tsx	Multi-stage page for GitHub OAuth verification & node claiming
pages/nodes/[nodeId]/claim.tsx	Publisher selection page before OAuth flow
pages/admin/search-ranking.tsx	Swapped `next/router` default import to `useRouter`
pages/admin/preempted-comfy-node-names.tsx	Swapped `next/router` default import to `useRouter`
package.json	Added `@tsconfig/next` and `octokit` dependencies
docs/github-app.md	Documentation for setting up GitHub OAuth App
README.md	Linked to GitHub OAuth docs in README
.env	Added GITHUB_CLIENT_ID / GITHUB_CLIENT_SECRET placeholders
components/publisher/CreatePublisherModal.tsx	New modal wrapper for creating publishers
components/publisher/CreatePublisherForm.tsx	Form updates: `onCancel`/`onSuccess` props, layout adjustments
components/nodes/NodeDetails.tsx	Added "Claim this node" button and handler in node details view
components/nodes/NodeClaimModal.tsx	Updated modal to use translation keys and improved error msgs
components/common/Spans/index.tsx	Central export of span components
components/common/Spans/GithubUserSpan.tsx	Added span for linking GitHub usernames
components/common/Spans/NodeSpan.tsx	Added span for linking node details
components/common/Spans/PublisherSpan.tsx	Added span for linking publisher details
app/api/auth/github/route.ts	Endpoint to initiate GitHub OAuth flow
app/api/auth/github/callback/route.ts	Callback handler to exchange code for token and redirect

Comments suppressed due to low confidence (7)

src/api/generated.ts:543

[nitpick] Property has_fund uses snake_case, while other fields follow camelCase (e.g., createdAt). Consider renaming to hasFund for consistency in TypeScript models.

  has_fund?: boolean;

components/common/Spans/GithubUserSpan.tsx:3

A code snippet mistakenly appears inside the JSDoc comment; remove the stray <span line to clean up the component documentation.

            <span

components/publisher/CreatePublisherForm.tsx:20

Missing import for useRouter from 'next/router'; without it, router will be undefined and calls like router.back() will fail.

    const router = useRouter()

app/api/auth/github/route.ts:56

Avoid hardcoding the host in OAuth redirects; derive the origin dynamically from request headers or an environment variable to support multiple deployments.

        const host = '3000.stukivx.snomiao.dev'

pages/publishers/[publisherId]/claim-my-node.tsx:65

The UseMutationResult from React Query does not include an isPending property; use isLoading to reflect the mutation in progress.

    const { mutate: claimNode, isPending: isClaimingNode } = useClaimMyNode({

public/locales/en/common.json:124

Inconsistent casing: use GitHub (capital H) instead of Github to match official branding.

  "Github": "Github",

components/publisher/CreatePublisherForm.tsx:50

Use the translation function t(...) for user-facing messages instead of a hardcoded English string to support localization.

                    toast.success('Publisher created successfully!')

snomiao added 2 commits June 16, 2025 10:53

fix(orval.config.js): update API target URL to use environment variab…

84b130e

…le for better configurability

style(orval.config.js): format target URL assignment for better reada…

9cf91a8

…bility by breaking it into multiple lines

vercel bot had a problem deploying to Preview June 16, 2025 10:54 Failure

refactor(claim.tsx): clean up code formatting and improve readability…

efaf8d4

… by adjusting spacing and line breaks feat(claim.tsx): wrap ClaimNodePage component with withAuth for authentication protection

vercel bot had a problem deploying to Preview June 16, 2025 10:59 Failure

Merge branch 'main' of github.com:Comfy-Org/registry-web into sno-cla…

6b5b12d

…im-my-node

vercel bot had a problem deploying to Preview June 16, 2025 11:00 Failure

snomiao added 4 commits June 16, 2025 15:12

feat(generated.ts): update orval version to 7.10.0 and add new proper…

2552bfa

…ties to Customer and Node interfaces to enhance API functionality feat(generated.ts): add claimMyNode endpoint to allow publishers to claim unclaimed nodes they own, improving node management capabilities

feat(package.json): add @tsconfig/next package for improved TypeScrip…

b07fb8c

…t support with Next.js chore(tsconfig.json): update tsconfig structure and include next-env.d.ts for better type definitions in Next.js projects

refactor(NodeDetails.tsx): remove unused router and query variables t…

09534b4

…o clean up code and improve readability

vercel bot had a problem deploying to Preview June 18, 2025 07:35 Failure

snomiao self-assigned this Jun 20, 2025

vercel bot had a problem deploying to Preview June 23, 2025 08:49 Failure

vercel bot had a problem deploying to Preview June 23, 2025 16:38 Failure

snomiao and others added 5 commits June 23, 2025 16:45

feat(NodeDetails): add useListPublishersForUser hook to check if admi…

1b71417

…n can edit nodes owned by them (#124) fix(NodeDetails): update warningForAdminEdit logic to show warning if admin edits a node not owned by them

chore(tailwind.config.cjs): remove deprecated color names from Tailwi…

7888fef

…nd colors to streamline configuration and avoid unnecessary imports (#126)

Fix: Remove legacyBehavior from Link components (#127)

ea5fc29

* Fix: Remove legacyBehavior from Link components * refactor(SearchHit.tsx): simplify JSX structure by removing unnecessary anchor tag and using React fragments for cleaner code * format: Apply prettier --fix changes

style(route.ts): correct typo in comment from "OAuthj" to "OAuth" for…

6254245

… clarity

vercel bot had a problem deploying to Preview June 24, 2025 08:23 Failure

snomiao added 2 commits June 24, 2025 08:51

chore(env): update comments in .env file for clarity on GITHUB_CLIENT…

7ad31be

…_ID and GITHUB_CLIENT_SECRET usage

docs: add GitHub App setup documentation for Comfy Registry to guide …

219800c

…users in creating and configuring the OAuth app

vercel bot had a problem deploying to Preview June 24, 2025 08:52 Failure

docs(github-app): update link to Vercel project settings for clarity …

47bee4e

…on environment variable configuration

vercel bot had a problem deploying to Preview June 24, 2025 08:57 Failure

docs(README): add GitHub OAuth App setup instructions for features re…

fdd87f5

…quiring authentication

vercel bot had a problem deploying to Preview June 24, 2025 09:33 Failure

Merge branch 'main' of github.com:Comfy-Org/registry-web into sno-cla…

9b6dd39

…im-my-node

vercel bot had a problem deploying to Preview June 25, 2025 08:13 Failure

snomiao and others added 2 commits June 25, 2025 08:21

chore(CreatePublisherModal.tsx): add TypeScript ignore comment for th…

703f0a2

…eme prop to suppress type checking error

format: Apply prettier --fix changes

1da368e

vercel bot deployed to Preview June 25, 2025 08:24 View deployment

vercel bot deployed to Preview June 28, 2025 02:46 View deployment

format: Apply prettier --fix changes

df90db4

vercel bot deployed to Preview June 28, 2025 02:49 View deployment

snomiao marked this pull request as ready for review June 30, 2025 05:18

Copilot AI review requested due to automatic review settings June 30, 2025 05:18

Copilot AI reviewed Jun 30, 2025

View reviewed changes

feat(claim-node): implement node claiming functionality for publishers #90

Are you sure you want to change the base?

feat(claim-node): implement node claiming functionality for publishers #90

Uh oh!

Conversation

snomiao commented May 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

vercel bot commented May 28, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented May 28, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 16, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 18, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 23, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

socket-security bot commented Jun 23, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions bot commented Jun 23, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 24, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 24, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 24, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 24, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 24, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 24, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 25, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 25, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

github-actions bot commented Jun 28, 2025

🎨 Chromatic Visual Testing Results

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Reviewed Changes

Uh oh!

Uh oh!

snomiao commented May 28, 2025 •

edited

Loading

vercel bot commented May 28, 2025 •

edited

Loading

socket-security bot commented Jun 23, 2025 •

edited

Loading