Safe Area Inset Fixes - iOS PWA should take full screen height #69
Conversation
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Summary of Changes
Hello @ByteBard11, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!
This pull request focuses on enhancing the user experience for iOS Progressive Web Apps by resolving layout issues related to safe area insets. The changes ensure that the application's content correctly utilizes the full screen height, provides a more immersive theme experience by extending backgrounds into safe areas, and properly positions UI components like notifications and the profiler button within the safe display boundaries.
Highlights
- iOS PWA Full Screen Height: Addressed an issue where content in iOS Progressive Web Apps (PWAs) did not fully occupy the viewport height, leading to dead space at the top and bottom of the screen. This ensures the application utilizes the entire display area.
- Theme-Aware Safe Areas: Ensured that the top status bar and bottom home indicator areas are theme-aware, restoring an immersive dark mode experience by allowing the application's background to extend seamlessly into these regions.
- UI Element Positioning for Safe Areas: Adjusted the positioning of key UI elements, including the profiler button and various notification banners (alert, CTA, notice), to correctly account for and respect iOS safe area insets, preventing content from being obscured.
Using Gemini Code Assist
The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.
Invoking Gemini
You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in issue comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
Customization
To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.
Limitations & Feedback
Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments or fill out our survey to provide feedback.
You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.
Footnotes
-
Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩
There was a problem hiding this comment.
Code Review
This pull request aims to fix UI layout issues on iOS PWAs by correctly applying safe area insets. The changes correctly add safe area awareness to dialogs, notifications, and the profiler button.
However, I've identified a critical issue with the switch from padding to margin on the <html> element, which will cause unthemed dead space on iOS devices. I've also noted that the bottom navigation for mobile is now missing its necessary bottom padding, which will impact usability. Finally, there's an opportunity to reduce code duplication in how safe area margins are applied to notifications.
My recommendations focus on removing the problematic global margin, restoring the padding on the bottom navigation, and centralizing the notification styling for better maintainability.
|
@ByteBard11: can you look at the dialog closing bug @steadyfall was running into here? You had quite a bit of review work on the original repo already, so not sure we'll be able to find anybody that can add more value than Zach did there. I don't see the video anymore, can you re-upload the recording of that bug @steadyfall? |
|
@jjmata I've created a specific issue for it: #84 (comment) |
|
This wasn't merged yet, @ByteBard11 ... working on a different PR for it? |
Apologies @jjmata, I was cleaning up my workspace, this has been restored, and the bottom safe area has been readjusted for issue seen in #149 |
|
Important Review skippedDraft detected. Please check the settings in the CodeRabbit UI or the You can disable this status message by setting the Note Other AI code review bot(s) detectedCodeRabbit has detected other AI code review bot(s) in this pull request and will avoid duplicating their findings in the review comments. This may lead to a less comprehensive review. WalkthroughUpdates safe-area handling and surface styling: adds a Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (5)
app/assets/tailwind/application.css(1 hunks)app/assets/tailwind/maybe-design-system.css(1 hunks)app/components/DS/dialog.html.erb(1 hunks)app/views/layouts/application.html.erb(1 hunks)app/views/layouts/shared/_htmldoc.html.erb(1 hunks)
🧰 Additional context used
📓 Path-based instructions (25)
app/assets/**/*.{css,scss,sass,pcss,png,jpg,jpeg,gif,svg,webp,woff,woff2,ttf,otf}
📄 CodeRabbit inference engine (AGENTS.md)
Store styles and static assets (Tailwind, images, fonts) under app/assets/
Files:
app/assets/tailwind/application.cssapp/assets/tailwind/maybe-design-system.css
app/assets/**/*.{css,scss,sass,pcss}
📄 CodeRabbit inference engine (AGENTS.md)
Let Biome format CSS/SCSS styles (npm run lint/format)
Files:
app/assets/tailwind/application.cssapp/assets/tailwind/maybe-design-system.css
**/*.{html,erb,slim,js,jsx,ts,tsx,css,scss}
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
Always use functional design tokens (e.g., text-primary, bg-container) from the design system; do not use raw colors or ad-hoc classes.
Files:
app/assets/tailwind/application.cssapp/assets/tailwind/maybe-design-system.cssapp/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erbapp/components/DS/dialog.html.erb
**/app/assets/tailwind/*.css
📄 CodeRabbit inference engine (CLAUDE.md)
**/app/assets/tailwind/*.css: NEVER create new styles in design system files without permission.
Use functional tokens (e.g.,text-primary,bg-container) as defined in the design system; do not use hardcoded color classes (e.g.,text-white,bg-white).
Files:
app/assets/tailwind/application.cssapp/assets/tailwind/maybe-design-system.css
**/app/**/*.{rb,erb,js,css}
📄 CodeRabbit inference engine (CLAUDE.md)
Push Rails to its limits before adding new dependencies; a strong technical/business reason is required for new dependencies.
Files:
app/assets/tailwind/application.cssapp/assets/tailwind/maybe-design-system.cssapp/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erbapp/components/DS/dialog.html.erb
app/assets/tailwind/{maybe-design-system.css,application.css}
📄 CodeRabbit inference engine (.cursor/rules/ui-ux-design-guidelines.mdc)
Do not create new styles in app/assets/tailwind/maybe-design-system.css or app/assets/tailwind/application.css without explicit permission
Files:
app/assets/tailwind/application.cssapp/assets/tailwind/maybe-design-system.css
app/assets/tailwind/maybe-design-system.css
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
app/assets/tailwind/maybe-design-system.css: Always reference app/assets/tailwind/maybe-design-system.css for design tokens and primitives; use only defined tokens.
NEVER add new styles to the design system CSS file without permission.
Files:
app/assets/tailwind/maybe-design-system.css
**/app/assets/tailwind/maybe-design-system.css
📄 CodeRabbit inference engine (CLAUDE.md)
Always reference
app/assets/tailwind/maybe-design-system.cssfor primitives and tokens when using Tailwind CSS.
Files:
app/assets/tailwind/maybe-design-system.css
app/views/**/*.erb
📄 CodeRabbit inference engine (AGENTS.md)
app/views/**/*.erb: Keep heavy logic out of ERB views; prefer helpers/components instead
ERB templates are linted by erb-lint per .erb_lint.ymlAlways use the icon helper (icon) for icons; never call lucide_icon directly
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erb
app/views/**/*.html.*
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
app/views/**/*.html.*: Use partials only for simple, context-specific, mostly static HTML content.
Prefer semantic HTML; use Turbo Frames where possible instead of client-side solutions.
Use query params for state, not localStorage or sessionStorage.
Always perform server-side formatting for currencies, numbers, and dates.
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erb
**/app/**/*.erb
📄 CodeRabbit inference engine (CLAUDE.md)
Always use the
iconhelper for icons in templates; never uselucide_icondirectly.
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erbapp/components/DS/dialog.html.erb
**/app/views/**/*.erb
📄 CodeRabbit inference engine (CLAUDE.md)
**/app/views/**/*.erb: Keep domain logic OUT of view templates; logic belongs in component files, not templates.
Use partials only for primarily static, simple HTML with minimal logic, and only when not likely to be reused.
Prefer native HTML over JavaScript components for UI elements (e.g., use<dialog>,<details><summary>).
Leverage Turbo frames for page sections over client-side JavaScript solutions.
Use query params (not localStorage/sessions) for client state management.
Perform server-side formatting for currencies, numbers, and dates in templates.
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erb
**/*.{rb,erb,haml,slim}
📄 CodeRabbit inference engine (.cursor/rules/general-rules.mdc)
**/*.{rb,erb,haml,slim}: UseCurrent.userfor the current user; do not usecurrent_user
UseCurrent.familyfor the current family; do not usecurrent_family
Ignore i18n methods; hardcode strings in English for now (do not useI18n.t,t, or similar)
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erbapp/components/DS/dialog.html.erb
app/views/**/*.html.erb
📄 CodeRabbit inference engine (.cursor/rules/project-conventions.mdc)
app/views/**/*.html.erb: Prefer native HTML elements (e.g., ,) over JS-based components
Leverage Turbo frames to break up pages instead of JS-driven client-side solutions
Prefer native client-side form validation when possible
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erb
app/views/layouts/application.html.erb
📄 CodeRabbit inference engine (.cursor/rules/project-conventions.mdc)
Use Turbo frames in the application layout to load controller actions as demonstrated
Files:
app/views/layouts/application.html.erb
app/views/layouts/**/*.erb
📄 CodeRabbit inference engine (.cursor/rules/project-conventions.mdc)
Be mindful of performance in global layouts (e.g., avoid loading large data payloads)
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erb
app/{models,controllers,views}/**/*.{rb,erb}
📄 CodeRabbit inference engine (.cursor/rules/project-conventions.mdc)
Avoid N+1 queries
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erb
{app/javascript/controllers/**/*.{js,ts},app/views/**/*.erb,app/components/**/*.erb}
📄 CodeRabbit inference engine (.cursor/rules/stimulus_conventions.mdc)
Use declarative Stimulus actions in ERB (data-action) instead of imperative event listeners in controller lifecycle (e.g., avoid addEventListener in connect); controllers should just respond to actions
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erbapp/components/DS/dialog.html.erb
{app/components/**/*.{js,ts,erb},app/views/**/*.erb}
📄 CodeRabbit inference engine (.cursor/rules/stimulus_conventions.mdc)
Component-scoped Stimulus controllers in app/components must be used only within their component views, not in app/views
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erbapp/components/DS/dialog.html.erb
{app/views/**,app/helpers/**,app/javascript/controllers/**}
📄 CodeRabbit inference engine (.cursor/rules/ui-ux-design-guidelines.mdc)
{app/views/**,app/helpers/**,app/javascript/controllers/**}: Style UI using TailwindCSS v4.x with the custom design system defined in app/assets/tailwind/maybe-design-system.css
Always start by referencing app/assets/tailwind/maybe-design-system.css to understand available primitives, functional tokens, and component tokens before styling
Prefer functional tokens from the design system over raw Tailwind values (e.g., use text-primary, bg-container, border border-primary instead of text-white, bg-white, border-gray-200)
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erb
{app/views/**,app/helpers/**}
📄 CodeRabbit inference engine (.cursor/rules/ui-ux-design-guidelines.mdc)
Always generate semantic HTML
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erb
{app/views,app/components}/**/*.html.erb
📄 CodeRabbit inference engine (.cursor/rules/view_conventions.mdc)
{app/views,app/components}/**/*.html.erb: Keep domain logic out of ERB templates; compute values in component/controller code and reference them in the template
Integrate Stimulus declaratively in ERB: templates declare data-controller/data-action; controllers respond to those declarations
Pass data from Rails to Stimulus via data-*-value attributes, not inline JavaScript
Files:
app/views/layouts/application.html.erbapp/views/layouts/shared/_htmldoc.html.erbapp/components/DS/dialog.html.erb
app/views/**/_*.html.erb
📄 CodeRabbit inference engine (.cursor/rules/view_conventions.mdc)
Name partials with a leading underscore (e.g., _trend_change.html.erb, _form_errors.html.erb)
Files:
app/views/layouts/shared/_htmldoc.html.erb
app/components/**/*
📄 CodeRabbit inference engine (.github/copilot-instructions.md)
app/components/**/*: Prefer ViewComponents for reusable or complex UI components; keep domain logic out of view templates.
Logic belongs in component files, not in component template (*.html.erb, *.html.slim) files.
Files:
app/components/DS/dialog.html.erb
**/app/components/**/*
📄 CodeRabbit inference engine (CLAUDE.md)
**/app/components/**/*: Component logic should live in component files; keep domain logic out of view templates.
Prefer components over partials when available.
Files:
app/components/DS/dialog.html.erb
🧠 Learnings (10)
📚 Learning: 2025-09-20T08:37:48.022Z
Learnt from: CR
PR: we-promise/sure#0
File: .github/copilot-instructions.md:0-0
Timestamp: 2025-09-20T08:37:48.022Z
Learning: Applies to app/assets/tailwind/maybe-design-system.css : Always reference app/assets/tailwind/maybe-design-system.css for design tokens and primitives; use only defined tokens.
Applied to files:
app/assets/tailwind/maybe-design-system.css
📚 Learning: 2025-09-20T08:42:15.420Z
Learnt from: CR
PR: we-promise/sure#0
File: CLAUDE.md:0-0
Timestamp: 2025-09-20T08:42:15.420Z
Learning: Applies to **/app/assets/tailwind/maybe-design-system.css : Always reference `app/assets/tailwind/maybe-design-system.css` for primitives and tokens when using Tailwind CSS.
Applied to files:
app/assets/tailwind/maybe-design-system.css
📚 Learning: 2025-09-23T22:23:17.441Z
Learnt from: CR
PR: we-promise/sure#0
File: .cursor/rules/ui-ux-design-guidelines.mdc:0-0
Timestamp: 2025-09-23T22:23:17.441Z
Learning: Applies to {app/views/**,app/helpers/**,app/javascript/controllers/**} : Style UI using TailwindCSS v4.x with the custom design system defined in app/assets/tailwind/maybe-design-system.css
Applied to files:
app/assets/tailwind/maybe-design-system.css
📚 Learning: 2025-09-20T08:37:48.022Z
Learnt from: CR
PR: we-promise/sure#0
File: .github/copilot-instructions.md:0-0
Timestamp: 2025-09-20T08:37:48.022Z
Learning: Applies to app/assets/tailwind/maybe-design-system.css : NEVER add new styles to the design system CSS file without permission.
Applied to files:
app/assets/tailwind/maybe-design-system.css
📚 Learning: 2025-09-23T22:23:17.441Z
Learnt from: CR
PR: we-promise/sure#0
File: .cursor/rules/ui-ux-design-guidelines.mdc:0-0
Timestamp: 2025-09-23T22:23:17.441Z
Learning: Applies to app/assets/tailwind/{maybe-design-system.css,application.css} : Do not create new styles in app/assets/tailwind/maybe-design-system.css or app/assets/tailwind/application.css without explicit permission
Applied to files:
app/assets/tailwind/maybe-design-system.css
📚 Learning: 2025-09-20T08:42:15.420Z
Learnt from: CR
PR: we-promise/sure#0
File: CLAUDE.md:0-0
Timestamp: 2025-09-20T08:42:15.420Z
Learning: Applies to **/app/assets/tailwind/*.css : NEVER create new styles in design system files without permission.
Applied to files:
app/assets/tailwind/maybe-design-system.css
📚 Learning: 2025-09-20T08:42:15.420Z
Learnt from: CR
PR: we-promise/sure#0
File: CLAUDE.md:0-0
Timestamp: 2025-09-20T08:42:15.420Z
Learning: Applies to **/app/assets/tailwind/*.css : Use functional tokens (e.g., `text-primary`, `bg-container`) as defined in the design system; do not use hardcoded color classes (e.g., `text-white`, `bg-white`).
Applied to files:
app/assets/tailwind/maybe-design-system.css
📚 Learning: 2025-09-23T22:23:17.441Z
Learnt from: CR
PR: we-promise/sure#0
File: .cursor/rules/ui-ux-design-guidelines.mdc:0-0
Timestamp: 2025-09-23T22:23:17.441Z
Learning: Applies to {app/views/**,app/helpers/**,app/javascript/controllers/**} : Always start by referencing app/assets/tailwind/maybe-design-system.css to understand available primitives, functional tokens, and component tokens before styling
Applied to files:
app/assets/tailwind/maybe-design-system.css
📚 Learning: 2025-09-23T22:21:06.637Z
Learnt from: CR
PR: we-promise/sure#0
File: .cursor/rules/project-conventions.mdc:0-0
Timestamp: 2025-09-23T22:21:06.637Z
Learning: Applies to app/views/**/*.html.erb : Prefer native HTML elements (e.g., <dialog>, <details><summary>) over JS-based components
Applied to files:
app/assets/tailwind/maybe-design-system.cssapp/components/DS/dialog.html.erb
📚 Learning: 2025-09-20T08:42:15.420Z
Learnt from: CR
PR: we-promise/sure#0
File: CLAUDE.md:0-0
Timestamp: 2025-09-20T08:42:15.420Z
Learning: Applies to **/app/views/**/*.erb : Prefer native HTML over JavaScript components for UI elements (e.g., use `<dialog>`, `<details><summary>`).
Applied to files:
app/components/DS/dialog.html.erb
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: ci / test
- GitHub Check: ci / test
🔇 Additional comments (4)
app/components/DS/dialog.html.erb (1)
2-2: LGTM: Safe-area padding added to dialog.The addition of
pt-[env(safe-area-inset-top)]andpb-[env(safe-area-inset-bottom)]ensures the dialog content respects iOS safe areas, preventing content from being clipped by the notch or home indicator. This aligns with the per-component safe-area handling strategy.app/views/layouts/application.html.erb (1)
159-159: Verify mobile nav touch targets remain accessible above home indicator.The removal of
pb-[env(safe-area-inset-bottom)]from the mobile bottom navigation was previously flagged as potentially causing nav items to be obscured by the iOS home indicator. While you've provided screenshot evidence that it works, please confirm that all touch targets remain fully accessible and not overlapped by the home indicator, especially on devices with larger safe-area-insets.app/assets/tailwind/maybe-design-system.css (1)
270-270: Verify background rendering in top safe-area across browsers.The change from
padding-toptomargin-topforenv(safe-area-inset-top)was previously flagged as potentially causing visual regressions in dark mode. While you've indicated that addingbg-surfaceto the body element resolves this, the fix relies on browser behavior that propagates the body's background to the viewport canvas.Please verify across multiple scenarios:
- iOS Safari and Chrome
- Light and dark modes
- Various safe-area-inset sizes (different device models)
Confirm that no unthemed "dead space" appears in the top safe-area under any combination.
app/views/layouts/shared/_htmldoc.html.erb (1)
16-16: LGTM: Proper use of design system token.The addition of
bg-surfaceto the body element correctly uses a functional token from the design system. This ensures the body has the appropriate themed background color.As per coding guidelines.
|
@ByteBard11 I'm doing some tests, but I still have some weird behaviours in PWA mode on iOS 26.0.1. 
It seems like the outer element (maybe Do you experience the same behaviour on your device? I can try to investigate a bit to see if I can fix it. |
Hi alessiocappa, I don't have this issue. I can't scroll the page with the bottom bar if the app is added to your home page. I can scroll down in safari like you describe, but that's not in PWA mode. |
Thanks for the feedback, in my case I can reproduce the issue on both Safari and in PWA mode. I tried to look into it a bit, and I believe the issue is related to how the overflow is managed; since the I believe the best would be to apply a fixed position to the sidebar when in desktop mode, and let the whole html/body scroll. The sidebar is hidden on mobile, so it should not be a problem. I partially managed to test it but I haven’t finished yet, I can try to work on it in the next few days and share the results to see how it works on different devices. |
…#2391 maybe-finance#2391 With updated _notice tab safety area. Further fix: adjust padding to margin for safe area insets across notify compents Fix profiler location Good DRY fix from gemini Restore bottom safe area. Should be small adjust to allow for device return bar, etc.
Thanks @alessiocappa, I can't seem to replicate your issue at all - not even in Safari either anymore. Scrolling on the navbar doesn't have any effect for me. Are you able to send me a screen recording when you get a chance? I've synced/rebased this branch if you would like to repull to help with your fixes if required. |
Here's the recording, it's from the PWA mode: ScreenRecording_10-03-2025.20-15-07_1.MP4I'll try to move forward with my testing and see if I can fix it. Is it fine if I push my changes to your branch? Or is it better if I do it in a different PR? |
|
I think I found a way to solve the issue. Additionally, I also removed the scrollbar on mobile, to make it feeling more like a native app, and I've adjusted some paddings that were different between pages and way too big on mobile. I don't know how to update the PR, so I put the changes here since they are quite easy: diff --git a/app/assets/tailwind/maybe-design-system.css b/app/assets/tailwind/maybe-design-system.css
index e8fb9488..3419c77f 100644
--- a/app/assets/tailwind/maybe-design-system.css
+++ b/app/assets/tailwind/maybe-design-system.css
@@ -266,11 +266,6 @@
--shadow-xl: 0px 20px 24px -4px --alpha(var(--color-white) / 8%);
}
- html {
- margin-top: env(safe-area-inset-top);
- padding-bottom: env(safe-area-inset-bottom);
- }
-
button {
@apply cursor-pointer focus-visible:outline-gray-900;
}
@@ -444,4 +439,11 @@
fill: var(--color-white);
}
}
+
+ @media (hover: none) {
+ ::-webkit-scrollbar {
+ display: none;
+ }
+ }
+
}
\ No newline at end of file
diff --git a/app/views/budgets/show.html.erb b/app/views/budgets/show.html.erb
index de47b27c..11c417d2 100644
--- a/app/views/budgets/show.html.erb
+++ b/app/views/budgets/show.html.erb
@@ -1,4 +1,4 @@
-<div class="pb-12">
+<div class="lg:pb-12">
<%= render "budgets/budget_header",
budget: @budget,
previous_budget: @previous_budget,
diff --git a/app/views/layouts/shared/_htmldoc.html.erb b/app/views/layouts/shared/_htmldoc.html.erb
index d1d7dd9e..b6d79709 100644
--- a/app/views/layouts/shared/_htmldoc.html.erb
+++ b/app/views/layouts/shared/_htmldoc.html.erb
@@ -7,38 +7,40 @@
data-theme="<%= theme %>"
data-controller="theme"
data-theme-user-preference-value="<%= Current.user&.theme || "system" %>"
- class="h-full text-primary overflow-hidden lg:overflow-auto font-sans <%= @os %>">
+ class="h-screen text-primary overflow-hidden lg:overflow-auto font-sans <%= @os %>">
<head>
<%= render "layouts/shared/head" %>
<%= yield :head %>
</head>
<body class="h-full bg-surface overflow-hidden lg:overflow-auto antialiased">
- <% if Rails.env.development? %>
- <button hidden data-controller="hotkey" data-hotkey="t t /" data-action="theme#toggle"></button>
- <% end %>
+ <div class="fixed inset-0 lg:relative h-full pt-[env(safe-area-inset-top)] pb-[env(safe-area-inset-bottom)]">
+ <% if Rails.env.development? %>
+ <button hidden data-controller="hotkey" data-hotkey="t t /" data-action="theme#toggle"></button>
+ <% end %>
- <div class="fixed z-50 top-6 md:top-4 left-1/2 -translate-x-1/2 w-full md:w-80 px-4 md:px-0 mx-auto md:mx-0 md:right-auto mt-safe">
- <div id="notification-tray" class="space-y-1 w-full">
- <%= render_flash_notifications %>
+ <div class="fixed z-50 top-6 md:top-4 left-1/2 -translate-x-1/2 w-full md:w-80 px-4 md:px-0 mx-auto md:mx-0 md:right-auto mt-safe">
+ <div id="notification-tray" class="space-y-1 w-full">
+ <%= render_flash_notifications %>
- <div id="cta"></div>
+ <div id="cta"></div>
+ </div>
</div>
- </div>
- <% if Current.family %>
- <%= turbo_stream_from Current.family %>
- <% end %>
+ <% if Current.family %>
+ <%= turbo_stream_from Current.family %>
+ <% end %>
- <%= turbo_frame_tag "modal" %>
- <%= turbo_frame_tag "drawer" %>
+ <%= turbo_frame_tag "modal" %>
+ <%= turbo_frame_tag "drawer" %>
- <%# Custom overrides for browser's confirm API %>
- <%= render "layouts/shared/confirm_dialog" %>
+ <%# Custom overrides for browser's confirm API %>
+ <%= render "layouts/shared/confirm_dialog" %>
- <%= render "impersonation_sessions/super_admin_bar" if Current.true_user&.super_admin? && show_super_admin_bar? %>
- <%= render "impersonation_sessions/approval_bar" if Current.true_user&.impersonated_support_sessions&.initiated&.any? %>
+ <%= render "impersonation_sessions/super_admin_bar" if Current.true_user&.super_admin? && show_super_admin_bar? %>
+ <%= render "impersonation_sessions/approval_bar" if Current.true_user&.impersonated_support_sessions&.initiated&.any? %>
- <%= yield %>
+ <%= yield %>
+ </div>
</body>
</html>
diff --git a/app/views/pages/dashboard.html.erb b/app/views/pages/dashboard.html.erb
index 4e06b270..3820f063 100644
--- a/app/views/pages/dashboard.html.erb
+++ b/app/views/pages/dashboard.html.erb
@@ -23,7 +23,7 @@
</div>
<% end %>
-<div class="w-full space-y-6 pb-24">
+<div class="w-full space-y-6 lg:pb-12">
<% if Current.family.accounts.any? %>
<%= turbo_frame_tag "cashflow_sankey_section" do %>
<section class="bg-container py-4 rounded-xl shadow-border-xs mb-6">
diff --git a/app/views/transactions/index.html.erb b/app/views/transactions/index.html.erb
index 8fa5860c..9f3406ce 100644
--- a/app/views/transactions/index.html.erb
+++ b/app/views/transactions/index.html.erb
@@ -1,4 +1,4 @@
-<div class="space-y-4 pb-20 flex flex-col">
+<div class="space-y-6 lg:pb-12 flex flex-col">
<header class="flex justify-between items-center text-primary font-medium">
<h1 class="text-xl">Transactions</h1>
<div class="flex items-center gap-5">
Let me know if you can test it and if you have any feedback/comment to share |
Signed-off-by: Juan José Mata <[email protected]>
Bumps [rack](https://github.com/rack/rack) from 3.1.16 to 3.1.18. - [Release notes](https://github.com/rack/rack/releases) - [Changelog](https://github.com/rack/rack/blob/main/CHANGELOG.md) - [Commits](rack/rack@v3.1.16...v3.1.18) --- updated-dependencies: - dependency-name: rack dependency-version: 3.1.18 dependency-type: indirect ... Signed-off-by: dependabot[bot] <[email protected]> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
* Add comprehensive Hetzner Cloud deployment guide * Fix markdown linting issues and backup retention policy - Add missing language identifiers to fenced code blocks (bash) - Fix inconsistent backup retention policy (standardize to 7 days) - Address CodeRabbit review feedback for PR we-promise#211
* Changing trades.price to have a larger scale - a scale of 4 causes destructive rounding when calculating transaction cost; changes to the UI to allow for inputting and showing increased scale trade prices; test case
* Implement support for generic OpenAI api - Implements support to route requests to any openAI capable provider ( Deepsek, Qwen, VLLM, LM Studio, Ollama ). - Keeps support for pure OpenAI and uses the new better responses api - Uses the /chat/completions api for the generic providers - If uri_base is not set, uses default implementation. * Fix json handling and indentation * Fix linter error indent * Fix tests to set env vars * Fix updating settings * Change to prefix checking for OAI models * FIX check model if custom uri is set * Change chat to sync calls Some local models don't support streaming. Revert to sync calls for generic OAI api * Fix tests * Fix tests * Fix for gpt5 message extraction - Finds the message output by filtering for "type" == "message" instead of assuming it's at index 0 - Safely extracts the text using safe navigation operators (&.) - Raises a clear error if no message content is found - Parses the JSON as before * Add more langfuse logging - Add Langfuse to auto categorizer and merchant detector - Fix monitoring on streaming chat responses - Add Langfuse traces also for model errors now * Update app/models/provider/openai.rb Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Signed-off-by: soky srm <[email protected]> * handle nil function results explicitly * Exposing some config vars. * Linter and nitpick comments * Drop back to `gpt-4.1` as default for now * Linter * Fix for strict tool schema in Gemini - This fixes tool calling in Gemini OpenAI api - Fix for getTransactions function, page size is not used. --------- Signed-off-by: soky srm <[email protected]> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Co-authored-by: Juan José Mata <[email protected]>
- Also implement an is empty/is null condition.
* Remove orphan function * Add centralized branding helpers and update locales * Remove _plus and add (proper) brand * No longer Sure, configurable * Consistency with compose file naming * Missed `product_name` mapping * Fix brand/product name in mailers * Product name in email reset flow * Fix i18n errors/tests * Fix password mailer brand/product name (again) * Missed hardcoded `Sure` in onboarding goals Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Signed-off-by: Juan José Mata <[email protected]> * PR nitpick on documentation * Missing interpolation key for invited UI * Orphan assets * New logos --------- Signed-off-by: Juan José Mata <[email protected]> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
…vements (we-promise#104) * Remove skipped account functionality from SimpleFin - Remove "Skip - don't add" option from account setup - Simplify account setup flow to require all accounts be assigned types - Update controller logic to handle all accounts without skipping - Redirect to accounts page instead of SimpleFin items page - Add I18N message support with t(".success") * Simplify SimpleFin sync logic by removing skipped accounts - Remove skipped account filtering from syncer - All unlinked accounts now block sync until setup is complete - Remove skipped account UI elements from setup view - Streamline sync flow without complex skipped/non-skipped logic * Fix cash balance calculation for SimpleFin investment accounts - Update SimplefinAccount::Processor to recalculate balances during sync - Properly calculate cash_balance for investment accounts using BalanceCalculator - Handle negative balances for credit cards and loans correctly - Ensure account balance and cash balance are updated from latest SimpleFin data * Add I18N translations and edit view for SimpleFin - Add comprehensive English translations for SimpleFin UI - Create edit view for SimpleFin re-authentication - Support status messages, errors, and user feedback - Match translation structure with Plaid integration * Add specialized SimpleFin data processors - Add investment processors for transactions, holdings, and balance calculation - Add liability processors for credit cards and loans - Add transaction processor for standard account transactions - Add account importer for SimpleFin account data - Organize processors by account type for maintainable architecture * Add loading button controller for SimpleFin forms - Add Stimulus controller to show loading state during form submission - Disable button and show loading text to prevent double submissions - Improve user experience during SimpleFin account setup * Add SimpleFin edit and update routes - Add edit and update actions to SimpleFin items routes - Enable re-authentication flow for expired SimpleFin connections - Match route structure with Plaid items for consistency * Add institution metadata fields to SimpleFin items - Add institution_id, institution_name, institution_domain fields - Add institution_url, institution_color for UI customization - Add raw_institution_payload for complete institution data storage - Enable better institution organization and display * Enhance SimpleFin item with institution support and metadata - Add institution summary and connected institutions methods - Store and retrieve institution metadata from SimpleFin API - Add institution-aware import functionality - Support multiple institutions per SimpleFin connection * Fix account creation and Plaid provider issues - Fix cash balance calculation in Account.create_from_simplefin_account - Add nil check for plaid_provider in remove_plaid_item method - Ensure proper balance handling for investment accounts during creation * Improve sync parent relationship handling - Add parent sync assignment for existing syncs when parent_sync is provided - Ensure sync hierarchy is maintained when expanding sync windows - Fix sync relationship consistency in nested sync operations * Update SimpleFin item view with enhanced UI - Improve SimpleFin connection display and status information - Add better visual styling and user feedback - Match UI consistency with Plaid item views * Update database schema with institution fields - Add institution metadata fields to simplefin_items table - Support institution tracking and organization features * Update SimpleFin tests for new functionality - Update controller tests for edit/update actions and removed skip functionality - Update model tests for institution metadata and enhanced features - Ensure test coverage for SimpleFin improvements * Add migration to remove old institution fields * Fix linting issues * Apply suggestion from @coderabbitai[bot] Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Signed-off-by: Himmelschmidt <[email protected]> * Fix 2 failing tests * Wrap SimpleFin account transfer in database transaction * Make loading button controller more reusable - Add loadingText Stimulus value for configurable loading text - Remove unused originalText variable - Update view to pass loading text via data attribute * Remove unused SimplefinAccount::Importer class This class was added in the PR but is never called anywhere in the codebase. The actual SimpleFin account processing is handled by SimplefinAccount::Processor and its specialized sub-processors. * Fix SimpleFin account transfer bug during token updates - Call import_latest_simplefin_data before account transfer to ensure new SimpleFin accounts exist with account_id populated - Prevents silent failure where accounts become orphaned when refreshing expired SimpleFin tokens * Fix SimpleFin error handling to render correct template and use i18n - Update render_error method to accept context parameter for template selection - Fix update action to render :edit template instead of :new on errors - Replace hardcoded error messages with localized strings using t() calls - Add comprehensive error message keys to SimpleFin locale file * Improve loading button accessibility and HTML semantics - Add aria-disabled and aria-busy attributes for screen readers - Use semantic span elements instead of divs for button content - Add aria-hidden to decorative spinner element * Fix SimpleFin SSL verification to use OpenSSL constant * Remove HTTParty streaming to prevent empty response body and PII logging * Use BigDecimal zero for consistent numeric types in balance calculator * Add investment account guard to holdings processor * Remove duplicate balance normalization from SimpleFin loan processor * Fix critical account deletion bug in SimpleFin token update * Fix linting issues in SimpleFin controller tests * Replace hardcoded colors with design system tokens in SimpleFin views * Gate investment processors to Investment accounts only Prevents investment processors from running on non-Investment account types, matching the pattern used by liability processors. * Localize hardcoded strings in SimpleFin edit form * Adding the error message to a hover state. * Use only 1 month for sync_start_date, new account restriction? * Harden investment cash_balance calculation with error handling - Add try/catch around SimplefinAccount::Investments::BalanceCalculator - Fallback to zero on calculation errors or nil results - Log warning with error details for debugging - Prevents nil cash_balance that could cause downstream issues * Fix SimpleFin institution fields migration and add DB constraints - Remove destructive migration that dropped existing institution fields - Add only new fields (institution_domain, institution_color) - Add indexes on institution fields for query performance - Add NOT NULL constraints on required fields (institution_id, institution_name) - Fix schema jsonb consistency for raw_institution_payload * Improve SimpleFin holdings error handling and BigDecimal consistency * Add security attribute to external link in SimpleFin edit form * Improve SimpleFin sync timing and add user-configurable date range - Fix initial sync timing issue: change from 1 month to 7 days default lookback - Add user-selectable sync start date in account setup UI - Implement chunked historical sync that respects user-selected date range - Add sync_start_date field to SimpleFin items - Handle new accounts on existing connections with same date picker This addresses SimpleFin API limitations and gives users control over how much transaction history to sync during initial setup. * Fix SimpleFin sync status to show detailed results instead of "Never synced" - Modify sync completion logic to always complete even with unlinked accounts - Add sync_stats column to track account sync statistics during sync process - Update sync status display to show "X synced, Y need setup" instead of "Never synced" - Store detailed sync statistics (total, linked, unlinked accounts) in sync record - Add sync_status_summary method to provide meaningful status text - Remove early return that prevented sync completion when accounts need setup Resolves issue where successful account syncing still showed "Never synced" status. * Fix Transaction persistence before Entry creation in SimpleFin processor Persist Transaction with create! instead of new to ensure it has an ID before creating Entry that references it as entryable. Prevents foreign key errors. * Fix indifferent access for SimpleFin institution data extraction The accounts_snapshot parameter comes from JSON with string keys, but the code was accessing with symbol keys which could silently fail. Convert to indifferent access to handle both string and symbol keys properly. * Localize hardcoded deletion in progress string Replace hardcoded "(deletion in progress...)" text with I18n translation to maintain consistency with the rest of the view. * Fix SimpleFin item update test to properly verify rebind/destroy behavior The test now creates a different SimplefinItem instance and mocks create_simplefin_item! to return it, ensuring the controller operates on a new record instead of the same instance. This properly exercises the rebind/destroy logic and verifies the original item is scheduled for deletion. * Fix potential transaction data loss in SimpleFin importer Prevent wiping stored transactions when API omits transaction data by only updating raw_transactions_payload when transactions are actually present in the response, preserving existing transaction data when API doesn't include transactions key. * Fix SimpleFin sync chunking and enforce 3-year historical limit - Fix SimpleFin's actual API limit from 365 days to 60 days per request - Implement proper backward-walking chunked sync for historical data - Enforce 3-year maximum historical data limit (60 days × 22 requests) - Update date picker to reflect 3-year limit and better defaults - Add comprehensive logging for debugging sync issues * Add dedicated raw_holdings_payload storage for SimpleFin accounts - Add raw_holdings_payload column to simplefin_accounts table - Separates holdings data from general account data for cleaner processing - Follows same pattern as raw_transactions_payload for consistency - Enables proper SimpleFin holdings processing pipeline * Enhance SimpleFin holdings storage with external ID tracking - Add external_id and cost_basis columns to holdings table - Update holdings processor to use external_id for precise matching - Capture all available SimpleFin holdings data (shares, market_value, cost_basis, etc.) - Use SimpleFin holding ID as external_id with "simplefin_" prefix - Calculate price from market_value/shares when available - Store raw holdings payload in simplefin_accounts for complete data retention This enables better holdings tracking than composite key approach and ensures we capture all SimpleFin data even if not immediately used in our models. * Simplify SimpleFin transaction enrichment - Add MerchantDetector that uses payee field directly for merchant creation - Enhance SimpleFin entry name generation combining payee + description - Remove transaction processor category matching logic - Create dedicated SimpleFin entry processor Uses SimpleFin's clean payee data without unnecessary filtering. * Add source field to ProviderMerchant and fix data enrichment - Add source field to ProviderMerchant model for provider-specific merchant tracking - Fix DataEnrichment to handle string transaction IDs correctly with to_i conversion Enables per-provider merchant deduplication and fixes transaction lookups. * Fix SimpleFin controller parameter handling - Convert string account_ids to integers for proper account lookup - Ensure account selection works correctly with form submissions Fixes account filtering when setting up SimpleFin sync. * Fix linting issues - auto-corrected whitespace and formatting * Derive institution domain from URL when missing in SimpleFin items * Fix render_error to preserve persisted record for edit context * Add unique index to prevent duplicate holdings * Fix potential NameError in holdings processor rescue block * Guard against missing SimpleFin transaction IDs * Fix SimpleFin amount parsing error handling Re-raise ArgumentError instead of silently returning BigDecimal("0") to prevent misleading $0 transactions from invalid amount data. * Fix SimpleFin chunked import data loss bug Merge transaction arrays instead of overwriting to prevent data loss during chunked imports. Preserve most recent holdings data only. * Add external_id uniqueness validation to Holding model * Fix holdings cost_basis precision and add external_id unique constraint * Fix SimpleFin test mock expectations and remove debug statements - Fixed SimplefinItemsControllerTest by properly mocking Provider::Simplefin instead of over-mocking the create_simplefin_item! method - Removed DEBUG puts statements from SimplefinItem::Importer * Fix linting issues - auto-corrected whitespace and formatting --------- Signed-off-by: Himmelschmidt <[email protected]> Signed-off-by: Juan José Mata <[email protected]> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Co-authored-by: Juan José Mata <[email protected]>
* Test disabling AI assistant * Leave "Maybe" out of it * It's "sure" now
Signed-off-by: Juan José Mata <[email protected]>
* Password reset back button also after confirmation Signed-off-by: Juan José Mata <[email protected]> * Implement a filter for category (we-promise#215) - Also implement an is empty/is null condition. * Implement an LLM cost estimation page Track costs across all the cost categories: auto categorization, auto merchant detection and chat. Show warning with estimated cost when running a rule that contains AI. * Update pricing * Add google pricing and fix inferred model everywhere. * Update app/models/llm_usage.rb Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Signed-off-by: soky srm <[email protected]> * FIX address review * Linter * Address review - Lowered log level - extracted the duplicated record_usage method into a shared concern * Update app/controllers/settings/llm_usages_controller.rb Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com> Signed-off-by: soky srm <[email protected]> * Moved attr_reader out of private --------- Signed-off-by: Juan José Mata <[email protected]> Signed-off-by: soky srm <[email protected]> Co-authored-by: Juan José Mata <[email protected]> Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
Signed-off-by: Juan José Mata <[email protected]>
…dd comprehensive AI documentation (we-promise#225) * Add comprehensive AI/LLM configuration documentation * Fix Chat.start! to use default model when model is nil or empty * Ensure all controllers use Chat.default_model for consistency * Move AI doc inside `hosting/` * Probably too much error handling --------- Co-authored-by: copilot-swe-agent[bot] <[email protected]> Co-authored-by: jjmata <[email protected]> Co-authored-by: Juan José Mata <[email protected]>
…own" (we-promise#224) * Add tests and fix for Twelve Data API parsing errors * Fix search_securities to handle nil data key --------- Co-authored-by: copilot-swe-agent[bot] <[email protected]> Co-authored-by: jjmata <[email protected]> Co-authored-by: Juan José Mata <[email protected]>
* Add OpenID Connect login support * Add docs for OIDC config with Google Auth * Use Google styles for log in - Add support for linking existing account - Force users to sign-in with passoword first, when linking existing accounts - Add support to create new user when using OIDC - Add identities to user to prevent account take-ver - Make tests mocking instead of being integration tests - Manage session handling correctly - use OmniAuth.config.mock_auth instead of passing auth data via request env * Conditionally render Oauth button - Set a config item `configuration.x.auth.oidc_enabled` - Hide button if disabled --------- Signed-off-by: Juan José Mata <[email protected]> Signed-off-by: soky srm <[email protected]> Co-authored-by: sokie <[email protected]>
Signed-off-by: Juan José Mata <[email protected]>
…romise#228) * Add Railway deployment button to README Signed-off-by: Marc <[email protected]>
Signed-off-by: Juan José Mata <[email protected]>
* Category improvements - Updated default categories to a more inclusive set - Updated default icon set for categories - Updated default categories colors to better separate then. * FIX tests * Better color pallettes for a few
Remove rounding from transactions.
Signed-off-by: ByteBard <[email protected]>
…-finance#2391" This reverts commit f9b0bab.
|
Moved to #237 |
10 participants
Copy of: fix(ui): iOS PWA should take full screen height (maybe-finance#2391, original repo),
with minor updates to handle notification banners & profiler fitting with safe areas.
Changes:
Fixes:
Excessive bottom/top padding on iOS 26 (#68)
Tested on iOS 26 16PM
Summary by CodeRabbit