- Notifications
You must be signed in to change notification settings - Fork1k
feat: add Coder registry links to template creation and editing#18680
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to ourterms of service andprivacy statement. We’ll occasionally send you account related emails.
Already on GitHub?Sign in to your account
Merged
+35 −5
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.Learn more about bidirectional Unicode characters
Add links tohttps://registry.coder.com in two locations:- "Browse Templates" card on starter templates page- "Browse Modules" button in template editor topbarThis provides users with easy access to community templates and modulesas a short-term solution before full registry integration.🤖 Generated with [Claude Code](https://claude.ai/code)Co-Authored-By: Claude <noreply@anthropic.com>
Replace template card with "Browse the Coder Registry" link in page header.The link appears in the top right aligned with the page title and includesan external link icon to indicate it opens in a new tab.🤖 Generated with [Claude Code](https://claude.ai/code)Co-Authored-By: Claude <noreply@anthropic.com>
Replace "Browse Modules" button with "Browse the Coder Registry" linkin the template editor topbar. The link matches the styling of thestarter templates page with an external link icon.🤖 Generated with [Claude Code](https://claude.ai/code)Co-Authored-By: Claude <noreply@anthropic.com>
Replace custom styled links with the existing Link component that:- Provides consistent styling and behavior- Includes proper external link icon (SquareArrowOutUpRightIcon)- Has built-in accessibility features and focus states- Removes duplicate custom CSS for link styling🤖 Generated with [Claude Code](https://claude.ai/code)Co-Authored-By: Claude <noreply@anthropic.com>
Add simple tests to verify the Coder registry links are presentand properly configured on both the starter templates page andtemplate editor:- Tests link text, href, target, and rel attributes- Uses existing test patterns with MSW and React Testing Library- Verifies external link behavior and accessibility🤖 Generated with [Claude Code](https://claude.ai/code)Co-Authored-By: Claude <noreply@anthropic.com>
Fix TypeScript error by passing createTestQueryClient() to renderEditorPagefunction call in the registry link test, matching the pattern used byother tests in the file.🤖 Generated with [Claude Code](https://claude.ai/code)Co-Authored-By: Claude <noreply@anthropic.com>
- Move template editor registry link to left of build status pill- Make links consistent with size=\sm\ variant- Add white-space: nowrap to prevent text wrapping- Add proper spacing with margins
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others.Learn more.
- suggested some tailwind classes to use instead of emotion styles
- I feel like the tests are pretty low value. they aren't verifying any actual behavior, they're just repeating stuff that the code already says explicitly. chromatic snapshots show that the link is definitely there, and will catch if it ever changes for "free" (no testing code).
site/src/pages/CreateTemplateGalleryPage/CreateTemplateGalleryPageView.tsx OutdatedShow resolvedHide resolved
Uh oh!
There was an error while loading.Please reload this page.
site/src/pages/CreateTemplateGalleryPage/CreateTemplateGalleryPageView.tsx OutdatedShow resolvedHide resolved
Uh oh!
There was an error while loading.Please reload this page.
site/src/pages/TemplateVersionEditorPage/TemplateVersionEditor.tsx OutdatedShow resolvedHide resolved
Uh oh!
There was an error while loading.Please reload this page.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others.Learn more.
Not a hard requirement but would be nice to make the link use some style. Maybe a button or a pill with an eye catching color.
…n links- Replace custom CSS with Tailwind classes (whitespace-nowrap, mr-2)- Add 'button' prop to Link components for button-like styling- Apply consistent styling across template editor and template gallery pages
- Replace Link components with Button + asChild pattern- Use variant=\outline\ for button styling- Keep tailwind classes for proper spacing
- Remove registry link tests from both page components- Fix Button variant and size values to use valid options- Remove unused theme import and reference- Fix build issues
- Import ExternalLinkIcon from lucide-react- Add icon after text in both registry link buttons- Use flex layout for proper alignment in the buttons
Updated the styling and code from feedback   |
matifali approved these changesJul 1, 2025
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others.Learn more.
LGTM from the feature perspective.
/cherry-pick release/2.24 |
aslilac approved these changesJul 1, 2025
d14e9be intomain 28 checks passed
Uh oh!
There was an error while loading.Please reload this page.
gcp-cherry-pick-botbot pushed a commit that referenced this pull requestJul 1, 2025
## Summary- Add "Browse Templates" card to starter templates page- Add "Browse Modules" button to template editor topbar- Both link tohttps://registry.coder.com as requested in#18141<img width="1248" alt="Screenshot 2025-07-01 at 9 29 26 AM"src="https://github.com/user-attachments/assets/2295e45c-2056-41cd-a39e-48d4379295be"/><img width="943" alt="Screenshot 2025-07-01 at 9 29 45 AM"src="https://github.com/user-attachments/assets/e0652b76-43bf-4794-825d-72b4fe7c5e5f"/>🤖 Generated with [Claude Code](https://claude.ai/code)---------Co-authored-by: Claude <noreply@anthropic.com>
| <spanclassName="mr-2"> | ||
| <ButtonasChildsize="sm"variant="outline"> | ||
| <a | ||
| href="https://registry.coder.com" |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others.Learn more.
Ideally we would like to point to"https://registry.coder.com/templates" here.
Sign up for freeto subscribe to this conversation on GitHub. Already have an account?Sign in.
Labels
None yet
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Uh oh!
There was an error while loading.Please reload this page.
Summary
🤖 Generated withClaude Code