Redesign automations empty state UI#1666
Open
karinakharchenko wants to merge 2 commits intorocket-admin:mainfrom
Open
Redesign automations empty state UI#1666karinakharchenko wants to merge 2 commits intorocket-admin:mainfrom
karinakharchenko wants to merge 2 commits intorocket-admin:mainfrom
Conversation
Replace old example cards with a trigger-to-action flow: WHEN trigger pills with "or" separators, bolt connector, THEN badge at branch intersection, and branching dashed lines to action toggles. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Replace pill-based triggers with 2x2 grid of icon+title+description cards. Actions shown as centered icon-box cards. Add WHEN/ACTION badges with section labels, connector with THEN pill. Improve light/dark theme contrast. Rename sidebar empty text. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Contributor
There was a problem hiding this comment.
Pull request overview
Redesigns the Automations empty state in the DB table “Actions/Automations” view to better communicate the WHEN → THEN flow, and updates the sidebar empty-copy to match the new terminology.
Changes:
- Updates sidebar empty text to “No automations yet”.
- Replaces the previous text-based empty state with a header/CTA and a non-interactive example flow card (trigger grid + action cards).
- Adds new component-scoped styles for the redesigned empty state, including light/dark scheme adjustments.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 3 comments.
| File | Description |
|---|---|
| frontend/src/app/components/dashboard/db-table-view/db-table-actions/db-table-actions.component.html | Updates empty-state markup (new header/CTA, WHEN/THEN flow card) and renames empty sidebar copy. |
| frontend/src/app/components/dashboard/db-table-view/db-table-actions/db-table-actions.component.css | Adds styling for the new empty state layout, trigger grid, connector, and action cards; tweaks custom trigger active background. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| </div> | ||
| <div class="example-trigger example-trigger--custom"> | ||
| <div class="example-trigger__icon-box example-trigger__icon-box--custom"> | ||
| <mat-icon>download</mat-icon> |
Comment on lines
+296
to
+298
| <mat-icon>webhook</mat-icon> | ||
| </div> | ||
| <span class="example-action__label">Webhook</span> |
Comment on lines
+222
to
+226
| <button mat-flat-button color="accent" | ||
| angulartics2On="click" | ||
| angularticsAction="Actions: add first action is clicked" | ||
| (click)="addNewRule(); posthog.capture('Actions: add first action is clicked')"> | ||
| Create first automation |
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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Summary
Test plan
🤖 Generated with Claude Code