mirror of
https://github.com/supabase/supabase.git
synced 2026-10-05 17:35:10 +03:00
Danny WhiteandJoshen Lim
ee484c8517
## What kind of change does this PR introduce? UI improvement for self-debugging efforts. ## What is the current behavior? https://github.com/supabase/supabase/pull/40937 removed our gating on the feedback form (plus some related affordances) in an effort to concentrate support entry into the Help dropdown instead: | Before | After | | --- | --- | | <img width="1090" height="579" alt="Inventory Nuts Bolts Supabase" src="https://github.com/user-attachments/assets/c7dacf40-5ae8-401c-a167-5e56c4c0635d" /> | _Not applicable. This step is skipped in the new version._ | | <img width="1090" height="579" alt="Inventory Nuts Bolts Supabase" src="https://github.com/user-attachments/assets/9bd2489d-7e87-49e5-99af-13eb5f387f60" /> | <img width="1090" height="579" alt="Inventory Nuts Bolts Supabase" src="https://github.com/user-attachments/assets/fa499a40-6d70-4674-9eb6-c7bd96019b27" /> | | <img width="1090" height="579" alt="Inventory Nuts Bolts Supabase" src="https://github.com/user-attachments/assets/e253381b-e8ba-476c-bd36-9dd522209498" /> | <img width="1090" height="579" alt="Inventory Nuts Bolts Supabase" src="https://github.com/user-attachments/assets/b5cf614b-329c-4517-90e9-c4d1b49bd139" /> | Despite putting other measures in place such as client-side form detection, the result is that people are increasingly writing in to support via the Feedback form. ## What is the new behavior? - Restores the gating - But also reuses the same self-debugging help options from the Help dropdown Other: - Renames `HelpPopover` to `HelpDropdown` to match others - Adjusts font size of `CommandMenu` _Search..._ | Before | After | | --- | --- | | <img width="1024" height="756" alt="Spinner Toolshed Supabase" src="https://github.com/user-attachments/assets/12e3be32-743d-488a-a13d-bf400fd0fd8d" /> | <img width="1024" height="756" alt="Spinner Toolshed Supabase" src="https://github.com/user-attachments/assets/bb064ef1-a771-416d-9b5b-dbdd774efed3" /> | | _Not applicable. This step is skipped in the old version._ | <img width="1024" height="756" alt="Spinner Toolshed Supabase" src="https://github.com/user-attachments/assets/3bc0b1c2-7003-4973-8e9c-2c7ee93fb0b4" /> | | <img width="1024" height="756" alt="Spinner Toolshed Supabase" src="https://github.com/user-attachments/assets/0bb18df4-d093-4440-8379-680f6c5e3cf9" /> | <img width="1024" height="756" alt="Spinner Toolshed Supabase" src="https://github.com/user-attachments/assets/1ef801d3-9cd7-4005-9082-8d229b7cdd19" /> | | <img width="1090" height="579" alt="Inventory Nuts Bolts Supabase" src="https://github.com/user-attachments/assets/e253381b-e8ba-476c-bd36-9dd522209498" /> | <img width="1024" height="794" alt="Spinner Toolshed Supabase" src="https://github.com/user-attachments/assets/b80de142-2199-420f-9018-8622b6d24312" /> | ## To test To test the “thanks” end state, add something like the following to `feedback-send.ts`: ```ts if (MOCK_FEEDBACK_SUCCESS) { return {} as Awaited<ReturnType<typeof sendFeedback>> } ``` Where `MOCK_FEEDBACK_SUCCESS` is `true`. <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit ## Release Notes * **New Features** * Introduced multi-stage feedback dropdown with Issue and Idea selection paths. * Added AI assistant integration in help menu for quick support access. * Enhanced help dropdown with expanded options: documentation, troubleshooting, Discord community, system status, and support links. * Added Community Support section featuring Discord community promotion. * **Style** * Refined command menu placeholder text sizing for improved visual hierarchy. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Joshen Lim <joshenlimek@gmail.com>
30 lines
809 B
TypeScript
30 lines
809 B
TypeScript
export type HelpOptionId =
|
|
| 'assistant'
|
|
| 'docs'
|
|
| 'troubleshooting'
|
|
| 'discord'
|
|
| 'status'
|
|
| 'support'
|
|
|
|
export const HELP_OPTION_IDS = [
|
|
'assistant',
|
|
'docs',
|
|
'troubleshooting',
|
|
'discord',
|
|
'status',
|
|
'support',
|
|
] as const satisfies readonly HelpOptionId[]
|
|
|
|
export const ASSISTANT_SUGGESTIONS = {
|
|
name: 'Support' as const,
|
|
initialInput: 'I need help with my project',
|
|
suggestions: {
|
|
title: 'I can help you with your project, here are some example prompts to get you started:',
|
|
prompts: [
|
|
{ label: 'Database Health', description: 'Summarise my database health and performance' },
|
|
{ label: 'Debug Logs', description: 'View and debug my edge function logs' },
|
|
{ label: 'RLS Setup', description: 'Implement row level security for my tables' },
|
|
],
|
|
},
|
|
}
|