github-starred/actual
2
0
Fork 0
mirror of https://github.com/actualbudget/actual.git synced 2026-07-15 22:54:03 -05:00
Code Issues 3.0k Packages Projects Releases 58 Wiki Activity

[PR #5516] [MERGED] Extract mobile rules form to a new page #139472

New Issue
Closed
opened 2026-06-19 06:15:28 -05:00 by GiteaMirror · 0 comments
GiteaMirror commented 2026-06-19 06:15:28 -05:00
Owner
Copy Link

📋 Pull Request Information

Original PR: https://github.com/actualbudget/actual/pull/5516
Author: @MatissJanis
Created: 8/7/2025
Status: ✅ Merged
Merged: 8/14/2025
Merged by: @MatissJanis

Base: master ← Head: cursor/extract-mobile-rules-form-to-a-new-page-5d37

📝 Commits (10+)

  • c2210e9 Refactor rule editing to use new RuleEditor component across platforms
  • c71394c Refactor: Move FieldSelect and OpSelect to rules components
  • 78eb392 Add release notes for PR #5516
  • ff23a39 Refactor rule editor and navigation hooks with TypeScript improvements
  • 5d5fe12 Fix mobile rules navigation with useCallback and proper handlers
  • aabc319 Add debug logging and alerts to test mobile rules navigation
  • 08572c2 [autofix.ci] apply automated fixes
  • a1b872b Create ultra-simplified debug version to isolate click issues
  • c4d73ff Test direct window navigation to isolate useNavigate issue
  • b54e278 Remove all debug code and restore proper UI components

📊 Changes

25 files changed (+260 additions, -98 deletions)

View changed files

📝 .prettierignore (+3 -0)
📝 package.json (+1 -0)
📝 packages/desktop-client/e2e/rules.mobile.test.ts (+6 -8)
➕ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-form-1-chromium-linux.png (+0 -0)
➕ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-form-2-chromium-linux.png (+0 -0)
➕ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-form-3-chromium-linux.png (+0 -0)
➖ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-modal-1-chromium-linux.png (+0 -0)
➖ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-modal-2-chromium-linux.png (+0 -0)
➖ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-modal-3-chromium-linux.png (+0 -0)
➕ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-form-1-chromium-linux.png (+0 -0)
➕ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-form-2-chromium-linux.png (+0 -0)
➕ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-form-3-chromium-linux.png (+0 -0)
➖ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-modal-1-chromium-linux.png (+0 -0)
➖ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-modal-2-chromium-linux.png (+0 -0)
➖ packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-modal-3-chromium-linux.png (+0 -0)
📝 packages/desktop-client/src/components/FinancesApp.tsx (+4 -0)
📝 packages/desktop-client/src/components/autocomplete/Autocomplete.tsx (+18 -5)
📝 packages/desktop-client/src/components/mobile/rules/AddRuleButton.tsx (+10 -46)
➕ packages/desktop-client/src/components/mobile/rules/MobileRuleEditPage.tsx (+133 -0)
📝 packages/desktop-client/src/components/mobile/rules/MobileRulesPage.tsx (+9 -24)

...and 5 more files

📄 Description

Feat: Dedicated Mobile Page for Rule Creation and Editing

This PR introduces a dedicated mobile page for creating and editing rules, replacing the previous modal-based approach for a significantly improved mobile user experience.

Why this change?
The primary goal is to provide a more native and user-friendly experience for managing rules on mobile devices, moving from a constrained modal to a full-page interface. This also improves code reusability by extracting the core editing logic.

Key Changes:

  • Dedicated Mobile Page: A new MobileRuleEditPage provides a full-screen interface for rule management on mobile, leveraging the new RuleEditor.
  • Updated Mobile Navigation: MobileRulesPage and AddRuleButton now navigate to the new dedicated page instead of opening a modal.
  • New Route: Added /rules/edit/:id for the mobile rule editing page.
Open in Cursor Open in Web

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/actualbudget/actual/pull/5516 **Author:** [@MatissJanis](https://github.com/MatissJanis) **Created:** 8/7/2025 **Status:** ✅ Merged **Merged:** 8/14/2025 **Merged by:** [@MatissJanis](https://github.com/MatissJanis) **Base:** `master` ← **Head:** `cursor/extract-mobile-rules-form-to-a-new-page-5d37` --- ### 📝 Commits (10+) - [`c2210e9`](https://github.com/actualbudget/actual/commit/c2210e9d8303ef813a216266f7fb64e514dcec6f) Refactor rule editing to use new RuleEditor component across platforms - [`c71394c`](https://github.com/actualbudget/actual/commit/c71394c165d1b03563e7df50b80e4c44183b7520) Refactor: Move FieldSelect and OpSelect to rules components - [`78eb392`](https://github.com/actualbudget/actual/commit/78eb392f07dacc41797296297a95cc9b6bafcf21) Add release notes for PR #5516 - [`ff23a39`](https://github.com/actualbudget/actual/commit/ff23a39551e5177014b37269f1f6fbe9b93ae81b) Refactor rule editor and navigation hooks with TypeScript improvements - [`5d5fe12`](https://github.com/actualbudget/actual/commit/5d5fe12d24af92beb9bc990a1aa5d52ed2bf5a12) Fix mobile rules navigation with useCallback and proper handlers - [`aabc319`](https://github.com/actualbudget/actual/commit/aabc319f7ef505935c6cb74b05c3da2b3d45d829) Add debug logging and alerts to test mobile rules navigation - [`08572c2`](https://github.com/actualbudget/actual/commit/08572c29f3558946f2e2c704ddba397c2777c9dc) [autofix.ci] apply automated fixes - [`a1b872b`](https://github.com/actualbudget/actual/commit/a1b872b5a5133a5788e8453aa71acd70c7bfb8fd) Create ultra-simplified debug version to isolate click issues - [`c4d73ff`](https://github.com/actualbudget/actual/commit/c4d73ff8600f9a75c5057993b83335c607ec6102) Test direct window navigation to isolate useNavigate issue - [`b54e278`](https://github.com/actualbudget/actual/commit/b54e27867bdde763d60d1c3bda0377951953bb3d) Remove all debug code and restore proper UI components ### 📊 Changes **25 files changed** (+260 additions, -98 deletions) <details> <summary>View changed files</summary> 📝 `.prettierignore` (+3 -0) 📝 `package.json` (+1 -0) 📝 `packages/desktop-client/e2e/rules.mobile.test.ts` (+6 -8) ➕ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-form-1-chromium-linux.png` (+0 -0) ➕ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-form-2-chromium-linux.png` (+0 -0) ➕ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-form-3-chromium-linux.png` (+0 -0) ➖ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-modal-1-chromium-linux.png` (+0 -0) ➖ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-modal-2-chromium-linux.png` (+0 -0) ➖ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-add-button-opens-rule-creation-modal-3-chromium-linux.png` (+0 -0) ➕ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-form-1-chromium-linux.png` (+0 -0) ➕ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-form-2-chromium-linux.png` (+0 -0) ➕ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-form-3-chromium-linux.png` (+0 -0) ➖ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-modal-1-chromium-linux.png` (+0 -0) ➖ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-modal-2-chromium-linux.png` (+0 -0) ➖ `packages/desktop-client/e2e/rules.mobile.test.ts-snapshots/Mobile-Rules-clicking-on-a-rule-opens-edit-modal-3-chromium-linux.png` (+0 -0) 📝 `packages/desktop-client/src/components/FinancesApp.tsx` (+4 -0) 📝 `packages/desktop-client/src/components/autocomplete/Autocomplete.tsx` (+18 -5) 📝 `packages/desktop-client/src/components/mobile/rules/AddRuleButton.tsx` (+10 -46) ➕ `packages/desktop-client/src/components/mobile/rules/MobileRuleEditPage.tsx` (+133 -0) 📝 `packages/desktop-client/src/components/mobile/rules/MobileRulesPage.tsx` (+9 -24) _...and 5 more files_ </details> ### 📄 Description ## Feat: Dedicated Mobile Page for Rule Creation and Editing This PR introduces a dedicated mobile page for creating and editing rules, replacing the previous modal-based approach for a significantly improved mobile user experience. **Why this change?** The primary goal is to provide a more native and user-friendly experience for managing rules on mobile devices, moving from a constrained modal to a full-page interface. This also improves code reusability by extracting the core editing logic. **Key Changes:** * **Dedicated Mobile Page:** A new `MobileRuleEditPage` provides a full-screen interface for rule management on mobile, leveraging the new `RuleEditor`. * **Updated Mobile Navigation:** `MobileRulesPage` and `AddRuleButton` now navigate to the new dedicated page instead of opening a modal. * **New Route:** Added `/rules/edit/:id` for the mobile rule editing page. --- <a href="https://cursor.com/background-agent?bcId=bc-8e41f8fe-a9c3-41d8-9272-e5f9dae4fd8f"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cursor.com/open-in-cursor-dark.svg"> <source media="(prefers-color-scheme: light)" srcset="https://cursor.com/open-in-cursor-light.svg"> <img alt="Open in Cursor" src="https://cursor.com/open-in-cursor.svg"> </picture> </a> <a href="https://cursor.com/agents?id=bc-8e41f8fe-a9c3-41d8-9272-e5f9dae4fd8f"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://cursor.com/open-in-web-dark.svg"> <source media="(prefers-color-scheme: light)" srcset="https://cursor.com/open-in-web-light.svg"> <img alt="Open in Web" src="https://cursor.com/open-in-web.svg"> </picture> </a> --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-06-19 06:15:28 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
AI generated
API
bank sync
budgeting
bug
can’t replicate
dependencies
docker
documentation
electron
experimental feature
feature
feedback
goal templates
good first issue
help wanted
importers
maintenance
needs info
needs testing
needs triage
needs votes
openid
payees
pull-request
Mirrored from GitHub Pull Request
 regression
reports
responsive
rules
schedules
server
✨ merged
split transactions
tech debt
tech-support
theme
transaction import
transaction reconciliation
transactions
translations
upstream
user interface
✅ approved
wontfix
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/actual#139472
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?