-
-
Notifications
You must be signed in to change notification settings - Fork 957
feat(webapp): add triggered via field to deployment details page #2850
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 our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
Display the deployment trigger source (CLI, CI/CD, Dashboard, GitHub Integration) with appropriate icons on the deployment details page. The triggeredVia field was already in the database but not displayed.
⚠️ No Changeset found
Latest commit: 710d6ec
Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.
This PR includes no changesets
When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types
Click here to learn what changesets are, and how to add one.
Click here if you're a maintainer who wants to add a changeset to this PR
WalkthroughThis change exposes the Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes 🚥 Pre-merge checks | ✅ 1 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (1 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
PR Review: feat(webapp): add triggered via field to deployment details page
Summary
This PR displays the triggeredVia field on the deployment details page, showing users how their deployment was initiated (CLI, CI/CD provider, Dashboard, or GitHub Integration). The field was already being captured in the database but was not displayed in the UI.
What is Good
-
Follows existing patterns: The implementation correctly uses the existing
Property.TableandProperty.Itemcomponents, maintaining consistency with other fields on the page. -
Graceful fallback handling: The
getTriggeredViaDisplayfunction handles unknown values well:- Returns
nullfor missing values (displays "–") - Has a fallback for unknown
cli:*prefixes - Has a catch-all for completely unknown values
- Returns
-
Matches the schema: The switch cases align with the
DeploymentTriggeredViaschema defined inpackages/core/src/v3/schemas/api.ts. -
Minimal backend changes: Only two lines added to the presenter to expose the field that was already being fetched.
Suggestions for Improvement
1. Consider using a Record/Map instead of a large switch statement
The getTriggeredViaDisplay function has a lot of repetition. Consider refactoring to a configuration object. This would make it easier to maintain and extend.
2. Consider extracting icon components or using a consistent icon pattern
The PR uses GitBranchIcon for both GitHub Actions CLI and GitHub Integration, while other CI providers use ServerIcon. Consider:
- Using the GitHub icon (from lucide:
Github) for GitHub-specific items - The
GitBranchIconmight be confusing since not all CI deployments involve git branches in the same way
3. Minor: IIFE in JSX could be simplified
The current IIFE pattern could be simplified to a ternary or extracted to a small TriggeredViaDisplay component for better readability.
Security
No security concerns. The field is read-only display data from the database.
Performance
No performance concerns. The field is already being fetched in the Prisma query; this just displays it.
Test Coverage
No tests are included in this PR. While this is a straightforward UI addition, consider adding:
- A unit test for
getTriggeredViaDisplayto ensure all cases are handled correctly - Integration/E2E tests if your test suite covers the deployment details page
Verdict
Looks good to merge! The suggestions above are minor improvements that could be addressed in a follow-up if desired. The core functionality is correct and follows the codebase patterns.
Review Complete
Your review story is ready!
Comment !reviewfast on this PR to re-generate the story.
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.
Actionable comments posted: 0
🧹 Nitpick comments (1)
apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx (1)
85-167: Consider refactoring to a lookup object for better maintainability.The
getTriggeredViaDisplayfunction works correctly and handles all edge cases well, including graceful fallbacks for unknown values. However, the large switch statement could be refactored to use a lookup object for improved maintainability.♻️ Optional refactor using a lookup object
+const TRIGGERED_VIA_DISPLAY_MAP: Record< + string, + { icon: React.ComponentType<{ className?: string }>; label: string } +> = { + "cli:manual": { icon: TerminalSquareIcon, label: "CLI (Manual)" }, + "cli:github_actions": { icon: GitBranchIcon, label: "CLI (GitHub Actions)" }, + "cli:gitlab_ci": { icon: ServerIcon, label: "CLI (GitLab CI)" }, + "cli:circleci": { icon: ServerIcon, label: "CLI (CircleCI)" }, + "cli:jenkins": { icon: ServerIcon, label: "CLI (Jenkins)" }, + "cli:azure_pipelines": { icon: ServerIcon, label: "CLI (Azure Pipelines)" }, + "cli:bitbucket_pipelines": { icon: ServerIcon, label: "CLI (Bitbucket Pipelines)" }, + "cli:travis_ci": { icon: ServerIcon, label: "CLI (Travis CI)" }, + "cli:buildkite": { icon: ServerIcon, label: "CLI (Buildkite)" }, + "cli:ci_other": { icon: ServerIcon, label: "CLI (CI)" }, + "git_integration:github": { icon: GitBranchIcon, label: "GitHub Integration" }, + dashboard: { icon: LayoutDashboardIcon, label: "Dashboard" }, +}; + function getTriggeredViaDisplay(triggeredVia: string | null | undefined): { icon: React.ReactNode; label: string; } | null { if (!triggeredVia) return null; const iconClass = "size-4 text-text-dimmed"; - - switch (triggeredVia) { - case "cli:manual": - return { - icon: <TerminalSquareIcon className={iconClass} />, - label: "CLI (Manual)", - }; - case "cli:github_actions": - return { - icon: <GitBranchIcon className={iconClass} />, - label: "CLI (GitHub Actions)", - }; - case "cli:gitlab_ci": - return { - icon: <ServerIcon className={iconClass} />, - label: "CLI (GitLab CI)", - }; - case "cli:circleci": - return { - icon: <ServerIcon className={iconClass} />, - label: "CLI (CircleCI)", - }; - case "cli:jenkins": - return { - icon: <ServerIcon className={iconClass} />, - label: "CLI (Jenkins)", - }; - case "cli:azure_pipelines": - return { - icon: <ServerIcon className={iconClass} />, - label: "CLI (Azure Pipelines)", - }; - case "cli:bitbucket_pipelines": - return { - icon: <ServerIcon className={iconClass} />, - label: "CLI (Bitbucket Pipelines)", - }; - case "cli:travis_ci": - return { - icon: <ServerIcon className={iconClass} />, - label: "CLI (Travis CI)", - }; - case "cli:buildkite": - return { - icon: <ServerIcon className={iconClass} />, - label: "CLI (Buildkite)", - }; - case "cli:ci_other": - return { - icon: <ServerIcon className={iconClass} />, - label: "CLI (CI)", - }; - case "git_integration:github": - return { - icon: <GitBranchIcon className={iconClass} />, - label: "GitHub Integration", - }; - case "dashboard": - return { - icon: <LayoutDashboardIcon className={iconClass} />, - label: "Dashboard", - }; - default: - // Handle any unknown values gracefully - if (triggeredVia.startsWith("cli:")) { - return { - icon: <TerminalSquareIcon className={iconClass} />, - label: `CLI (${triggeredVia.replace("cli:", "")})`, - }; - } - return { - icon: <ServerIcon className={iconClass} />, - label: triggeredVia, - }; - } + + const config = TRIGGERED_VIA_DISPLAY_MAP[triggeredVia]; + + if (config) { + const IconComponent = config.icon; + return { + icon: <IconComponent className={iconClass} />, + label: config.label, + }; + } + + // Handle any unknown values gracefully + if (triggeredVia.startsWith("cli:")) { + return { + icon: <TerminalSquareIcon className={iconClass} />, + label: `CLI (${triggeredVia.replace("cli:", "")})`, + }; + } + + return { + icon: <ServerIcon className={iconClass} />, + label: triggeredVia, + }; }This approach makes it easier to add or modify trigger source mappings without touching the function logic.
📜 Review details
Configuration used: Repository UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
🧰 Additional context used
📓 Path-based instructions (7)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
**/*.{ts,tsx}: Use types over interfaces for TypeScript
Avoid using enums; prefer string unions or const objects instead
Files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
{packages/core,apps/webapp}/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
Use zod for validation in packages/core and apps/webapp
Files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
Use function declarations instead of default exports
Files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
apps/webapp/app/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/webapp.mdc)
Access all environment variables through the
envexport ofenv.server.tsinstead of directly accessingprocess.envin the Trigger.dev webapp
Files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
apps/webapp/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/webapp.mdc)
apps/webapp/**/*.{ts,tsx}: When importing from@trigger.dev/corein the webapp, use subpath exports from the package.json instead of importing from the root path
Follow the Remix 2.1.0 and Express server conventions when updating the main trigger.dev webapp
Files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
**/*.{js,ts,jsx,tsx,json,md,css,scss}
📄 CodeRabbit inference engine (AGENTS.md)
Format code using Prettier
Files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/otel-metrics.mdc)
**/*.ts: OpenTelemetry metric attributes must have low cardinality - use only enums, booleans, bounded error codes, or bounded shard IDs as attribute values
Do not use high-cardinality attributes in OpenTelemetry metrics: avoid UUIDs/IDs (envId, userId, runId, projectId, organizationId), unbounded integers (itemCount, batchSize, retryCount), timestamps (createdAt, startTime), or free-form strings (errorMessage, taskName, queueName)
Files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.ts
🧠 Learnings (9)
📚 Learning: 2025年11月27日T16:27:35.304Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/writing-tasks.mdc:0-0
Timestamp: 2025年11月27日T16:27:35.304Z
Learning: Applies to **/trigger.config.ts : Use build extensions in trigger.config.ts (additionalFiles, additionalPackages, aptGet, prismaExtension, etc.) to customize the build
Applied to files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
📚 Learning: 2025年11月27日T16:26:58.661Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/webapp.mdc:0-0
Timestamp: 2025年11月27日T16:26:58.661Z
Learning: Applies to apps/webapp/**/*.{ts,tsx} : Follow the Remix 2.1.0 and Express server conventions when updating the main trigger.dev webapp
Applied to files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.tsapps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
📚 Learning: 2025年11月27日T16:27:35.304Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/writing-tasks.mdc:0-0
Timestamp: 2025年11月27日T16:27:35.304Z
Learning: Applies to **/trigger.config.ts : Configure build process in trigger.config.ts using `build` object with external packages, extensions, and JSX settings
Applied to files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.ts
📚 Learning: 2025年11月27日T16:27:35.304Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/writing-tasks.mdc:0-0
Timestamp: 2025年11月27日T16:27:35.304Z
Learning: Applies to **/trigger/**/*.{ts,tsx,js,jsx} : Attach metadata to task runs using the metadata option when triggering, and access/update it inside runs using metadata functions
Applied to files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.ts
📚 Learning: 2025年11月27日T16:27:35.304Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/writing-tasks.mdc:0-0
Timestamp: 2025年11月27日T16:27:35.304Z
Learning: Applies to **/trigger/**/*.{ts,tsx,js,jsx} : Use metadata methods (set, del, replace, append, remove, increment, decrement, stream, flush) to update metadata during task execution
Applied to files:
apps/webapp/app/presenters/v3/DeploymentPresenter.server.ts
📚 Learning: 2025年11月27日T16:27:35.304Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/writing-tasks.mdc:0-0
Timestamp: 2025年11月27日T16:27:35.304Z
Learning: Applies to **/trigger/**/*.{ts,tsx,js,jsx} : Use `trigger.dev/sdk/v3` for all imports in Trigger.dev tasks
Applied to files:
apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
📚 Learning: 2025年11月27日T16:26:58.661Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/webapp.mdc:0-0
Timestamp: 2025年11月27日T16:26:58.661Z
Learning: Applies to apps/webapp/**/*.{ts,tsx} : When importing from `trigger.dev/core` in the webapp, use subpath exports from the package.json instead of importing from the root path
Applied to files:
apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
📚 Learning: 2025年11月27日T16:27:35.304Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/writing-tasks.mdc:0-0
Timestamp: 2025年11月27日T16:27:35.304Z
Learning: Applies to **/trigger/**/*.{ts,tsx,js,jsx} : Export tasks with unique IDs within the project to enable proper task discovery and execution
Applied to files:
apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
📚 Learning: 2025年11月27日T16:26:58.661Z
Learnt from: CR
Repo: triggerdotdev/trigger.dev PR: 0
File: .cursor/rules/webapp.mdc:0-0
Timestamp: 2025年11月27日T16:26:58.661Z
Learning: Applies to apps/webapp/app/**/*.{ts,tsx} : Access all environment variables through the `env` export of `env.server.ts` instead of directly accessing `process.env` in the Trigger.dev webapp
Applied to files:
apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (24)
- GitHub Check: units / internal / 🧪 Unit Tests: Internal (6, 8)
- GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (7, 8)
- GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (2, 8)
- GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (6, 8)
- GitHub Check: units / internal / 🧪 Unit Tests: Internal (5, 8)
- GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (8, 8)
- GitHub Check: units / internal / 🧪 Unit Tests: Internal (7, 8)
- GitHub Check: units / internal / 🧪 Unit Tests: Internal (2, 8)
- GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (4, 8)
- GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (5, 8)
- GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (3, 8)
- GitHub Check: units / internal / 🧪 Unit Tests: Internal (8, 8)
- GitHub Check: units / webapp / 🧪 Unit Tests: Webapp (1, 8)
- GitHub Check: units / internal / 🧪 Unit Tests: Internal (4, 8)
- GitHub Check: units / internal / 🧪 Unit Tests: Internal (3, 8)
- GitHub Check: units / internal / 🧪 Unit Tests: Internal (1, 8)
- GitHub Check: e2e / 🧪 CLI v3 tests (ubuntu-latest - npm)
- GitHub Check: units / packages / 🧪 Unit Tests: Packages (1, 1)
- GitHub Check: e2e / 🧪 CLI v3 tests (windows-latest - pnpm)
- GitHub Check: e2e / 🧪 CLI v3 tests (ubuntu-latest - pnpm)
- GitHub Check: e2e / 🧪 CLI v3 tests (windows-latest - npm)
- GitHub Check: typecheck / typecheck
- GitHub Check: claude-review
- GitHub Check: Analyze (javascript-typescript)
🔇 Additional comments (4)
apps/webapp/app/presenters/v3/DeploymentPresenter.server.ts (2)
159-159: LGTM! Field selection added correctly.The
triggeredViafield is properly added to the Prisma select statement, following the same pattern as other fields.
229-229: LGTM! Field properly exposed in API response.The
triggeredViavalue is correctly passed through from the database record to the API response object.apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.deployments.$deploymentParam/route.tsx (2)
6-15: LGTM! Icon imports added correctly.The new icons (
TerminalSquareIcon,LayoutDashboardIcon,GitBranchIcon,ServerIcon) are properly imported and used in thegetTriggeredViaDisplayhelper function.
504-518: LGTM! UI integration is clean and consistent.The "Triggered via" field is properly integrated into the deployment details table. The implementation follows existing patterns, includes appropriate fallback handling, and provides accessible text labels alongside decorative icons.
@nicktrn
nicktrn
left a comment
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.
already approved, just testing gh app
Display the deployment trigger source (CLI, CI/CD, Dashboard, GitHub Integration) with appropriate icons on the deployment details page. The triggeredVia field was already in the database but not displayed.