Skip to content
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

feat: UX improvements to Action #22253

Merged
merged 16 commits into from May 22, 2024
Merged

Conversation

benjackwhite
Copy link
Contributor

@benjackwhite benjackwhite commented May 10, 2024

Problem

Ended up doing some refactoring in this PR so decided to pull it out

Changes

  • Proper loading and not found state for actions
  • Smaller action segmented buttons
  • Tighter padding on match groups
  • Clearer secondary button for adding another match group
  • Fixed unloading logic
  • Container based re-flowing of the grid (works better with the sidebar)
  • Redirect back to the action when undoing delete
  • Disable the save button when not changed and hide it when editing unless changed (makes it more obvious how to save it when you make a change)
  • Set the default for an match group to be a $pageview
  • Re-order options to be Pageview, Autocapture, Other events as that felt more readable

👉 Stay up-to-date with PostHog coding conventions for a smoother review.

Does this work well for both Cloud and self-hosted?

How did you test this code?

Copy link
Contributor

github-actions bot commented May 10, 2024

Size Change: +4.27 kB (+0.41%)

Total Size: 1.05 MB

Filename Size Change
frontend/dist/toolbar.js 1.05 MB +4.27 kB (+0.41%)

compressed-size-action

Copy link
Member

@pauldambra pauldambra left a comment

Choose a reason for hiding this comment

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

didn't run it but lgtm

@pauldambra
Copy link
Member

i guess we have no visual regression tests for this scene 🙈

Copy link
Member

@pauldambra pauldambra left a comment

Choose a reason for hiding this comment

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

ran it, looks great...

cypress failure looks real (probably cypress test too tightly bound to vague selector from the look of it)

Copy link
Contributor

@daibhin daibhin left a comment

Choose a reason for hiding this comment

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

Some screenshots of the changes or snapshot stories would be nice to see what's changing here

frontend/src/scenes/actions/ActionEdit.tsx Show resolved Hide resolved
@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

2 snapshot changes in total. 0 added, 2 modified, 0 deleted:

  • chromium: 0 added, 2 modified, 0 deleted (diff for shard 1)
  • webkit: 0 added, 0 modified, 0 deleted

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@posthog-bot
Copy link
Contributor

📸 UI snapshots have been updated

2 snapshot changes in total. 0 added, 2 modified, 0 deleted:

  • chromium: 0 added, 2 modified, 0 deleted (diff for shard 1)
  • webkit: 0 added, 0 modified, 0 deleted

Triggered by this commit.

👉 Review this PR's diff of snapshots.

@benjackwhite benjackwhite merged commit 5d72477 into master May 22, 2024
83 checks passed
@benjackwhite benjackwhite deleted the fix/action-ui-improvements branch May 22, 2024 07:09
timgl pushed a commit that referenced this pull request May 24, 2024
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.

None yet

4 participants