From 8f24c9ff3da5b3f4e384fa13595603703cf3f8e1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=98=99=E2=97=A6=20The=20Tablet=20=E2=9D=80=20GamerGirla?=
 =?UTF-8?q?ndCo=20=E2=97=A6=E2=9D=A7?= <i.am.the.tablet@proton.me>
Date: Sun, 31 Dec 2023 01:50:35 -0500
Subject: [PATCH] refactor(components): create story actions component and
 related functions

---
 components/story/atoms/actions.vue | 28 ++++++++++++++++++++++++++++
 lib/client/storyActions.ts         |  6 ++++++
 2 files changed, 34 insertions(+)
 create mode 100644 components/story/atoms/actions.vue
 create mode 100644 lib/client/storyActions.ts

diff --git a/components/story/atoms/actions.vue b/components/story/atoms/actions.vue
new file mode 100644
index 0000000..03a2d2f
--- /dev/null
+++ b/components/story/atoms/actions.vue
@@ -0,0 +1,28 @@
+<script setup lang="ts">
+	import { theme } from "ant-design-vue";
+	import { IStory } from "@models/stories";
+	import { deleteStory } from "@client/storyActions";
+	const props = defineProps<{ story: IStory }>();
+</script>
+
+<template>
+	<a-popconfirm title="Are you sure you want to delete this story?" @confirm="() => deleteStory(story._id!)">
+		<a-tooltip title="Delete">
+			<a-button type="ghost">
+				<icon istyle="regular" name="trash" :icolor="theme.useToken().token.value.colorError" />
+			</a-button>
+		</a-tooltip>
+	</a-popconfirm>
+	<a-tooltip title="Edit">
+		<a-button type="ghost" @click="$router.push(`/story/${story._id}/edit`)">
+			<icon istyle="regular" name="pen-to-square" />
+		</a-button>
+	</a-tooltip>
+	<a-tooltip title="View">
+		<a-button type="ghost" @click="$router.push(`/story/${story._id}/${story.chapters.length}`)">
+			<icon istyle="regular" name="eye" />
+		</a-button>
+	</a-tooltip>
+</template>
+
+<style scoped></style>
diff --git a/lib/client/storyActions.ts b/lib/client/storyActions.ts
new file mode 100644
index 0000000..53191bd
--- /dev/null
+++ b/lib/client/storyActions.ts
@@ -0,0 +1,6 @@
+import { useApiFetch } from "#imports";
+
+export async function deleteStory(id: number) {
+	await useApiFetch(`/story/${id}`, { method: "delete" });
+	await navigateTo("/my-stuff/stories");
+}