From 616bdc830791e83610e667e1e4d76f793ba61ef7 Mon Sep 17 00:00:00 2001 From: Ryan Wang Date: Fri, 18 Nov 2022 14:00:23 +0800 Subject: [PATCH] refactor: use generateName instead of uuid to generate metadata.name (#688) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit #### What type of PR is this? /kind improvement /milestone 2.0 #### What this PR does / why we need it: 使用 metadata.generateName 代替 uuid 为 metadata.name 生成值。 Ref https://github.com/halo-dev/halo/pull/2563 #### Special notes for your reviewer: /cc @halo-dev/sig-halo-console 测试方式： 1. 需要 `pnpm install` 2. 测试登录以及所有需要创建更新资源的业务模块。 #### Does this PR introduce a user-facing change? ```release-note None ``` --- package.json | 2 -- pnpm-lock.yaml | 13 ---------- src/composables/use-setting-form.ts | 19 +++++++++----- .../AttachmentGroupEditingModal.vue | 5 ++-- .../components/AttachmentPoliciesModal.vue | 7 ++--- .../AttachmentPolicyEditingModal.vue | 26 ++++++++++++++++--- .../components/AttachmentUploadModal.vue | 14 +++++----- .../contents/pages/SinglePageEditor.vue | 6 ++--- .../components/SinglePageSettingModal.vue | 4 +-- src/modules/contents/posts/PostEditor.vue | 6 ++--- .../components/CategoryEditingModal.vue | 5 ++-- .../posts/components/PostSettingModal.vue | 4 +-- .../posts/tags/components/TagEditingModal.vue | 5 ++-- .../menus/components/MenuEditingModal.vue | 5 ++-- .../menus/components/MenuItemEditingModal.vue | 5 ++-- .../roles/components/RoleEditingModal.vue | 11 -------- .../system/roles/composables/use-role.ts | 1 + src/modules/system/users/Login.vue | 4 +-- src/utils/id.ts | 7 +++++ 19 files changed, 76 insertions(+), 73 deletions(-) create mode 100644 src/utils/id.ts diff --git a/package.json b/package.json index bc06bea0..f5ef8223 100644 --- a/package.json +++ b/package.json @@ -64,7 +64,6 @@ "pinia": "^2.0.23", "pretty-bytes": "^6.0.0", "qs": "^6.11.0", - "uuid": "^9.0.0", "vue": "^3.2.44", "vue-grid-layout": "3.0.0-beta1", "vue-router": "^4.1.6", @@ -84,7 +83,6 @@ "@types/node": "^18.11.9", "@types/qs": "^6.9.7", "@types/randomstring": "^1.1.8", - "@types/uuid": "^8.3.4", "@vitejs/plugin-vue": "^3.2.0", "@vitejs/plugin-vue-jsx": "^2.1.1", "@vitest/ui": "^0.25.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index a5d3378c..2d871231 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -28,7 +28,6 @@ importers: '@types/node': ^18.11.9 '@types/qs': ^6.9.7 '@types/randomstring': ^1.1.8 - '@types/uuid': ^8.3.4 '@uppy/core': ^3.0.4 '@uppy/dashboard': ^3.2.0 '@uppy/drag-drop': ^3.0.1 @@ -83,7 +82,6 @@ importers: tailwindcss-themer: ^2.0.2 typescript: ~4.7.4 unplugin-icons: ^0.14.13 - uuid: ^9.0.0 vite: ^3.2.3 vite-compression-plugin: ^0.0.4 vite-plugin-externals: ^0.5.1 @@ -138,7 +136,6 @@ importers: pinia: 2.0.23_e7lp6ggkpgyi5vqd44m2kxvk6i pretty-bytes: 6.0.0 qs: 6.11.0 - uuid: 9.0.0 vue: 3.2.45 vue-grid-layout: 3.0.0-beta1 vue-router: 4.1.6_vue@3.2.45 @@ -157,7 +154,6 @@ importers: '@types/node': 18.11.9 '@types/qs': 6.9.7 '@types/randomstring': 1.1.8 - '@types/uuid': 8.3.4 '@vitejs/plugin-vue': 3.2.0_vite@3.2.4+vue@3.2.45 '@vitejs/plugin-vue-jsx': 2.1.1_vite@3.2.4+vue@3.2.45 '@vitest/ui': 0.25.2 @@ -3229,10 +3225,6 @@ packages: resolution: {integrity: sha512-PBjIUxZHOuj0R15/xuwJYjFi+KZdNFrehocChv4g5hu6aFroHue8m0lBP0POdK2nKzbw0cgV1mws8+V/JAcEkQ==} dev: false - /@types/uuid/8.3.4: - resolution: {integrity: sha512-c/I8ZRb51j+pYGAu5CrFMRxqZ2ke4y2grEBO5AUjgSkSk+qT2Ea+OdWElz/OiMf5MNpn2b17kuVBwZLQJXzihw==} - dev: true - /@types/web-bluetooth/0.0.16: resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==} dev: false @@ -9043,11 +9035,6 @@ packages: hasBin: true dev: true - /uuid/9.0.0: - resolution: {integrity: sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==} - hasBin: true - dev: false - /v8-to-istanbul/9.0.1: resolution: {integrity: sha512-74Y4LqY74kLE6IFyIjPtkSTWzUZmj8tdHT9Ii/26dvQ6K9Dl2NbEfj0XgU2sHCtKgt5VupqhlO/5aWuqS+IY1w==} engines: {node: '>=10.12.0'} diff --git a/src/composables/use-setting-form.ts b/src/composables/use-setting-form.ts index e6a9bd6f..8263de15 100644 --- a/src/composables/use-setting-form.ts +++ b/src/composables/use-setting-form.ts @@ -133,14 +133,19 @@ export function useSettingForm( }); if (!configMap.value.metadata.creationTimestamp) { - await apiClient.extension.configMap.createv1alpha1ConfigMap({ - configMap: configMap.value, - }); + const { data } = + await apiClient.extension.configMap.createv1alpha1ConfigMap({ + configMap: configMap.value, + }); + + configMapName.value = data.metadata.name; } else { - await apiClient.extension.configMap.updatev1alpha1ConfigMap({ - configMap: configMap.value, - name: configMap.value.metadata.name, - }); + const { data } = + await apiClient.extension.configMap.updatev1alpha1ConfigMap({ + configMap: configMap.value, + name: configMap.value.metadata.name, + }); + configMapName.value = data.metadata.name; } } catch (e) { console.error("Failed to save configMap", e); diff --git a/src/modules/contents/attachments/components/AttachmentGroupEditingModal.vue b/src/modules/contents/attachments/components/AttachmentGroupEditingModal.vue index e43c3511..98f29687 100644 --- a/src/modules/contents/attachments/components/AttachmentGroupEditingModal.vue +++ b/src/modules/contents/attachments/components/AttachmentGroupEditingModal.vue @@ -2,7 +2,6 @@ import { VButton, VModal, VSpace } from "@halo-dev/components"; import SubmitButton from "@/components/button/SubmitButton.vue"; import type { Group } from "@halo-dev/api-client"; -import { v4 as uuid } from "uuid"; import { computed, ref, watch } from "vue"; import cloneDeep from "lodash.clonedeep"; import { apiClient } from "@/utils/api-client"; @@ -32,7 +31,8 @@ const initialFormState: Group = { apiVersion: "storage.halo.run/v1alpha1", kind: "Group", metadata: { - name: uuid(), + name: "", + generateName: "attachment-group-", }, }; @@ -81,7 +81,6 @@ const onVisibleChange = (visible: boolean) => { const handleResetForm = () => { formState.value = cloneDeep(initialFormState); - formState.value.metadata.name = uuid(); reset("attachment-group-form"); }; diff --git a/src/modules/contents/attachments/components/AttachmentPoliciesModal.vue b/src/modules/contents/attachments/components/AttachmentPoliciesModal.vue index e71a7109..4ba47dd2 100644 --- a/src/modules/contents/attachments/components/AttachmentPoliciesModal.vue +++ b/src/modules/contents/attachments/components/AttachmentPoliciesModal.vue @@ -10,7 +10,6 @@ import { import AttachmentPolicyEditingModal from "./AttachmentPolicyEditingModal.vue"; import { ref, watch } from "vue"; import type { Policy, PolicyTemplate } from "@halo-dev/api-client"; -import { v4 as uuid } from "uuid"; import { formatDatetime } from "@/utils/date"; import { useFetchAttachmentPolicy, @@ -61,13 +60,14 @@ const handleOpenCreateNewPolicyModal = (policyTemplate: PolicyTemplate) => { name: policyTemplate.metadata.name, }, configMapRef: { - name: uuid(), + name: "", }, }, apiVersion: "storage.halo.run/v1alpha1", kind: "Policy", metadata: { - name: uuid(), + name: "", + generateName: "attachment-policy-", }, }; policyEditingModal.value = true; @@ -221,6 +221,7 @@ watch( (); const settingName = computed( () => policyTemplate.value?.spec?.settingRef?.name ); -const configMapName = computed(() => formState.value.spec.configMapRef?.name); + +const configMapName = computed({ + get() { + return formState.value.spec.configMapRef?.name; + }, + set(value) { + formState.value.spec.configMapRef = { + name: value as string, + }; + }, +}); const { setting, configMapFormData, + configMap, saving, handleFetchConfigMap, handleFetchSettings, @@ -102,6 +113,11 @@ const handleSave = async () => { try { saving.value = true; + if (!isUpdateMode.value) { + configMap.value.metadata.name = ""; + configMap.value.metadata.generateName = "configMap-"; + } + await handleSaveConfigMap(); if (isUpdateMode.value) { @@ -112,6 +128,9 @@ const handleSave = async () => { } ); } else { + formState.value.spec.configMapRef = { + name: configMap.value.metadata.name, + }; await apiClient.extension.storage.policy.createstorageHaloRunV1alpha1Policy( { policy: formState.value, @@ -129,7 +148,6 @@ const handleSave = async () => { const handleResetForm = () => { formState.value = cloneDeep(initialFormState); - formState.value.metadata.name = uuid(); reset("attachment-policy-form"); }; diff --git a/src/modules/contents/attachments/components/AttachmentUploadModal.vue b/src/modules/contents/attachments/components/AttachmentUploadModal.vue index 546f0963..cfbf8318 100644 --- a/src/modules/contents/attachments/components/AttachmentUploadModal.vue +++ b/src/modules/contents/attachments/components/AttachmentUploadModal.vue @@ -8,7 +8,6 @@ import { useFetchAttachmentPolicyTemplate, } from "../composables/use-attachment-policy"; import AttachmentPolicyEditingModal from "./AttachmentPolicyEditingModal.vue"; -import { v4 as uuid } from "uuid"; const props = withDefaults( defineProps<{ @@ -33,6 +32,7 @@ const { policyTemplates, handleFetchPolicyTemplates } = useFetchAttachmentPolicyTemplate(); const selectedPolicy = ref(); +const policyToCreate = ref(); const uploadVisible = ref(false); const policyEditingModal = ref(false); @@ -50,20 +50,21 @@ watchEffect(() => { }); const handleOpenCreateNewPolicyModal = (policyTemplate: PolicyTemplate) => { - selectedPolicy.value = { + policyToCreate.value = { spec: { displayName: "", templateRef: { name: policyTemplate.metadata.name, }, configMapRef: { - name: uuid(), + name: "", }, }, apiVersion: "storage.halo.run/v1alpha1", kind: "Policy", metadata: { - name: uuid(), + name: "", + generateName: "attachment-policy-", }, }; policyEditingModal.value = true; @@ -71,7 +72,7 @@ const handleOpenCreateNewPolicyModal = (policyTemplate: PolicyTemplate) => { const onEditingModalClose = async () => { await handleFetchPolicies(); - selectedPolicy.value = policies.value[0]; + policyToCreate.value = policies.value[0]; }; const onVisibleChange = (visible: boolean) => { @@ -181,8 +182,9 @@ watch( diff --git a/src/modules/contents/pages/SinglePageEditor.vue b/src/modules/contents/pages/SinglePageEditor.vue index 541c9d5b..13e55568 100644 --- a/src/modules/contents/pages/SinglePageEditor.vue +++ b/src/modules/contents/pages/SinglePageEditor.vue @@ -12,12 +12,12 @@ import DefaultEditor from "@/components/editor/DefaultEditor.vue"; import SinglePageSettingModal from "./components/SinglePageSettingModal.vue"; import PostPreviewModal from "../posts/components/PostPreviewModal.vue"; import type { SinglePage, SinglePageRequest } from "@halo-dev/api-client"; -import { v4 as uuid } from "uuid"; import { computed, onMounted, ref } from "vue"; import { apiClient } from "@/utils/api-client"; import { useRouteQuery } from "@vueuse/router"; import cloneDeep from "lodash.clonedeep"; import { useRouter } from "vue-router"; +import { randomUUID } from "@/utils/id"; const router = useRouter(); @@ -45,7 +45,7 @@ const initialFormState: SinglePageRequest = { apiVersion: "content.halo.run/v1alpha1", kind: "SinglePage", metadata: { - name: uuid(), + name: randomUUID(), }, }, content: { @@ -79,7 +79,7 @@ const handleSave = async () => { formState.value.page.spec.title = "无标题页面"; } if (!formState.value.page.spec.slug) { - formState.value.page.spec.slug = uuid(); + formState.value.page.spec.slug = new Date().getTime().toString(); } if (isUpdateMode.value) { diff --git a/src/modules/contents/pages/components/SinglePageSettingModal.vue b/src/modules/contents/pages/components/SinglePageSettingModal.vue index 14cb8522..13b6ac40 100644 --- a/src/modules/contents/pages/components/SinglePageSettingModal.vue +++ b/src/modules/contents/pages/components/SinglePageSettingModal.vue @@ -4,9 +4,9 @@ import { computed, ref, watchEffect } from "vue"; import type { SinglePage } from "@halo-dev/api-client"; import cloneDeep from "lodash.clonedeep"; import { apiClient } from "@/utils/api-client"; -import { v4 as uuid } from "uuid"; import { useThemeCustomTemplates } from "@/modules/interface/themes/composables/use-theme"; import { singlePageLabels } from "@/constants/labels"; +import { randomUUID } from "@/utils/id"; const initialFormState: SinglePage = { spec: { @@ -31,7 +31,7 @@ const initialFormState: SinglePage = { apiVersion: "content.halo.run/v1alpha1", kind: "SinglePage", metadata: { - name: uuid(), + name: randomUUID(), }, }; diff --git a/src/modules/contents/posts/PostEditor.vue b/src/modules/contents/posts/PostEditor.vue index 703e5057..f4ff7496 100644 --- a/src/modules/contents/posts/PostEditor.vue +++ b/src/modules/contents/posts/PostEditor.vue @@ -16,8 +16,8 @@ import { computed, onMounted, ref } from "vue"; import cloneDeep from "lodash.clonedeep"; import { apiClient } from "@/utils/api-client"; import { useRouteQuery } from "@vueuse/router"; -import { v4 as uuid } from "uuid"; import { useRouter } from "vue-router"; +import { randomUUID } from "@/utils/id"; const router = useRouter(); @@ -47,7 +47,7 @@ const initialFormState: PostRequest = { apiVersion: "content.halo.run/v1alpha1", kind: "Post", metadata: { - name: uuid(), + name: randomUUID(), }, }, content: { @@ -80,7 +80,7 @@ const handleSave = async () => { } if (!formState.value.post.spec.slug) { - formState.value.post.spec.slug = uuid(); + formState.value.post.spec.slug = new Date().getTime().toString(); } if (isUpdateMode.value) { diff --git a/src/modules/contents/posts/categories/components/CategoryEditingModal.vue b/src/modules/contents/posts/categories/components/CategoryEditingModal.vue index e4447ffe..98b2263d 100644 --- a/src/modules/contents/posts/categories/components/CategoryEditingModal.vue +++ b/src/modules/contents/posts/categories/components/CategoryEditingModal.vue @@ -14,7 +14,6 @@ import type { Category } from "@halo-dev/api-client"; import cloneDeep from "lodash.clonedeep"; import { reset } from "@formkit/core"; import { setFocus } from "@/formkit/utils/focus"; -import { v4 as uuid } from "uuid"; import { useThemeCustomTemplates } from "@/modules/interface/themes/composables/use-theme"; const props = withDefaults( @@ -47,7 +46,8 @@ const initialFormState: Category = { apiVersion: "content.halo.run/v1alpha1", kind: "Category", metadata: { - name: uuid(), + name: "", + generateName: "category-", }, }; @@ -92,7 +92,6 @@ const onVisibleChange = (visible: boolean) => { const handleResetForm = () => { formState.value = cloneDeep(initialFormState); - formState.value.metadata.name = uuid(); reset("category-form"); }; diff --git a/src/modules/contents/posts/components/PostSettingModal.vue b/src/modules/contents/posts/components/PostSettingModal.vue index 44f66777..3855d990 100644 --- a/src/modules/contents/posts/components/PostSettingModal.vue +++ b/src/modules/contents/posts/components/PostSettingModal.vue @@ -4,9 +4,9 @@ import { computed, ref, watchEffect } from "vue"; import type { Post } from "@halo-dev/api-client"; import cloneDeep from "lodash.clonedeep"; import { apiClient } from "@/utils/api-client"; -import { v4 as uuid } from "uuid"; import { useThemeCustomTemplates } from "@/modules/interface/themes/composables/use-theme"; import { postLabels } from "@/constants/labels"; +import { randomUUID } from "@/utils/id"; const initialFormState: Post = { spec: { @@ -33,7 +33,7 @@ const initialFormState: Post = { apiVersion: "content.halo.run/v1alpha1", kind: "Post", metadata: { - name: uuid(), + name: randomUUID(), }, }; diff --git a/src/modules/contents/posts/tags/components/TagEditingModal.vue b/src/modules/contents/posts/tags/components/TagEditingModal.vue index 68c4a7e2..bc646a9d 100644 --- a/src/modules/contents/posts/tags/components/TagEditingModal.vue +++ b/src/modules/contents/posts/tags/components/TagEditingModal.vue @@ -20,7 +20,6 @@ import type { Tag } from "@halo-dev/api-client"; import cloneDeep from "lodash.clonedeep"; import { reset } from "@formkit/core"; import { setFocus } from "@/formkit/utils/focus"; -import { v4 as uuid } from "uuid"; const props = withDefaults( defineProps<{ @@ -50,7 +49,8 @@ const initialFormState: Tag = { apiVersion: "content.halo.run/v1alpha1", kind: "Tag", metadata: { - name: uuid(), + name: "", + generateName: "tag-", }, }; @@ -95,7 +95,6 @@ const onVisibleChange = (visible: boolean) => { const handleResetForm = () => { formState.value = cloneDeep(initialFormState); - formState.value.metadata.name = uuid(); reset("tag-form"); }; diff --git a/src/modules/interface/menus/components/MenuEditingModal.vue b/src/modules/interface/menus/components/MenuEditingModal.vue index fbb510f9..91e7d967 100644 --- a/src/modules/interface/menus/components/MenuEditingModal.vue +++ b/src/modules/interface/menus/components/MenuEditingModal.vue @@ -2,7 +2,6 @@ import { VButton, VModal, VSpace } from "@halo-dev/components"; import SubmitButton from "@/components/button/SubmitButton.vue"; import type { Menu } from "@halo-dev/api-client"; -import { v4 as uuid } from "uuid"; import { computed, ref, watch } from "vue"; import { apiClient } from "@/utils/api-client"; import { reset } from "@formkit/core"; @@ -34,7 +33,8 @@ const initialFormState: Menu = { apiVersion: "v1alpha1", kind: "Menu", metadata: { - name: uuid(), + name: "", + generateName: "menu-", }, }; @@ -76,7 +76,6 @@ const onVisibleChange = (visible: boolean) => { const handleResetForm = () => { formState.value = cloneDeep(initialFormState); - formState.value.metadata.name = uuid(); reset("menu-form"); }; diff --git a/src/modules/interface/menus/components/MenuItemEditingModal.vue b/src/modules/interface/menus/components/MenuItemEditingModal.vue index e6b7abb9..c07309b0 100644 --- a/src/modules/interface/menus/components/MenuItemEditingModal.vue +++ b/src/modules/interface/menus/components/MenuItemEditingModal.vue @@ -3,7 +3,6 @@ import { VButton, VModal, VSpace } from "@halo-dev/components"; import SubmitButton from "@/components/button/SubmitButton.vue"; import { computed, ref, watch } from "vue"; import type { Menu, MenuItem } from "@halo-dev/api-client"; -import { v4 as uuid } from "uuid"; import { apiClient } from "@/utils/api-client"; import { reset } from "@formkit/core"; import cloneDeep from "lodash.clonedeep"; @@ -40,7 +39,8 @@ const initialFormState: MenuItem = { apiVersion: "v1alpha1", kind: "MenuItem", metadata: { - name: uuid(), + name: "", + generateName: "menu-item-", }, }; @@ -122,7 +122,6 @@ const onVisibleChange = (visible: boolean) => { const handleResetForm = () => { formState.value = cloneDeep(initialFormState); - formState.value.metadata.name = uuid(); selectedMenuItemSource.value = menuItemSources[0].value; selectedRef.value = ""; selectedParentMenuItem.value = ""; diff --git a/src/modules/system/roles/components/RoleEditingModal.vue b/src/modules/system/roles/components/RoleEditingModal.vue index 60e37c4f..692140bc 100644 --- a/src/modules/system/roles/components/RoleEditingModal.vue +++ b/src/modules/system/roles/components/RoleEditingModal.vue @@ -10,7 +10,6 @@ import { } from "@/modules/system/roles/composables/use-role"; import cloneDeep from "lodash.clonedeep"; import { reset } from "@formkit/core"; -import { v4 as uuid } from "uuid"; import { setFocus } from "@/formkit/utils/focus"; const props = withDefaults( @@ -101,7 +100,6 @@ const onVisibleChange = (visible: boolean) => { const handleResetForm = () => { formState.value = cloneDeep(initialFormState); - formState.value.metadata.name = uuid(); reset("role-form"); }; @@ -132,15 +130,6 @@ const handleResetForm = () => { type="text" validation="required" > - diff --git a/src/modules/system/roles/composables/use-role.ts b/src/modules/system/roles/composables/use-role.ts index a5846945..2486174f 100644 --- a/src/modules/system/roles/composables/use-role.ts +++ b/src/modules/system/roles/composables/use-role.ts @@ -15,6 +15,7 @@ const initialFormState: Role = { kind: "Role", metadata: { name: "", + generateName: "role-", labels: {}, annotations: { [rbacAnnotations.DEPENDENCIES]: "", diff --git a/src/modules/system/users/Login.vue b/src/modules/system/users/Login.vue index fbba6b04..517eeeee 100644 --- a/src/modules/system/users/Login.vue +++ b/src/modules/system/users/Login.vue @@ -5,7 +5,6 @@ import { VButton, Toast, } from "@halo-dev/components"; -import { v4 as uuid } from "uuid"; import qs from "qs"; import { inject, onBeforeMount, onMounted, ref } from "vue"; import { submitForm } from "@formkit/vue"; @@ -14,6 +13,7 @@ import axios from "axios"; import type { User } from "@halo-dev/api-client"; import { setFocus } from "@/formkit/utils/focus"; import IconLogo from "~icons/core/logo?width=5rem&height=2rem"; +import { randomUUID } from "@/utils/id"; interface LoginForm { _csrf: string; @@ -30,7 +30,7 @@ const loginForm = ref({ const loading = ref(false); const handleGenerateToken = async () => { - const token = uuid(); + const token = randomUUID(); loginForm.value._csrf = token; document.cookie = `XSRF-TOKEN=${token}; Path=/;`; }; diff --git a/src/utils/id.ts b/src/utils/id.ts new file mode 100644 index 00000000..8cfe5d75 --- /dev/null +++ b/src/utils/id.ts @@ -0,0 +1,7 @@ +export function randomUUID() { + return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function (c) { + const r = (Math.random() * 16) | 0, + v = c === "x" ? r : (r & 0x3) | 0x8; + return v.toString(16); + }); +}