Display errors that occur while loading the web app.

[nilsreichardt]

I have an open support ticket where the web is just stuck at the loading screen. Hopefully, this will show the error message and help to resolve the issue.

[gemini-code-assist]

Summary of Changes

Hello @nilsreichardt, I'm Gemini Code Assist¹! 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 enhances the web application's resilience and user experience by implementing a dedicated error display mechanism. It ensures that users are immediately informed of any issues preventing the app from loading correctly, providing clear instructions and contact information, thereby reducing user frustration and aiding in debugging.

Highlights

• Error Display UI: Introduced a new, styled container to prominently display errors that occur during web app loading.
• Robust Error Catching: Implemented JavaScript to capture both synchronous (window.onerror) and asynchronous (window.onunhandledrejection) errors, ensuring comprehensive error reporting.
• User Guidance: The error display includes a message advising users to reload the page and provides a support email address for persistent issues.

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 by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

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 pull request 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. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

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

1. 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. ↩

[gemini-code-assist]

Code Review

This pull request introduces a mechanism to display errors that occur during the web app's loading phase. It adds a new error container in index.html, styles it with index.css, and includes JavaScript to catch unhandled errors and promise rejections, displaying them to the user. My review focuses on improving the JavaScript implementation for better performance, consistency, and readability.

[github-actions]

Visit the preview URL for this PR (updated for commit 60aeeb4):

https://sharezone-test--pr1973-display-web-error-95lhijca.web.app

_{(expires Wed, 12 Nov 2025 05:45:52 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: 4cb3ae61e1e018abfd9841fd3239f5b49ccc034b}

[nilsreichardt]

Most of @gemini-code-assist seem legit. Will apply them in the next days.

[gemini-code-assist]

That's great to hear, @nilsreichardt! I'm glad the suggestions were helpful. Please let me know if you have any questions as you work through them, or if there's anything else I can assist with.

[Jonas-Sander]

Warum nicht auf Deutsch?

[nilsreichardt]

I assume we will not support multiple languages in our app/web/index.html (outside the Flutter world) and already defaulting there for English.

[Jonas-Sander]

I don't understand what you want to say with your comment.

Our app is in German so why shouldn't we use German there as well? If we have errors for persons who legitimately want to use our app, then they are probably German speaking and we should be sure that they understand the error message. If they are not German speaking they are not the target group for our app anyways right now.

[nilsreichardt]

Since we're going to add more language (#1973) and I didn't plan to add multilingual support, I wanted directly default to English.

However, with f990777 I added very simple multilingual support with supports English & German now. In case we need more translation in our index.html, we can extract the translation to translations.js or something more professional.

[nilsreichardt]

@codex Please review.

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[nilsreichardt]

todo:

Screen.Recording.2025-12-01.at.15.30.41.mov

[nilsreichardt]

this has more side effects (every time our web app throws an unhandled exception, the overlay will be shown) than I thought. Converting this PR to draft for now.