Ryan/docmost
1
0
Fork 0
mirror of https://github.com/docmost/docmost.git synced 2025-11-16 06:21:13 +10:00
Code Issues Packages Projects Releases Wiki Activity

added recycle bin modal, updated api routes

Browse Source
This commit is contained in:
Eddy Oyieko
2024-09-18 11:18:32 +03:00
parent 4e69f91420
commit bda2dda12d
10 changed files with 316 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
apps/client/src/features/space/components/recycled-pages.tsx Normal file
View File

@ -0,0 +1,106 @@
import { useDeletedPagesQuery, useRestorePageMutation, useDeletePageMutation } from "@/features/page/queries/page-query.ts";
import { modals } from "@mantine/modals";
import { ActionIcon, Menu, Table, Text } from "@mantine/core";
import { IconDots } from "@tabler/icons-react";
interface RecycledPagesProps {
spaceId: string;
readOnly?: boolean;
}
export default function RecycledPagesList({
spaceId,
}: RecycledPagesProps) {
const { data, isLoading } = useDeletedPagesQuery(spaceId);
const restorePageMutation = useRestorePageMutation();
const removePageMutation = useDeletePageMutation();
const handleRestorePage = async (pageId: string) => {
await restorePageMutation.mutateAsync(pageId);
};
const handleRemovePage = async (pageId: string) => {
await removePageMutation.mutateAsync(pageId);
};
const openRemovePageModal = (pageId: string) =>
modals.openConfirmModal({
title: "Delete page permanently",
children: (
<Text size="sm">
Are you sure you want to permanently delete this page ?
</Text>
),
centered: true,
labels: { confirm: "Delete", cancel: "Cancel" },
confirmProps: { color: "red" },
onConfirm: () => handleRemovePage(pageId),
});
const openRestorePageModal = (pageId: string) =>
modals.openConfirmModal({
title: "Restore page",
children: (
<Text size="sm">
"Restore this page ?"
</Text>
),
centered: true,
labels: { confirm: "Restore", cancel: "Cancel" },
confirmProps: { color: "blue" },
onConfirm: () => handleRestorePage(pageId)
})
return (
<>
{data && (
<Table>
<Table.Thead>
<Table.Th>Deleted Pages</Table.Th>
</Table.Thead>
<Table.Tbody>
{data?.items.map((page) => (
<Table.Tr>
<Table.Td>
<div>
<Text fz="sm" fw={500}>
{page?.title}
</Text>
</div>
</Table.Td>
<Table.Td>
{(
<Menu>
<Menu.Target>
<ActionIcon variant="subtle" c="gray">
<IconDots size={20} stroke={2} />
</ActionIcon>
</Menu.Target>
<Menu.Dropdown>
<Menu.Item
onClick={() =>
openRestorePageModal(page.id)
}>
Restore Page
</Menu.Item>
<Menu.Item
onClick={() =>
openRemovePageModal
}>
Delete Page permanently
</Menu.Item>
</Menu.Dropdown>
</Menu>
)}
</Table.Td>
</Table.Tr>
))}
</Table.Tbody>
</Table>
)}
</>
);
}