mirror of
https://github.com/supabase/supabase.git
synced 2026-10-09 19:35:06 +03:00
Ali WaseemandAlaister Young
1696262088
## I have read the [CONTRIBUTING.md](https://github.com/supabase/supabase/blob/master/CONTRIBUTING.md) file. YES ## What kind of change does this PR introduce? Completion of batch edits on the table editor ## Demo https://github.com/user-attachments/assets/ab5a7112-3dcc-456a-a5fc-1c9a99fccf34 <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Queued add/edit/delete operations with optimistic UI, conflict resolution, and queue-based flows * Side-panel items showing queued add/delete row previews * **UI** * Pending-add placeholders plus a visible "DEFAULT" marker in grid cells * Visual row states: green for pending adds, red with strike-through for pending deletes * Queue-based deletes can bypass confirmation when queue mode is enabled * **Tests** * Expanded tests covering queue conflict resolution and queue utilities <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Alaister Young <a@alaisteryoung.com>
30 lines
1.2 KiB
TypeScript
30 lines
1.2 KiB
TypeScript
import { BASE_PATH } from 'lib/constants'
|
|
import Image from 'next/image'
|
|
|
|
export const QueueOperationsPreview = () => {
|
|
return (
|
|
<div className="flex flex-col gap-2">
|
|
<p className="text-foreground-light text-sm mb-4">
|
|
Queue your table edits and review all pending changes before saving them to your database.
|
|
This gives you more control over when changes are committed, allowing you to batch multiple
|
|
edits and review them together.
|
|
</p>
|
|
<Image
|
|
src={`${BASE_PATH}/img/previews/queue-operations-table-preview.png`}
|
|
width={1296}
|
|
height={900}
|
|
alt="queue-operations-preview"
|
|
className="rounded border"
|
|
/>
|
|
<div className="space-y-2 !mt-4">
|
|
<p className="text-sm">Enabling this preview will:</p>
|
|
<ul className="list-disc pl-6 text-sm text-foreground-light space-y-1">
|
|
<li>Queue cell edits in the Table Editor instead of saving them immediately</li>
|
|
<li>Show a panel to review all pending changes before committing them</li>
|
|
<li>Allow you to cancel individual changes or save all changes at once</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|