diff --git a/src/app/(main)/boards/BoardDeleteButton.tsx b/src/app/(main)/boards/BoardDeleteButton.tsx
new file mode 100644
index 000000000..e8ae8d3fd
--- /dev/null
+++ b/src/app/(main)/boards/BoardDeleteButton.tsx
@@ -0,0 +1,46 @@
+import { ConfirmationForm } from '@/components/common/ConfirmationForm';
+import { useDeleteQuery, useMessages } from '@/components/hooks';
+import { Trash } from '@/components/icons';
+import { DialogButton } from '@/components/input/DialogButton';
+
+export function BoardDeleteButton({
+ boardId,
+ name,
+ onSave,
+}: {
+ boardId: string;
+ name: string;
+ onSave?: () => void;
+}) {
+ const { t, labels, messages, getErrorMessage } = useMessages();
+ const { mutateAsync, isPending, error, touch } = useDeleteQuery(`/boards/${boardId}`);
+
+ const handleConfirm = async (close: () => void) => {
+ await mutateAsync(null, {
+ onSuccess: () => {
+ touch('boards');
+ onSave?.();
+ close();
+ },
+ });
+ };
+
+ return (
+ } title={t(labels.confirm)} variant="quiet" width="400px">
+ {({ close }) => (
+ {chunks},
+ })}
+ isLoading={isPending}
+ error={getErrorMessage(error)}
+ onConfirm={handleConfirm.bind(null, close)}
+ onClose={close}
+ buttonLabel={t(labels.delete)}
+ buttonVariant="danger"
+ />
+ )}
+
+ );
+}
diff --git a/src/app/(main)/boards/BoardEditButton.tsx b/src/app/(main)/boards/BoardEditButton.tsx
new file mode 100644
index 000000000..a4bdd2863
--- /dev/null
+++ b/src/app/(main)/boards/BoardEditButton.tsx
@@ -0,0 +1,22 @@
+import { Icon } from '@umami/react-zen';
+import { LinkButton } from '@/components/common/LinkButton';
+import { useMessages, useNavigation } from '@/components/hooks';
+import { Edit } from '@/components/icons';
+
+export function BoardEditButton({ boardId }: { boardId: string }) {
+ const { t, labels } = useMessages();
+ const { renderUrl } = useNavigation();
+
+ return (
+
+
+
+
+
+ );
+}
diff --git a/src/app/(main)/boards/BoardsTable.tsx b/src/app/(main)/boards/BoardsTable.tsx
index d750db9e5..c68aab544 100644
--- a/src/app/(main)/boards/BoardsTable.tsx
+++ b/src/app/(main)/boards/BoardsTable.tsx
@@ -1,18 +1,19 @@
import { DataColumn, DataTable, type DataTableProps, Row } from '@umami/react-zen';
-import Board from 'next/link';
+import Link from 'next/link';
import { DateDistance } from '@/components/common/DateDistance';
-import { useMessages, useNavigation, useSlug } from '@/components/hooks';
+import { useMessages, useNavigation } from '@/components/hooks';
+import { BoardDeleteButton } from './BoardDeleteButton';
+import { BoardEditButton } from './BoardEditButton';
export function BoardsTable(props: DataTableProps) {
const { t, labels } = useMessages();
- const { websiteId, renderUrl } = useNavigation();
- const { getSlugUrl } = useSlug('link');
+ const { renderUrl } = useNavigation();
return (
{({ id, name }: any) => {
- return {name};
+ return {name};
}}
@@ -21,7 +22,12 @@ export function BoardsTable(props: DataTableProps) {
{({ id, name }: any) => {
- return
;
+ return (
+
+
+
+
+ );
}}