Skip to content

Conversation

@imnasnainaec
Copy link
Collaborator

@imnasnainaec imnasnainaec commented Jun 6, 2025

Part of #3787

Notes for review:

  • Replaced <Grid> with <Grid2>, <Stack>, <Box>, <div>, or nothing, as fit the design need.
  • <Stack direction="row"> can be used in place of <Grid2> when we don't want the items in the row to wrap to a second row in a narrow window
  • Do a side-by-side visual comparison between this and master (on QA) to make sure appearance is (roughly) the same or (subjectively) improved on all edited components
  • Try each edited component with various window widths > 400px (we don't support narrower than that)
  • To test AppBar with the most possible items, open a project in which you're owner or administrator (to see the statistics button) and go to Data Entry or Review Entries (to see the speaker button)
  • Test with a few different UI languages

The only component with a visual difference is the AnalyticsConsent, with slightly less padding (for the sake of narrow windows)

Before'n'after screenshots with AppBar and AnalyticsConsent

400px wide
Screenshot 2025-06-19 102417Screenshot 2025-06-19 102431

900px wide
Screenshot 2025-06-19 102623
Screenshot 2025-06-19 102704


This change is Reviewable

@imnasnainaec imnasnainaec self-assigned this Jun 6, 2025
@imnasnainaec imnasnainaec added frontend maintenance Issue that makes it difficult to maintain the software or to upgrade installations post-release. labels Jun 6, 2025
@codecov
Copy link

codecov bot commented Jun 6, 2025

Codecov Report

❌ Patch coverage is 57.14286% with 3 lines in your changes missing coverage. Please review.
✅ Project coverage is 74.17%. Comparing base (d7e37be) to head (69f4d9d).
⚠️ Report is 23 commits behind head on master.

Files with missing lines Patch % Lines
src/components/UserSettings/UserSettings.tsx 50.00% 3 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##           master    #3854      +/-   ##
==========================================
- Coverage   74.19%   74.17%   -0.02%     
==========================================
  Files         288      288              
  Lines       10617    10611       -6     
  Branches     1323     1323              
==========================================
- Hits         7877     7871       -6     
  Misses       2353     2353              
  Partials      387      387              
Flag Coverage Δ
backend 85.41% <ø> (ø)
frontend 65.64% <57.14%> (-0.04%) ⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@imnasnainaec imnasnainaec changed the title [frontend] Migrate 5 components from deprecated Grid [frontend] Migrate 5 components from deprecations Jun 16, 2025
Copy link
Contributor

@jasonleenaylor jasonleenaylor left a comment

Choose a reason for hiding this comment

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

Nice refactor with the ids, makes the testing clean clear and stable.
:lgtm:

Reviewed 1 of 5 files at r1, 5 of 5 files at r2, all commit messages.
Reviewable status: :shipit: complete! all files reviewed, all discussions resolved (waiting on @imnasnainaec)

@imnasnainaec imnasnainaec merged commit a65801e into master Jul 11, 2025
22 of 24 checks passed
@imnasnainaec imnasnainaec deleted the grid2a branch July 11, 2025 15:11
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

frontend maintenance Issue that makes it difficult to maintain the software or to upgrade installations post-release.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants