:recycle: refactoring Select component to use existing Menu

MatissJanis commented 1 week ago

Refactoring the Select component to use the existing Menu, Popover and Button components. This allows us to remove the @reach/listbox dependency.

There is a slight visual difference. I think the new variation looks better (and more consistent), but LMK if you disagree and we can style it to match the old one.

netlify[bot] commented 1 week ago

Deploy Preview for actualbudget ready!

Name	Link
Latest commit	63a2b58b684cac49c9437a2a0374f78840fe70f6
Latest deploy log	https://app.netlify.com/sites/actualbudget/deploys/66773f187c907f000889ad69
Deploy Preview	https://deploy-preview-2905.demo.actualbudget.org
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

github-actions[bot] commented 1 week ago

Bundle Stats — desktop-client

Hey there, this message comes from a GitHub action that helps you and reviewers to understand how these changes affect the size of this project's bundle.

As this PR is updated, I'll keep you updated on how the bundle size is impacted.

Total

Files count	Total bundle size	% Changed
9	4.76 MB → 4.67 MB (-91.29 kB)	-1.87%

Changeset

File | Δ | Size ---- | - | ---- `src/components/reports/ReportSidebar.tsx` | 📈 +95 B (+0.56%) | 16.61 kB → 16.71 kB `src/components/modals/EditRule.jsx` | 📈 +68 B (+0.19%) | 34.46 kB → 34.53 kB `node_modules/@reach/listbox/styles.css` | +0 B (0%) | 0 B → 0 B `node_modules/@react-spring/core/dist/react-spring_core.modern.mjs` | 📉 -4 B (-0.01%) | 58.12 kB → 58.12 kB `node_modules/@react-spring/shared/dist/react-spring_shared.modern.mjs` | 📉 -2 B (-0.01%) | 27.69 kB → 27.69 kB `node_modules/react-dom/cjs/react-dom.production.min.js` | 📉 -10 B (-0.01%) | 130.03 kB → 130.02 kB `src/components/table.tsx` | 📉 -2 B (-0.01%) | 24.11 kB → 24.11 kB `src/components/autocomplete/Autocomplete.tsx` | 📉 -2 B (-0.01%) | 16.27 kB → 16.27 kB `src/components/Titlebar.tsx` | 📉 -2 B (-0.02%) | 11.58 kB → 11.58 kB `src/components/manager/BudgetList.jsx` | 📉 -2 B (-0.02%) | 9.95 kB → 9.95 kB `src/components/schedules/SchedulesTable.tsx` | 📉 -2 B (-0.02%) | 9.95 kB → 9.94 kB `src/components/payees/ManagePayees.jsx` | 📉 -2 B (-0.02%) | 8.79 kB → 8.78 kB `src/components/select/DateSelect.tsx` | 📉 -2 B (-0.02%) | 8.53 kB → 8.53 kB `node_modules/@react-spring/animated/dist/react-spring_animated.modern.mjs` | 📉 -2 B (-0.02%) | 8.15 kB → 8.14 kB `src/components/sidebar/Sidebar.tsx` | 📉 -2 B (-0.03%) | 5.9 kB → 5.9 kB `src/components/modals/CategoryGroupMenuModal.tsx` | 📉 -2 B (-0.03%) | 5.65 kB → 5.64 kB `src/components/modals/CategoryMenuModal.tsx` | 📉 -2 B (-0.04%) | 4.89 kB → 4.89 kB `src/components/modals/AccountMenuModal.tsx` | 📉 -2 B (-0.04%) | 4.76 kB → 4.76 kB `src/components/accounts/AccountSyncCheck.jsx` | 📉 -2 B (-0.04%) | 4.67 kB → 4.67 kB `node_modules/downshift/dist/downshift.esm.js` | 📉 -20 B (-0.05%) | 43.26 kB → 43.24 kB `src/components/LoggedInUser.tsx` | 📉 -2 B (-0.08%) | 2.58 kB → 2.57 kB `node_modules/react-dnd/dist/hooks/useCollector.js` | 📉 -2 B (-0.18%) | 1.07 kB → 1.07 kB `node_modules/react-modal/lib/helpers/tabbable.js` | 📉 -6 B (-0.21%) | 2.8 kB → 2.79 kB `node_modules/compute-scroll-into-view/dist/index.js` | 📉 -6 B (-0.22%) | 2.64 kB → 2.63 kB `node_modules/react-dnd/dist/hooks/useDrag/useRegisteredDragSource.js` | 📉 -2 B (-0.31%) | 650 B → 648 B `node_modules/react-dnd/dist/hooks/useDrop/useRegisteredDropTarget.js` | 📉 -2 B (-0.33%) | 610 B → 608 B `node_modules/react-dnd/dist/hooks/useMonitorOutput.js` | 📉 -2 B (-0.36%) | 553 B → 551 B `src/components/modals/ImportTransactions.jsx` | 📉 -151 B (-0.38%) | 38.47 kB → 38.32 kB `node_modules/react-dnd/dist/hooks/useDrop/useDropTargetConnector.js` | 📉 -2 B (-0.45%) | 448 B → 446 B `node_modules/react-dnd/dist/hooks/useDrag/useDragSourceConnector.js` | 📉 -4 B (-0.51%) | 779 B → 775 B `src/components/filters/FiltersMenu.jsx` | 📉 -97 B (-0.77%) | 12.26 kB → 12.16 kB `package.json` | 📉 -30 B (-1.02%) | 2.87 kB → 2.84 kB `node_modules/react-dnd/dist/hooks/useIsomorphicLayoutEffect.js` | 📉 -2 B (-1.12%) | 178 B → 176 B `node_modules/react-is/cjs/react-is.production.min.js` | 📉 -48 B (-1.76%) | 2.66 kB → 2.61 kB `src/components/select/RecurringSchedulePicker.jsx` | 📉 -653 B (-3.78%) | 16.88 kB → 16.24 kB `node_modules/react-modal/lib/helpers/tabbable.js?commonjs-module` | 📉 -2 B (-6.45%) | 31 B → 29 B `src/components/settings/Format.tsx` | 📉 -380 B (-7.20%) | 5.16 kB → 4.79 kB `src/components/settings/Themes.tsx` | 📉 -123 B (-15.17%) | 811 B → 688 B `src/components/common/Popover.tsx` | 📉 -164 B (-23.30%) | 704 B → 540 B `src/components/common/Select.tsx` | 📉 -1.13 kB (-31.38%) | 3.61 kB → 2.47 kB `node_modules/@reach/listbox/dist/reach-listbox.mjs` | 🔥 -40.52 kB (-100%) | 40.52 kB → 0 B `node_modules/tabbable/dist/index.esm.js` | 🔥 -17.99 kB (-100%) | 17.99 kB → 0 B `node_modules/@reach/popover/dist/reach-popover.mjs` | 🔥 -7.15 kB (-100%) | 7.15 kB → 0 B `node_modules/@reach/descendants/dist/reach-descendants.mjs` | 🔥 -7 kB (-100%) | 7 kB → 0 B `node_modules/@reach/utils/dist/reach-utils.mjs` | 🔥 -4.15 kB (-100%) | 4.15 kB → 0 B `node_modules/@xstate/fsm/es/index.js` | 🔥 -3.28 kB (-100%) | 3.28 kB → 0 B `node_modules/@reach/rect/dist/reach-rect.mjs` | 🔥 -2.36 kB (-100%) | 2.36 kB → 0 B `node_modules/@reach/portal/dist/reach-portal.mjs` | 🔥 -2.1 kB (-100%) | 2.1 kB → 0 B `node_modules/@reach/machine/dist/reach-machine.mjs` | 🔥 -1.81 kB (-100%) | 1.81 kB → 0 B `node_modules/@reach/observe-rect/dist/observe-rect.esm.js` | 🔥 -1.58 kB (-100%) | 1.58 kB → 0 B `node_modules/@reach/auto-id/dist/reach-auto-id.mjs` | 🔥 -676 B (-100%) | 676 B → 0 B

