Adding a ton of stuff

web/src/use/use-blog-post.ts

@@ -0,0 +1,83 @@
+import { type Ref, reactive, toRefs, unref, watch } from "vue"
+import { isNil } from "lodash"
+
+import blogPostsApi, { type BlogPost } from "@/api/blog-posts-api"
+
+export { type BlogPost }
+
+export function useBlogPost(idOrSlug: Ref<number | string | null | undefined>) {
+  const state = reactive<{
+    blogPost: BlogPost | null
+    isLoading: boolean
+    isErrored: boolean
+  }>({
+    blogPost: null,
+    isLoading: false,
+    isErrored: false,
+  })
+
+  async function fetch(): Promise<BlogPost> {
+    const staticIdOrSlug = unref(idOrSlug)
+    if (isNil(staticIdOrSlug)) {
+      throw new Error("idOrSlug is required")
+    }
+
+    state.isLoading = true
+    try {
+      const { blogPost } = await blogPostsApi.get(staticIdOrSlug)
+      state.isErrored = false
+      state.blogPost = blogPost
+      return blogPost
+    } catch (error) {
+      console.error("Failed to fetch blog post:", error)
+      state.isErrored = true
+      throw error
+    } finally {
+      state.isLoading = false
+    }
+  }
+
+  async function save(): Promise<BlogPost> {
+    const staticIdOrSlug = unref(idOrSlug)
+    if (isNil(staticIdOrSlug)) {
+      throw new Error("idOrSlug is required")
+    }
+
+    if (isNil(state.blogPost)) {
+      throw new Error("No blog post to save")
+    }
+
+    state.isLoading = true
+    try {
+      const { blogPost } = await blogPostsApi.update(staticIdOrSlug, state.blogPost)
+      state.isErrored = false
+      state.blogPost = blogPost
+      return blogPost
+    } catch (error) {
+      console.error("Failed to save blog post:", error)
+      state.isErrored = true
+      throw error
+    } finally {
+      state.isLoading = false
+    }
+  }
+
+  watch(
+    () => unref(idOrSlug),
+    async (newIdOrSlug) => {
+      if (isNil(newIdOrSlug)) return
+
+      await fetch()
+    },
+    { immediate: true }
+  )
+
+  return {
+    ...toRefs(state),
+    fetch,
+    refresh: fetch,
+    save,
+  }
+}
+
+export default useBlogPost