mirror of
https://github.com/supabase/supabase.git
synced 2026-10-07 02:15:05 +03:00
## Problem Deleting a custom report waited for the API round trip before updating the UI. The confirmation modal showed a loading spinner, the report stayed visible in the sidebar until the request resolved, and the interaction felt sluggish. ## Fix The delete now applies optimistically. On confirm, the report is removed from the sidebar immediately and the user is navigated away. The actual delete runs in the background. If it fails, the cached list is rolled back to its previous state and an error toast is shown. The optimistic behavior lives inside `useContentDeleteMutation` (via `onMutate` snapshot + `onError` rollback), so any current or future caller of that hook gets it for free, no per-call wiring required. ## How to test - Open a project with at least one custom report - Click the kebab menu on a report and choose Delete report, then confirm - Expected result: the report disappears from the sidebar instantly and a success toast appears - To test rollback: throttle/offline the network or force the delete endpoint to fail, then delete again - Expected result: the report reappears in the sidebar and an error toast is shown <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Improvements** * Deletion flows now provide explicit loading, success and error feedback; UI updates immediately on delete and will restore if the action fails. * **Removals** * Removed the reports menu and individual report menu item UI components (affects report-level rename/delete dropdowns and related menu navigation). * **Tests** * Added tests covering content deletion behavior, multiple-deletion cases, and data integrity after removals. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
Writing components
Where to create your components
- For components that declare the general structure and layout of a page:
/components/layouts/xxx
- For components that are tightly coupled to a specific interface:
/components/interfaces/xxx
- For components that are meant to be reusable across multiple pages:
/components/ui/xxx
- Note: We're gradually moving files out of the
to-be-cleanedfolder into the respective folders as we refactor
Component structure
- If a component has constants and utility methods that are tightly coupled to itself, keep them close to the component and enclose them in a folder with an
index.tsxas an entry point - Otherwise it can just be a file on its own
- For example:
-
components/ui - SampleComponentA - SampleComponentA.tsx - SampleComponentA.constants.ts - SampleComponentA.utils.ts - SampleComponentA.types.ts - index.ts - SampleComponentB.tsx
-
Template for building components
// Declare the prop types of your component
interface ComponentAProps {
sampleProp: string
}
// Name your component accordingly
const ComponentA = ({ sampleProp }: ComponentAProps) => {
return <div>ComponentA: {sampleProp}</div>
}
export default ComponentA