mirror of
https://github.com/supabase/supabase.git
synced 2026-05-14 14:49:37 +08:00
bcfc666284
## Problem We still use our old `Input` in some places. This means multiple components are bundled for the same use cases and we have some design differences across the application. ## Solution - [x] Migrate to the new ShadCN inputs - [x] Fix `<InputGroupButton>` cannot be used with components that triggers modal, popovers, dropdowns - [x] Fix `<FormLayout>` does not display errors for inputs that are not inside a React Hook Form - [x] Fix `InputGroup` invalid design ## Screenshots ### Table Editor - table edition sidepanel Before: <img width="758" height="1206" alt="image" src="https://github.com/user-attachments/assets/d4da4af0-a9d3-4967-935f-554233d7896b" /> After: <img width="747" height="1209" alt="image" src="https://github.com/user-attachments/assets/6286e6a0-317f-486c-a8b4-0e233706ba0f" /> ### Table Editor - row edition sidepanel Before: <img width="675" height="710" alt="image" src="https://github.com/user-attachments/assets/9fdfe819-6d62-40c8-bdc8-fa6051dab834" /> After: (I placed the TextArea button at the bottom because ShadCN reserves a full line space for it. It was weird at the top. <img width="674" height="714" alt="image" src="https://github.com/user-attachments/assets/611d5f8d-de12-4c16-ac38-bd9192cd6d73" /> ### Database settings - password reset modal Before: <img width="773" height="548" alt="image" src="https://github.com/user-attachments/assets/17f679a7-3aed-4cf9-8245-194a8a16823f" /> After: <img width="563" height="311" alt="image" src="https://github.com/user-attachments/assets/08888471-4cc8-4a3c-bf1e-8dce364f1aa6" /> ### Database - Event triggers Before: <img width="1134" height="453" alt="image" src="https://github.com/user-attachments/assets/e9d06d58-782c-4ccb-93c0-2ce1ca8c5748" /> After: <img width="1115" height="451" alt="image" src="https://github.com/user-attachments/assets/c437acb0-c602-4dd2-b249-66c7a7e739d6" /> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Copy action now shows confirmation state (“Copy” → “Copied”) when copying error details. * **UI Improvements** * Unified form-field layouts and input-group composition across editors, settings, and integration forms for a more consistent experience. * Password-strength feedback moved into field layout for clearer messaging. * Improved inline input/button/dropdown behaviors and non-React-form error display. * **Removed** * Display configuration settings component. [](https://app.coderabbit.ai/change-stack/supabase/supabase/pull/45791) <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Ali Waseem <waseema393@gmail.com>