View detailed bundle breakdown

**Added** No assets were added **Removed** No assets were removed **Bigger** Asset | File Size | % Changed ----- | --------- | --------- static/js/ReportRouter.js | 1.23 MB → 1.23 MB (+95 B) | +0.01% **Smaller** Asset | File Size | % Changed ----- | --------- | --------- static/js/index.js | 3.02 MB → 2.93 MB (-91.29 kB) | -2.95% static/js/AppliedFilters.js | 27.22 kB → 27.12 kB (-97 B) | -0.35% **Unchanged** Asset | File Size | % Changed ----- | --------- | --------- static/js/resize-observer.js | 18.37 kB | 0% static/js/indexeddb-main-thread-worker-e59fee74.js | 13.5 kB | 0% static/js/BackgroundImage.js | 122.29 kB | 0% static/js/narrow.js | 75.73 kB | 0% static/js/usePreviewTransactions.js | 790 B | 0% static/js/wide.js | 266.96 kB | 0%

github-actions[bot] commented 1 week ago

Bundle Stats — loot-core

Hey there, this message comes from a GitHub action that helps you and reviewers to understand how these changes affect the size of this project's bundle.

As this PR is updated, I'll keep you updated on how the bundle size is impacted.

Total

Files count	Total bundle size	% Changed
1	1.13 MB	0%

Changeset

No files were changed

View detailed bundle breakdown

**Added** No assets were added **Removed** No assets were removed **Bigger** No assets were bigger **Smaller** No assets were smaller **Unchanged** Asset | File Size | % Changed ----- | --------- | --------- kcab.worker.js | 1.13 MB | 0%

MatissJanis commented 1 week ago

Greta catch @joel-jeremy ! This has now been patched.

actualbudget / actual