apunkt/SurfSense
1
0
Fork 0
mirror of https://github.com/MODSetter/SurfSense.git synced 2026-05-10 00:02:40 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor: update bulk delete bar positioning and styling in DocumentsTableShell

Browse source
This commit is contained in:
Anish Sarkar 2026-03-27 12:20:43 +05:30
parent 7a2467c1ed
commit 22e36d00fc
1 changed files with 7 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

16
surfsense_web/app/dashboard/[search_space_id]/documents/(manage)/components/DocumentsTableShell.tsx
View file

@ -473,14 +473,14 @@ export function DocumentsTableShell({
}, [deletableSelectedIds, bulkDeleteDocuments, deleteDocument]); }, [deletableSelectedIds, bulkDeleteDocuments, deleteDocument]);
const bulkDeleteBar = hasDeletableSelection ? ( const bulkDeleteBar = hasDeletableSelection ? (
<div className="flex items-center justify-center py-1.5 border-b border-border/50 bg-destructive/5 shrink-0 animate-in fade-in slide-in-from-top-1 duration-150"> <div className="absolute inset-x-0 top-0 z-10 flex items-center justify-center py-1 pointer-events-none animate-in fade-in duration-150">
<button <button
type="button" type="button"
onClick={() => setBulkDeleteConfirmOpen(true)} onClick={() => setBulkDeleteConfirmOpen(true)}
className="flex items-center gap-1.5 px-3 py-1 rounded-md bg-destructive text-destructive-foreground shadow-sm text-xs font-medium hover:bg-destructive/90 transition-colors" className="pointer-events-auto flex items-center gap-1.5 px-3 py-1 rounded-md bg-destructive text-destructive-foreground shadow-lg text-xs font-medium hover:bg-destructive/90 transition-colors"
> >
<Trash2 size={12} /> <Trash2 size={12} />
Delete ({deletableSelectedIds.length} selected) Delete {deletableSelectedIds.length} {deletableSelectedIds.length === 1 ? "item" : "items"}
</button> </button>
</div> </div>
) : null; ) : null;
@ -526,7 +526,6 @@ export function DocumentsTableShell({
</TableRow> </TableRow>
</TableHeader> </TableHeader>
</Table> </Table>
{bulkDeleteBar}
{loading ? ( {loading ? (
<div className="flex-1 overflow-auto"> <div className="flex-1 overflow-auto">
<Table className="table-fixed w-full"> <Table className="table-fixed w-full">
@ -594,7 +593,8 @@ export function DocumentsTableShell({
)} )}
</div> </div>
) : ( ) : (
<div ref={desktopScrollRef} className="flex-1 overflow-auto"> <div ref={desktopScrollRef} className="flex-1 overflow-auto relative">
{bulkDeleteBar}
<Table className="table-fixed w-full"> <Table className="table-fixed w-full">
<TableBody> <TableBody>
{sorted.map((doc) => { {sorted.map((doc) => {
@ -788,9 +788,6 @@ export function DocumentsTableShell({
)} )}
</div> </div>
{/* Mobile bulk delete bar */}
<div className="md:hidden">{bulkDeleteBar}</div>
{/* Mobile Card View */} {/* Mobile Card View */}
{loading ? ( {loading ? (
<div className="md:hidden divide-y divide-border/50 flex-1 overflow-auto"> <div className="md:hidden divide-y divide-border/50 flex-1 overflow-auto">
@ -846,8 +843,9 @@ export function DocumentsTableShell({
) : ( ) : (
<div <div
ref={mobileScrollRef} ref={mobileScrollRef}
className="md:hidden divide-y divide-border/50 flex-1 overflow-auto" className="md:hidden divide-y divide-border/50 flex-1 overflow-auto relative"
> >
{bulkDeleteBar}
{sorted.map((doc) => { {sorted.map((doc) => {
const isMentioned = mentionedDocIds?.has(doc.id) ?? false; const isMentioned = mentionedDocIds?.has(doc.id) ?? false;
const statusState = doc.status?.state ?? "ready"; const statusState = doc.status?.state ?? "ready";