From 6ec3ecc2e7ab5861a280f77c119839a219adc7ca Mon Sep 17 00:00:00 2001
From: Halo Dev Bot <87291978+halo-dev-bot@users.noreply.github.com>
Date: Wed, 15 Mar 2023 14:24:26 +0800
Subject: [PATCH] [release-2.3] perf: add supports for force updating of post
 and single page settings (#913)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This is an automated cherry-pick of #907

/assign ruibaby

```release-note
支持强制保存文章和页面的设置，避免因为 Version 锁的机制导致保存失败。
```
---
 .../components/SinglePageSettingModal.vue     | 44 +++++++++++++++----
 .../posts/components/PostSettingModal.vue     | 40 +++++++++++++++--
 .../__tests__/PostSettingModal.spec.ts        | 18 +++++---
 3 files changed, 85 insertions(+), 17 deletions(-)

diff --git a/src/modules/contents/pages/components/SinglePageSettingModal.vue b/src/modules/contents/pages/components/SinglePageSettingModal.vue
index 67ce50c8..cd670636 100644
--- a/src/modules/contents/pages/components/SinglePageSettingModal.vue
+++ b/src/modules/contents/pages/components/SinglePageSettingModal.vue
@@ -17,6 +17,7 @@ import { toDatetimeLocal, toISOString } from "@/utils/date";
 import { submitForm } from "@formkit/core";
 import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
 import useSlugify from "@/composables/use-slugify";
+import { useMutation } from "@tanstack/vue-query";
 
 const initialFormState: SinglePage = {
   spec: {
@@ -110,6 +111,40 @@ const handlePublishClick = () => {
   });
 };
 
+// Fix me:
+// Force update post settings,
+// because currently there may be errors caused by changes in version due to asynchronous processing.
+const { mutateAsync: singlePageUpdateMutate } = useMutation({
+  mutationKey: ["singlePage-update"],
+  mutationFn: async (page: SinglePage) => {
+    const { data: latestSinglePage } =
+      await apiClient.extension.singlePage.getcontentHaloRunV1alpha1SinglePage({
+        name: page.metadata.name,
+      });
+    return apiClient.extension.singlePage.updatecontentHaloRunV1alpha1SinglePage(
+      {
+        name: page.metadata.name,
+        singlePage: {
+          ...latestSinglePage,
+          spec: page.spec,
+          metadata: {
+            ...latestSinglePage.metadata,
+            annotations: page.metadata.annotations,
+          },
+        },
+      },
+      {
+        mute: true,
+      }
+    );
+  },
+  retry: 3,
+  onError: (error) => {
+    console.error("Failed to update post", error);
+    Toast.error(`服务器内部错误`);
+  },
+});
+
 const handleSave = async () => {
   annotationsFormRef.value?.handleSubmit();
   await nextTick();
@@ -133,15 +168,8 @@ const handleSave = async () => {
   try {
     saving.value = true;
 
-    saving.value = true;
-
     const { data } = isUpdateMode.value
-      ? await apiClient.extension.singlePage.updatecontentHaloRunV1alpha1SinglePage(
-          {
-            name: formState.value.metadata.name,
-            singlePage: formState.value,
-          }
-        )
+      ? await singlePageUpdateMutate(formState.value)
       : await apiClient.extension.singlePage.createcontentHaloRunV1alpha1SinglePage(
           {
             singlePage: formState.value,
diff --git a/src/modules/contents/posts/components/PostSettingModal.vue b/src/modules/contents/posts/components/PostSettingModal.vue
index 8affc3ea..89d3fa2d 100644
--- a/src/modules/contents/posts/components/PostSettingModal.vue
+++ b/src/modules/contents/posts/components/PostSettingModal.vue
@@ -17,6 +17,7 @@ import { toDatetimeLocal, toISOString } from "@/utils/date";
 import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
 import { submitForm } from "@formkit/core";
 import useSlugify from "@/composables/use-slugify";
+import { useMutation } from "@tanstack/vue-query";
 
 const initialFormState: Post = {
   spec: {
@@ -114,6 +115,40 @@ const handlePublishClick = () => {
   });
 };
 
+// Fix me:
+// Force update post settings,
+// because currently there may be errors caused by changes in version due to asynchronous processing.
+const { mutateAsync: postUpdateMutate } = useMutation({
+  mutationKey: ["post-update"],
+  mutationFn: async (post: Post) => {
+    const { data: latestPost } =
+      await apiClient.extension.post.getcontentHaloRunV1alpha1Post({
+        name: post.metadata.name,
+      });
+    return apiClient.extension.post.updatecontentHaloRunV1alpha1Post(
+      {
+        name: post.metadata.name,
+        post: {
+          ...latestPost,
+          spec: post.spec,
+          metadata: {
+            ...latestPost.metadata,
+            annotations: post.metadata.annotations,
+          },
+        },
+      },
+      {
+        mute: true,
+      }
+    );
+  },
+  retry: 3,
+  onError: (error) => {
+    console.error("Failed to update post", error);
+    Toast.error(`服务器内部错误`);
+  },
+});
+
 const handleSave = async () => {
   annotationsFormRef.value?.handleSubmit();
   await nextTick();
@@ -139,10 +174,7 @@ const handleSave = async () => {
     saving.value = true;
 
     const { data } = isUpdateMode.value
-      ? await apiClient.extension.post.updatecontentHaloRunV1alpha1Post({
-          name: formState.value.metadata.name,
-          post: formState.value,
-        })
+      ? await postUpdateMutate(formState.value)
       : await apiClient.extension.post.createcontentHaloRunV1alpha1Post({
           post: formState.value,
         });
diff --git a/src/modules/contents/posts/components/__tests__/PostSettingModal.spec.ts b/src/modules/contents/posts/components/__tests__/PostSettingModal.spec.ts
index 781930aa..1fba561b 100644
--- a/src/modules/contents/posts/components/__tests__/PostSettingModal.spec.ts
+++ b/src/modules/contents/posts/components/__tests__/PostSettingModal.spec.ts
@@ -2,6 +2,7 @@ import { beforeEach, describe, expect, it } from "vitest";
 import { mount } from "@vue/test-utils";
 import PostSettingModal from "../PostSettingModal.vue";
 import { createPinia, setActivePinia } from "pinia";
+import { VueQueryPlugin } from "@tanstack/vue-query";
 
 describe("PostSettingModal", () => {
   beforeEach(() => {
@@ -9,12 +10,19 @@ describe("PostSettingModal", () => {
   });
 
   it("should render", () => {
-    const wrapper = mount({
-      components: {
-        PostSettingModal,
+    const wrapper = mount(
+      {
+        components: {
+          PostSettingModal,
+        },
+        template: `<PostSettingModal></PostSettingModal>`,
       },
-      template: `<PostSettingModal></PostSettingModal>`,
-    });
+      {
+        global: {
+          plugins: [VueQueryPlugin],
+        },
+      }
+    );
     expect(wrapper).toBeDefined();
   });
 });