## What kind of change does this PR introduce?
UI improvement
## What is the current behavior?
The session expired dialog is quite hard to parse when, for most people,
the ask is simple.
## What is the new behavior?
Improved session expired dialog:
- Refactored to use AlertDialog
- Clarified copywriting
- Uses the new AlertCollapsible to hide all the complicated debugging
steps under a toggle
- This component is documented in the design-system
| Before | After |
| --- | --- |
| <img width="1024" height="563"
alt="Supabase-B1728A05-DDD2-4A50-AED4-D62EAA2E7D7C"
src="https://github.com/user-attachments/assets/771f85d8-21ea-42b5-99f5-b9b05f5617dd"
/> | <img width="1024" height="563" alt="Storage Supabase"
src="https://github.com/user-attachments/assets/b2fcab68-fb29-4cb9-bd42-aecc57b9fa32"
/> |
| <img width="1024" height="563"
alt="Supabase-B1728A05-DDD2-4A50-AED4-D62EAA2E7D7C"
src="https://github.com/user-attachments/assets/771f85d8-21ea-42b5-99f5-b9b05f5617dd"
/> | <img width="1024" height="563" alt="Storage Supabase"
src="https://github.com/user-attachments/assets/babd3711-5fdf-43b9-be06-d96268a191fd"
/> |
## To test
In apps/studio/hooks/misc/withAuth.tsx:
```diff
- const [isSessionTimeoutModalOpen, setIsSessionTimeoutModalOpen] = useState(false)
+ const [isSessionTimeoutModalOpen, setIsSessionTimeoutModalOpen] = useState(true) // Mocked as true for UI testing
```
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* fix(feedback): generate image urls on backend
* Fix support form skip generate attachment urls if no attachments
* Refactor to use useLocalStorageQuery
* Nit
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* fix(support form): api route to create attachment urls
* clean: remove console log
* fix staging and prod
* Minor clean up
* Shift generation of urls to data folder
* refactor
* Final
* Fix tests
* Nit
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
* refactor: refactor support form
Refactor support form to make it easier to maintain:
- Split up large components into smaller components and hooks
- Lift state up so we don't have to do complex child/parent
state-syncing via useEffect
- Use nuqs parsing for consistent serialization/deserialization of
support form prefilled fields
* test: support form
Add comprehensive tests for support form
* fix(support form): project and org empty state
* Nit clean up
* More clean up
* cleannnn
* fix(support form): allow case-insensitive category in url
* clean(support form tests): remove unused param
* fix(support form): incorrect logic for sending affected services in payload
* clean(support form): use NO_ORG_MARKER and NO_PROJECT_MARKER instead of strings
* fix(support form): don't show upgrade cta if already on enterprise
---------
Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
