<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 }>(); console.log("SINFO", props.story._id); </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"> <nuxt-link :to="`/story/${story._id}/edit`"> <a-button type="ghost"> <icon istyle="regular" name="pen-to-square" /> </a-button> </nuxt-link> </a-tooltip> <a-tooltip title="View"> <nuxt-link :to="`/story/${story._id}/${story.chapters.length}`"> <a-button type="ghost"> <icon istyle="regular" name="eye" /> </a-button> </nuxt-link> </a-tooltip> </template> <style scoped></style>