Swipe up mobile navbar

[joel-jeremy]

Swipe up mobile navbar to reveal more menus.

[netlify]

✅ Deploy Preview for actualbudget ready!

Name	Link
🔨 Latest commit	7eb1867
🔍 Latest deploy log	https://app.netlify.com/sites/actualbudget/deploys/65529a6da4173300085a84fd
😎 Deploy Preview	https://deploy-preview-1758.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]

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
16	2.85 MB → 2.88 MB (+31.74 kB)	+1.09%

Changeset

File	Δ	Size
../../node_modules/@use-gesture/core/dist/actions-fe213e88.esm.js	🆕 +45.51 kB	0 B → 45.51 kB
../../node_modules/@use-gesture/core/dist/use-gesture-core.esm.js	🆕 +10.99 kB	0 B → 10.99 kB
../../node_modules/@use-gesture/react/dist/use-gesture-react.esm.js	🆕 +2.23 kB	0 B → 2.23 kB
../../node_modules/@use-gesture/core/dist/maths-0ab39ae9.esm.js	🆕 +1.24 kB	0 B → 1.24 kB
src/components/mobile/MobileNavTabs.tsx	📈 +3.65 kB (+137.21%)	2.66 kB → 6.31 kB
package.json	📈 +31 B (+1.41%)	2.15 kB → 2.18 kB

View detailed bundle breakdown

Added

No assets were added

Removed

No assets were removed

Bigger

Asset	File Size	% Changed
static/js/main.js	1.12 MB → 1.15 MB (+31.74 kB)	+2.77%

Smaller

No assets were smaller

Unchanged

Asset	File Size	% Changed
static/js/460.chunk.js	774.35 kB	0%
static/media/Inter-italic.var.woff2	239.29 kB	0%
static/media/Inter-roman.var.woff2	221.86 kB	0%
static/js/444.chunk.js	156.11 kB	0%
static/js/wide-components.chunk.js	127.08 kB	0%
static/js/231.chunk.js	117.37 kB	0%
static/js/narrow-components.chunk.js	52.15 kB	0%
static/js/reports.chunk.js	35.97 kB	0%
static/js/473.chunk.js	13 kB	0%
static/js/312.chunk.js	12.93 kB	0%
static/js/resize-observer-polyfill.chunk.js	8.88 kB	0%
static/css/main.css	7.41 kB	0%
asset-manifest.json	2.07 kB	0%
index.html	1.66 kB	0%
static/media/browser-server.js	903 B	0%

[github-actions]

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
2	2.22 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.23 MB	0%
xfo.xfo.kcab.worker.js	1014.46 kB	0%

[shall0pass]

I really like this interaction!

[shall0pass]

It has my 👍.

[joel-jeremy]

Some tests are failing due to the settings menu now hidden and can't be clicked by playwright. I'm trying to figure out how to do a swipe up on the e2e tests so that the settings and other button can become clickable but no luck so far. Any help or ideas would be appreciated.

[joel-jeremy]

@MatissJanis Any suggestions on how to implement swipe up in tests? I tried some solutions I found online but it doesn't drag the nav tabs up.

[MatissJanis]

Would this work? https://playwright.dev/docs/input#drag-and-drop

On a different note: what if we had the "+" icon in the middle? Maybe it's just me, but that's where budgeting apps usually have it. Not a blocker though.

[joel-jeremy]

Unfortunately, I have tried that and doesn't seem to work so I'm stuck :(

Yeah, putting the + in the middle makes sense. I'll update it tomorrow.

[MatissJanis]

Fixed the e2e tests for you: fe3a4e1

Though you'll want to solve the lint issue and also merge the latest master branch in here before merging.

[joel-jeremy]

Thank you @MatissJanis! Rebased from master and tests are now passing.