Skip to content

Commit

Permalink
add delete request
Browse files Browse the repository at this point in the history
  • Loading branch information
Hartaithan committed May 9, 2023
1 parent b67fdc5 commit 24a432a
Show file tree
Hide file tree
Showing 4 changed files with 73 additions and 5 deletions.
51 changes: 50 additions & 1 deletion components/BoardCard.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,11 @@ import ColumnBadge from "./ColumnBadge";
import PlatformBadge from "./PlatformBadge";
import ProgressStats from "./ProgressStats";
import { Dots, Edit, Trash } from "tabler-icons-react";
import { modals } from "@mantine/modals";
import { useBoard } from "@/providers/BoardProvider";
import API from "@/helpers/api";
import { type IBoardColumns } from "@/models/BoardModel";
import { notifications } from "@mantine/notifications";

interface IBoardCardProps {
item: IGame;
Expand Down Expand Up @@ -69,6 +74,7 @@ const BoardCard: FC<IBoardCardProps> = (props) => {
const { item } = props;
const { id, title, image_url, status, platform, progress } = item;

const { columns, setColumns } = useBoard();
const { classes, cx } = useStyles();
const {
attributes,
Expand All @@ -79,6 +85,49 @@ const BoardCard: FC<IBoardCardProps> = (props) => {
isDragging,
} = useSortable({ id });

const handleDelete = (): void => {
let previousState: IBoardColumns = { ...columns };
setColumns((prev) => {
previousState = prev;
const column = [...prev[status]];
return { ...prev, [status]: column.filter((i) => i.id !== id) };
});
API.delete(`/games/${id}`)
.then((res) => {
notifications.show({
title: "Success!",
message: res.data.message,
autoClose: 3000,
});
})
.catch((error) => {
setColumns(previousState);
notifications.show({
title: "Something went wrong!",
color: "red",
message: error.response.data.message,
autoClose: false,
});
console.error("delete game error", error);
});
};

const handleDeleteModal = (): void => {
modals.openConfirmModal({
title: "Are you sure?",
centered: true,
children: (
<Text size="sm">
Do you really want to delete this game? This process cannot be undone.
</Text>
),
labels: { confirm: "Delete", cancel: "No don't delete it" },
confirmProps: { color: "red" },
onCancel: () => console.info("user cancelled delete"),
onConfirm: handleDelete,
});
};

return (
<Flex
ref={setNodeRef}
Expand Down Expand Up @@ -109,7 +158,7 @@ const BoardCard: FC<IBoardCardProps> = (props) => {
</Menu.Item>
<Menu.Item
icon={<Trash size="1rem" />}
onClick={() => alert("TODO: add delete modal")}
onClick={() => handleDeleteModal()}
>
Delete
</Menu.Item>
Expand Down
15 changes: 15 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
"@mantine/core": "^6.0.10",
"@mantine/form": "^6.0.10",
"@mantine/hooks": "^6.0.10",
"@mantine/modals": "^6.0.10",
"@mantine/next": "^6.0.10",
"@mantine/notifications": "^6.0.10",
"@supabase/auth-helpers-nextjs": "^0.6.1",
Expand Down
11 changes: 7 additions & 4 deletions pages/_app.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import {
} from "@/models/AuthModel";
import ProfileProvider from "@/providers/ProfileProvider";
import { Notifications } from "@mantine/notifications";
import { ModalsProvider } from "@mantine/modals";

const API_URL = process.env.NEXT_PUBLIC_API_URL;

Expand Down Expand Up @@ -146,10 +147,12 @@ const App = (props: IAppProps): JSX.Element => {
initialProfile={initialProfile}
initialPSNProfile={initialPSNProfile}
>
<MainLayout>
<Notifications />
<Component {...pageProps} />
</MainLayout>
<ModalsProvider>
<MainLayout>
<Notifications />
<Component {...pageProps} />
</MainLayout>
</ModalsProvider>
</ProfileProvider>
</MantineProvider>
</SessionContextProvider>
Expand Down

0 comments on commit 24a432a

Please sign in to comment.