diff --git a/ui/console-src/composables/use-content-snapshot.ts b/ui/console-src/composables/use-content-snapshot.ts
index 938623f2f..dde6e4e87 100644
--- a/ui/console-src/composables/use-content-snapshot.ts
+++ b/ui/console-src/composables/use-content-snapshot.ts
@@ -1,5 +1,5 @@
 import { coreApiClient } from "@halo-dev/api-client";
-import { watch, type Ref, ref, nextTick } from "vue";
+import { nextTick, ref, watch, type Ref } from "vue";
 
 interface SnapshotContent {
   version: Ref<number>;
diff --git a/ui/console-src/composables/use-entity-extension-points.ts b/ui/console-src/composables/use-entity-extension-points.ts
index 11e08a399..164644d22 100644
--- a/ui/console-src/composables/use-entity-extension-points.ts
+++ b/ui/console-src/composables/use-entity-extension-points.ts
@@ -1,6 +1,6 @@
 import { usePluginModuleStore } from "@/stores/plugin";
 import type { EntityFieldItem, PluginModule } from "@halo-dev/console-shared";
-import { onMounted, ref, type ComputedRef, type Ref, computed } from "vue";
+import { computed, onMounted, ref, type ComputedRef, type Ref } from "vue";
 
 export function useEntityFieldItemExtensionPoint<T>(
   extensionPointName: string,
diff --git a/ui/console-src/composables/use-operation-extension-points.ts b/ui/console-src/composables/use-operation-extension-points.ts
index 11f51f10f..d594b5837 100644
--- a/ui/console-src/composables/use-operation-extension-points.ts
+++ b/ui/console-src/composables/use-operation-extension-points.ts
@@ -1,6 +1,6 @@
 import { usePluginModuleStore } from "@/stores/plugin";
 import type { OperationItem, PluginModule } from "@halo-dev/console-shared";
-import { onMounted, ref, type ComputedRef, type Ref, computed } from "vue";
+import { computed, onMounted, ref, type ComputedRef, type Ref } from "vue";
 
 export function useOperationItemExtensionPoint<T>(
   extensionPointName: string,
diff --git a/ui/console-src/composables/use-setting-form.ts b/ui/console-src/composables/use-setting-form.ts
index 837731597..63ef1534f 100644
--- a/ui/console-src/composables/use-setting-form.ts
+++ b/ui/console-src/composables/use-setting-form.ts
@@ -1,12 +1,11 @@
 // core libs
 // types
-import { computed, watch, type ComputedRef, type Ref } from "vue";
-import { ref } from "vue";
+import { computed, ref, watch, type ComputedRef, type Ref } from "vue";
 
 // libs
-import { cloneDeep } from "lodash-es";
-import type { ConfigMap, Setting, SettingForm } from "@halo-dev/api-client";
 import type { FormKitSchemaCondition, FormKitSchemaNode } from "@formkit/core";
+import type { ConfigMap, Setting, SettingForm } from "@halo-dev/api-client";
+import { cloneDeep } from "lodash-es";
 
 interface useSettingFormConvertReturn {
   formSchema: ComputedRef<
diff --git a/ui/console-src/composables/use-slugify.ts b/ui/console-src/composables/use-slugify.ts
index 613f76240..b94c1b400 100644
--- a/ui/console-src/composables/use-slugify.ts
+++ b/ui/console-src/composables/use-slugify.ts
@@ -1,9 +1,9 @@
+import { useGlobalInfoStore } from "@/stores/global-info";
+import { FormType } from "@/types/slug";
+import { randomUUID } from "@/utils/id";
+import ShortUniqueId from "short-unique-id";
 import { slugify } from "transliteration";
 import { watch, type Ref } from "vue";
-import ShortUniqueId from "short-unique-id";
-import { FormType } from "@/types/slug";
-import { useGlobalInfoStore } from "@/stores/global-info";
-import { randomUUID } from "@/utils/id";
 const uid = new ShortUniqueId();
 const Strategy = {
   generateByTitle: (value: string) => {
diff --git a/ui/console-src/layouts/BasicLayout.vue b/ui/console-src/layouts/BasicLayout.vue
index 9d5f496fc..b1fc71be7 100644
--- a/ui/console-src/layouts/BasicLayout.vue
+++ b/ui/console-src/layouts/BasicLayout.vue
@@ -1,33 +1,33 @@
 <script lang="ts" setup>
+import GlobalSearchModal from "@/components/global-search/GlobalSearchModal.vue";
+import LoginModal from "@/components/login/LoginModal.vue";
+import { RoutesMenu } from "@/components/menu/RoutesMenu";
+import { useRouteMenuGenerator } from "@/composables/use-route-menu-generator";
+import { rbacAnnotations } from "@/constants/annotations";
+import { useUserStore } from "@/stores/user";
+import { isMac } from "@/utils/device";
+import { coreMenuGroups } from "@console/router/constant";
 import {
+  Dialog,
+  IconAccountCircleLine,
+  IconLogoutCircleRLine,
   IconMore,
   IconSearch,
   IconUserSettings,
-  IconLogoutCircleRLine,
-  VTag,
   VAvatar,
-  Dialog,
-  IconAccountCircleLine,
+  VTag,
 } from "@halo-dev/components";
-import { RoutesMenu } from "@/components/menu/RoutesMenu";
-import IconLogo from "~icons/core/logo?width=5rem&height=2rem";
-import { RouterView, useRoute, useRouter } from "vue-router";
-import { onMounted, reactive, ref } from "vue";
+import { useEventListener } from "@vueuse/core";
 import axios from "axios";
-import GlobalSearchModal from "@/components/global-search/GlobalSearchModal.vue";
-import LoginModal from "@/components/login/LoginModal.vue";
-import { coreMenuGroups } from "@console/router/constant";
-import { useUserStore } from "@/stores/user";
-import { rbacAnnotations } from "@/constants/annotations";
-import { defineStore, storeToRefs } from "pinia";
-import { useI18n } from "vue-i18n";
 import {
   useOverlayScrollbars,
   type UseOverlayScrollbarsParams,
 } from "overlayscrollbars-vue";
-import { isMac } from "@/utils/device";
-import { useEventListener } from "@vueuse/core";
-import { useRouteMenuGenerator } from "@/composables/use-route-menu-generator";
+import { defineStore, storeToRefs } from "pinia";
+import { onMounted, reactive, ref } from "vue";
+import { useI18n } from "vue-i18n";
+import { RouterView, useRoute, useRouter } from "vue-router";
+import IconLogo from "~icons/core/logo?width=5rem&height=2rem";
 
 const route = useRoute();
 const router = useRouter();
diff --git a/ui/console-src/main.ts b/ui/console-src/main.ts
index 6431157d7..5c5c7e566 100644
--- a/ui/console-src/main.ts
+++ b/ui/console-src/main.ts
@@ -1,26 +1,26 @@
-import { createApp } from "vue";
-import type { DirectiveBinding } from "vue";
+import { consoleApiClient } from "@halo-dev/api-client";
 import { createPinia } from "pinia";
+import type { DirectiveBinding } from "vue";
+import { createApp } from "vue";
 import App from "./App.vue";
 import router from "./router";
-import { consoleApiClient } from "@halo-dev/api-client";
 // setup
-import "@/setup/setupStyles";
+import { getBrowserLanguage, i18n, setupI18n } from "@/locales";
 import { setupComponents } from "@/setup/setupComponents";
-import { setupI18n, i18n, getBrowserLanguage } from "@/locales";
+import "@/setup/setupStyles";
 // core modules
-import { hasPermission } from "@/utils/permission";
-import { useRoleStore } from "@/stores/role";
-import { useThemeStore } from "@console/stores/theme";
-import { useUserStore } from "@/stores/user";
-import { useSystemConfigMapStore } from "@console/stores/system-configmap";
+import { setupApiClient } from "@/setup/setupApiClient";
 import { setupVueQuery } from "@/setup/setupVueQuery";
 import { useGlobalInfoStore } from "@/stores/global-info";
+import { useRoleStore } from "@/stores/role";
+import { useUserStore } from "@/stores/user";
+import { hasPermission } from "@/utils/permission";
 import {
   setupCoreModules,
   setupPluginModules,
 } from "@console/setup/setupModules";
-import { setupApiClient } from "@/setup/setupApiClient";
+import { useSystemConfigMapStore } from "@console/stores/system-configmap";
+import { useThemeStore } from "@console/stores/theme";
 
 const app = createApp(App);
 
diff --git a/ui/console-src/modules/contents/attachments/components/AttachmentDetailModal.vue b/ui/console-src/modules/contents/attachments/components/AttachmentDetailModal.vue
index 24566e1d8..e9a401fd2 100644
--- a/ui/console-src/modules/contents/attachments/components/AttachmentDetailModal.vue
+++ b/ui/console-src/modules/contents/attachments/components/AttachmentDetailModal.vue
@@ -1,4 +1,9 @@
 <script lang="ts" setup>
+import LazyImage from "@/components/image/LazyImage.vue";
+import { formatDatetime } from "@/utils/date";
+import { isImage } from "@/utils/image";
+import type { Attachment } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   VButton,
   VDescription,
@@ -6,15 +11,10 @@ import {
   VModal,
   VSpace,
 } from "@halo-dev/components";
-import LazyImage from "@/components/image/LazyImage.vue";
-import type { Attachment } from "@halo-dev/api-client";
+import { useQuery } from "@tanstack/vue-query";
 import prettyBytes from "pretty-bytes";
 import { computed, ref } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
-import { isImage } from "@/utils/image";
-import { formatDatetime } from "@/utils/date";
 import { useFetchAttachmentGroup } from "../composables/use-attachment-group";
-import { useQuery } from "@tanstack/vue-query";
 import AttachmentPermalinkList from "./AttachmentPermalinkList.vue";
 
 const props = withDefaults(
diff --git a/ui/console-src/modules/contents/attachments/components/AttachmentGroupBadge.vue b/ui/console-src/modules/contents/attachments/components/AttachmentGroupBadge.vue
index 2c6cd76a6..04c921d1e 100644
--- a/ui/console-src/modules/contents/attachments/components/AttachmentGroupBadge.vue
+++ b/ui/console-src/modules/contents/attachments/components/AttachmentGroupBadge.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import type { Group } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconCheckboxCircle,
diff --git a/ui/console-src/modules/contents/attachments/components/AttachmentGroupEditingModal.vue b/ui/console-src/modules/contents/attachments/components/AttachmentGroupEditingModal.vue
index 7db20a7be..dad1ed46d 100644
--- a/ui/console-src/modules/contents/attachments/components/AttachmentGroupEditingModal.vue
+++ b/ui/console-src/modules/contents/attachments/components/AttachmentGroupEditingModal.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import SubmitButton from "@/components/button/SubmitButton.vue";
 import { setFocus } from "@/formkit/utils/focus";
-import { coreApiClient } from "@halo-dev/api-client";
 import type { Group } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import { cloneDeep } from "lodash-es";
 import { onMounted, ref } from "vue";
diff --git a/ui/console-src/modules/contents/attachments/components/AttachmentListItem.vue b/ui/console-src/modules/contents/attachments/components/AttachmentListItem.vue
index fa9c82d9c..85f0b57a7 100644
--- a/ui/console-src/modules/contents/attachments/components/AttachmentListItem.vue
+++ b/ui/console-src/modules/contents/attachments/components/AttachmentListItem.vue
@@ -1,4 +1,10 @@
 <script lang="ts" setup>
+import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
+import { formatDatetime } from "@/utils/date";
+import { usePermission } from "@/utils/permission";
+import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
+import type { Attachment } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   Toast,
@@ -9,19 +15,13 @@ import {
   VSpace,
   VStatusDot,
 } from "@halo-dev/components";
+import type { OperationItem } from "@halo-dev/console-shared";
+import { useQueryClient } from "@tanstack/vue-query";
+import prettyBytes from "pretty-bytes";
 import type { Ref } from "vue";
 import { computed, inject, markRaw, ref, toRefs } from "vue";
-import type { Attachment } from "@halo-dev/api-client";
-import { formatDatetime } from "@/utils/date";
-import prettyBytes from "pretty-bytes";
-import { useFetchAttachmentPolicy } from "../composables/use-attachment-policy";
-import { coreApiClient } from "@halo-dev/api-client";
-import { usePermission } from "@/utils/permission";
 import { useI18n } from "vue-i18n";
-import { useQueryClient } from "@tanstack/vue-query";
-import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
-import type { OperationItem } from "@halo-dev/console-shared";
-import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
+import { useFetchAttachmentPolicy } from "../composables/use-attachment-policy";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/attachments/components/AttachmentPermalinkList.vue b/ui/console-src/modules/contents/attachments/components/AttachmentPermalinkList.vue
index 59a3f793c..1338f1cca 100644
--- a/ui/console-src/modules/contents/attachments/components/AttachmentPermalinkList.vue
+++ b/ui/console-src/modules/contents/attachments/components/AttachmentPermalinkList.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { VButton } from "@halo-dev/components";
 import type { Attachment } from "@halo-dev/api-client";
-import { useAttachmentPermalinkCopy } from "../composables/use-attachment";
+import { VButton } from "@halo-dev/components";
 import { computed, toRefs } from "vue";
+import { useAttachmentPermalinkCopy } from "../composables/use-attachment";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/attachments/components/AttachmentPoliciesModal.vue b/ui/console-src/modules/contents/attachments/components/AttachmentPoliciesModal.vue
index 14b065797..3b4b5ae39 100644
--- a/ui/console-src/modules/contents/attachments/components/AttachmentPoliciesModal.vue
+++ b/ui/console-src/modules/contents/attachments/components/AttachmentPoliciesModal.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import { formatDatetime } from "@/utils/date";
 import type { Policy, PolicyTemplate } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconAddCircle,
diff --git a/ui/console-src/modules/contents/attachments/components/AttachmentPolicyEditingModal.vue b/ui/console-src/modules/contents/attachments/components/AttachmentPolicyEditingModal.vue
index f0dc021bd..ec0987202 100644
--- a/ui/console-src/modules/contents/attachments/components/AttachmentPolicyEditingModal.vue
+++ b/ui/console-src/modules/contents/attachments/components/AttachmentPolicyEditingModal.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import SubmitButton from "@/components/button/SubmitButton.vue";
 import { setFocus } from "@/formkit/utils/focus";
-import { coreApiClient } from "@halo-dev/api-client";
 import { useSettingFormConvert } from "@console/composables/use-setting-form";
 import type { Policy } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import { Toast, VButton, VLoading, VModal, VSpace } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
 import { cloneDeep } from "lodash-es";
diff --git a/ui/console-src/modules/contents/attachments/composables/use-attachment-group.ts b/ui/console-src/modules/contents/attachments/composables/use-attachment-group.ts
index 7be4cd12c..118297b1f 100644
--- a/ui/console-src/modules/contents/attachments/composables/use-attachment-group.ts
+++ b/ui/console-src/modules/contents/attachments/composables/use-attachment-group.ts
@@ -1,7 +1,7 @@
-import type { Ref } from "vue";
 import type { Group } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
 import { useQuery } from "@tanstack/vue-query";
+import type { Ref } from "vue";
 
 interface useFetchAttachmentGroupReturn {
   groups: Ref<Group[] | undefined>;
diff --git a/ui/console-src/modules/contents/attachments/composables/use-attachment-policy.ts b/ui/console-src/modules/contents/attachments/composables/use-attachment-policy.ts
index 7385ea224..47c32158b 100644
--- a/ui/console-src/modules/contents/attachments/composables/use-attachment-policy.ts
+++ b/ui/console-src/modules/contents/attachments/composables/use-attachment-policy.ts
@@ -1,7 +1,7 @@
-import type { Ref } from "vue";
 import type { Policy, PolicyTemplate } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
 import { useQuery } from "@tanstack/vue-query";
+import type { Ref } from "vue";
 
 interface useFetchAttachmentPolicyReturn {
   policies: Ref<Policy[] | undefined>;
diff --git a/ui/console-src/modules/contents/attachments/composables/use-attachment.ts b/ui/console-src/modules/contents/attachments/composables/use-attachment.ts
index 9f3d3a69f..1a386fd1f 100644
--- a/ui/console-src/modules/contents/attachments/composables/use-attachment.ts
+++ b/ui/console-src/modules/contents/attachments/composables/use-attachment.ts
@@ -1,11 +1,11 @@
+import { matchMediaType } from "@/utils/media-type";
 import type { Attachment } from "@halo-dev/api-client";
-import { computed, nextTick, type Ref, ref, watch } from "vue";
 import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
-import { useI18n } from "vue-i18n";
 import { useClipboard } from "@vueuse/core";
-import { matchMediaType } from "@/utils/media-type";
+import { computed, nextTick, ref, watch, type Ref } from "vue";
+import { useI18n } from "vue-i18n";
 
 interface useAttachmentControlReturn {
   attachments: Ref<Attachment[] | undefined>;
diff --git a/ui/console-src/modules/contents/attachments/module.ts b/ui/console-src/modules/contents/attachments/module.ts
index 8ebe2a708..1ef394bc9 100644
--- a/ui/console-src/modules/contents/attachments/module.ts
+++ b/ui/console-src/modules/contents/attachments/module.ts
@@ -1,9 +1,9 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
+import { IconFolder } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
+import { markRaw } from "vue";
 import AttachmentList from "./AttachmentList.vue";
 import AttachmentSelectorModal from "./components/AttachmentSelectorModal.vue";
-import { IconFolder } from "@halo-dev/components";
-import { markRaw } from "vue";
 
 export default definePlugin({
   components: {
diff --git a/ui/console-src/modules/contents/comments/CommentList.vue b/ui/console-src/modules/contents/comments/CommentList.vue
index 1ed62aeca..047be8216 100644
--- a/ui/console-src/modules/contents/comments/CommentList.vue
+++ b/ui/console-src/modules/contents/comments/CommentList.vue
@@ -1,25 +1,25 @@
 <script lang="ts" setup>
+import UserFilterDropdown from "@/components/filter/UserFilterDropdown.vue";
+import type { ListedComment } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
+  Dialog,
   IconMessage,
+  IconRefreshLine,
+  Toast,
   VButton,
   VCard,
+  VEmpty,
+  VLoading,
   VPageHeader,
   VPagination,
   VSpace,
-  IconRefreshLine,
-  VEmpty,
-  Dialog,
-  VLoading,
-  Toast,
 } from "@halo-dev/components";
-import CommentListItem from "./components/CommentListItem.vue";
-import type { ListedComment } from "@halo-dev/api-client";
-import { computed, ref, watch } from "vue";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import { useQuery } from "@tanstack/vue-query";
-import { useI18n } from "vue-i18n";
-import UserFilterDropdown from "@/components/filter/UserFilterDropdown.vue";
 import { useRouteQuery } from "@vueuse/router";
+import { computed, ref, watch } from "vue";
+import { useI18n } from "vue-i18n";
+import CommentListItem from "./components/CommentListItem.vue";
 
 const { t } = useI18n();
 
diff --git a/ui/console-src/modules/contents/comments/components/CommentListItem.vue b/ui/console-src/modules/contents/comments/components/CommentListItem.vue
index 31303e46d..296902c5f 100644
--- a/ui/console-src/modules/contents/comments/components/CommentListItem.vue
+++ b/ui/console-src/modules/contents/comments/components/CommentListItem.vue
@@ -1,6 +1,5 @@
 <script lang="ts" setup>
 import { usePluginModuleStore } from "@/stores/plugin";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import { formatDatetime } from "@/utils/date";
 import { usePermission } from "@/utils/permission";
 import type {
@@ -10,6 +9,7 @@ import type {
   Post,
   SinglePage,
 } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconAddCircle,
diff --git a/ui/console-src/modules/contents/comments/components/ReplyCreationModal.vue b/ui/console-src/modules/contents/comments/components/ReplyCreationModal.vue
index 862acce42..06842c842 100644
--- a/ui/console-src/modules/contents/comments/components/ReplyCreationModal.vue
+++ b/ui/console-src/modules/contents/comments/components/ReplyCreationModal.vue
@@ -1,4 +1,10 @@
 <script lang="ts" setup>
+import SubmitButton from "@/components/button/SubmitButton.vue";
+import type {
+  ListedComment,
+  ListedReply,
+  ReplyRequest,
+} from "@halo-dev/api-client";
 import {
   IconMotionLine,
   Toast,
@@ -7,18 +13,12 @@ import {
   VModal,
   VSpace,
 } from "@halo-dev/components";
-import SubmitButton from "@/components/button/SubmitButton.vue";
-import type {
-  ListedComment,
-  ListedReply,
-  ReplyRequest,
-} from "@halo-dev/api-client";
 // @ts-ignore
-import { Picker } from "emoji-mart";
-import i18n from "@emoji-mart/data/i18n/zh.json";
-import { onMounted, ref } from "vue";
 import { setFocus } from "@/formkit/utils/focus";
+import i18n from "@emoji-mart/data/i18n/zh.json";
 import { consoleApiClient } from "@halo-dev/api-client";
+import { Picker } from "emoji-mart";
+import { onMounted, ref } from "vue";
 import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/comments/components/ReplyListItem.vue b/ui/console-src/modules/contents/comments/components/ReplyListItem.vue
index 70eef6a49..738c6d746 100644
--- a/ui/console-src/modules/contents/comments/components/ReplyListItem.vue
+++ b/ui/console-src/modules/contents/comments/components/ReplyListItem.vue
@@ -1,4 +1,7 @@
 <script lang="ts" setup>
+import { formatDatetime } from "@/utils/date";
+import type { ListedComment, ListedReply } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconReplyLine,
@@ -10,12 +13,9 @@ import {
   VStatusDot,
   VTag,
 } from "@halo-dev/components";
-import type { ListedComment, ListedReply } from "@halo-dev/api-client";
-import { formatDatetime } from "@/utils/date";
-import { coreApiClient } from "@halo-dev/api-client";
+import { useQueryClient } from "@tanstack/vue-query";
 import { computed, inject, ref, type Ref } from "vue";
 import { useI18n } from "vue-i18n";
-import { useQueryClient } from "@tanstack/vue-query";
 import ReplyCreationModal from "./ReplyCreationModal.vue";
 
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/comments/module.ts b/ui/console-src/modules/contents/comments/module.ts
index c2c2f4b0c..eee1b12ce 100644
--- a/ui/console-src/modules/contents/comments/module.ts
+++ b/ui/console-src/modules/contents/comments/module.ts
@@ -1,9 +1,9 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
 import { IconMessage } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
+import { markRaw } from "vue";
 import CommentList from "./CommentList.vue";
 import CommentStatsWidget from "./widgets/CommentStatsWidget.vue";
-import { markRaw } from "vue";
 
 export default definePlugin({
   components: {
diff --git a/ui/console-src/modules/contents/comments/widgets/CommentStatsWidget.vue b/ui/console-src/modules/contents/comments/widgets/CommentStatsWidget.vue
index bfe96668a..ef7afbbca 100644
--- a/ui/console-src/modules/contents/comments/widgets/CommentStatsWidget.vue
+++ b/ui/console-src/modules/contents/comments/widgets/CommentStatsWidget.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { useDashboardStats } from "@console/composables/use-dashboard-stats";
-import { VCard, IconMessage } from "@halo-dev/components";
+import { IconMessage, VCard } from "@halo-dev/components";
 
 const { data: stats } = useDashboardStats();
 </script>
diff --git a/ui/console-src/modules/contents/pages/DeletedSinglePageList.vue b/ui/console-src/modules/contents/pages/DeletedSinglePageList.vue
index af05a5c23..294b6ff19 100644
--- a/ui/console-src/modules/contents/pages/DeletedSinglePageList.vue
+++ b/ui/console-src/modules/contents/pages/DeletedSinglePageList.vue
@@ -1,29 +1,29 @@
 <script lang="ts" setup>
+import { formatDatetime } from "@/utils/date";
+import { usePermission } from "@/utils/permission";
+import type { ListedSinglePage, SinglePage } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
+  Dialog,
   IconAddCircle,
-  IconRefreshLine,
   IconDeleteBin,
+  IconRefreshLine,
+  Toast,
   VButton,
   VCard,
-  VPagination,
-  VSpace,
-  Dialog,
+  VDropdownItem,
   VEmpty,
   VEntity,
   VEntityField,
-  VPageHeader,
-  VStatusDot,
   VLoading,
-  Toast,
-  VDropdownItem,
+  VPageHeader,
+  VPagination,
+  VSpace,
+  VStatusDot,
 } from "@halo-dev/components";
-import { ref, watch } from "vue";
-import type { ListedSinglePage, SinglePage } from "@halo-dev/api-client";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { formatDatetime } from "@/utils/date";
-import { cloneDeep } from "lodash-es";
-import { usePermission } from "@/utils/permission";
 import { useQuery } from "@tanstack/vue-query";
+import { cloneDeep } from "lodash-es";
+import { ref, watch } from "vue";
 import { useI18n } from "vue-i18n";
 import ContributorList from "../_components/ContributorList.vue";
 
diff --git a/ui/console-src/modules/contents/pages/SinglePageEditor.vue b/ui/console-src/modules/contents/pages/SinglePageEditor.vue
index 649882b11..3f217e99c 100644
--- a/ui/console-src/modules/contents/pages/SinglePageEditor.vue
+++ b/ui/console-src/modules/contents/pages/SinglePageEditor.vue
@@ -1,4 +1,21 @@
 <script lang="ts" setup>
+import EditorProviderSelector from "@/components/dropdown-selector/EditorProviderSelector.vue";
+import UrlPreviewModal from "@/components/preview/UrlPreviewModal.vue";
+import { useAutoSaveContent } from "@/composables/use-auto-save-content";
+import { useContentCache } from "@/composables/use-content-cache";
+import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points";
+import { useSessionKeepAlive } from "@/composables/use-session-keep-alive";
+import { contentAnnotations } from "@/constants/annotations";
+import { randomUUID } from "@/utils/id";
+import { usePermission } from "@/utils/permission";
+import { useContentSnapshot } from "@console/composables/use-content-snapshot";
+import { useSaveKeybinding } from "@console/composables/use-save-keybinding";
+import type { SinglePage, SinglePageRequest } from "@halo-dev/api-client";
+import {
+  consoleApiClient,
+  coreApiClient,
+  ucApiClient,
+} from "@halo-dev/api-client";
 import {
   Dialog,
   IconEye,
@@ -12,41 +29,24 @@ import {
   VPageHeader,
   VSpace,
 } from "@halo-dev/components";
-import SinglePageSettingModal from "./components/SinglePageSettingModal.vue";
-import type { SinglePage, SinglePageRequest } from "@halo-dev/api-client";
+import type { EditorProvider } from "@halo-dev/console-shared";
+import { useLocalStorage } from "@vueuse/core";
+import { useRouteQuery } from "@vueuse/router";
+import type { AxiosRequestConfig } from "axios";
 import {
   computed,
-  type ComputedRef,
   nextTick,
   onMounted,
   provide,
   ref,
   toRef,
   watch,
+  type ComputedRef,
 } from "vue";
-import {
-  consoleApiClient,
-  coreApiClient,
-  ucApiClient,
-} from "@halo-dev/api-client";
-import { useRouteQuery } from "@vueuse/router";
-import { useRouter } from "vue-router";
-import { randomUUID } from "@/utils/id";
-import { useContentCache } from "@/composables/use-content-cache";
-import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points";
-import type { EditorProvider } from "@halo-dev/console-shared";
-import { useLocalStorage } from "@vueuse/core";
-import EditorProviderSelector from "@/components/dropdown-selector/EditorProviderSelector.vue";
 import { useI18n } from "vue-i18n";
-import UrlPreviewModal from "@/components/preview/UrlPreviewModal.vue";
-import { contentAnnotations } from "@/constants/annotations";
+import { useRouter } from "vue-router";
+import SinglePageSettingModal from "./components/SinglePageSettingModal.vue";
 import { usePageUpdateMutate } from "./composables/use-page-update-mutate";
-import { useAutoSaveContent } from "@/composables/use-auto-save-content";
-import { useContentSnapshot } from "@console/composables/use-content-snapshot";
-import { useSaveKeybinding } from "@console/composables/use-save-keybinding";
-import { useSessionKeepAlive } from "@/composables/use-session-keep-alive";
-import { usePermission } from "@/utils/permission";
-import type { AxiosRequestConfig } from "axios";
 
 const router = useRouter();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/pages/SinglePageList.vue b/ui/console-src/modules/contents/pages/SinglePageList.vue
index 08fdd615e..508b4099c 100644
--- a/ui/console-src/modules/contents/pages/SinglePageList.vue
+++ b/ui/console-src/modules/contents/pages/SinglePageList.vue
@@ -1,4 +1,8 @@
 <script lang="ts" setup>
+import UserFilterDropdown from "@/components/filter/UserFilterDropdown.vue";
+import { singlePageLabels } from "@/constants/labels";
+import type { ListedSinglePage, SinglePage } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconAddCircle,
@@ -15,17 +19,13 @@ import {
   VPagination,
   VSpace,
 } from "@halo-dev/components";
-import SinglePageSettingModal from "./components/SinglePageSettingModal.vue";
+import { useQuery } from "@tanstack/vue-query";
+import { useRouteQuery } from "@vueuse/router";
 import type { Ref } from "vue";
 import { computed, provide, ref, watch } from "vue";
-import type { ListedSinglePage, SinglePage } from "@halo-dev/api-client";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { singlePageLabels } from "@/constants/labels";
-import { useQuery } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
-import UserFilterDropdown from "@/components/filter/UserFilterDropdown.vue";
 import SinglePageListItem from "./components/SinglePageListItem.vue";
-import { useRouteQuery } from "@vueuse/router";
+import SinglePageSettingModal from "./components/SinglePageSettingModal.vue";
 
 const { t } = useI18n();
 
diff --git a/ui/console-src/modules/contents/pages/SinglePageSnapshots.vue b/ui/console-src/modules/contents/pages/SinglePageSnapshots.vue
index 00072ba95..3db7fd4f8 100644
--- a/ui/console-src/modules/contents/pages/SinglePageSnapshots.vue
+++ b/ui/console-src/modules/contents/pages/SinglePageSnapshots.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconHistoryLine,
@@ -10,14 +11,13 @@ import {
   VSpace,
 } from "@halo-dev/components";
 import { useQuery, useQueryClient } from "@tanstack/vue-query";
-import { useRoute } from "vue-router";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { computed, watch } from "vue";
-import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
 import { useRouteQuery } from "@vueuse/router";
+import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
+import { computed, watch } from "vue";
+import { useI18n } from "vue-i18n";
+import { useRoute } from "vue-router";
 import SnapshotContent from "./components/SnapshotContent.vue";
 import SnapshotListItem from "./components/SnapshotListItem.vue";
-import { useI18n } from "vue-i18n";
 
 const queryClient = useQueryClient();
 const route = useRoute();
diff --git a/ui/console-src/modules/contents/pages/components/SinglePageListItem.vue b/ui/console-src/modules/contents/pages/components/SinglePageListItem.vue
index 086da5d41..75dac1926 100644
--- a/ui/console-src/modules/contents/pages/components/SinglePageListItem.vue
+++ b/ui/console-src/modules/contents/pages/components/SinglePageListItem.vue
@@ -1,29 +1,28 @@
 <script lang="ts" setup>
-import {
-  IconEye,
-  IconEyeOff,
-  IconExternalLinkLine,
-  VSpace,
-  Dialog,
-  VStatusDot,
-  VEntity,
-  VEntityField,
-  Toast,
-  VDropdownItem,
-  VDropdownDivider,
-} from "@halo-dev/components";
-import { computed, ref } from "vue";
+import { singlePageLabels } from "@/constants/labels";
+import { formatDatetime } from "@/utils/date";
+import { usePermission } from "@/utils/permission";
 import type { ListedSinglePage, SinglePage } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
-import { formatDatetime } from "@/utils/date";
-import { RouterLink } from "vue-router";
-import { cloneDeep } from "lodash-es";
-import { usePermission } from "@/utils/permission";
-import { singlePageLabels } from "@/constants/labels";
+import {
+  Dialog,
+  IconExternalLinkLine,
+  IconEye,
+  IconEyeOff,
+  Toast,
+  VDropdownDivider,
+  VDropdownItem,
+  VEntity,
+  VEntityField,
+  VSpace,
+  VStatusDot,
+} from "@halo-dev/components";
 import { useMutation, useQueryClient } from "@tanstack/vue-query";
-import { useI18n } from "vue-i18n";
-import { inject } from "vue";
+import { cloneDeep } from "lodash-es";
 import type { Ref } from "vue";
+import { computed, inject, ref } from "vue";
+import { useI18n } from "vue-i18n";
+import { RouterLink } from "vue-router";
 import ContributorList from "../../_components/ContributorList.vue";
 
 const { currentUserHasPermission } = usePermission();
diff --git a/ui/console-src/modules/contents/pages/components/SinglePageSettingModal.vue b/ui/console-src/modules/contents/pages/components/SinglePageSettingModal.vue
index db1f2fde7..97a104360 100644
--- a/ui/console-src/modules/contents/pages/components/SinglePageSettingModal.vue
+++ b/ui/console-src/modules/contents/pages/components/SinglePageSettingModal.vue
@@ -2,13 +2,13 @@
 import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
 import { singlePageLabels } from "@/constants/labels";
 import { FormType } from "@/types/slug";
-import { coreApiClient } from "@halo-dev/api-client";
 import { toDatetimeLocal, toISOString } from "@/utils/date";
 import { randomUUID } from "@/utils/id";
 import useSlugify from "@console/composables/use-slugify";
 import { useThemeCustomTemplates } from "@console/modules/interface/themes/composables/use-theme";
 import { submitForm } from "@formkit/core";
 import type { SinglePage } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   IconRefreshLine,
   Toast,
diff --git a/ui/console-src/modules/contents/pages/components/SnapshotContent.vue b/ui/console-src/modules/contents/pages/components/SnapshotContent.vue
index 24f056388..bd06e2a80 100644
--- a/ui/console-src/modules/contents/pages/components/SnapshotContent.vue
+++ b/ui/console-src/modules/contents/pages/components/SnapshotContent.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import { useQuery } from "@tanstack/vue-query";
 import { consoleApiClient } from "@halo-dev/api-client";
-import { computed, toRefs } from "vue";
 import { Toast, VLoading } from "@halo-dev/components";
+import { useQuery } from "@tanstack/vue-query";
 import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
+import { computed, toRefs } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/pages/components/SnapshotListItem.vue b/ui/console-src/modules/contents/pages/components/SnapshotListItem.vue
index 47015291f..6d872752b 100644
--- a/ui/console-src/modules/contents/pages/components/SnapshotListItem.vue
+++ b/ui/console-src/modules/contents/pages/components/SnapshotListItem.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
+import { relativeTimeTo } from "@/utils/date";
 import type { ListedSnapshotDto, SinglePage } from "@halo-dev/api-client";
 import { consoleApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast, VButton, VStatusDot, VTag } from "@halo-dev/components";
 import { useQueryClient } from "@tanstack/vue-query";
 import { computed } from "vue";
-import { relativeTimeTo } from "@/utils/date";
 import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/pages/composables/use-page-update-mutate.ts b/ui/console-src/modules/contents/pages/composables/use-page-update-mutate.ts
index 44e71b60a..2cb219d3b 100644
--- a/ui/console-src/modules/contents/pages/composables/use-page-update-mutate.ts
+++ b/ui/console-src/modules/contents/pages/composables/use-page-update-mutate.ts
@@ -1,7 +1,7 @@
-import { coreApiClient } from "@halo-dev/api-client";
-import { useMutation } from "@tanstack/vue-query";
 import type { SinglePage } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import { Toast } from "@halo-dev/components";
+import { useMutation } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
 
 export function usePageUpdateMutate() {
diff --git a/ui/console-src/modules/contents/pages/module.ts b/ui/console-src/modules/contents/pages/module.ts
index 0638087a8..1c7ab040d 100644
--- a/ui/console-src/modules/contents/pages/module.ts
+++ b/ui/console-src/modules/contents/pages/module.ts
@@ -1,12 +1,12 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import SinglePageList from "./SinglePageList.vue";
+import { IconPages } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
+import { markRaw } from "vue";
 import DeletedSinglePageList from "./DeletedSinglePageList.vue";
 import SinglePageEditor from "./SinglePageEditor.vue";
-import SinglePageStatsWidget from "./widgets/SinglePageStatsWidget.vue";
-import { IconPages } from "@halo-dev/components";
-import { markRaw } from "vue";
+import SinglePageList from "./SinglePageList.vue";
 import SinglePageSnapshots from "./SinglePageSnapshots.vue";
+import SinglePageStatsWidget from "./widgets/SinglePageStatsWidget.vue";
 
 export default definePlugin({
   components: {
diff --git a/ui/console-src/modules/contents/pages/widgets/SinglePageStatsWidget.vue b/ui/console-src/modules/contents/pages/widgets/SinglePageStatsWidget.vue
index 423d1ac0a..46dae2b64 100644
--- a/ui/console-src/modules/contents/pages/widgets/SinglePageStatsWidget.vue
+++ b/ui/console-src/modules/contents/pages/widgets/SinglePageStatsWidget.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { VCard, IconPages } from "@halo-dev/components";
-import { consoleApiClient } from "@halo-dev/api-client";
 import { singlePageLabels } from "@/constants/labels";
+import { consoleApiClient } from "@halo-dev/api-client";
+import { IconPages, VCard } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
 
 const { data: total } = useQuery({
diff --git a/ui/console-src/modules/contents/posts/DeletedPostList.vue b/ui/console-src/modules/contents/posts/DeletedPostList.vue
index 68f1d7745..94ddc472f 100644
--- a/ui/console-src/modules/contents/posts/DeletedPostList.vue
+++ b/ui/console-src/modules/contents/posts/DeletedPostList.vue
@@ -1,32 +1,32 @@
 <script lang="ts" setup>
+import { formatDatetime } from "@/utils/date";
+import { usePermission } from "@/utils/permission";
+import type { ListedPost, Post } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
+  Dialog,
   IconAddCircle,
   IconDeleteBin,
   IconRefreshLine,
-  Dialog,
+  Toast,
   VButton,
   VCard,
+  VDropdownItem,
   VEmpty,
+  VEntity,
+  VEntityField,
+  VLoading,
   VPageHeader,
   VPagination,
   VSpace,
   VStatusDot,
-  VEntity,
-  VEntityField,
-  VLoading,
-  Toast,
-  VDropdownItem,
 } from "@halo-dev/components";
-import PostTag from "./tags/components/PostTag.vue";
-import { ref, watch } from "vue";
-import type { ListedPost, Post } from "@halo-dev/api-client";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { formatDatetime } from "@/utils/date";
-import { usePermission } from "@/utils/permission";
-import { cloneDeep } from "lodash-es";
 import { useQuery } from "@tanstack/vue-query";
+import { cloneDeep } from "lodash-es";
+import { ref, watch } from "vue";
 import { useI18n } from "vue-i18n";
 import ContributorList from "../_components/ContributorList.vue";
+import PostTag from "./tags/components/PostTag.vue";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/posts/PostEditor.vue b/ui/console-src/modules/contents/posts/PostEditor.vue
index 13f210102..ca4059b1a 100644
--- a/ui/console-src/modules/contents/posts/PostEditor.vue
+++ b/ui/console-src/modules/contents/posts/PostEditor.vue
@@ -1,4 +1,21 @@
 <script lang="ts" setup>
+import EditorProviderSelector from "@/components/dropdown-selector/EditorProviderSelector.vue";
+import UrlPreviewModal from "@/components/preview/UrlPreviewModal.vue";
+import { useAutoSaveContent } from "@/composables/use-auto-save-content";
+import { useContentCache } from "@/composables/use-content-cache";
+import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points";
+import { useSessionKeepAlive } from "@/composables/use-session-keep-alive";
+import { contentAnnotations } from "@/constants/annotations";
+import { randomUUID } from "@/utils/id";
+import { usePermission } from "@/utils/permission";
+import { useContentSnapshot } from "@console/composables/use-content-snapshot";
+import { useSaveKeybinding } from "@console/composables/use-save-keybinding";
+import type { Post, PostRequest } from "@halo-dev/api-client";
+import {
+  consoleApiClient,
+  coreApiClient,
+  ucApiClient,
+} from "@halo-dev/api-client";
 import {
   Dialog,
   IconBookRead,
@@ -12,41 +29,24 @@ import {
   VPageHeader,
   VSpace,
 } from "@halo-dev/components";
-import PostSettingModal from "./components/PostSettingModal.vue";
-import type { Post, PostRequest } from "@halo-dev/api-client";
+import type { EditorProvider } from "@halo-dev/console-shared";
+import { useLocalStorage } from "@vueuse/core";
+import { useRouteQuery } from "@vueuse/router";
+import type { AxiosRequestConfig } from "axios";
 import {
   computed,
-  type ComputedRef,
   nextTick,
   onMounted,
   provide,
   ref,
   toRef,
   watch,
+  type ComputedRef,
 } from "vue";
-import {
-  consoleApiClient,
-  coreApiClient,
-  ucApiClient,
-} from "@halo-dev/api-client";
-import { useRouteQuery } from "@vueuse/router";
-import { useRouter } from "vue-router";
-import { randomUUID } from "@/utils/id";
-import { useContentCache } from "@/composables/use-content-cache";
-import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points";
-import type { EditorProvider } from "@halo-dev/console-shared";
-import { useLocalStorage } from "@vueuse/core";
-import EditorProviderSelector from "@/components/dropdown-selector/EditorProviderSelector.vue";
 import { useI18n } from "vue-i18n";
-import UrlPreviewModal from "@/components/preview/UrlPreviewModal.vue";
+import { useRouter } from "vue-router";
+import PostSettingModal from "./components/PostSettingModal.vue";
 import { usePostUpdateMutate } from "./composables/use-post-update-mutate";
-import { contentAnnotations } from "@/constants/annotations";
-import { useAutoSaveContent } from "@/composables/use-auto-save-content";
-import { useContentSnapshot } from "@console/composables/use-content-snapshot";
-import { useSaveKeybinding } from "@console/composables/use-save-keybinding";
-import { useSessionKeepAlive } from "@/composables/use-session-keep-alive";
-import { usePermission } from "@/utils/permission";
-import type { AxiosRequestConfig } from "axios";
 
 const router = useRouter();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/posts/PostList.vue b/ui/console-src/modules/contents/posts/PostList.vue
index 130d7c5d9..01c36facb 100644
--- a/ui/console-src/modules/contents/posts/PostList.vue
+++ b/ui/console-src/modules/contents/posts/PostList.vue
@@ -1,4 +1,10 @@
 <script lang="ts" setup>
+import CategoryFilterDropdown from "@/components/filter/CategoryFilterDropdown.vue";
+import TagFilterDropdown from "@/components/filter/TagFilterDropdown.vue";
+import UserFilterDropdown from "@/components/filter/UserFilterDropdown.vue";
+import { postLabels } from "@/constants/labels";
+import type { ListedPost, Post } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconAddCircle,
@@ -15,20 +21,14 @@ import {
   VPagination,
   VSpace,
 } from "@halo-dev/components";
-import PostSettingModal from "./components/PostSettingModal.vue";
+import { useQuery } from "@tanstack/vue-query";
+import { useRouteQuery } from "@vueuse/router";
 import type { Ref } from "vue";
 import { computed, provide, ref, watch } from "vue";
-import type { ListedPost, Post } from "@halo-dev/api-client";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { postLabels } from "@/constants/labels";
-import { useQuery } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
-import { useRouteQuery } from "@vueuse/router";
-import UserFilterDropdown from "@/components/filter/UserFilterDropdown.vue";
-import CategoryFilterDropdown from "@/components/filter/CategoryFilterDropdown.vue";
-import TagFilterDropdown from "@/components/filter/TagFilterDropdown.vue";
-import PostListItem from "./components/PostListItem.vue";
 import PostBatchSettingModal from "./components/PostBatchSettingModal.vue";
+import PostListItem from "./components/PostListItem.vue";
+import PostSettingModal from "./components/PostSettingModal.vue";
 
 const { t } = useI18n();
 
diff --git a/ui/console-src/modules/contents/posts/PostSnapshots.vue b/ui/console-src/modules/contents/posts/PostSnapshots.vue
index fb934bf23..c6478bfeb 100644
--- a/ui/console-src/modules/contents/posts/PostSnapshots.vue
+++ b/ui/console-src/modules/contents/posts/PostSnapshots.vue
@@ -1,4 +1,7 @@
 <script setup lang="ts">
+import SnapshotContent from "@console/modules/contents/posts/components/SnapshotContent.vue";
+import SnapshotListItem from "@console/modules/contents/posts/components/SnapshotListItem.vue";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconHistoryLine,
@@ -10,14 +13,11 @@ import {
   VSpace,
 } from "@halo-dev/components";
 import { useQuery, useQueryClient } from "@tanstack/vue-query";
-import { useRoute } from "vue-router";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { computed, watch } from "vue";
-import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
 import { useRouteQuery } from "@vueuse/router";
-import SnapshotContent from "@console/modules/contents/posts/components/SnapshotContent.vue";
-import SnapshotListItem from "@console/modules/contents/posts/components/SnapshotListItem.vue";
+import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
+import { computed, watch } from "vue";
 import { useI18n } from "vue-i18n";
+import { useRoute } from "vue-router";
 
 const { t } = useI18n();
 const route = useRoute();
diff --git a/ui/console-src/modules/contents/posts/categories/CategoryList.vue b/ui/console-src/modules/contents/posts/categories/CategoryList.vue
index 1abe3a1dd..c4be69aca 100644
--- a/ui/console-src/modules/contents/posts/categories/CategoryList.vue
+++ b/ui/console-src/modules/contents/posts/categories/CategoryList.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 // core libs
-import { ref } from "vue";
 import { coreApiClient } from "@halo-dev/api-client";
+import { ref } from "vue";
 
 // components
 import {
diff --git a/ui/console-src/modules/contents/posts/categories/components/CategoryEditingModal.vue b/ui/console-src/modules/contents/posts/categories/components/CategoryEditingModal.vue
index 88b39f4db..b90c8c448 100644
--- a/ui/console-src/modules/contents/posts/categories/components/CategoryEditingModal.vue
+++ b/ui/console-src/modules/contents/posts/categories/components/CategoryEditingModal.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 // core libs
-import { computed, nextTick, onMounted, ref } from "vue";
 import { coreApiClient } from "@halo-dev/api-client";
+import { computed, nextTick, onMounted, ref } from "vue";
 
 // components
 import SubmitButton from "@/components/button/SubmitButton.vue";
diff --git a/ui/console-src/modules/contents/posts/categories/components/CategoryListItem.vue b/ui/console-src/modules/contents/posts/categories/components/CategoryListItem.vue
index 2b1a27bec..8b441d44f 100644
--- a/ui/console-src/modules/contents/posts/categories/components/CategoryListItem.vue
+++ b/ui/console-src/modules/contents/posts/categories/components/CategoryListItem.vue
@@ -2,6 +2,7 @@
 import { formatDatetime } from "@/utils/date";
 import { usePermission } from "@/utils/permission";
 import type { Category } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconList,
@@ -16,7 +17,6 @@ import type { PropType } from "vue";
 import { ref } from "vue";
 import { VueDraggable } from "vue-draggable-plus";
 import { useI18n } from "vue-i18n";
-import { coreApiClient } from "@halo-dev/api-client";
 import GridiconsLinkBreak from "~icons/gridicons/link-break";
 import { convertCategoryTreeToCategory, type CategoryTree } from "../utils";
 import CategoryEditingModal from "./CategoryEditingModal.vue";
diff --git a/ui/console-src/modules/contents/posts/categories/components/__tests__/CategoryEditingModal.spec.ts b/ui/console-src/modules/contents/posts/categories/components/__tests__/CategoryEditingModal.spec.ts
index 31c04f29b..2f856cb69 100644
--- a/ui/console-src/modules/contents/posts/categories/components/__tests__/CategoryEditingModal.spec.ts
+++ b/ui/console-src/modules/contents/posts/categories/components/__tests__/CategoryEditingModal.spec.ts
@@ -1,9 +1,9 @@
-import { beforeEach, describe, expect, it } from "vitest";
-import { mount } from "@vue/test-utils";
-import CategoryEditingModal from "../CategoryEditingModal.vue";
-import { createPinia, setActivePinia } from "pinia";
-import { createI18n } from "vue-i18n";
 import messages from "@intlify/unplugin-vue-i18n/messages";
+import { mount } from "@vue/test-utils";
+import { createPinia, setActivePinia } from "pinia";
+import { beforeEach, describe, expect, it } from "vitest";
+import { createI18n } from "vue-i18n";
+import CategoryEditingModal from "../CategoryEditingModal.vue";
 
 describe("CategoryEditingModal", function () {
   beforeEach(() => {
diff --git a/ui/console-src/modules/contents/posts/categories/composables/use-post-category.ts b/ui/console-src/modules/contents/posts/categories/composables/use-post-category.ts
index 1285815b9..eaf6a6d5a 100644
--- a/ui/console-src/modules/contents/posts/categories/composables/use-post-category.ts
+++ b/ui/console-src/modules/contents/posts/categories/composables/use-post-category.ts
@@ -1,10 +1,10 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { Category } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
+import { useQuery } from "@tanstack/vue-query";
 import type { Ref } from "vue";
 import { ref } from "vue";
 import type { CategoryTree } from "../utils";
 import { buildCategoriesTree } from "../utils";
-import { useQuery } from "@tanstack/vue-query";
 
 interface usePostCategoryReturn {
   categories: Ref<Category[] | undefined>;
diff --git a/ui/console-src/modules/contents/posts/components/PostBatchSettingModal.vue b/ui/console-src/modules/contents/posts/components/PostBatchSettingModal.vue
index 4707bc9bd..a4c5eb9c6 100644
--- a/ui/console-src/modules/contents/posts/components/PostBatchSettingModal.vue
+++ b/ui/console-src/modules/contents/posts/components/PostBatchSettingModal.vue
@@ -1,12 +1,12 @@
 <script lang="ts" setup>
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import {
   coreApiClient,
   type JsonPatchInner,
   type ListedPost,
 } from "@halo-dev/api-client";
-import { ref } from "vue";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import { useMutation, useQueryClient } from "@tanstack/vue-query";
+import { ref } from "vue";
 import { useI18n } from "vue-i18n";
 
 type ArrayPatchOp = "add" | "replace" | "removeAll";
diff --git a/ui/console-src/modules/contents/posts/components/PostListItem.vue b/ui/console-src/modules/contents/posts/components/PostListItem.vue
index ea03a4d9e..f8ce4acfa 100644
--- a/ui/console-src/modules/contents/posts/components/PostListItem.vue
+++ b/ui/console-src/modules/contents/posts/components/PostListItem.vue
@@ -1,4 +1,13 @@
 <script lang="ts" setup>
+import EntityFieldItems from "@/components/entity-fields/EntityFieldItems.vue";
+import StatusDotField from "@/components/entity-fields/StatusDotField.vue";
+import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
+import { postLabels } from "@/constants/labels";
+import { usePermission } from "@/utils/permission";
+import { useEntityFieldItemExtensionPoint } from "@console/composables/use-entity-extension-points";
+import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
+import type { ListedPost, Post } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   Toast,
@@ -6,26 +15,17 @@ import {
   VDropdownItem,
   VEntity,
 } from "@halo-dev/components";
-import type { ListedPost, Post } from "@halo-dev/api-client";
-import { useI18n } from "vue-i18n";
-import { usePermission } from "@/utils/permission";
-import { consoleApiClient } from "@halo-dev/api-client";
+import type { EntityFieldItem, OperationItem } from "@halo-dev/console-shared";
 import { useQueryClient } from "@tanstack/vue-query";
 import type { Ref } from "vue";
 import { computed, inject, markRaw, ref, toRefs } from "vue";
+import { useI18n } from "vue-i18n";
 import { useRouter } from "vue-router";
-import { useEntityFieldItemExtensionPoint } from "@console/composables/use-entity-extension-points";
-import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
-import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
-import type { EntityFieldItem, OperationItem } from "@halo-dev/console-shared";
-import TitleField from "./entity-fields/TitleField.vue";
-import EntityFieldItems from "@/components/entity-fields/EntityFieldItems.vue";
 import ContributorsField from "./entity-fields/ContributorsField.vue";
 import PublishStatusField from "./entity-fields/PublishStatusField.vue";
-import VisibleField from "./entity-fields/VisibleField.vue";
-import StatusDotField from "@/components/entity-fields/StatusDotField.vue";
 import PublishTimeField from "./entity-fields/PublishTimeField.vue";
-import { postLabels } from "@/constants/labels";
+import TitleField from "./entity-fields/TitleField.vue";
+import VisibleField from "./entity-fields/VisibleField.vue";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/posts/components/PostSettingModal.vue b/ui/console-src/modules/contents/posts/components/PostSettingModal.vue
index 19fe889b8..09dde2e39 100644
--- a/ui/console-src/modules/contents/posts/components/PostSettingModal.vue
+++ b/ui/console-src/modules/contents/posts/components/PostSettingModal.vue
@@ -1,4 +1,14 @@
 <script lang="ts" setup>
+import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
+import { postLabels } from "@/constants/labels";
+import { FormType } from "@/types/slug";
+import { formatDatetime, toDatetimeLocal, toISOString } from "@/utils/date";
+import { randomUUID } from "@/utils/id";
+import useSlugify from "@console/composables/use-slugify";
+import { useThemeCustomTemplates } from "@console/modules/interface/themes/composables/use-theme";
+import { submitForm } from "@formkit/core";
+import type { Post } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   IconRefreshLine,
   Toast,
@@ -6,20 +16,10 @@ import {
   VModal,
   VSpace,
 } from "@halo-dev/components";
+import { cloneDeep } from "lodash-es";
 import { computed, nextTick, ref, watch } from "vue";
-import type { Post } from "@halo-dev/api-client";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { useThemeCustomTemplates } from "@console/modules/interface/themes/composables/use-theme";
-import { postLabels } from "@/constants/labels";
-import { randomUUID } from "@/utils/id";
-import { formatDatetime, toDatetimeLocal, toISOString } from "@/utils/date";
-import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
-import { submitForm } from "@formkit/core";
-import useSlugify from "@console/composables/use-slugify";
 import { useI18n } from "vue-i18n";
 import { usePostUpdateMutate } from "../composables/use-post-update-mutate";
-import { FormType } from "@/types/slug";
-import { cloneDeep } from "lodash-es";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/posts/components/SnapshotContent.vue b/ui/console-src/modules/contents/posts/components/SnapshotContent.vue
index 41985893f..e8566d99e 100644
--- a/ui/console-src/modules/contents/posts/components/SnapshotContent.vue
+++ b/ui/console-src/modules/contents/posts/components/SnapshotContent.vue
@@ -1,9 +1,9 @@
 <script setup lang="ts">
-import { useQuery } from "@tanstack/vue-query";
 import { consoleApiClient } from "@halo-dev/api-client";
-import { computed, toRefs } from "vue";
 import { Toast, VLoading } from "@halo-dev/components";
+import { useQuery } from "@tanstack/vue-query";
 import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
+import { computed, toRefs } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/posts/components/SnapshotListItem.vue b/ui/console-src/modules/contents/posts/components/SnapshotListItem.vue
index 46e0eecad..fb41df46b 100644
--- a/ui/console-src/modules/contents/posts/components/SnapshotListItem.vue
+++ b/ui/console-src/modules/contents/posts/components/SnapshotListItem.vue
@@ -1,10 +1,10 @@
 <script setup lang="ts">
+import { relativeTimeTo } from "@/utils/date";
 import type { ListedSnapshotDto, Post } from "@halo-dev/api-client";
 import { consoleApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast, VButton, VStatusDot, VTag } from "@halo-dev/components";
 import { useQueryClient } from "@tanstack/vue-query";
 import { computed } from "vue";
-import { relativeTimeTo } from "@/utils/date";
 import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
diff --git a/ui/console-src/modules/contents/posts/components/__tests__/PostSettingModal.spec.ts b/ui/console-src/modules/contents/posts/components/__tests__/PostSettingModal.spec.ts
index d642976a0..3e674d19a 100644
--- a/ui/console-src/modules/contents/posts/components/__tests__/PostSettingModal.spec.ts
+++ b/ui/console-src/modules/contents/posts/components/__tests__/PostSettingModal.spec.ts
@@ -1,10 +1,10 @@
-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";
-import { createI18n } from "vue-i18n";
 import messages from "@intlify/unplugin-vue-i18n/messages";
+import { VueQueryPlugin } from "@tanstack/vue-query";
+import { mount } from "@vue/test-utils";
+import { createPinia, setActivePinia } from "pinia";
+import { beforeEach, describe, expect, it } from "vitest";
+import { createI18n } from "vue-i18n";
+import PostSettingModal from "../PostSettingModal.vue";
 
 describe("PostSettingModal", () => {
   beforeEach(() => {
diff --git a/ui/console-src/modules/contents/posts/components/entity-fields/ContributorsField.vue b/ui/console-src/modules/contents/posts/components/entity-fields/ContributorsField.vue
index 87b609032..d2987096c 100644
--- a/ui/console-src/modules/contents/posts/components/entity-fields/ContributorsField.vue
+++ b/ui/console-src/modules/contents/posts/components/entity-fields/ContributorsField.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { VEntityField } from "@halo-dev/components";
-import type { ListedPost } from "@halo-dev/api-client";
 import ContributorList from "@console/modules/contents/_components/ContributorList.vue";
+import type { ListedPost } from "@halo-dev/api-client";
+import { VEntityField } from "@halo-dev/components";
 
 withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/posts/components/entity-fields/PublishStatusField.vue b/ui/console-src/modules/contents/posts/components/entity-fields/PublishStatusField.vue
index 4e4102856..662afc396 100644
--- a/ui/console-src/modules/contents/posts/components/entity-fields/PublishStatusField.vue
+++ b/ui/console-src/modules/contents/posts/components/entity-fields/PublishStatusField.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { VEntityField, VStatusDot } from "@halo-dev/components";
-import type { ListedPost } from "@halo-dev/api-client";
 import { postLabels } from "@/constants/labels";
+import type { ListedPost } from "@halo-dev/api-client";
+import { VEntityField, VStatusDot } from "@halo-dev/components";
 import { computed } from "vue";
 import { useI18n } from "vue-i18n";
 
diff --git a/ui/console-src/modules/contents/posts/components/entity-fields/PublishTimeField.vue b/ui/console-src/modules/contents/posts/components/entity-fields/PublishTimeField.vue
index 70b91bbc8..74a13edb7 100644
--- a/ui/console-src/modules/contents/posts/components/entity-fields/PublishTimeField.vue
+++ b/ui/console-src/modules/contents/posts/components/entity-fields/PublishTimeField.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import { postLabels } from "@/constants/labels";
 import { formatDatetime } from "@/utils/date";
-import { IconTimerLine, VEntityField } from "@halo-dev/components";
 import type { ListedPost } from "@halo-dev/api-client";
+import { IconTimerLine, VEntityField } from "@halo-dev/components";
 
 withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/posts/components/entity-fields/TitleField.vue b/ui/console-src/modules/contents/posts/components/entity-fields/TitleField.vue
index e9c6b050a..df9bad2af 100644
--- a/ui/console-src/modules/contents/posts/components/entity-fields/TitleField.vue
+++ b/ui/console-src/modules/contents/posts/components/entity-fields/TitleField.vue
@@ -1,14 +1,14 @@
 <script lang="ts" setup>
+import { postLabels } from "@/constants/labels";
+import type { ListedPost } from "@halo-dev/api-client";
 import {
   IconExternalLinkLine,
   VEntityField,
   VSpace,
   VStatusDot,
 } from "@halo-dev/components";
-import PostTag from "../../tags/components/PostTag.vue";
-import type { ListedPost } from "@halo-dev/api-client";
-import { postLabels } from "@/constants/labels";
 import { computed } from "vue";
+import PostTag from "../../tags/components/PostTag.vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/posts/components/entity-fields/VisibleField.vue b/ui/console-src/modules/contents/posts/components/entity-fields/VisibleField.vue
index 00a57d5fc..364cf1535 100644
--- a/ui/console-src/modules/contents/posts/components/entity-fields/VisibleField.vue
+++ b/ui/console-src/modules/contents/posts/components/entity-fields/VisibleField.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { coreApiClient } from "@halo-dev/api-client";
 import type { ListedPost, Post } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import { IconEye, IconEyeOff, Toast, VEntityField } from "@halo-dev/components";
 import { useMutation, useQueryClient } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
diff --git a/ui/console-src/modules/contents/posts/composables/use-post-update-mutate.ts b/ui/console-src/modules/contents/posts/composables/use-post-update-mutate.ts
index 558622e0b..2716c75dc 100644
--- a/ui/console-src/modules/contents/posts/composables/use-post-update-mutate.ts
+++ b/ui/console-src/modules/contents/posts/composables/use-post-update-mutate.ts
@@ -1,7 +1,7 @@
-import { useMutation } from "@tanstack/vue-query";
 import type { Post } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
 import { Toast } from "@halo-dev/components";
+import { useMutation } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
 
 export function usePostUpdateMutate() {
diff --git a/ui/console-src/modules/contents/posts/module.ts b/ui/console-src/modules/contents/posts/module.ts
index 2b8dd997f..6c391b378 100644
--- a/ui/console-src/modules/contents/posts/module.ts
+++ b/ui/console-src/modules/contents/posts/module.ts
@@ -1,16 +1,16 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
 import BlankLayout from "@console/layouts/BlankLayout.vue";
 import { IconBookRead } from "@halo-dev/components";
-import PostList from "./PostList.vue";
+import { definePlugin } from "@halo-dev/console-shared";
+import { markRaw } from "vue";
 import DeletedPostList from "./DeletedPostList.vue";
 import PostEditor from "./PostEditor.vue";
+import PostList from "./PostList.vue";
+import PostSnapshots from "./PostSnapshots.vue";
 import CategoryList from "./categories/CategoryList.vue";
 import TagList from "./tags/TagList.vue";
 import PostStatsWidget from "./widgets/PostStatsWidget.vue";
 import RecentPublishedWidget from "./widgets/RecentPublishedWidget.vue";
-import { markRaw } from "vue";
-import PostSnapshots from "./PostSnapshots.vue";
 
 export default definePlugin({
   components: {
diff --git a/ui/console-src/modules/contents/posts/tags/TagList.vue b/ui/console-src/modules/contents/posts/tags/TagList.vue
index 824c01b57..639128635 100644
--- a/ui/console-src/modules/contents/posts/tags/TagList.vue
+++ b/ui/console-src/modules/contents/posts/tags/TagList.vue
@@ -1,28 +1,27 @@
 <script lang="ts" setup>
+import FilterCleanButton from "@/components/filter/FilterCleanButton.vue";
+import SearchInput from "@/components/input/SearchInput.vue";
+import HasPermission from "@/components/permission/HasPermission.vue";
 import type { Tag } from "@halo-dev/api-client";
-import { onMounted, ref, watch } from "vue";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   IconAddCircle,
   IconBookRead,
+  IconRefreshLine,
   VButton,
   VCard,
   VEmpty,
-  VPageHeader,
-  VSpace,
   VLoading,
+  VPageHeader,
   VPagination,
-  IconRefreshLine,
+  VSpace,
 } from "@halo-dev/components";
-import HasPermission from "@/components/permission/HasPermission.vue";
-import TagEditingModal from "./components/TagEditingModal.vue";
 import { useRouteQuery } from "@vueuse/router";
-import { coreApiClient } from "@halo-dev/api-client";
-import { usePostTag } from "./composables/use-post-tag";
-import TagListItem from "./components/TagListItem.vue";
-import SearchInput from "@/components/input/SearchInput.vue";
-import FilterCleanButton from "@/components/filter/FilterCleanButton.vue";
-import { computed } from "vue";
+import { computed, onMounted, ref, watch } from "vue";
 import { useI18n } from "vue-i18n";
+import TagEditingModal from "./components/TagEditingModal.vue";
+import TagListItem from "./components/TagListItem.vue";
+import { usePostTag } from "./composables/use-post-tag";
 
 const { t } = useI18n();
 
diff --git a/ui/console-src/modules/contents/posts/tags/components/PostTag.vue b/ui/console-src/modules/contents/posts/tags/components/PostTag.vue
index 35ae402ef..b74382a77 100644
--- a/ui/console-src/modules/contents/posts/tags/components/PostTag.vue
+++ b/ui/console-src/modules/contents/posts/tags/components/PostTag.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import { VTag } from "@halo-dev/components";
 import type { Tag } from "@halo-dev/api-client";
+import { VTag } from "@halo-dev/components";
+import Color from "colorjs.io";
 import { computed } from "vue";
 import { useRouter } from "vue-router";
-import Color from "colorjs.io";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/posts/tags/components/TagEditingModal.vue b/ui/console-src/modules/contents/posts/tags/components/TagEditingModal.vue
index ce47a5e96..ec60168e5 100644
--- a/ui/console-src/modules/contents/posts/tags/components/TagEditingModal.vue
+++ b/ui/console-src/modules/contents/posts/tags/components/TagEditingModal.vue
@@ -1,9 +1,10 @@
 <script lang="ts" setup>
 // core libs
-import { computed, nextTick, ref, watch } from "vue";
 import { coreApiClient } from "@halo-dev/api-client";
+import { computed, nextTick, ref, watch } from "vue";
 
 // components
+import SubmitButton from "@/components/button/SubmitButton.vue";
 import {
   IconArrowLeft,
   IconArrowRight,
@@ -13,19 +14,18 @@ import {
   VModal,
   VSpace,
 } from "@halo-dev/components";
-import SubmitButton from "@/components/button/SubmitButton.vue";
 
 // types
 import type { Tag } from "@halo-dev/api-client";
 
 // libs
-import { setFocus } from "@/formkit/utils/focus";
 import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
-import useSlugify from "@console/composables/use-slugify";
-import { useI18n } from "vue-i18n";
+import { setFocus } from "@/formkit/utils/focus";
 import { FormType } from "@/types/slug";
-import { onMounted } from "vue";
+import useSlugify from "@console/composables/use-slugify";
 import { cloneDeep } from "lodash-es";
+import { onMounted } from "vue";
+import { useI18n } from "vue-i18n";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/contents/posts/tags/components/TagListItem.vue b/ui/console-src/modules/contents/posts/tags/components/TagListItem.vue
index 479c1fab3..728263383 100644
--- a/ui/console-src/modules/contents/posts/tags/components/TagListItem.vue
+++ b/ui/console-src/modules/contents/posts/tags/components/TagListItem.vue
@@ -3,12 +3,12 @@ import HasPermission from "@/components/permission/HasPermission.vue";
 import { formatDatetime } from "@/utils/date";
 import type { Tag } from "@halo-dev/api-client";
 import {
-  VStatusDot,
+  IconExternalLinkLine,
+  VDropdownItem,
   VEntity,
   VEntityField,
-  VDropdownItem,
-  IconExternalLinkLine,
   VSpace,
+  VStatusDot,
 } from "@halo-dev/components";
 import PostTag from "./PostTag.vue";
 
diff --git a/ui/console-src/modules/contents/posts/tags/composables/use-post-tag.ts b/ui/console-src/modules/contents/posts/tags/composables/use-post-tag.ts
index 6d69b43a6..446926aaa 100644
--- a/ui/console-src/modules/contents/posts/tags/composables/use-post-tag.ts
+++ b/ui/console-src/modules/contents/posts/tags/composables/use-post-tag.ts
@@ -1,8 +1,8 @@
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import type { Tag } from "@halo-dev/api-client";
-import { ref, watch, type Ref } from "vue";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast } from "@halo-dev/components";
 import { useQuery, type QueryObserverResult } from "@tanstack/vue-query";
+import { ref, watch, type Ref } from "vue";
 import { useI18n } from "vue-i18n";
 
 interface usePostTagReturn {
diff --git a/ui/console-src/modules/contents/posts/widgets/PostStatsWidget.vue b/ui/console-src/modules/contents/posts/widgets/PostStatsWidget.vue
index 28ae4f1b9..ac86c0112 100644
--- a/ui/console-src/modules/contents/posts/widgets/PostStatsWidget.vue
+++ b/ui/console-src/modules/contents/posts/widgets/PostStatsWidget.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { VCard, IconBookRead } from "@halo-dev/components";
 import { useDashboardStats } from "@console/composables/use-dashboard-stats";
+import { IconBookRead, VCard } from "@halo-dev/components";
 
 const { data: stats } = useDashboardStats();
 </script>
diff --git a/ui/console-src/modules/contents/posts/widgets/RecentPublishedWidget.vue b/ui/console-src/modules/contents/posts/widgets/RecentPublishedWidget.vue
index f0ab706f7..50fe26a45 100644
--- a/ui/console-src/modules/contents/posts/widgets/RecentPublishedWidget.vue
+++ b/ui/console-src/modules/contents/posts/widgets/RecentPublishedWidget.vue
@@ -1,15 +1,15 @@
 <script lang="ts" setup>
-import {
-  VCard,
-  VSpace,
-  VEntity,
-  VEntityField,
-  IconExternalLinkLine,
-} from "@halo-dev/components";
+import { postLabels } from "@/constants/labels";
+import { formatDatetime } from "@/utils/date";
 import type { ListedPost } from "@halo-dev/api-client";
 import { consoleApiClient } from "@halo-dev/api-client";
-import { formatDatetime } from "@/utils/date";
-import { postLabels } from "@/constants/labels";
+import {
+  IconExternalLinkLine,
+  VCard,
+  VEntity,
+  VEntityField,
+  VSpace,
+} from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
 import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
 
diff --git a/ui/console-src/modules/dashboard/Dashboard.vue b/ui/console-src/modules/dashboard/Dashboard.vue
index 53235bb2c..eb201d390 100644
--- a/ui/console-src/modules/dashboard/Dashboard.vue
+++ b/ui/console-src/modules/dashboard/Dashboard.vue
@@ -110,6 +110,7 @@
   </VModal>
 </template>
 <script lang="ts" setup>
+import { usePermission } from "@/utils/permission";
 import {
   IconAddCircle,
   IconCloseCircle,
@@ -122,11 +123,10 @@ import {
   VSpace,
   VTabbar,
 } from "@halo-dev/components";
-import { ref } from "vue";
 import { useStorage } from "@vueuse/core";
 import { cloneDeep } from "lodash-es";
+import { ref } from "vue";
 import { useI18n } from "vue-i18n";
-import { usePermission } from "@/utils/permission";
 
 const { t } = useI18n();
 const { currentUserHasPermission } = usePermission();
diff --git a/ui/console-src/modules/dashboard/module.ts b/ui/console-src/modules/dashboard/module.ts
index acfad5ed5..a33977d08 100644
--- a/ui/console-src/modules/dashboard/module.ts
+++ b/ui/console-src/modules/dashboard/module.ts
@@ -1,11 +1,11 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import Dashboard from "./Dashboard.vue";
 import { IconDashboard } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
+import Dashboard from "./Dashboard.vue";
 
+import { markRaw } from "vue";
 import QuickLinkWidget from "./widgets/QuickLinkWidget.vue";
 import ViewsStatsWidget from "./widgets/ViewsStatsWidget.vue";
-import { markRaw } from "vue";
 
 export default definePlugin({
   components: {
diff --git a/ui/console-src/modules/dashboard/widgets/QuickLinkWidget.vue b/ui/console-src/modules/dashboard/widgets/QuickLinkWidget.vue
index 4138f1802..9c8287576 100644
--- a/ui/console-src/modules/dashboard/widgets/QuickLinkWidget.vue
+++ b/ui/console-src/modules/dashboard/widgets/QuickLinkWidget.vue
@@ -1,26 +1,26 @@
 <script lang="ts" setup>
-import {
-  IconArrowRight,
-  IconBookRead,
-  IconFolder,
-  IconPages,
-  IconPlug,
-  IconUserSettings,
-  IconPalette,
-  IconWindowLine,
-  IconSearch,
-  IconDatabase2Line,
-  VCard,
-  IconAccountCircleLine,
-  Dialog,
-  Toast,
-} from "@halo-dev/components";
-import { markRaw, ref, type Component } from "vue";
-import { useRouter } from "vue-router";
 import ThemePreviewModal from "@console/modules/interface/themes/components/preview/ThemePreviewModal.vue";
 import { consoleApiClient } from "@halo-dev/api-client";
-import { useI18n } from "vue-i18n";
+import {
+  Dialog,
+  IconAccountCircleLine,
+  IconArrowRight,
+  IconBookRead,
+  IconDatabase2Line,
+  IconFolder,
+  IconPages,
+  IconPalette,
+  IconPlug,
+  IconSearch,
+  IconUserSettings,
+  IconWindowLine,
+  Toast,
+  VCard,
+} from "@halo-dev/components";
 import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
+import { markRaw, ref, type Component } from "vue";
+import { useI18n } from "vue-i18n";
+import { useRouter } from "vue-router";
 
 interface Action {
   icon: Component;
diff --git a/ui/console-src/modules/dashboard/widgets/ViewsStatsWidget.vue b/ui/console-src/modules/dashboard/widgets/ViewsStatsWidget.vue
index 429d4a25b..7fc3da24b 100644
--- a/ui/console-src/modules/dashboard/widgets/ViewsStatsWidget.vue
+++ b/ui/console-src/modules/dashboard/widgets/ViewsStatsWidget.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { useDashboardStats } from "@console/composables/use-dashboard-stats";
-import { VCard, IconEye } from "@halo-dev/components";
+import { IconEye, VCard } from "@halo-dev/components";
 
 const { data: stats } = useDashboardStats();
 </script>
diff --git a/ui/console-src/modules/interface/menus/Menus.vue b/ui/console-src/modules/interface/menus/Menus.vue
index 7ba7f0bee..fe8f897e3 100644
--- a/ui/console-src/modules/interface/menus/Menus.vue
+++ b/ui/console-src/modules/interface/menus/Menus.vue
@@ -1,4 +1,6 @@
 <script lang="ts" setup>
+import type { Menu, MenuItem } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconAddCircle,
@@ -11,13 +13,14 @@ import {
   VPageHeader,
   VSpace,
 } from "@halo-dev/components";
+import { useQuery, useQueryClient } from "@tanstack/vue-query";
+import { useDebounceFn } from "@vueuse/core";
+import { cloneDeep } from "lodash-es";
+import { computed, ref } from "vue";
+import { useI18n } from "vue-i18n";
 import MenuItemEditingModal from "./components/MenuItemEditingModal.vue";
 import MenuItemListItem from "./components/MenuItemListItem.vue";
 import MenuList from "./components/MenuList.vue";
-import { computed, ref } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
-import type { Menu, MenuItem } from "@halo-dev/api-client";
-import { cloneDeep } from "lodash-es";
 import type { MenuTreeItem } from "./utils";
 import {
   buildMenuItemsTree,
@@ -26,9 +29,6 @@ import {
   getChildrenNames,
   resetMenuItemsTreePriority,
 } from "./utils";
-import { useDebounceFn } from "@vueuse/core";
-import { useI18n } from "vue-i18n";
-import { useQuery, useQueryClient } from "@tanstack/vue-query";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/console-src/modules/interface/menus/components/MenuEditingModal.vue b/ui/console-src/modules/interface/menus/components/MenuEditingModal.vue
index 34ddb0ac4..5f487f124 100644
--- a/ui/console-src/modules/interface/menus/components/MenuEditingModal.vue
+++ b/ui/console-src/modules/interface/menus/components/MenuEditingModal.vue
@@ -1,13 +1,13 @@
 <script lang="ts" setup>
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
-import type { Menu } from "@halo-dev/api-client";
-import { onMounted, ref } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
 import { setFocus } from "@/formkit/utils/focus";
-import { useI18n } from "vue-i18n";
+import type { Menu } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import { useQueryClient } from "@tanstack/vue-query";
 import { cloneDeep } from "lodash-es";
+import { onMounted, ref } from "vue";
+import { useI18n } from "vue-i18n";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/interface/menus/components/MenuItemEditingModal.vue b/ui/console-src/modules/interface/menus/components/MenuItemEditingModal.vue
index 668c985a8..1e4e22fe1 100644
--- a/ui/console-src/modules/interface/menus/components/MenuItemEditingModal.vue
+++ b/ui/console-src/modules/interface/menus/components/MenuItemEditingModal.vue
@@ -1,13 +1,13 @@
 <script lang="ts" setup>
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
-import { computed, nextTick, onMounted, ref } from "vue";
+import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
+import { setFocus } from "@/formkit/utils/focus";
 import type { Menu, MenuItem, Ref } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
-import { setFocus } from "@/formkit/utils/focus";
-import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
-import { useI18n } from "vue-i18n";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import { cloneDeep } from "lodash-es";
+import { computed, nextTick, onMounted, ref } from "vue";
+import { useI18n } from "vue-i18n";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/interface/menus/components/MenuItemListItem.vue b/ui/console-src/modules/interface/menus/components/MenuItemListItem.vue
index e98bb8f01..9d0543ad2 100644
--- a/ui/console-src/modules/interface/menus/components/MenuItemListItem.vue
+++ b/ui/console-src/modules/interface/menus/components/MenuItemListItem.vue
@@ -1,4 +1,6 @@
 <script lang="ts" setup>
+import { usePermission } from "@/utils/permission";
+import type { MenuTreeItem } from "@console/modules/interface/menus/utils";
 import {
   IconList,
   VDropdownItem,
@@ -7,11 +9,9 @@ import {
   VStatusDot,
   VTag,
 } from "@halo-dev/components";
-import { VueDraggable } from "vue-draggable-plus";
-import type { MenuTreeItem } from "@console/modules/interface/menus/utils";
-import { usePermission } from "@/utils/permission";
-import { useI18n } from "vue-i18n";
 import type { PropType } from "vue";
+import { VueDraggable } from "vue-draggable-plus";
+import { useI18n } from "vue-i18n";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/interface/menus/components/MenuList.vue b/ui/console-src/modules/interface/menus/components/MenuList.vue
index 4fc4be989..36f3bd7c2 100644
--- a/ui/console-src/modules/interface/menus/components/MenuList.vue
+++ b/ui/console-src/modules/interface/menus/components/MenuList.vue
@@ -1,4 +1,7 @@
 <script lang="ts" setup>
+import { usePermission } from "@/utils/permission";
+import type { Menu } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   Toast,
@@ -13,14 +16,11 @@ import {
   VStatusDot,
   VTag,
 } from "@halo-dev/components";
-import MenuEditingModal from "./MenuEditingModal.vue";
-import { onMounted, ref } from "vue";
-import type { Menu } from "@halo-dev/api-client";
-import { coreApiClient } from "@halo-dev/api-client";
-import { useRouteQuery } from "@vueuse/router";
-import { usePermission } from "@/utils/permission";
-import { useI18n } from "vue-i18n";
 import { useQuery } from "@tanstack/vue-query";
+import { useRouteQuery } from "@vueuse/router";
+import { onMounted, ref } from "vue";
+import { useI18n } from "vue-i18n";
+import MenuEditingModal from "./MenuEditingModal.vue";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/interface/menus/module.ts b/ui/console-src/modules/interface/menus/module.ts
index f1e860624..ddfbddd26 100644
--- a/ui/console-src/modules/interface/menus/module.ts
+++ b/ui/console-src/modules/interface/menus/module.ts
@@ -1,8 +1,8 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import Menus from "./Menus.vue";
 import { IconListSettings } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
 import { markRaw } from "vue";
+import Menus from "./Menus.vue";
 
 export default definePlugin({
   components: {},
diff --git a/ui/console-src/modules/interface/menus/utils/__tests__/index.spec.ts b/ui/console-src/modules/interface/menus/utils/__tests__/index.spec.ts
index c34eaa890..833edf89d 100644
--- a/ui/console-src/modules/interface/menus/utils/__tests__/index.spec.ts
+++ b/ui/console-src/modules/interface/menus/utils/__tests__/index.spec.ts
@@ -1,3 +1,4 @@
+import type { MenuItem } from "@halo-dev/api-client";
 import { describe, expect, it } from "vitest";
 import type { MenuTreeItem } from "../index";
 import {
@@ -8,7 +9,6 @@ import {
   resetMenuItemsTreePriority,
   sortMenuItemsTree,
 } from "../index";
-import type { MenuItem } from "@halo-dev/api-client";
 
 const rawMenuItems: MenuItem[] = [
   {
diff --git a/ui/console-src/modules/interface/themes/ThemeDetail.vue b/ui/console-src/modules/interface/themes/ThemeDetail.vue
index cbd34a9e6..413b4726a 100644
--- a/ui/console-src/modules/interface/themes/ThemeDetail.vue
+++ b/ui/console-src/modules/interface/themes/ThemeDetail.vue
@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import type { Theme } from "@halo-dev/api-client";
 import {
   Dialog,
   IconMore,
@@ -12,7 +13,6 @@ import {
   VStatusDot,
   VTag,
 } from "@halo-dev/components";
-import type { Theme } from "@halo-dev/api-client";
 
 import { consoleApiClient } from "@halo-dev/api-client";
 import type { Ref } from "vue";
diff --git a/ui/console-src/modules/interface/themes/ThemeSetting.vue b/ui/console-src/modules/interface/themes/ThemeSetting.vue
index d9116f220..7f207c82b 100644
--- a/ui/console-src/modules/interface/themes/ThemeSetting.vue
+++ b/ui/console-src/modules/interface/themes/ThemeSetting.vue
@@ -1,20 +1,20 @@
 <script lang="ts" setup>
 // core libs
-import { inject, ref, computed, toRaw } from "vue";
+import { computed, inject, ref, toRaw } from "vue";
 
 // components
 import { Toast, VButton } from "@halo-dev/components";
 
 // types
-import type { Ref } from "vue";
 import type { ConfigMap, Setting, Theme } from "@halo-dev/api-client";
+import type { Ref } from "vue";
 
 // hooks
-import { consoleApiClient } from "@halo-dev/api-client";
-import { useSettingFormConvert } from "@console/composables/use-setting-form";
-import { useI18n } from "vue-i18n";
-import { useQuery, useQueryClient } from "@tanstack/vue-query";
 import StickyBlock from "@/components/sticky-block/StickyBlock.vue";
+import { useSettingFormConvert } from "@console/composables/use-setting-form";
+import { consoleApiClient } from "@halo-dev/api-client";
+import { useQuery, useQueryClient } from "@tanstack/vue-query";
+import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/console-src/modules/interface/themes/components/ThemeListItem.vue b/ui/console-src/modules/interface/themes/components/ThemeListItem.vue
index 2bf6a5563..fd566407d 100644
--- a/ui/console-src/modules/interface/themes/components/ThemeListItem.vue
+++ b/ui/console-src/modules/interface/themes/components/ThemeListItem.vue
@@ -1,27 +1,25 @@
 <script lang="ts" setup>
-import {
-  VTag,
-  VStatusDot,
-  Toast,
-  VDropdownItem,
-  VDropdown,
-  VDropdownDivider,
-  VButton,
-  VSpace,
-} from "@halo-dev/components";
+import { usePermission } from "@/utils/permission";
+import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
 import type { Theme } from "@halo-dev/api-client";
 import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { toRefs, ref, inject, type Ref } from "vue";
-import { useThemeLifeCycle } from "../composables/use-theme";
-import { usePermission } from "@/utils/permission";
-import { useI18n } from "vue-i18n";
-import { useQueryClient } from "@tanstack/vue-query";
-import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
-import { markRaw } from "vue";
-import UninstallOperationItem from "./operation/UninstallOperationItem.vue";
-import { computed } from "vue";
+import {
+  Toast,
+  VButton,
+  VDropdown,
+  VDropdownDivider,
+  VDropdownItem,
+  VSpace,
+  VStatusDot,
+  VTag,
+} from "@halo-dev/components";
 import type { OperationItem } from "@halo-dev/console-shared";
+import { useQueryClient } from "@tanstack/vue-query";
+import { computed, inject, markRaw, ref, toRefs, type Ref } from "vue";
+import { useI18n } from "vue-i18n";
+import { useThemeLifeCycle } from "../composables/use-theme";
 import MoreOperationItem from "./operation/MoreOperationItem.vue";
+import UninstallOperationItem from "./operation/UninstallOperationItem.vue";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/interface/themes/components/list-tabs/InstalledThemes.vue b/ui/console-src/modules/interface/themes/components/list-tabs/InstalledThemes.vue
index 55d90ba0a..401608f4f 100644
--- a/ui/console-src/modules/interface/themes/components/list-tabs/InstalledThemes.vue
+++ b/ui/console-src/modules/interface/themes/components/list-tabs/InstalledThemes.vue
@@ -1,4 +1,7 @@
 <script lang="ts" setup>
+import { useThemeStore } from "@console/stores/theme";
+import type { Theme } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import {
   IconAddCircle,
   VButton,
@@ -6,13 +9,10 @@ import {
   VLoading,
   VSpace,
 } from "@halo-dev/components";
-import ThemePreviewModal from "../preview/ThemePreviewModal.vue";
-import ThemeListItem from "../ThemeListItem.vue";
-import { inject, ref, type Ref } from "vue";
-import type { Theme } from "@halo-dev/api-client";
-import { consoleApiClient } from "@halo-dev/api-client";
 import { useQuery } from "@tanstack/vue-query";
-import { useThemeStore } from "@console/stores/theme";
+import { inject, ref, type Ref } from "vue";
+import ThemeListItem from "../ThemeListItem.vue";
+import ThemePreviewModal from "../preview/ThemePreviewModal.vue";
 
 const themeStore = useThemeStore();
 
diff --git a/ui/console-src/modules/interface/themes/components/list-tabs/LocalUpload.vue b/ui/console-src/modules/interface/themes/components/list-tabs/LocalUpload.vue
index 72d4eadaa..51beeb931 100644
--- a/ui/console-src/modules/interface/themes/components/list-tabs/LocalUpload.vue
+++ b/ui/console-src/modules/interface/themes/components/list-tabs/LocalUpload.vue
@@ -1,17 +1,15 @@
 <script lang="ts" setup>
 import AppDownloadAlert from "@/components/common/AppDownloadAlert.vue";
-import { Dialog, Toast } from "@halo-dev/components";
-import type { ErrorResponse } from "@uppy/core";
-import type { UppyFile } from "@uppy/core";
-import { THEME_ALREADY_EXISTS_TYPE } from "../../constants";
-import type { ThemeInstallationErrorResponse } from "../../types";
-import { useQueryClient } from "@tanstack/vue-query";
-import { useI18n } from "vue-i18n";
-import { inject } from "vue";
-import type { Ref } from "vue";
-import { ref } from "vue";
 import { useThemeStore } from "@console/stores/theme";
 import { consoleApiClient } from "@halo-dev/api-client";
+import { Dialog, Toast } from "@halo-dev/components";
+import { useQueryClient } from "@tanstack/vue-query";
+import type { ErrorResponse, UppyFile } from "@uppy/core";
+import type { Ref } from "vue";
+import { inject, ref } from "vue";
+import { useI18n } from "vue-i18n";
+import { THEME_ALREADY_EXISTS_TYPE } from "../../constants";
+import type { ThemeInstallationErrorResponse } from "../../types";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/console-src/modules/interface/themes/components/list-tabs/NotInstalledThemes.vue b/ui/console-src/modules/interface/themes/components/list-tabs/NotInstalledThemes.vue
index 52b55cd05..3a5e451cd 100644
--- a/ui/console-src/modules/interface/themes/components/list-tabs/NotInstalledThemes.vue
+++ b/ui/console-src/modules/interface/themes/components/list-tabs/NotInstalledThemes.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import { VButton, VEmpty, VSpace, VLoading } from "@halo-dev/components";
-import ThemeListItem from "../ThemeListItem.vue";
 import type { Theme } from "@halo-dev/api-client";
 import { consoleApiClient } from "@halo-dev/api-client";
+import { VButton, VEmpty, VLoading, VSpace } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
+import ThemeListItem from "../ThemeListItem.vue";
 
 const {
   data: themes,
diff --git a/ui/console-src/modules/interface/themes/components/list-tabs/RemoteDownload.vue b/ui/console-src/modules/interface/themes/components/list-tabs/RemoteDownload.vue
index 0444a3f98..1267e42a3 100644
--- a/ui/console-src/modules/interface/themes/components/list-tabs/RemoteDownload.vue
+++ b/ui/console-src/modules/interface/themes/components/list-tabs/RemoteDownload.vue
@@ -1,18 +1,15 @@
 <script lang="ts" setup>
+import { useThemeStore } from "@console/stores/theme";
+import { submitForm } from "@formkit/core";
 import { consoleApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast, VButton } from "@halo-dev/components";
 import { useQueryClient } from "@tanstack/vue-query";
-import type { Ref } from "vue";
-import { inject } from "vue";
-import { ref } from "vue";
-import { useI18n } from "vue-i18n";
-import type { ThemeInstallationErrorResponse } from "../../types";
-import { useThemeStore } from "@console/stores/theme";
-import { THEME_ALREADY_EXISTS_TYPE } from "../../constants";
 import { useRouteQuery } from "@vueuse/router";
-import { onMounted } from "vue";
-import { nextTick } from "vue";
-import { submitForm } from "@formkit/core";
+import type { Ref } from "vue";
+import { inject, nextTick, onMounted, ref } from "vue";
+import { useI18n } from "vue-i18n";
+import { THEME_ALREADY_EXISTS_TYPE } from "../../constants";
+import type { ThemeInstallationErrorResponse } from "../../types";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/console-src/modules/interface/themes/components/operation/MoreOperationItem.vue b/ui/console-src/modules/interface/themes/components/operation/MoreOperationItem.vue
index 814876741..f08a7c1e1 100644
--- a/ui/console-src/modules/interface/themes/components/operation/MoreOperationItem.vue
+++ b/ui/console-src/modules/interface/themes/components/operation/MoreOperationItem.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { VButton, IconMore } from "@halo-dev/components";
+import { IconMore, VButton } from "@halo-dev/components";
 </script>
 
 <template>
diff --git a/ui/console-src/modules/interface/themes/components/operation/UninstallOperationItem.vue b/ui/console-src/modules/interface/themes/components/operation/UninstallOperationItem.vue
index a8a14af40..20f86cb08 100644
--- a/ui/console-src/modules/interface/themes/components/operation/UninstallOperationItem.vue
+++ b/ui/console-src/modules/interface/themes/components/operation/UninstallOperationItem.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import { Dialog, Toast, VDropdown, VDropdownItem } from "@halo-dev/components";
 import type { Theme } from "@halo-dev/api-client";
-import { useI18n } from "vue-i18n";
 import { coreApiClient } from "@halo-dev/api-client";
+import { Dialog, Toast, VDropdown, VDropdownItem } from "@halo-dev/components";
 import { useQueryClient } from "@tanstack/vue-query";
+import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/console-src/modules/interface/themes/components/preview/ThemePreviewListItem.vue b/ui/console-src/modules/interface/themes/components/preview/ThemePreviewListItem.vue
index 65a9c0d09..45cbffaf8 100644
--- a/ui/console-src/modules/interface/themes/components/preview/ThemePreviewListItem.vue
+++ b/ui/console-src/modules/interface/themes/components/preview/ThemePreviewListItem.vue
@@ -2,10 +2,10 @@
 import LazyImage from "@/components/image/LazyImage.vue";
 import type { Theme } from "@halo-dev/api-client";
 import {
+  VDropdownItem,
   VEntity,
   VEntityField,
   VTag,
-  VDropdownItem,
 } from "@halo-dev/components";
 import { toRefs } from "vue";
 import { useThemeLifeCycle } from "../../composables/use-theme";
diff --git a/ui/console-src/modules/interface/themes/components/preview/ThemePreviewModal.vue b/ui/console-src/modules/interface/themes/components/preview/ThemePreviewModal.vue
index 9b30c8b07..56d485e72 100644
--- a/ui/console-src/modules/interface/themes/components/preview/ThemePreviewModal.vue
+++ b/ui/console-src/modules/interface/themes/components/preview/ThemePreviewModal.vue
@@ -1,35 +1,34 @@
 <script lang="ts" setup>
-import ThemePreviewListItem from "./ThemePreviewListItem.vue";
 import { useSettingFormConvert } from "@console/composables/use-setting-form";
 import { useThemeStore } from "@console/stores/theme";
-import { axiosInstance, consoleApiClient } from "@halo-dev/api-client";
 import type {
   ConfigMap,
   Setting,
   SettingForm,
   Theme,
 } from "@halo-dev/api-client";
+import { axiosInstance, consoleApiClient } from "@halo-dev/api-client";
 import {
-  VModal,
+  IconArrowLeft,
+  IconComputer,
   IconLink,
   IconPalette,
-  IconSettings,
-  IconArrowLeft,
-  VTabbar,
-  VButton,
-  IconComputer,
   IconPhone,
-  IconTablet,
   IconRefreshLine,
+  IconSettings,
+  IconTablet,
   Toast,
+  VButton,
   VLoading,
+  VModal,
+  VTabbar,
 } from "@halo-dev/components";
-import { storeToRefs } from "pinia";
-import { computed, markRaw, ref, toRaw } from "vue";
-import { useI18n } from "vue-i18n";
-import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
 import { useQuery } from "@tanstack/vue-query";
-import { onMounted } from "vue";
+import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
+import { storeToRefs } from "pinia";
+import { computed, markRaw, onMounted, ref, toRaw } from "vue";
+import { useI18n } from "vue-i18n";
+import ThemePreviewListItem from "./ThemePreviewListItem.vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/interface/themes/layouts/ThemeLayout.vue b/ui/console-src/modules/interface/themes/layouts/ThemeLayout.vue
index 9e3a6e164..98cb1fa4b 100644
--- a/ui/console-src/modules/interface/themes/layouts/ThemeLayout.vue
+++ b/ui/console-src/modules/interface/themes/layouts/ThemeLayout.vue
@@ -5,9 +5,9 @@ import {
   nextTick,
   onMounted,
   provide,
-  type Ref,
   ref,
   watch,
+  type Ref,
 } from "vue";
 import { useRoute, useRouter } from "vue-router";
 
@@ -20,6 +20,10 @@ import { useThemeLifeCycle } from "../composables/use-theme";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
 
 // components
+import { usePermission } from "@/utils/permission";
+import { useThemeStore } from "@console/stores/theme";
+import type { Setting, SettingForm, Theme } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconExchange,
@@ -34,16 +38,12 @@ import {
   VSpace,
   VTabbar,
 } from "@halo-dev/components";
-import ThemeListModal from "../components/ThemeListModal.vue";
-import ThemePreviewModal from "../components/preview/ThemePreviewModal.vue";
-import type { Setting, SettingForm, Theme } from "@halo-dev/api-client";
-import { usePermission } from "@/utils/permission";
-import { useThemeStore } from "@console/stores/theme";
-import { storeToRefs } from "pinia";
-import { consoleApiClient } from "@halo-dev/api-client";
-import { useI18n } from "vue-i18n";
 import { useQuery } from "@tanstack/vue-query";
 import { useRouteQuery } from "@vueuse/router";
+import { storeToRefs } from "pinia";
+import { useI18n } from "vue-i18n";
+import ThemeListModal from "../components/ThemeListModal.vue";
+import ThemePreviewModal from "../components/preview/ThemePreviewModal.vue";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/interface/themes/module.ts b/ui/console-src/modules/interface/themes/module.ts
index 46c00d4b7..9c4bfbabf 100644
--- a/ui/console-src/modules/interface/themes/module.ts
+++ b/ui/console-src/modules/interface/themes/module.ts
@@ -1,9 +1,9 @@
+import { IconPalette } from "@halo-dev/components";
 import { definePlugin } from "@halo-dev/console-shared";
-import ThemeLayout from "./layouts/ThemeLayout.vue";
+import { markRaw } from "vue";
 import ThemeDetail from "./ThemeDetail.vue";
 import ThemeSetting from "./ThemeSetting.vue";
-import { IconPalette } from "@halo-dev/components";
-import { markRaw } from "vue";
+import ThemeLayout from "./layouts/ThemeLayout.vue";
 
 export default definePlugin({
   components: {},
diff --git a/ui/console-src/modules/system/auth-providers/AuthProviderDetail.vue b/ui/console-src/modules/system/auth-providers/AuthProviderDetail.vue
index 96cb1fc30..eab704f8e 100644
--- a/ui/console-src/modules/system/auth-providers/AuthProviderDetail.vue
+++ b/ui/console-src/modules/system/auth-providers/AuthProviderDetail.vue
@@ -1,9 +1,7 @@
 <script lang="ts" setup>
-import { computed, ref, toRaw } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
-import { useQuery } from "@tanstack/vue-query";
+import { useSettingFormConvert } from "@console/composables/use-setting-form";
 import type { AuthProvider, Setting } from "@halo-dev/api-client";
-import { useRoute } from "vue-router";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   Toast,
   VAvatar,
@@ -14,8 +12,10 @@ import {
   VPageHeader,
   VTabbar,
 } from "@halo-dev/components";
-import { useSettingFormConvert } from "@console/composables/use-setting-form";
+import { useQuery } from "@tanstack/vue-query";
+import { computed, ref, toRaw } from "vue";
 import { useI18n } from "vue-i18n";
+import { useRoute } from "vue-router";
 
 const route = useRoute();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/system/auth-providers/AuthProviders.vue b/ui/console-src/modules/system/auth-providers/AuthProviders.vue
index c6429a899..416ba857e 100644
--- a/ui/console-src/modules/system/auth-providers/AuthProviders.vue
+++ b/ui/console-src/modules/system/auth-providers/AuthProviders.vue
@@ -1,17 +1,17 @@
 <script lang="ts" setup>
+import type { AuthProvider, ListedAuthProvider } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
-  VPageHeader,
   IconLockPasswordLine,
   VCard,
   VLoading,
+  VPageHeader,
 } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import type { AuthProvider, ListedAuthProvider } from "@halo-dev/api-client";
-import AuthProviderListItem from "./components/AuthProviderListItem.vue";
-import { computed, ref } from "vue";
 import Fuse from "fuse.js";
+import { computed, ref } from "vue";
 import { VueDraggable } from "vue-draggable-plus";
+import AuthProviderListItem from "./components/AuthProviderListItem.vue";
 
 const authProviders = ref<ListedAuthProvider[]>([]);
 
diff --git a/ui/console-src/modules/system/auth-providers/components/AuthProviderListItem.vue b/ui/console-src/modules/system/auth-providers/components/AuthProviderListItem.vue
index 81f2444a9..794d97e6c 100644
--- a/ui/console-src/modules/system/auth-providers/components/AuthProviderListItem.vue
+++ b/ui/console-src/modules/system/auth-providers/components/AuthProviderListItem.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { consoleApiClient } from "@halo-dev/api-client";
 import type { ListedAuthProvider } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconList,
diff --git a/ui/console-src/modules/system/auth-providers/module.ts b/ui/console-src/modules/system/auth-providers/module.ts
index 086919dd9..a2cb8d910 100644
--- a/ui/console-src/modules/system/auth-providers/module.ts
+++ b/ui/console-src/modules/system/auth-providers/module.ts
@@ -1,7 +1,7 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import AuthProviders from "./AuthProviders.vue";
+import { definePlugin } from "@halo-dev/console-shared";
 import AuthProviderDetail from "./AuthProviderDetail.vue";
+import AuthProviders from "./AuthProviders.vue";
 
 export default definePlugin({
   routes: [
diff --git a/ui/console-src/modules/system/backup/components/BackupListItem.vue b/ui/console-src/modules/system/backup/components/BackupListItem.vue
index c214a2bab..3117628ed 100644
--- a/ui/console-src/modules/system/backup/components/BackupListItem.vue
+++ b/ui/console-src/modules/system/backup/components/BackupListItem.vue
@@ -1,4 +1,9 @@
 <script lang="ts" setup>
+import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
+import { formatDatetime, relativeTimeTo } from "@/utils/date";
+import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
+import type { Backup } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   Toast,
@@ -8,17 +13,11 @@ import {
   VSpace,
   VStatusDot,
 } from "@halo-dev/components";
-import type { Backup } from "@halo-dev/api-client";
-import { relativeTimeTo, formatDatetime } from "@/utils/date";
-import { computed, markRaw } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
+import type { OperationItem } from "@halo-dev/console-shared";
 import { useQueryClient } from "@tanstack/vue-query";
 import prettyBytes from "pretty-bytes";
+import { computed, markRaw, toRefs } from "vue";
 import { useI18n } from "vue-i18n";
-import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
-import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
-import { toRefs } from "vue";
-import type { OperationItem } from "@halo-dev/console-shared";
 
 const queryClient = useQueryClient();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/system/backup/composables/use-backup.ts b/ui/console-src/modules/system/backup/composables/use-backup.ts
index 5da5cafbd..8b0d172ba 100644
--- a/ui/console-src/modules/system/backup/composables/use-backup.ts
+++ b/ui/console-src/modules/system/backup/composables/use-backup.ts
@@ -1,8 +1,7 @@
-import { coreApiClient } from "@halo-dev/api-client";
+import { BackupStatusPhaseEnum, coreApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast } from "@halo-dev/components";
 import { useQuery, useQueryClient } from "@tanstack/vue-query";
 import dayjs from "dayjs";
-import { BackupStatusPhaseEnum } from "@halo-dev/api-client";
 import { useI18n } from "vue-i18n";
 
 export function useBackupFetch() {
diff --git a/ui/console-src/modules/system/backup/module.ts b/ui/console-src/modules/system/backup/module.ts
index b56e1c533..3d68e116a 100644
--- a/ui/console-src/modules/system/backup/module.ts
+++ b/ui/console-src/modules/system/backup/module.ts
@@ -1,8 +1,8 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import Backups from "./Backups.vue";
 import { IconServerLine } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
 import { markRaw } from "vue";
+import Backups from "./Backups.vue";
 
 export default definePlugin({
   components: {},
diff --git a/ui/console-src/modules/system/backup/tabs/Restore.vue b/ui/console-src/modules/system/backup/tabs/Restore.vue
index 33146958b..e671172fa 100644
--- a/ui/console-src/modules/system/backup/tabs/Restore.vue
+++ b/ui/console-src/modules/system/backup/tabs/Restore.vue
@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import type { Backup } from "@halo-dev/api-client";
 import { consoleApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
@@ -12,12 +13,10 @@ import {
 } from "@halo-dev/components";
 import { useMutation, useQuery } from "@tanstack/vue-query";
 import axios from "axios";
-import { computed } from "vue";
-import { ref } from "vue";
+import { computed, ref } from "vue";
 import { useI18n } from "vue-i18n";
-import { useBackupFetch } from "../composables/use-backup";
 import BackupListItem from "../components/BackupListItem.vue";
-import type { Backup } from "@halo-dev/api-client";
+import { useBackupFetch } from "../composables/use-backup";
 
 const { t } = useI18n();
 const { data: backups } = useBackupFetch();
diff --git a/ui/console-src/modules/system/overview/Overview.vue b/ui/console-src/modules/system/overview/Overview.vue
index 150442ed0..8e1ec2d0e 100644
--- a/ui/console-src/modules/system/overview/Overview.vue
+++ b/ui/console-src/modules/system/overview/Overview.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
 import type { GlobalInfo, Info, Startup } from "@/types";
-import { consoleApiClient } from "@halo-dev/api-client";
 import { formatDatetime } from "@/utils/date";
 import { usePermission } from "@/utils/permission";
 import { useThemeStore } from "@console/stores/theme";
 import type { Plugin } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import {
   IconClipboardLine,
   IconTerminalBoxLine,
diff --git a/ui/console-src/modules/system/overview/module.ts b/ui/console-src/modules/system/overview/module.ts
index 3a2f59256..df1a12e80 100644
--- a/ui/console-src/modules/system/overview/module.ts
+++ b/ui/console-src/modules/system/overview/module.ts
@@ -1,8 +1,8 @@
-import { definePlugin } from "@halo-dev/console-shared";
-import { IconTerminalBoxLine } from "@halo-dev/components";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import Overview from "./Overview.vue";
+import { IconTerminalBoxLine } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
 import { markRaw } from "vue";
+import Overview from "./Overview.vue";
 
 export default definePlugin({
   components: {},
diff --git a/ui/console-src/modules/system/plugins/PluginList.vue b/ui/console-src/modules/system/plugins/PluginList.vue
index 5c6ee1d63..28daed86d 100644
--- a/ui/console-src/modules/system/plugins/PluginList.vue
+++ b/ui/console-src/modules/system/plugins/PluginList.vue
@@ -1,7 +1,10 @@
 <script lang="ts" setup>
-import { consoleApiClient } from "@halo-dev/api-client";
 import { usePermission } from "@/utils/permission";
-import { PluginStatusPhaseEnum, type Plugin } from "@halo-dev/api-client";
+import {
+  PluginStatusPhaseEnum,
+  consoleApiClient,
+  type Plugin,
+} from "@halo-dev/api-client";
 import {
   Dialog,
   IconAddCircle,
diff --git a/ui/console-src/modules/system/plugins/components/PluginConditionsModal.vue b/ui/console-src/modules/system/plugins/components/PluginConditionsModal.vue
index a58b14272..2bcaac9e1 100644
--- a/ui/console-src/modules/system/plugins/components/PluginConditionsModal.vue
+++ b/ui/console-src/modules/system/plugins/components/PluginConditionsModal.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { VButton, VModal } from "@halo-dev/components";
-import type { Plugin } from "@halo-dev/api-client";
 import { formatDatetime, relativeTimeTo } from "@/utils/date";
+import type { Plugin } from "@halo-dev/api-client";
+import { VButton, VModal } from "@halo-dev/components";
 import { ref } from "vue";
 
 withDefaults(defineProps<{ plugin: Plugin }>(), {});
diff --git a/ui/console-src/modules/system/plugins/components/PluginListItem.vue b/ui/console-src/modules/system/plugins/components/PluginListItem.vue
index 5765601fd..fa0737748 100644
--- a/ui/console-src/modules/system/plugins/components/PluginListItem.vue
+++ b/ui/console-src/modules/system/plugins/components/PluginListItem.vue
@@ -1,4 +1,11 @@
 <script lang="ts" setup>
+import { formatDatetime } from "@/utils/date";
+import { usePermission } from "@/utils/permission";
+import {
+  PluginStatusPhaseEnum,
+  consoleApiClient,
+  type Plugin,
+} from "@halo-dev/api-client";
 import {
   Dialog,
   Toast,
@@ -10,26 +17,19 @@ import {
 import type { Ref } from "vue";
 import { computed, inject, markRaw, ref, toRefs } from "vue";
 import { usePluginLifeCycle } from "../composables/use-plugin";
-import {
-  type Plugin,
-  PluginStatusPhaseEnum,
-  consoleApiClient,
-} from "@halo-dev/api-client";
-import { formatDatetime } from "@/utils/date";
-import { usePermission } from "@/utils/permission";
 
-import { useI18n } from "vue-i18n";
+import EntityFieldItems from "@/components/entity-fields/EntityFieldItems.vue";
+import StatusDotField from "@/components/entity-fields/StatusDotField.vue";
+import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
 import { useEntityFieldItemExtensionPoint } from "@console/composables/use-entity-extension-points";
 import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
-import { useRouter } from "vue-router";
-import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
-import EntityFieldItems from "@/components/entity-fields/EntityFieldItems.vue";
-import LogoField from "./entity-fields/LogoField.vue";
-import StatusDotField from "@/components/entity-fields/StatusDotField.vue";
-import AuthorField from "./entity-fields/AuthorField.vue";
-import SwitchField from "./entity-fields/SwitchField.vue";
-import type { EntityFieldItem, OperationItem } from "@halo-dev/console-shared";
 import PluginInstallationModal from "@console/modules/system/plugins/components/PluginInstallationModal.vue";
+import type { EntityFieldItem, OperationItem } from "@halo-dev/console-shared";
+import { useI18n } from "vue-i18n";
+import { useRouter } from "vue-router";
+import AuthorField from "./entity-fields/AuthorField.vue";
+import LogoField from "./entity-fields/LogoField.vue";
+import SwitchField from "./entity-fields/SwitchField.vue";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/system/plugins/components/entity-fields/AuthorField.vue b/ui/console-src/modules/system/plugins/components/entity-fields/AuthorField.vue
index 0c392c090..c573fa1ac 100644
--- a/ui/console-src/modules/system/plugins/components/entity-fields/AuthorField.vue
+++ b/ui/console-src/modules/system/plugins/components/entity-fields/AuthorField.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { VEntityField } from "@halo-dev/components";
 import type { Plugin } from "@halo-dev/api-client";
+import { VEntityField } from "@halo-dev/components";
 withDefaults(
   defineProps<{
     plugin: Plugin;
diff --git a/ui/console-src/modules/system/plugins/components/entity-fields/LogoField.vue b/ui/console-src/modules/system/plugins/components/entity-fields/LogoField.vue
index d49569ad6..b7cf153b2 100644
--- a/ui/console-src/modules/system/plugins/components/entity-fields/LogoField.vue
+++ b/ui/console-src/modules/system/plugins/components/entity-fields/LogoField.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { VAvatar, VEntityField } from "@halo-dev/components";
 import type { Plugin } from "@halo-dev/api-client";
+import { VAvatar, VEntityField } from "@halo-dev/components";
 withDefaults(
   defineProps<{
     plugin: Plugin;
diff --git a/ui/console-src/modules/system/plugins/components/entity-fields/SwitchField.vue b/ui/console-src/modules/system/plugins/components/entity-fields/SwitchField.vue
index 25c848ab3..3897901ff 100644
--- a/ui/console-src/modules/system/plugins/components/entity-fields/SwitchField.vue
+++ b/ui/console-src/modules/system/plugins/components/entity-fields/SwitchField.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { VEntityField, VSwitch } from "@halo-dev/components";
 import type { Plugin } from "@halo-dev/api-client";
-import { usePluginLifeCycle } from "../../composables/use-plugin";
+import { VEntityField, VSwitch } from "@halo-dev/components";
 import { toRefs } from "vue";
+import { usePluginLifeCycle } from "../../composables/use-plugin";
 const props = withDefaults(
   defineProps<{
     plugin: Plugin;
diff --git a/ui/console-src/modules/system/plugins/components/installation-tabs/LocalUpload.vue b/ui/console-src/modules/system/plugins/components/installation-tabs/LocalUpload.vue
index 52adb9dbd..80063d1df 100644
--- a/ui/console-src/modules/system/plugins/components/installation-tabs/LocalUpload.vue
+++ b/ui/console-src/modules/system/plugins/components/installation-tabs/LocalUpload.vue
@@ -1,17 +1,14 @@
 <script lang="ts" setup>
-import { type Ref, inject, ref } from "vue";
-import type { Plugin } from "@halo-dev/api-client";
-import { Dialog, Toast } from "@halo-dev/components";
-import type { SuccessResponse } from "@uppy/core";
-import { useI18n } from "vue-i18n";
-import { useQueryClient } from "@tanstack/vue-query";
-import { computed } from "vue";
-import type { UppyFile } from "@uppy/core";
-import type { ErrorResponse } from "@uppy/core";
-import type { PluginInstallationErrorResponse } from "../../types";
-import { PLUGIN_ALREADY_EXISTS_TYPE } from "../../constants";
-import { consoleApiClient } from "@halo-dev/api-client";
 import AppDownloadAlert from "@/components/common/AppDownloadAlert.vue";
+import type { Plugin } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
+import { Dialog, Toast } from "@halo-dev/components";
+import { useQueryClient } from "@tanstack/vue-query";
+import type { ErrorResponse, SuccessResponse, UppyFile } from "@uppy/core";
+import { computed, inject, ref, type Ref } from "vue";
+import { useI18n } from "vue-i18n";
+import { PLUGIN_ALREADY_EXISTS_TYPE } from "../../constants";
+import type { PluginInstallationErrorResponse } from "../../types";
 
 const emit = defineEmits<{
   (event: "close-modal"): void;
diff --git a/ui/console-src/modules/system/plugins/components/installation-tabs/RemoteDownload.vue b/ui/console-src/modules/system/plugins/components/installation-tabs/RemoteDownload.vue
index 366aa7163..3d1133a2a 100644
--- a/ui/console-src/modules/system/plugins/components/installation-tabs/RemoteDownload.vue
+++ b/ui/console-src/modules/system/plugins/components/installation-tabs/RemoteDownload.vue
@@ -1,18 +1,15 @@
 <script lang="ts" setup>
+import { submitForm } from "@formkit/core";
+import type { Plugin } from "@halo-dev/api-client";
 import { consoleApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast, VButton } from "@halo-dev/components";
-import type { Plugin } from "@halo-dev/api-client";
-import type { Ref } from "vue";
-import { inject } from "vue";
-import { ref } from "vue";
-import { useI18n } from "vue-i18n";
 import { useQueryClient } from "@tanstack/vue-query";
-import type { PluginInstallationErrorResponse } from "../../types";
-import { PLUGIN_ALREADY_EXISTS_TYPE } from "../../constants";
 import { useRouteQuery } from "@vueuse/router";
-import { onMounted } from "vue";
-import { nextTick } from "vue";
-import { submitForm } from "@formkit/core";
+import type { Ref } from "vue";
+import { inject, nextTick, onMounted, ref } from "vue";
+import { useI18n } from "vue-i18n";
+import { PLUGIN_ALREADY_EXISTS_TYPE } from "../../constants";
+import type { PluginInstallationErrorResponse } from "../../types";
 
 const emit = defineEmits<{
   (event: "close-modal"): void;
diff --git a/ui/console-src/modules/system/plugins/composables/use-plugin.ts b/ui/console-src/modules/system/plugins/composables/use-plugin.ts
index b1b059d31..0a562f74d 100644
--- a/ui/console-src/modules/system/plugins/composables/use-plugin.ts
+++ b/ui/console-src/modules/system/plugins/composables/use-plugin.ts
@@ -1,15 +1,15 @@
+import {
+  PluginStatusPhaseEnum,
+  consoleApiClient,
+  coreApiClient,
+  type Plugin,
+} from "@halo-dev/api-client";
 import type { ComputedRef, Ref } from "vue";
 import { computed } from "vue";
-import {
-  type Plugin,
-  PluginStatusPhaseEnum,
-  coreApiClient,
-  consoleApiClient,
-} from "@halo-dev/api-client";
 
 import { Dialog, Toast } from "@halo-dev/components";
-import { useI18n } from "vue-i18n";
 import { useMutation } from "@tanstack/vue-query";
+import { useI18n } from "vue-i18n";
 
 interface usePluginLifeCycleReturn {
   isStarted: ComputedRef<boolean | undefined>;
diff --git a/ui/console-src/modules/system/plugins/module.ts b/ui/console-src/modules/system/plugins/module.ts
index 2add63468..3dc58c3a5 100644
--- a/ui/console-src/modules/system/plugins/module.ts
+++ b/ui/console-src/modules/system/plugins/module.ts
@@ -1,9 +1,9 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import PluginList from "./PluginList.vue";
-import PluginDetail from "./PluginDetail.vue";
 import { IconPlug } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
 import { markRaw } from "vue";
+import PluginDetail from "./PluginDetail.vue";
+import PluginList from "./PluginList.vue";
 
 export default definePlugin({
   components: {},
diff --git a/ui/console-src/modules/system/plugins/tabs/Detail.vue b/ui/console-src/modules/system/plugins/tabs/Detail.vue
index 0549fb669..0078abd70 100644
--- a/ui/console-src/modules/system/plugins/tabs/Detail.vue
+++ b/ui/console-src/modules/system/plugins/tabs/Detail.vue
@@ -1,4 +1,13 @@
 <script lang="ts" setup>
+import { rbacAnnotations } from "@/constants/annotations";
+import { pluginLabels, roleLabels } from "@/constants/labels";
+import { formatDatetime } from "@/utils/date";
+import {
+  PluginStatusPhaseEnum,
+  coreApiClient,
+  type Plugin,
+  type Role,
+} from "@halo-dev/api-client";
 import {
   VAlert,
   VButton,
@@ -6,21 +15,11 @@ import {
   VDescriptionItem,
   VSwitch,
 } from "@halo-dev/components";
-import type { Ref } from "vue";
-import { computed, inject } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
-import {
-  PluginStatusPhaseEnum,
-  type Plugin,
-  type Role,
-} from "@halo-dev/api-client";
-import { pluginLabels, roleLabels } from "@/constants/labels";
-import { rbacAnnotations } from "@/constants/annotations";
-import { usePluginLifeCycle } from "../composables/use-plugin";
-import { formatDatetime } from "@/utils/date";
 import { useQuery } from "@tanstack/vue-query";
-import { ref } from "vue";
+import type { Ref } from "vue";
+import { computed, inject, ref } from "vue";
 import PluginConditionsModal from "../components/PluginConditionsModal.vue";
+import { usePluginLifeCycle } from "../composables/use-plugin";
 
 const plugin = inject<Ref<Plugin | undefined>>("plugin");
 const { changeStatus, changingStatus } = usePluginLifeCycle(plugin);
diff --git a/ui/console-src/modules/system/plugins/tabs/Setting.vue b/ui/console-src/modules/system/plugins/tabs/Setting.vue
index a64b440dd..bd5bdf575 100644
--- a/ui/console-src/modules/system/plugins/tabs/Setting.vue
+++ b/ui/console-src/modules/system/plugins/tabs/Setting.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 // core libs
-import { inject, ref, type Ref, computed } from "vue";
+import { computed, inject, ref, type Ref } from "vue";
 
 // hooks
 import { useSettingFormConvert } from "@console/composables/use-setting-form";
@@ -10,11 +10,11 @@ import { consoleApiClient } from "@halo-dev/api-client";
 import { Toast, VButton } from "@halo-dev/components";
 
 // types
+import StickyBlock from "@/components/sticky-block/StickyBlock.vue";
 import type { ConfigMap, Plugin, Setting } from "@halo-dev/api-client";
-import { useI18n } from "vue-i18n";
 import { useQuery, useQueryClient } from "@tanstack/vue-query";
 import { toRaw } from "vue";
-import StickyBlock from "@/components/sticky-block/StickyBlock.vue";
+import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/console-src/modules/system/roles/RoleDetail.vue b/ui/console-src/modules/system/roles/RoleDetail.vue
index 4c61b4a5a..d32a9164d 100644
--- a/ui/console-src/modules/system/roles/RoleDetail.vue
+++ b/ui/console-src/modules/system/roles/RoleDetail.vue
@@ -1,4 +1,12 @@
 <script lang="ts" setup>
+import { useRoleForm, useRoleTemplateSelection } from "@/composables/use-role";
+import { rbacAnnotations } from "@/constants/annotations";
+import { SUPER_ROLE_NAME } from "@/constants/constants";
+import { pluginLabels, roleLabels } from "@/constants/labels";
+import { formatDatetime } from "@/utils/date";
+import { resolveDeepDependencies } from "@/utils/role";
+import type { Role } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
   IconShieldUser,
   VAlert,
@@ -10,18 +18,10 @@ import {
   VTabbar,
   VTag,
 } from "@halo-dev/components";
-import { useRoute } from "vue-router";
-import { computed, ref, watch } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
-import { pluginLabels, roleLabels } from "@/constants/labels";
-import { rbacAnnotations } from "@/constants/annotations";
-import { useRoleForm, useRoleTemplateSelection } from "@/composables/use-role";
-import { SUPER_ROLE_NAME } from "@/constants/constants";
-import { useI18n } from "vue-i18n";
-import { formatDatetime } from "@/utils/date";
 import { useQuery } from "@tanstack/vue-query";
-import type { Role } from "@halo-dev/api-client";
-import { resolveDeepDependencies } from "@/utils/role";
+import { computed, ref, watch } from "vue";
+import { useI18n } from "vue-i18n";
+import { useRoute } from "vue-router";
 
 const route = useRoute();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/system/roles/RoleList.vue b/ui/console-src/modules/system/roles/RoleList.vue
index df8486276..d39d3a5b8 100644
--- a/ui/console-src/modules/system/roles/RoleList.vue
+++ b/ui/console-src/modules/system/roles/RoleList.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 // core libs
-import { computed, ref } from "vue";
 import type { Role, RoleList } from "@halo-dev/api-client";
+import { computed, ref } from "vue";
 
 // components
 import {
@@ -26,14 +26,14 @@ import { rbacAnnotations } from "@/constants/annotations";
 import { formatDatetime } from "@/utils/date";
 
 // libs
-import { coreApiClient } from "@halo-dev/api-client";
-import Fuse from "fuse.js";
-import { usePermission } from "@/utils/permission";
-import { roleLabels } from "@/constants/labels";
 import { SUPER_ROLE_NAME } from "@/constants/constants";
-import { useI18n } from "vue-i18n";
-import { useQuery } from "@tanstack/vue-query";
+import { roleLabels } from "@/constants/labels";
+import { usePermission } from "@/utils/permission";
 import { resolveDeepDependencies } from "@/utils/role";
+import { coreApiClient } from "@halo-dev/api-client";
+import { useQuery } from "@tanstack/vue-query";
+import Fuse from "fuse.js";
+import { useI18n } from "vue-i18n";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/system/roles/components/RoleEditingModal.vue b/ui/console-src/modules/system/roles/components/RoleEditingModal.vue
index f102654d5..400eba68d 100644
--- a/ui/console-src/modules/system/roles/components/RoleEditingModal.vue
+++ b/ui/console-src/modules/system/roles/components/RoleEditingModal.vue
@@ -1,16 +1,16 @@
 <script lang="ts" setup>
-import { VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
-import { onMounted, ref, watch } from "vue";
-import { rbacAnnotations } from "@/constants/annotations";
-import type { Role } from "@halo-dev/api-client";
 import { useRoleForm, useRoleTemplateSelection } from "@/composables/use-role";
-import { cloneDeep } from "lodash-es";
-import { setFocus } from "@/formkit/utils/focus";
+import { rbacAnnotations } from "@/constants/annotations";
 import { pluginLabels, roleLabels } from "@/constants/labels";
-import { useI18n } from "vue-i18n";
+import { setFocus } from "@/formkit/utils/focus";
+import type { Role } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
+import { VButton, VModal, VSpace } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
+import { cloneDeep } from "lodash-es";
+import { onMounted, ref, watch } from "vue";
+import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
 
diff --git a/ui/console-src/modules/system/roles/module.ts b/ui/console-src/modules/system/roles/module.ts
index 38ff665a8..ea88ceea8 100644
--- a/ui/console-src/modules/system/roles/module.ts
+++ b/ui/console-src/modules/system/roles/module.ts
@@ -1,7 +1,7 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import RoleList from "./RoleList.vue";
+import { definePlugin } from "@halo-dev/console-shared";
 import RoleDetail from "./RoleDetail.vue";
+import RoleList from "./RoleList.vue";
 
 export default definePlugin({
   components: {},
diff --git a/ui/console-src/modules/system/settings/SystemSettings.vue b/ui/console-src/modules/system/settings/SystemSettings.vue
index 754d35854..ea4f6df81 100644
--- a/ui/console-src/modules/system/settings/SystemSettings.vue
+++ b/ui/console-src/modules/system/settings/SystemSettings.vue
@@ -1,25 +1,24 @@
 <script lang="ts" setup>
 // core libs
-import { ref, type Ref, provide } from "vue";
+import { provide, ref, type Ref } from "vue";
 
 // components
+import { usePermission } from "@/utils/permission";
+import type { Setting, SettingForm } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
+  IconSettings,
   VCard,
   VPageHeader,
   VTabbar,
-  IconSettings,
 } from "@halo-dev/components";
-import type { Setting, SettingForm } from "@halo-dev/api-client";
 import { useQuery } from "@tanstack/vue-query";
-import { coreApiClient } from "@halo-dev/api-client";
-import { useI18n } from "vue-i18n";
-import type { Raw } from "vue";
-import type { Component } from "vue";
-import { markRaw } from "vue";
-import SettingTab from "./tabs/Setting.vue";
 import { useRouteQuery } from "@vueuse/router";
+import type { Component, Raw } from "vue";
+import { markRaw } from "vue";
+import { useI18n } from "vue-i18n";
 import NotificationsTab from "./tabs/Notifications.vue";
-import { usePermission } from "@/utils/permission";
+import SettingTab from "./tabs/Setting.vue";
 
 const { t } = useI18n();
 const { currentUserHasPermission } = usePermission();
diff --git a/ui/console-src/modules/system/settings/module.ts b/ui/console-src/modules/system/settings/module.ts
index faaee6902..1e10c4a5b 100644
--- a/ui/console-src/modules/system/settings/module.ts
+++ b/ui/console-src/modules/system/settings/module.ts
@@ -1,8 +1,8 @@
-import { definePlugin } from "@halo-dev/console-shared";
-import SystemSettings from "./SystemSettings.vue";
-import { IconSettings } from "@halo-dev/components";
-import { markRaw } from "vue";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
+import { IconSettings } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
+import { markRaw } from "vue";
+import SystemSettings from "./SystemSettings.vue";
 
 export default definePlugin({
   components: {},
diff --git a/ui/console-src/modules/system/settings/tabs/NotificationSetting.vue b/ui/console-src/modules/system/settings/tabs/NotificationSetting.vue
index 3b7daa2cb..5401a1ab1 100644
--- a/ui/console-src/modules/system/settings/tabs/NotificationSetting.vue
+++ b/ui/console-src/modules/system/settings/tabs/NotificationSetting.vue
@@ -1,16 +1,13 @@
 <script lang="ts" setup>
+import StickyBlock from "@/components/sticky-block/StickyBlock.vue";
+import type { FormKitSchemaCondition, FormKitSchemaNode } from "@formkit/core";
+import type { NotifierDescriptor, Setting } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import { Toast, VButton } from "@halo-dev/components";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
-import type { NotifierDescriptor, Setting } from "@halo-dev/api-client";
 import type { Ref } from "vue";
-import { inject } from "vue";
-import { ref } from "vue";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { computed } from "vue";
-import { toRaw } from "vue";
-import type { FormKitSchemaCondition, FormKitSchemaNode } from "@formkit/core";
+import { computed, inject, ref, toRaw } from "vue";
 import { useI18n } from "vue-i18n";
-import StickyBlock from "@/components/sticky-block/StickyBlock.vue";
 
 const queryClient = useQueryClient();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/system/settings/tabs/Setting.vue b/ui/console-src/modules/system/settings/tabs/Setting.vue
index 73f58fcc4..a897b1170 100644
--- a/ui/console-src/modules/system/settings/tabs/Setting.vue
+++ b/ui/console-src/modules/system/settings/tabs/Setting.vue
@@ -1,19 +1,19 @@
 <script lang="ts" setup>
 // core libs
-import { computed, ref, type Ref, inject, toRaw } from "vue";
+import { computed, inject, ref, toRaw, type Ref } from "vue";
 
 // components
-import { Toast, VButton } from "@halo-dev/components";
 import StickyBlock from "@/components/sticky-block/StickyBlock.vue";
+import { Toast, VButton } from "@halo-dev/components";
 
 // hooks
+import { useGlobalInfoStore } from "@/stores/global-info";
 import { useSettingFormConvert } from "@console/composables/use-setting-form";
 import { useSystemConfigMapStore } from "@console/stores/system-configmap";
 import type { ConfigMap, Setting } from "@halo-dev/api-client";
-import { useQuery, useQueryClient } from "@tanstack/vue-query";
 import { coreApiClient } from "@halo-dev/api-client";
+import { useQuery, useQueryClient } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
-import { useGlobalInfoStore } from "@/stores/global-info";
 
 const SYSTEM_CONFIGMAP_NAME = "system";
 
diff --git a/ui/console-src/modules/system/tools/Tools.vue b/ui/console-src/modules/system/tools/Tools.vue
index 276f546af..d755163a4 100644
--- a/ui/console-src/modules/system/tools/Tools.vue
+++ b/ui/console-src/modules/system/tools/Tools.vue
@@ -2,13 +2,13 @@
 import { useRoleStore } from "@/stores/role";
 import { hasPermission } from "@/utils/permission";
 import {
-  VPageHeader,
   IconToolsFill,
+  VButton,
   VCard,
+  VEmpty,
   VEntity,
   VEntityField,
-  VButton,
-  VEmpty,
+  VPageHeader,
 } from "@halo-dev/components";
 import { computed } from "vue";
 import type { RouteRecordRaw } from "vue-router";
diff --git a/ui/console-src/modules/system/tools/module.ts b/ui/console-src/modules/system/tools/module.ts
index e6d29eb7d..2ea5db04a 100644
--- a/ui/console-src/modules/system/tools/module.ts
+++ b/ui/console-src/modules/system/tools/module.ts
@@ -1,8 +1,8 @@
-import { definePlugin } from "@halo-dev/console-shared";
-import Tools from "./Tools.vue";
-import { markRaw } from "vue";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
 import { IconToolsFill } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
+import { markRaw } from "vue";
+import Tools from "./Tools.vue";
 
 export default definePlugin({
   components: {},
diff --git a/ui/console-src/modules/system/users/UserDetail.vue b/ui/console-src/modules/system/users/UserDetail.vue
index 9a1c117df..798d01d3c 100644
--- a/ui/console-src/modules/system/users/UserDetail.vue
+++ b/ui/console-src/modules/system/users/UserDetail.vue
@@ -2,8 +2,8 @@
 import UserAvatar from "@/components/user-avatar/UserAvatar.vue";
 import { usePluginModuleStore } from "@/stores/plugin";
 import { useUserStore } from "@/stores/user";
-import { consoleApiClient } from "@halo-dev/api-client";
 import { usePermission } from "@/utils/permission";
+import { consoleApiClient } from "@halo-dev/api-client";
 import {
   VButton,
   VDropdown,
diff --git a/ui/console-src/modules/system/users/UserList.vue b/ui/console-src/modules/system/users/UserList.vue
index 1f764dd3b..e438fc298 100644
--- a/ui/console-src/modules/system/users/UserList.vue
+++ b/ui/console-src/modules/system/users/UserList.vue
@@ -1,4 +1,11 @@
 <script lang="ts" setup>
+import { useFetchRole } from "@/composables/use-role";
+import { rbacAnnotations } from "@/constants/annotations";
+import { useUserStore } from "@/stores/user";
+import { formatDatetime } from "@/utils/date";
+import { usePermission } from "@/utils/permission";
+import type { ListedUser, User } from "@halo-dev/api-client";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconAddCircle,
@@ -21,21 +28,14 @@ import {
   VStatusDot,
   VTag,
 } from "@halo-dev/components";
+import { useQuery } from "@tanstack/vue-query";
+import { useRouteQuery } from "@vueuse/router";
+import { computed, onMounted, ref, watch } from "vue";
+import { useI18n } from "vue-i18n";
+import GrantPermissionModal from "./components/GrantPermissionModal.vue";
+import UserCreationModal from "./components/UserCreationModal.vue";
 import UserEditingModal from "./components/UserEditingModal.vue";
 import UserPasswordChangeModal from "./components/UserPasswordChangeModal.vue";
-import GrantPermissionModal from "./components/GrantPermissionModal.vue";
-import { computed, onMounted, ref, watch } from "vue";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import type { ListedUser, User } from "@halo-dev/api-client";
-import { rbacAnnotations } from "@/constants/annotations";
-import { formatDatetime } from "@/utils/date";
-import { useRouteQuery } from "@vueuse/router";
-import { usePermission } from "@/utils/permission";
-import { useUserStore } from "@/stores/user";
-import { useFetchRole } from "@/composables/use-role";
-import { useQuery } from "@tanstack/vue-query";
-import { useI18n } from "vue-i18n";
-import UserCreationModal from "./components/UserCreationModal.vue";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();
diff --git a/ui/console-src/modules/system/users/components/GrantPermissionModal.vue b/ui/console-src/modules/system/users/components/GrantPermissionModal.vue
index 1c7e78617..733094738 100644
--- a/ui/console-src/modules/system/users/components/GrantPermissionModal.vue
+++ b/ui/console-src/modules/system/users/components/GrantPermissionModal.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { consoleApiClient } from "@halo-dev/api-client";
-import type { User } from "@halo-dev/api-client";
-import { VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
+import type { User } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
+import { VButton, VModal, VSpace } from "@halo-dev/components";
 import { ref } from "vue";
 
 const props = withDefaults(
diff --git a/ui/console-src/modules/system/users/components/UserCreationModal.vue b/ui/console-src/modules/system/users/components/UserCreationModal.vue
index e4446d993..5084f5e73 100644
--- a/ui/console-src/modules/system/users/components/UserCreationModal.vue
+++ b/ui/console-src/modules/system/users/components/UserCreationModal.vue
@@ -1,17 +1,17 @@
 <script lang="ts" setup>
 // core libs
-import { onMounted, ref } from "vue";
-import { consoleApiClient } from "@halo-dev/api-client";
 import type { CreateUserRequest } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
+import { onMounted, ref } from "vue";
 
 // components
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 
 // hooks
 import { setFocus } from "@/formkit/utils/focus";
-import { useI18n } from "vue-i18n";
 import { useQueryClient } from "@tanstack/vue-query";
+import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/console-src/modules/system/users/components/UserEditingModal.vue b/ui/console-src/modules/system/users/components/UserEditingModal.vue
index 13bb8f2fe..e7adb37f1 100644
--- a/ui/console-src/modules/system/users/components/UserEditingModal.vue
+++ b/ui/console-src/modules/system/users/components/UserEditingModal.vue
@@ -1,20 +1,20 @@
 <script lang="ts" setup>
 // core libs
-import { nextTick, ref } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
 import type { User } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
+import { nextTick, ref } from "vue";
 
 // components
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 
 // libs
 import { cloneDeep } from "lodash-es";
 
 // hooks
 import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
-import { useI18n } from "vue-i18n";
 import { useQueryClient } from "@tanstack/vue-query";
+import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/console-src/modules/system/users/components/UserPasswordChangeModal.vue b/ui/console-src/modules/system/users/components/UserPasswordChangeModal.vue
index a674bb469..1af2058ed 100644
--- a/ui/console-src/modules/system/users/components/UserPasswordChangeModal.vue
+++ b/ui/console-src/modules/system/users/components/UserPasswordChangeModal.vue
@@ -1,11 +1,11 @@
 <script lang="ts" setup>
-import { VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
-import { onMounted, ref } from "vue";
+import { setFocus } from "@/formkit/utils/focus";
 import type { User } from "@halo-dev/api-client";
 import { consoleApiClient } from "@halo-dev/api-client";
+import { VButton, VModal, VSpace } from "@halo-dev/components";
 import { cloneDeep } from "lodash-es";
-import { setFocus } from "@/formkit/utils/focus";
+import { onMounted, ref } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/console-src/modules/system/users/composables/use-user.ts b/ui/console-src/modules/system/users/composables/use-user.ts
index 04ccc456f..b35a24613 100644
--- a/ui/console-src/modules/system/users/composables/use-user.ts
+++ b/ui/console-src/modules/system/users/composables/use-user.ts
@@ -1,7 +1,7 @@
-import type { Ref } from "vue";
-import { onMounted, ref } from "vue";
 import type { User } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
+import type { Ref } from "vue";
+import { onMounted, ref } from "vue";
 
 interface useUserFetchReturn {
   users: Ref<User[]>;
diff --git a/ui/console-src/modules/system/users/module.ts b/ui/console-src/modules/system/users/module.ts
index 9842f3f2f..1443dabe3 100644
--- a/ui/console-src/modules/system/users/module.ts
+++ b/ui/console-src/modules/system/users/module.ts
@@ -1,11 +1,11 @@
-import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@console/layouts/BasicLayout.vue";
-import UserStatsWidget from "./widgets/UserStatsWidget.vue";
-import UserList from "./UserList.vue";
-import UserDetail from "./UserDetail.vue";
 import { IconUserSettings } from "@halo-dev/components";
+import { definePlugin } from "@halo-dev/console-shared";
 import { markRaw } from "vue";
+import UserDetail from "./UserDetail.vue";
+import UserList from "./UserList.vue";
 import NotificationWidget from "./widgets/NotificationWidget.vue";
+import UserStatsWidget from "./widgets/UserStatsWidget.vue";
 
 export default definePlugin({
   components: {
diff --git a/ui/console-src/modules/system/users/tabs/Detail.vue b/ui/console-src/modules/system/users/tabs/Detail.vue
index 06571b44a..49f97bed5 100644
--- a/ui/console-src/modules/system/users/tabs/Detail.vue
+++ b/ui/console-src/modules/system/users/tabs/Detail.vue
@@ -1,4 +1,7 @@
 <script lang="ts" setup>
+import { rbacAnnotations } from "@/constants/annotations";
+import { formatDatetime } from "@/utils/date";
+import type { DetailedUser } from "@halo-dev/api-client";
 import {
   IconInformation,
   IconUserSettings,
@@ -6,9 +9,6 @@ import {
   VDescriptionItem,
   VTag,
 } from "@halo-dev/components";
-import type { DetailedUser } from "@halo-dev/api-client";
-import { rbacAnnotations } from "@/constants/annotations";
-import { formatDatetime } from "@/utils/date";
 import RiVerifiedBadgeLine from "~icons/ri/verified-badge-line";
 
 withDefaults(defineProps<{ user?: DetailedUser }>(), {
diff --git a/ui/console-src/modules/system/users/widgets/NotificationWidget.vue b/ui/console-src/modules/system/users/widgets/NotificationWidget.vue
index 3881a3a4a..007b08f4f 100644
--- a/ui/console-src/modules/system/users/widgets/NotificationWidget.vue
+++ b/ui/console-src/modules/system/users/widgets/NotificationWidget.vue
@@ -1,7 +1,8 @@
 <script lang="ts" setup>
 import { useUserStore } from "@/stores/user";
-import { ucApiClient } from "@halo-dev/api-client";
 import { relativeTimeTo } from "@/utils/date";
+import type { Notification } from "@halo-dev/api-client";
+import { ucApiClient } from "@halo-dev/api-client";
 import {
   VButton,
   VCard,
@@ -12,7 +13,6 @@ import {
 } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
 import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
-import type { Notification } from "@halo-dev/api-client";
 
 const { currentUser } = useUserStore();
 
diff --git a/ui/console-src/modules/system/users/widgets/RecentLoginWidget.vue b/ui/console-src/modules/system/users/widgets/RecentLoginWidget.vue
index ab348d7a5..124568d25 100644
--- a/ui/console-src/modules/system/users/widgets/RecentLoginWidget.vue
+++ b/ui/console-src/modules/system/users/widgets/RecentLoginWidget.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { VCard, VAvatar } from "@halo-dev/components";
 import { useUserFetch } from "@console/modules/system/users/composables/use-user";
+import { VAvatar, VCard } from "@halo-dev/components";
 
 const { users } = useUserFetch({ fetchOnMounted: true });
 </script>
diff --git a/ui/console-src/modules/system/users/widgets/UserStatsWidget.vue b/ui/console-src/modules/system/users/widgets/UserStatsWidget.vue
index fe43d2250..be65bab25 100644
--- a/ui/console-src/modules/system/users/widgets/UserStatsWidget.vue
+++ b/ui/console-src/modules/system/users/widgets/UserStatsWidget.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { VCard, IconUserSettings } from "@halo-dev/components";
 import { useDashboardStats } from "@console/composables/use-dashboard-stats";
+import { IconUserSettings, VCard } from "@halo-dev/components";
 
 const { data: stats } = useDashboardStats();
 </script>
diff --git a/ui/console-src/router/index.ts b/ui/console-src/router/index.ts
index 50ad60ae0..d8afd9b5c 100644
--- a/ui/console-src/router/index.ts
+++ b/ui/console-src/router/index.ts
@@ -1,13 +1,13 @@
+import routesConfig from "@console/router/routes.config";
 import {
   createRouter,
   createWebHistory,
   type RouteLocationNormalized,
   type RouteLocationNormalizedLoaded,
 } from "vue-router";
-import routesConfig from "@console/router/routes.config";
-import { setupPermissionGuard } from "./guards/permission";
-import { setupCheckStatesGuard } from "./guards/check-states";
 import { setupAuthCheckGuard } from "./guards/auth-check";
+import { setupCheckStatesGuard } from "./guards/check-states";
+import { setupPermissionGuard } from "./guards/permission";
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
diff --git a/ui/console-src/router/routes.config.ts b/ui/console-src/router/routes.config.ts
index 58e3354f2..7238ae36c 100644
--- a/ui/console-src/router/routes.config.ts
+++ b/ui/console-src/router/routes.config.ts
@@ -1,14 +1,14 @@
-import type { RouteRecordRaw } from "vue-router";
-import NotFound from "@/views/exceptions/NotFound.vue";
-import Forbidden from "@/views/exceptions/Forbidden.vue";
-import BasicLayout from "@console/layouts/BasicLayout.vue";
 import GatewayLayout from "@/layouts/GatewayLayout.vue";
-import Setup from "@console/views/system/Setup.vue";
-import Redirect from "@console/views/system/Redirect.vue";
-import SetupInitialData from "@console/views/system/SetupInitialData.vue";
-import ResetPassword from "@console/views/system/ResetPassword.vue";
-import Login from "@console/views/system/Login.vue";
+import Forbidden from "@/views/exceptions/Forbidden.vue";
+import NotFound from "@/views/exceptions/NotFound.vue";
+import BasicLayout from "@console/layouts/BasicLayout.vue";
 import Binding from "@console/views/system/Binding.vue";
+import Login from "@console/views/system/Login.vue";
+import Redirect from "@console/views/system/Redirect.vue";
+import ResetPassword from "@console/views/system/ResetPassword.vue";
+import Setup from "@console/views/system/Setup.vue";
+import SetupInitialData from "@console/views/system/SetupInitialData.vue";
+import type { RouteRecordRaw } from "vue-router";
 
 export const routes: Array<RouteRecordRaw> = [
   {
diff --git a/ui/console-src/setup/setupModules.ts b/ui/console-src/setup/setupModules.ts
index 76260f689..e7ded8bf2 100644
--- a/ui/console-src/setup/setupModules.ts
+++ b/ui/console-src/setup/setupModules.ts
@@ -1,13 +1,13 @@
 import { i18n } from "@/locales";
+import { usePluginModuleStore } from "@/stores/plugin";
+import { loadStyle } from "@/utils/load-style";
 import modules from "@console/modules";
 import router from "@console/router";
-import { usePluginModuleStore } from "@/stores/plugin";
+import { Toast } from "@halo-dev/components";
 import type { PluginModule, RouteRecordAppend } from "@halo-dev/console-shared";
 import { useScriptTag } from "@vueuse/core";
-import { Toast } from "@halo-dev/components";
 import type { App } from "vue";
 import type { RouteRecordRaw } from "vue-router";
-import { loadStyle } from "@/utils/load-style";
 
 export function setupCoreModules(app: App) {
   modules.forEach((module) => {
diff --git a/ui/console-src/stores/system-configmap.ts b/ui/console-src/stores/system-configmap.ts
index b93be1a21..18ed50c5e 100644
--- a/ui/console-src/stores/system-configmap.ts
+++ b/ui/console-src/stores/system-configmap.ts
@@ -1,5 +1,5 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { ConfigMap } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
 import { defineStore } from "pinia";
 
 interface SystemConfigMapState {
diff --git a/ui/console-src/stores/theme.ts b/ui/console-src/stores/theme.ts
index 3901da820..1b55c8284 100644
--- a/ui/console-src/stores/theme.ts
+++ b/ui/console-src/stores/theme.ts
@@ -1,8 +1,8 @@
-import { consoleApiClient } from "@halo-dev/api-client";
+import { usePermission } from "@/utils/permission";
 import type { Theme } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import { defineStore } from "pinia";
 import { ref } from "vue";
-import { usePermission } from "@/utils/permission";
 
 export const useThemeStore = defineStore("theme", () => {
   const activatedTheme = ref<Theme>();
diff --git a/ui/console-src/views/system/Binding.vue b/ui/console-src/views/system/Binding.vue
index aa0f570bc..aed3ea40a 100644
--- a/ui/console-src/views/system/Binding.vue
+++ b/ui/console-src/views/system/Binding.vue
@@ -1,14 +1,14 @@
 <script lang="ts" setup>
-import { computed, onBeforeMount, onMounted } from "vue";
-import router from "@console/router";
-import { useUserStore } from "@/stores/user";
 import LoginForm from "@/components/login/LoginForm.vue";
-import { useRoute } from "vue-router";
+import SignupForm from "@/components/signup/SignupForm.vue";
+import { useUserStore } from "@/stores/user";
+import { useGlobalInfoFetch } from "@console/composables/use-global-info";
+import router from "@console/router";
 import { Toast } from "@halo-dev/components";
 import { useRouteQuery } from "@vueuse/router";
-import SignupForm from "@/components/signup/SignupForm.vue";
-import { useGlobalInfoFetch } from "@console/composables/use-global-info";
+import { computed, onBeforeMount, onMounted } from "vue";
 import { useI18n } from "vue-i18n";
+import { useRoute } from "vue-router";
 
 const userStore = useUserStore();
 const route = useRoute();
diff --git a/ui/console-src/views/system/Login.vue b/ui/console-src/views/system/Login.vue
index a116a702a..76d70bacc 100644
--- a/ui/console-src/views/system/Login.vue
+++ b/ui/console-src/views/system/Login.vue
@@ -1,13 +1,13 @@
 <script lang="ts" setup>
-import { computed } from "vue";
-import LoginForm from "@/components/login/LoginForm.vue";
-import { useRouteQuery } from "@vueuse/router";
-import SignupForm from "@/components/signup/SignupForm.vue";
-import SocialAuthProviders from "@/components/login/SocialAuthProviders.vue";
-import { useGlobalInfoFetch } from "@console/composables/use-global-info";
-import MdiKeyboardBackspace from "~icons/mdi/keyboard-backspace";
 import LocaleChange from "@/components/common/LocaleChange.vue";
+import LoginForm from "@/components/login/LoginForm.vue";
+import SocialAuthProviders from "@/components/login/SocialAuthProviders.vue";
+import SignupForm from "@/components/signup/SignupForm.vue";
 import { useAppTitle } from "@/composables/use-title";
+import { useGlobalInfoFetch } from "@console/composables/use-global-info";
+import { useRouteQuery } from "@vueuse/router";
+import { computed } from "vue";
+import MdiKeyboardBackspace from "~icons/mdi/keyboard-backspace";
 
 const { globalInfo } = useGlobalInfoFetch();
 
diff --git a/ui/console-src/views/system/Setup.vue b/ui/console-src/views/system/Setup.vue
index a87bedc69..9852f422e 100644
--- a/ui/console-src/views/system/Setup.vue
+++ b/ui/console-src/views/system/Setup.vue
@@ -1,12 +1,12 @@
 <script lang="ts" setup>
+import LocaleChange from "@/components/common/LocaleChange.vue";
+import { useGlobalInfoStore } from "@/stores/global-info";
+import type { SystemInitializationRequest } from "@halo-dev/api-client";
 import { consoleApiClient } from "@halo-dev/api-client";
 import { Toast, VButton } from "@halo-dev/components";
 import { ref } from "vue";
-import { useRouter } from "vue-router";
-import type { SystemInitializationRequest } from "@halo-dev/api-client";
 import { useI18n } from "vue-i18n";
-import { useGlobalInfoStore } from "@/stores/global-info";
-import LocaleChange from "@/components/common/LocaleChange.vue";
+import { useRouter } from "vue-router";
 
 const router = useRouter();
 const { t } = useI18n();
diff --git a/ui/console-src/views/system/SetupInitialData.vue b/ui/console-src/views/system/SetupInitialData.vue
index 13e27a125..ee8c9fba8 100644
--- a/ui/console-src/views/system/SetupInitialData.vue
+++ b/ui/console-src/views/system/SetupInitialData.vue
@@ -1,25 +1,25 @@
 <script lang="ts" setup>
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { VLoading } from "@halo-dev/components";
-import { useMutation } from "@tanstack/vue-query";
+import { useGlobalInfoStore } from "@/stores/global-info";
+import { useUserStore } from "@/stores/user";
 import {
+  consoleApiClient,
+  coreApiClient,
   type Category,
   type Plugin,
   type PostRequest,
   type SinglePageRequest,
   type Tag,
 } from "@halo-dev/api-client";
-import { onMounted } from "vue";
+import { VLoading } from "@halo-dev/components";
+import { useMutation } from "@tanstack/vue-query";
+import { onMounted, ref } from "vue";
+import { useRouter } from "vue-router";
 import category from "./setup-data/category.json";
-import tag from "./setup-data/tag.json";
+import menuItems from "./setup-data/menu-items.json";
+import menu from "./setup-data/menu.json";
 import post from "./setup-data/post.json";
 import singlePage from "./setup-data/singlePage.json";
-import menu from "./setup-data/menu.json";
-import menuItems from "./setup-data/menu-items.json";
-import { useRouter } from "vue-router";
-import { useGlobalInfoStore } from "@/stores/global-info";
-import { ref } from "vue";
-import { useUserStore } from "@/stores/user";
+import tag from "./setup-data/tag.json";
 
 const router = useRouter();
 const globalInfoStore = useGlobalInfoStore();
diff --git a/ui/packages/api-client/entry/api-client.ts b/ui/packages/api-client/entry/api-client.ts
index 67c578617..436619bcd 100644
--- a/ui/packages/api-client/entry/api-client.ts
+++ b/ui/packages/api-client/entry/api-client.ts
@@ -444,5 +444,5 @@ export {
   createPublicApiClient,
   createUcApiClient,
   defaultPublicApiClient as publicApiClient,
-  defaultUcApiClient as ucApiClient,
+  defaultUcApiClient as ucApiClient
 };
diff --git a/ui/packages/components/src/components.ts b/ui/packages/components/src/components.ts
index a52d158bf..50de09f37 100644
--- a/ui/packages/components/src/components.ts
+++ b/ui/packages/components/src/components.ts
@@ -1,21 +1,21 @@
-export * from "./components/avatar";
 export * from "./components/alert";
+export * from "./components/avatar";
 export * from "./components/button";
 export * from "./components/card";
+export * from "./components/description";
+export * from "./components/dialog";
+export * from "./components/dropdown";
+export * from "./components/empty";
+export * from "./components/entity";
 export * from "./components/header";
+export * from "./components/loading";
 export * from "./components/menu";
 export * from "./components/modal";
+export * from "./components/pagination";
 export * from "./components/space";
+export * from "./components/status";
+export * from "./components/switch";
 export * from "./components/tabs";
 export * from "./components/tag";
-export * from "./components/switch";
-export * from "./components/dialog";
-export * from "./components/pagination";
-export * from "./components/empty";
-export * from "./components/status";
-export * from "./components/entity";
 export * from "./components/toast";
-export * from "./components/loading";
-export * from "./components/dropdown";
 export * from "./components/tooltip";
-export * from "./components/description";
diff --git a/ui/packages/components/src/components/alert/Alert.vue b/ui/packages/components/src/components/alert/Alert.vue
index e9a0becab..dd75251ec 100644
--- a/ui/packages/components/src/components/alert/Alert.vue
+++ b/ui/packages/components/src/components/alert/Alert.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
+import type { FunctionalComponent, Raw, SVGAttributes } from "vue";
 import { computed, markRaw } from "vue";
-import type { Type } from "./interface";
 import {
   IconCheckboxCircle,
   IconClose,
@@ -8,8 +8,7 @@ import {
   IconErrorWarning,
   IconInformation,
 } from "../../icons/icons";
-import type { FunctionalComponent, Raw } from "vue";
-import type { SVGAttributes } from "vue";
+import type { Type } from "./interface";
 
 const TypeIcons: Record<Type, Raw<FunctionalComponent<SVGAttributes>>> = {
   success: markRaw(IconCheckboxCircle),
diff --git a/ui/packages/components/src/components/button/__tests__/Button.spec.ts b/ui/packages/components/src/components/button/__tests__/Button.spec.ts
index 143e73952..807f164f0 100644
--- a/ui/packages/components/src/components/button/__tests__/Button.spec.ts
+++ b/ui/packages/components/src/components/button/__tests__/Button.spec.ts
@@ -1,7 +1,7 @@
-import { describe, expect, it, vi } from "vitest";
-import { VButton } from "../index";
 import { mount } from "@vue/test-utils";
+import { describe, expect, it, vi } from "vitest";
 import { IconSettings } from "../../../icons/icons";
+import { VButton } from "../index";
 
 describe("Button", () => {
   it("should render", () => {
diff --git a/ui/packages/components/src/components/dialog/Dialog.vue b/ui/packages/components/src/components/dialog/Dialog.vue
index 60466863b..94b2608fb 100644
--- a/ui/packages/components/src/components/dialog/Dialog.vue
+++ b/ui/packages/components/src/components/dialog/Dialog.vue
@@ -1,6 +1,7 @@
 <script lang="ts" setup>
-import { VModal } from "../modal";
-import { VButton } from "../button";
+import type { Type as ButtonType } from "@/components/button/interface";
+import type { Type } from "@/components/dialog/interface";
+import { markRaw, ref, type Component, type Raw } from "vue";
 import {
   IconCheckboxCircle,
   IconClose,
@@ -8,9 +9,8 @@ import {
   IconForbidLine,
   IconInformation,
 } from "../../icons/icons";
-import { ref, type Component, markRaw, type Raw } from "vue";
-import type { Type } from "@/components/dialog/interface";
-import type { Type as ButtonType } from "@/components/button/interface";
+import { VButton } from "../button";
+import { VModal } from "../modal";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/components/src/components/dialog/__tests__/Dialog.spec.ts b/ui/packages/components/src/components/dialog/__tests__/Dialog.spec.ts
index 15a9c515e..364f05fb9 100644
--- a/ui/packages/components/src/components/dialog/__tests__/Dialog.spec.ts
+++ b/ui/packages/components/src/components/dialog/__tests__/Dialog.spec.ts
@@ -1,5 +1,5 @@
-import { describe, expect, it } from "vitest";
 import { mount } from "@vue/test-utils";
+import { describe, expect, it } from "vitest";
 import { VDialog } from "../index";
 
 describe("Dialog", () => {
diff --git a/ui/packages/components/src/components/dialog/dialog-manager.ts b/ui/packages/components/src/components/dialog/dialog-manager.ts
index f11407d83..37d2d740d 100644
--- a/ui/packages/components/src/components/dialog/dialog-manager.ts
+++ b/ui/packages/components/src/components/dialog/dialog-manager.ts
@@ -1,5 +1,5 @@
-import DialogComponent from "./Dialog.vue";
 import { createVNode, render, type Component } from "vue";
+import DialogComponent from "./Dialog.vue";
 import type { DialogProps } from "./interface";
 
 export type DialogApiProps = Omit<DialogProps, "type" | "visible">;
diff --git a/ui/packages/components/src/components/dropdown/Draopdown.stories.ts b/ui/packages/components/src/components/dropdown/Draopdown.stories.ts
index 6ecce2a74..73c918891 100644
--- a/ui/packages/components/src/components/dropdown/Draopdown.stories.ts
+++ b/ui/packages/components/src/components/dropdown/Draopdown.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from "@storybook/vue3";
 
-import { VDropdown, VDropdownItem, VDropdownDivider } from ".";
+import { VDropdown, VDropdownDivider, VDropdownItem } from ".";
 import { VButton } from "../button";
 
 const meta: Meta<typeof VDropdown> = {
diff --git a/ui/packages/components/src/components/dropdown/DropdownItem.vue b/ui/packages/components/src/components/dropdown/DropdownItem.vue
index 3c19dc5a7..699cdb23f 100644
--- a/ui/packages/components/src/components/dropdown/DropdownItem.vue
+++ b/ui/packages/components/src/components/dropdown/DropdownItem.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { DropdownContextInjectionKey } from "./symbols";
 import { inject } from "vue";
+import { DropdownContextInjectionKey } from "./symbols";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/components/src/components/dropdown/index.ts b/ui/packages/components/src/components/dropdown/index.ts
index c4e8a6f85..db264c5f9 100644
--- a/ui/packages/components/src/components/dropdown/index.ts
+++ b/ui/packages/components/src/components/dropdown/index.ts
@@ -1,6 +1,6 @@
 export { default as VDropdown } from "./Dropdown.vue";
-export { default as VDropdownItem } from "./DropdownItem.vue";
 export { default as VDropdownDivider } from "./DropdownDivider.vue";
+export { default as VDropdownItem } from "./DropdownItem.vue";
 // VClosePopper is deprecated, please use vClosePopper from "@halo-dev/components" instead
 export { vClosePopper as VClosePopper, vClosePopper } from "floating-vue";
 export * from "./symbols";
diff --git a/ui/packages/components/src/components/empty/Empty.stories.ts b/ui/packages/components/src/components/empty/Empty.stories.ts
index efc35d370..9897b23b0 100644
--- a/ui/packages/components/src/components/empty/Empty.stories.ts
+++ b/ui/packages/components/src/components/empty/Empty.stories.ts
@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from "@storybook/vue3";
 import { VEmpty } from ".";
-import { VSpace } from "../space";
 import { VButton } from "../button";
+import { VSpace } from "../space";
 
 const meta: Meta<typeof VEmpty> = {
   title: "Empty",
diff --git a/ui/packages/components/src/components/empty/__tests__/Empty.spec.ts b/ui/packages/components/src/components/empty/__tests__/Empty.spec.ts
index 5ae4bd8a6..5156470d5 100644
--- a/ui/packages/components/src/components/empty/__tests__/Empty.spec.ts
+++ b/ui/packages/components/src/components/empty/__tests__/Empty.spec.ts
@@ -1,8 +1,8 @@
-import { describe, expect, it } from "vitest";
 import { mount } from "@vue/test-utils";
-import { VEmpty } from "../index";
-import { VButton } from "../../button";
+import { describe, expect, it } from "vitest";
 import { h } from "vue";
+import { VButton } from "../../button";
+import { VEmpty } from "../index";
 
 describe("Empty", () => {
   it("should render", () => {
diff --git a/ui/packages/components/src/components/entity/Entity.vue b/ui/packages/components/src/components/entity/Entity.vue
index f57ea6d81..8dd242d84 100644
--- a/ui/packages/components/src/components/entity/Entity.vue
+++ b/ui/packages/components/src/components/entity/Entity.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { IconMore } from "../../icons/icons";
 import { computed } from "vue";
+import { IconMore } from "../../icons/icons";
 import { VDropdown } from "../dropdown";
 
 const props = withDefaults(
diff --git a/ui/packages/components/src/components/menu/Menu.stories.ts b/ui/packages/components/src/components/menu/Menu.stories.ts
index b5f1ada85..518d04bbc 100644
--- a/ui/packages/components/src/components/menu/Menu.stories.ts
+++ b/ui/packages/components/src/components/menu/Menu.stories.ts
@@ -1,13 +1,13 @@
-import type { Meta, StoryObj } from "@storybook/vue3";
-import { VMenu, VMenuItem, VMenuLabel } from "./index";
 import {
+  IconAddCircle,
   IconBookRead,
   IconDashboard,
   IconFolder,
   IconMessage,
   IconPages,
-  IconAddCircle,
 } from "@/icons/icons";
+import type { Meta, StoryObj } from "@storybook/vue3";
+import { VMenu, VMenuItem, VMenuLabel } from "./index";
 
 const meta: Meta<typeof VMenu> = {
   title: "Menu",
diff --git a/ui/packages/components/src/components/menu/MenuItem.vue b/ui/packages/components/src/components/menu/MenuItem.vue
index a4ed9b209..5d79987ac 100644
--- a/ui/packages/components/src/components/menu/MenuItem.vue
+++ b/ui/packages/components/src/components/menu/MenuItem.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { IconArrowRight } from "../../icons/icons";
 import { computed, inject, ref, useSlots } from "vue";
+import { IconArrowRight } from "../../icons/icons";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/components/src/components/menu/__tests__/Menu.spec.tsx b/ui/packages/components/src/components/menu/__tests__/Menu.spec.tsx
index d1058be65..ded07e3f0 100644
--- a/ui/packages/components/src/components/menu/__tests__/Menu.spec.tsx
+++ b/ui/packages/components/src/components/menu/__tests__/Menu.spec.tsx
@@ -1,5 +1,5 @@
-import { describe, expect, it } from "vitest";
 import { mount } from "@vue/test-utils";
+import { describe, expect, it } from "vitest";
 import { VMenu, VMenuItem } from "../index";
 
 describe("Menu", () => {
diff --git a/ui/packages/components/src/components/menu/__tests__/MenuLabel.spec.ts b/ui/packages/components/src/components/menu/__tests__/MenuLabel.spec.ts
index 317fdd784..fcf5fa7c4 100644
--- a/ui/packages/components/src/components/menu/__tests__/MenuLabel.spec.ts
+++ b/ui/packages/components/src/components/menu/__tests__/MenuLabel.spec.ts
@@ -1,6 +1,6 @@
+import { mount } from "@vue/test-utils";
 import { describe, expect, it } from "vitest";
 import { VMenuLabel } from "../index";
-import { mount } from "@vue/test-utils";
 
 describe("MenuLabel", () => {
   it("should render", () => {
diff --git a/ui/packages/components/src/components/modal/Modal.stories.ts b/ui/packages/components/src/components/modal/Modal.stories.ts
index 87eb41c78..39f9285d2 100644
--- a/ui/packages/components/src/components/modal/Modal.stories.ts
+++ b/ui/packages/components/src/components/modal/Modal.stories.ts
@@ -1,10 +1,10 @@
 import type { Meta, StoryObj } from "@storybook/vue3";
 
+import { IconArrowLeft, IconArrowRight } from "@/icons/icons";
+import { ref } from "vue";
 import { VModal } from ".";
 import { VButton } from "../button";
-import { IconArrowLeft, IconArrowRight } from "@/icons/icons";
 import { VSpace } from "../space";
-import { ref } from "vue";
 
 const meta: Meta<typeof VModal> = {
   title: "Modal",
diff --git a/ui/packages/components/src/components/modal/Modal.vue b/ui/packages/components/src/components/modal/Modal.vue
index fc000f414..3c9ba85e9 100644
--- a/ui/packages/components/src/components/modal/Modal.vue
+++ b/ui/packages/components/src/components/modal/Modal.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { computed, nextTick, reactive, ref, watch, onMounted } from "vue";
-import { IconClose } from "../../icons/icons";
 import type { UseOverlayScrollbarsParams } from "overlayscrollbars-vue";
 import { useOverlayScrollbars } from "overlayscrollbars-vue";
+import { computed, nextTick, onMounted, reactive, ref, watch } from "vue";
+import { IconClose } from "../../icons/icons";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/components/src/components/pagination/__tests__/Pagination.spec.ts b/ui/packages/components/src/components/pagination/__tests__/Pagination.spec.ts
index d5eb39418..9993d8e7c 100644
--- a/ui/packages/components/src/components/pagination/__tests__/Pagination.spec.ts
+++ b/ui/packages/components/src/components/pagination/__tests__/Pagination.spec.ts
@@ -1,5 +1,5 @@
-import { describe, expect, it } from "vitest";
 import { mount } from "@vue/test-utils";
+import { describe, expect, it } from "vitest";
 import { VPagination } from "../index";
 
 describe("Pagination", () => {
diff --git a/ui/packages/components/src/components/space/Space.vue b/ui/packages/components/src/components/space/Space.vue
index 7cc9f9f8b..1be4dee2a 100644
--- a/ui/packages/components/src/components/space/Space.vue
+++ b/ui/packages/components/src/components/space/Space.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
+import { computed } from "vue";
 import type { Align, Direction, Spacing } from "./interface";
 import { SpacingSize } from "./interface";
-import { computed } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/components/src/components/space/__tests__/Space.spec.ts b/ui/packages/components/src/components/space/__tests__/Space.spec.ts
index 3854ac0ce..b79152033 100644
--- a/ui/packages/components/src/components/space/__tests__/Space.spec.ts
+++ b/ui/packages/components/src/components/space/__tests__/Space.spec.ts
@@ -1,6 +1,6 @@
+import { mount } from "@vue/test-utils";
 import { describe, expect, it } from "vitest";
 import { VSpace } from "../index";
-import { mount } from "@vue/test-utils";
 import { SpacingSize } from "../interface";
 
 describe("Space", () => {
diff --git a/ui/packages/components/src/components/switch/__tests__/Switch.spec.ts b/ui/packages/components/src/components/switch/__tests__/Switch.spec.ts
index b77724498..ee77a6108 100644
--- a/ui/packages/components/src/components/switch/__tests__/Switch.spec.ts
+++ b/ui/packages/components/src/components/switch/__tests__/Switch.spec.ts
@@ -1,6 +1,6 @@
+import { mount } from "@vue/test-utils";
 import { describe, expect, it } from "vitest";
 import { VSwitch } from "../index";
-import { mount } from "@vue/test-utils";
 
 describe("Switch", () => {
   it("should render", () => {
diff --git a/ui/packages/components/src/components/tabs/Tabbar.stories.ts b/ui/packages/components/src/components/tabs/Tabbar.stories.ts
index 8e49081c4..bdea3757d 100644
--- a/ui/packages/components/src/components/tabs/Tabbar.stories.ts
+++ b/ui/packages/components/src/components/tabs/Tabbar.stories.ts
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from "@storybook/vue3";
-import { VTabbar } from ".";
 import { ref } from "vue";
+import { VTabbar } from ".";
 
 const meta: Meta<typeof VTabbar> = {
   title: "Tabbar",
diff --git a/ui/packages/components/src/components/tabs/Tabbar.vue b/ui/packages/components/src/components/tabs/Tabbar.vue
index a8cc00db0..78c3cf9fc 100644
--- a/ui/packages/components/src/components/tabs/Tabbar.vue
+++ b/ui/packages/components/src/components/tabs/Tabbar.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import { computed, onMounted, onUnmounted, ref, watch } from "vue";
-import type { ArrowShow, Direction, Type } from "./interface";
-import type { ComputedRef } from "vue";
 import { useElementSize, useThrottleFn } from "@vueuse/core";
+import type { ComputedRef } from "vue";
+import { computed, onMounted, onUnmounted, ref, watch } from "vue";
 import { IconArrowLeft, IconArrowRight } from "../../icons/icons";
+import type { ArrowShow, Direction, Type } from "./interface";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/components/src/components/tabs/Tabs.stories.ts b/ui/packages/components/src/components/tabs/Tabs.stories.ts
index f3f9cf6d4..9d58030ba 100644
--- a/ui/packages/components/src/components/tabs/Tabs.stories.ts
+++ b/ui/packages/components/src/components/tabs/Tabs.stories.ts
@@ -1,5 +1,5 @@
 import type { Meta, StoryObj } from "@storybook/vue3";
-import { VTabs, VTabItem } from ".";
+import { VTabItem, VTabs } from ".";
 
 const meta: Meta<typeof VTabs> = {
   title: "Tabs",
diff --git a/ui/packages/components/src/components/tabs/index.ts b/ui/packages/components/src/components/tabs/index.ts
index 17d188189..307789a25 100644
--- a/ui/packages/components/src/components/tabs/index.ts
+++ b/ui/packages/components/src/components/tabs/index.ts
@@ -1,3 +1,3 @@
-export { default as VTabs } from "./Tabs.vue";
 export { default as VTabItem } from "./TabItem.vue";
 export { default as VTabbar } from "./Tabbar.vue";
+export { default as VTabs } from "./Tabs.vue";
diff --git a/ui/packages/components/src/components/tag/Tag.story.vue b/ui/packages/components/src/components/tag/Tag.story.vue
index e5b9385e5..6705b2b89 100644
--- a/ui/packages/components/src/components/tag/Tag.story.vue
+++ b/ui/packages/components/src/components/tag/Tag.story.vue
@@ -43,7 +43,7 @@
   </Story>
 </template>
 <script lang="ts" setup>
-import { VTag } from "../../components/tag";
 import { VSpace } from "../../components/space";
+import { VTag } from "../../components/tag";
 import { IconSettings } from "../../icons/icons";
 </script>
diff --git a/ui/packages/components/src/components/toast/Toast.story.vue b/ui/packages/components/src/components/toast/Toast.story.vue
index 6b14679c1..e22b4aee1 100644
--- a/ui/packages/components/src/components/toast/Toast.story.vue
+++ b/ui/packages/components/src/components/toast/Toast.story.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import { VButton } from "../button";
 import { VSpace } from "../space";
-import { Toast } from "./toast-manager";
 import type { Type } from "./interface";
+import { Toast } from "./toast-manager";
 
 function handleShowToast(type: Type, content: string) {
   Toast[type](content);
diff --git a/ui/packages/components/src/components/toast/Toast.vue b/ui/packages/components/src/components/toast/Toast.vue
index 8b5b49564..c6774bb31 100644
--- a/ui/packages/components/src/components/toast/Toast.vue
+++ b/ui/packages/components/src/components/toast/Toast.vue
@@ -1,20 +1,20 @@
 <script lang="ts" setup>
-import type { Type } from "./interface";
-import {
-  onMounted,
-  ref,
-  watchEffect,
-  type Raw,
-  type Component,
-  markRaw,
-} from "vue";
 import {
   IconCheckboxCircle,
+  IconClose,
   IconErrorWarning,
   IconForbidLine,
   IconInformation,
-  IconClose,
 } from "@/icons/icons";
+import {
+  markRaw,
+  onMounted,
+  ref,
+  watchEffect,
+  type Component,
+  type Raw,
+} from "vue";
+import type { Type } from "./interface";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/components/src/components/toast/toast-manager.ts b/ui/packages/components/src/components/toast/toast-manager.ts
index baa0e5b46..591b8b3a8 100644
--- a/ui/packages/components/src/components/toast/toast-manager.ts
+++ b/ui/packages/components/src/components/toast/toast-manager.ts
@@ -1,5 +1,5 @@
-import ToastComponent from "./Toast.vue";
 import { createVNode, render, type Component, type VNode } from "vue";
+import ToastComponent from "./Toast.vue";
 import type { ToastProps } from "./interface";
 
 export type ToastApiProps = Omit<ToastProps, "type" | "content">;
diff --git a/ui/packages/components/src/components/tooltip/index.ts b/ui/packages/components/src/components/tooltip/index.ts
index f3893f8b3..1e9da5869 100644
--- a/ui/packages/components/src/components/tooltip/index.ts
+++ b/ui/packages/components/src/components/tooltip/index.ts
@@ -1,3 +1,3 @@
 // VTooltip is deprecated, please use vTooltip from "@halo-dev/components" instead
-export { vTooltip, vTooltip as VTooltip } from "floating-vue";
+export { vTooltip as VTooltip, vTooltip } from "floating-vue";
 import "./style.css";
diff --git a/ui/packages/components/src/icons/icons.ts b/ui/packages/components/src/icons/icons.ts
index 550009405..f31c69959 100644
--- a/ui/packages/components/src/icons/icons.ts
+++ b/ui/packages/components/src/icons/icons.ts
@@ -1,155 +1,155 @@
-import IconDashboard from "~icons/ri/dashboard-3-line";
+import IconAccountCircleLine from "~icons/ri/account-circle-line";
+import IconAddCircle from "~icons/ri/add-circle-line";
+import IconArrowDownCircleLine from "~icons/ri/arrow-down-circle-line";
+import IconArrowDown from "~icons/ri/arrow-down-s-fill";
+import IconArrowDownLine from "~icons/ri/arrow-down-s-line";
+import IconArrowLeftRightLine from "~icons/ri/arrow-left-right-line";
 import IconArrowLeft from "~icons/ri/arrow-left-s-line";
 import IconArrowRight from "~icons/ri/arrow-right-s-line";
-import IconArrowDown from "~icons/ri/arrow-down-s-fill";
+import IconArrowUpCircleLine from "~icons/ri/arrow-up-circle-line";
+import IconArrowUpDownLine from "~icons/ri/arrow-up-down-line";
 import IconArrowUpLine from "~icons/ri/arrow-up-s-line";
-import IconArrowDownLine from "~icons/ri/arrow-down-s-line";
 import IconBookRead from "~icons/ri/book-read-line";
-import IconPages from "~icons/ri/pages-line";
-import IconMessage from "~icons/ri/message-3-line";
-import IconPalette from "~icons/ri/palette-line";
-import IconListSettings from "~icons/ri/list-settings-line";
-import IconMagic from "~icons/ri/magic-line";
-import IconUserSettings from "~icons/ri/user-settings-line";
-import IconSettings from "~icons/ri/settings-4-line";
-import IconPlug from "~icons/ri/plug-2-line";
+import IconCalendar from "~icons/ri/calendar-line";
+import IconCharacterRecognition from "~icons/ri/character-recognition-line";
+import IconCheckboxFill from "~icons/ri/checkbox-circle-fill";
+import IconCheckboxCircle from "~icons/ri/checkbox-circle-line";
+import IconClipboardLine from "~icons/ri/clipboard-line";
+import IconCloseCircle from "~icons/ri/close-circle-line";
+import IconClose from "~icons/ri/close-line";
+import IconCodeBoxLine from "~icons/ri/code-box-line";
+import IconComputer from "~icons/ri/computer-line";
+import IconDashboard from "~icons/ri/dashboard-3-line";
+import IconDatabase2Line from "~icons/ri/database-2-line";
+import IconDeleteBin from "~icons/ri/delete-bin-2-line";
+import IconMotionLine from "~icons/ri/emotion-line";
+import IconErrorWarning from "~icons/ri/error-warning-line";
+import IconExchange from "~icons/ri/exchange-line";
+import IconExternalLinkLine from "~icons/ri/external-link-line";
 import IconEye from "~icons/ri/eye-line";
 import IconEyeOff from "~icons/ri/eye-off-line";
 import IconFolder from "~icons/ri/folder-2-line";
-import IconMore from "~icons/ri/more-line";
-import IconClose from "~icons/ri/close-line";
-import IconErrorWarning from "~icons/ri/error-warning-line";
-import IconCheckboxCircle from "~icons/ri/checkbox-circle-line";
-import IconInformation from "~icons/ri/information-line";
-import IconCloseCircle from "~icons/ri/close-circle-line";
-import IconDeleteBin from "~icons/ri/delete-bin-2-line";
-import IconAddCircle from "~icons/ri/add-circle-line";
-import IconSave from "~icons/ri/save-line";
-import IconList from "~icons/ri/list-unordered";
-import IconGrid from "~icons/ri/grid-line";
-import IconCheckboxFill from "~icons/ri/checkbox-circle-fill";
-import IconSearch from "~icons/ri/search-2-line";
-import IconComputer from "~icons/ri/computer-line";
-import IconPhone from "~icons/ri/smartphone-line";
-import IconTablet from "~icons/ri/tablet-line";
-import IconUserFollow from "~icons/ri/user-follow-line";
-import IconExchange from "~icons/ri/exchange-line";
-import IconGitHub from "~icons/ri/github-fill";
-import IconUpload from "~icons/ri/upload-cloud-2-line";
-import IconShieldUser from "~icons/ri/shield-user-line";
-import IconGitBranch from "~icons/ri/git-branch-line";
-import IconStopCircle from "~icons/ri/stop-circle-line";
 import IconForbidLine from "~icons/ri/forbid-line";
-import IconCodeBoxLine from "~icons/ri/code-box-line";
-import IconDatabase2Line from "~icons/ri/database-2-line";
-import IconTeam from "~icons/ri/team-fill";
-import IconCharacterRecognition from "~icons/ri/character-recognition-line";
-import IconCalendar from "~icons/ri/calendar-line";
+import IconGitBranch from "~icons/ri/git-branch-line";
+import IconGitHub from "~icons/ri/github-fill";
+import IconGrid from "~icons/ri/grid-line";
+import IconHistoryLine from "~icons/ri/history-line";
+import IconImageAddLine from "~icons/ri/image-add-line";
+import IconInformation from "~icons/ri/information-line";
 import IconLink from "~icons/ri/link";
-import IconUserLine from "~icons/ri/user-line";
-import IconMotionLine from "~icons/ri/emotion-line";
-import IconReplyLine from "~icons/ri/reply-line";
-import IconExternalLinkLine from "~icons/ri/external-link-line";
-import IconRefreshLine from "~icons/ri/refresh-line";
-import IconWindowLine from "~icons/ri/window-line";
-import IconSendPlaneFill from "~icons/ri/send-plane-fill";
-import IconRocketLine from "~icons/ri/rocket-line";
-import IconArrowUpCircleLine from "~icons/ri/arrow-up-circle-line";
-import IconArrowDownCircleLine from "~icons/ri/arrow-down-circle-line";
-import IconTerminalBoxLine from "~icons/ri/terminal-box-line";
-import IconClipboardLine from "~icons/ri/clipboard-line";
+import IconListSettings from "~icons/ri/list-settings-line";
+import IconList from "~icons/ri/list-unordered";
 import IconLockPasswordLine from "~icons/ri/lock-password-line";
-import IconServerLine from "~icons/ri/server-line";
+import IconLogoutCircleRLine from "~icons/ri/logout-circle-r-line";
+import IconMagic from "~icons/ri/magic-line";
+import IconMessage from "~icons/ri/message-3-line";
+import IconMore from "~icons/ri/more-line";
+import IconNotificationBadgeLine from "~icons/ri/notification-badge-line";
+import IconPages from "~icons/ri/pages-line";
+import IconPalette from "~icons/ri/palette-line";
 import IconRiPencilFill from "~icons/ri/pencil-fill";
+import IconPlug from "~icons/ri/plug-2-line";
+import IconRefreshLine from "~icons/ri/refresh-line";
+import IconReplyLine from "~icons/ri/reply-line";
+import IconRocketLine from "~icons/ri/rocket-line";
+import IconSave from "~icons/ri/save-line";
+import IconSearch from "~icons/ri/search-2-line";
+import IconSendPlaneFill from "~icons/ri/send-plane-fill";
+import IconServerLine from "~icons/ri/server-line";
+import IconSettings3Line from "~icons/ri/settings-3-line";
+import IconSettings from "~icons/ri/settings-4-line";
+import IconShieldUser from "~icons/ri/shield-user-line";
+import IconPhone from "~icons/ri/smartphone-line";
+import IconStopCircle from "~icons/ri/stop-circle-line";
+import IconTablet from "~icons/ri/tablet-line";
+import IconTeam from "~icons/ri/team-fill";
+import IconTerminalBoxLine from "~icons/ri/terminal-box-line";
+import IconTimerLine from "~icons/ri/timer-line";
+import IconToolsFill from "~icons/ri/tools-fill";
+import IconRiUpload2Fill from "~icons/ri/upload-2-fill";
+import IconUpload from "~icons/ri/upload-cloud-2-line";
+import IconUserFollow from "~icons/ri/user-follow-line";
+import IconUserLine from "~icons/ri/user-line";
+import IconUserSettings from "~icons/ri/user-settings-line";
+import IconWindowLine from "~icons/ri/window-line";
 import IconZoomInLine from "~icons/ri/zoom-in-line";
 import IconZoomOutLine from "~icons/ri/zoom-out-line";
-import IconArrowLeftRightLine from "~icons/ri/arrow-left-right-line";
-import IconArrowUpDownLine from "~icons/ri/arrow-up-down-line";
-import IconRiUpload2Fill from "~icons/ri/upload-2-fill";
-import IconNotificationBadgeLine from "~icons/ri/notification-badge-line";
-import IconLogoutCircleRLine from "~icons/ri/logout-circle-r-line";
-import IconAccountCircleLine from "~icons/ri/account-circle-line";
-import IconSettings3Line from "~icons/ri/settings-3-line";
-import IconImageAddLine from "~icons/ri/image-add-line";
-import IconToolsFill from "~icons/ri/tools-fill";
-import IconHistoryLine from "~icons/ri/history-line";
-import IconTimerLine from "~icons/ri/timer-line";
 
 export {
-  IconDashboard,
-  IconArrowLeft,
-  IconArrowRight,
+  IconAccountCircleLine,
+  IconAddCircle,
   IconArrowDown,
+  IconArrowDownCircleLine,
+  IconArrowDownLine,
+  IconArrowLeft,
+  IconArrowLeftRightLine,
+  IconArrowRight,
+  IconArrowUpCircleLine,
+  IconArrowUpDownLine,
+  IconArrowUpLine,
   IconBookRead,
-  IconPages,
-  IconMessage,
-  IconPalette,
-  IconListSettings,
-  IconMagic,
-  IconUserSettings,
-  IconSettings,
-  IconPlug,
+  IconCalendar,
+  IconCharacterRecognition,
+  IconCheckboxCircle,
+  IconCheckboxFill,
+  IconClipboardLine,
+  IconClose,
+  IconCloseCircle,
+  IconCodeBoxLine,
+  IconComputer,
+  IconDashboard,
+  IconDatabase2Line,
+  IconDeleteBin,
+  IconErrorWarning,
+  IconExchange,
+  IconExternalLinkLine,
   IconEye,
   IconEyeOff,
   IconFolder,
-  IconMore,
-  IconClose,
-  IconErrorWarning,
-  IconCheckboxCircle,
-  IconInformation,
-  IconCloseCircle,
-  IconDeleteBin,
-  IconAddCircle,
-  IconSave,
-  IconList,
-  IconGrid,
-  IconCheckboxFill,
-  IconArrowUpLine,
-  IconArrowDownLine,
-  IconSearch,
-  IconComputer,
-  IconPhone,
-  IconTablet,
-  IconUserFollow,
-  IconExchange,
-  IconGitHub,
-  IconUpload,
-  IconShieldUser,
-  IconGitBranch,
-  IconStopCircle,
   IconForbidLine,
-  IconCodeBoxLine,
-  IconDatabase2Line,
-  IconTeam,
-  IconCharacterRecognition,
-  IconCalendar,
+  IconGitBranch,
+  IconGitHub,
+  IconGrid,
+  IconHistoryLine,
+  IconImageAddLine,
+  IconInformation,
   IconLink,
-  IconUserLine,
-  IconMotionLine,
-  IconReplyLine,
-  IconExternalLinkLine,
-  IconRefreshLine,
-  IconWindowLine,
-  IconSendPlaneFill,
-  IconRocketLine,
-  IconArrowUpCircleLine,
-  IconArrowDownCircleLine,
-  IconTerminalBoxLine,
-  IconClipboardLine,
+  IconList,
+  IconListSettings,
   IconLockPasswordLine,
-  IconServerLine,
+  IconLogoutCircleRLine,
+  IconMagic,
+  IconMessage,
+  IconMore,
+  IconMotionLine,
+  IconNotificationBadgeLine,
+  IconPages,
+  IconPalette,
+  IconPhone,
+  IconPlug,
+  IconRefreshLine,
+  IconReplyLine,
   IconRiPencilFill,
+  IconRiUpload2Fill,
+  IconRocketLine,
+  IconSave,
+  IconSearch,
+  IconSendPlaneFill,
+  IconServerLine,
+  IconSettings,
+  IconSettings3Line,
+  IconShieldUser,
+  IconStopCircle,
+  IconTablet,
+  IconTeam,
+  IconTerminalBoxLine,
+  IconTimerLine,
+  IconToolsFill,
+  IconUpload,
+  IconUserFollow,
+  IconUserLine,
+  IconUserSettings,
+  IconWindowLine,
   IconZoomInLine,
   IconZoomOutLine,
-  IconArrowLeftRightLine,
-  IconArrowUpDownLine,
-  IconRiUpload2Fill,
-  IconNotificationBadgeLine,
-  IconLogoutCircleRLine,
-  IconAccountCircleLine,
-  IconSettings3Line,
-  IconImageAddLine,
-  IconToolsFill,
-  IconHistoryLine,
-  IconTimerLine,
 };
diff --git a/ui/packages/components/src/index.ts b/ui/packages/components/src/index.ts
index dc9571175..532e02eeb 100644
--- a/ui/packages/components/src/index.ts
+++ b/ui/packages/components/src/index.ts
@@ -1,5 +1,5 @@
-import "./styles/tailwind.css";
 import "overlayscrollbars/overlayscrollbars.css";
+import "./styles/tailwind.css";
 
 export * from "./components";
 export * from "./icons/icons";
diff --git a/ui/packages/components/src/stories/assets/code-brackets.svg b/ui/packages/components/src/stories/assets/code-brackets.svg
index 73de94776..19c7826c8 100644
--- a/ui/packages/components/src/stories/assets/code-brackets.svg
+++ b/ui/packages/components/src/stories/assets/code-brackets.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/code-brackets</title><g id="illustration/code-brackets" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#87E6E5" d="M11.4139325,12 C11.7605938,12 12,12.5059743 12,13.3779712 L12,17.4951758 L6.43502246,23.3839989 C5.85499251,23.9978337 5.85499251,25.0021663 6.43502246,25.6160011 L12,31.5048242 L12,35.6220288 C12,36.4939606 11.7605228,37 11.4139325,37 C11.2725831,37 11.1134406,36.9158987 10.9453839,36.7379973 L0.435022463,25.6160011 C-0.145007488,25.0021663 -0.145007488,23.9978337 0.435022463,23.3839989 L10.9453839,12.2620027 C11.1134051,12.0841663 11.2725831,12 11.4139325,12 Z M36.5860675,12 C36.7274169,12 36.8865594,12.0841013 37.0546161,12.2620027 L47.5649775,23.3839989 C48.1450075,23.9978337 48.1450075,25.0021663 47.5649775,25.6160011 L37.0546161,36.7379973 C36.8865949,36.9158337 36.7274169,37 36.5860675,37 C36.2394062,37 36,36.4940257 36,35.6220288 L36,31.5048242 L41.5649775,25.6160011 C42.1450075,25.0021663 42.1450075,23.9978337 41.5649775,23.3839989 L36,17.4951758 L36,13.3779712 C36,12.5060394 36.2394772,12 36.5860675,12 Z"/><rect id="Rectangle-7-Copy-5" width="35.57" height="4" x="5.009" y="22.662" fill="#A0DB77" rx="2" transform="translate(22.793959, 24.662305) rotate(-75.000000) translate(-22.793959, -24.662305)"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/code-brackets</title><g id="illustration/code-brackets" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#87E6E5" d="M11.4139325,12 C11.7605938,12 12,12.5059743 12,13.3779712 L12,17.4951758 L6.43502246,23.3839989 C5.85499251,23.9978337 5.85499251,25.0021663 6.43502246,25.6160011 L12,31.5048242 L12,35.6220288 C12,36.4939606 11.7605228,37 11.4139325,37 C11.2725831,37 11.1134406,36.9158987 10.9453839,36.7379973 L0.435022463,25.6160011 C-0.145007488,25.0021663 -0.145007488,23.9978337 0.435022463,23.3839989 L10.9453839,12.2620027 C11.1134051,12.0841663 11.2725831,12 11.4139325,12 Z M36.5860675,12 C36.7274169,12 36.8865594,12.0841013 37.0546161,12.2620027 L47.5649775,23.3839989 C48.1450075,23.9978337 48.1450075,25.0021663 47.5649775,25.6160011 L37.0546161,36.7379973 C36.8865949,36.9158337 36.7274169,37 36.5860675,37 C36.2394062,37 36,36.4940257 36,35.6220288 L36,31.5048242 L41.5649775,25.6160011 C42.1450075,25.0021663 42.1450075,23.9978337 41.5649775,23.3839989 L36,17.4951758 L36,13.3779712 C36,12.5060394 36.2394772,12 36.5860675,12 Z"/><rect id="Rectangle-7-Copy-5" width="35.57" height="4" x="5.009" y="22.662" fill="#A0DB77" rx="2" transform="translate(22.793959, 24.662305) rotate(-75.000000) translate(-22.793959, -24.662305)"/></g></svg>
diff --git a/ui/packages/components/src/stories/assets/colors.svg b/ui/packages/components/src/stories/assets/colors.svg
index 17d58d516..bcfd39901 100644
--- a/ui/packages/components/src/stories/assets/colors.svg
+++ b/ui/packages/components/src/stories/assets/colors.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/colors</title><g id="illustration/colors" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><circle id="Oval" cx="23.763" cy="16.192" r="13.271" fill="#FC521F" opacity=".6"/><circle id="Oval-Copy" cx="15.468" cy="32.308" r="13.271" fill="#66BF3C" opacity=".6"/><path id="Combined-Shape" fill="#FF5F95" d="M15.4683651,19.0362231 C21.5434817,19.0362231 26.6652087,23.1181689 28.2404554,28.6889694 C26.8420385,29.1906678 25.3344184,29.4637769 23.7630101,29.4637769 C17.6878936,29.4637769 12.5661666,25.3818311 10.9909199,19.8110306 C12.3898993,19.3092302 13.8972501,19.0362231 15.4683651,19.0362231 Z"/><circle id="Oval-Copy-2" cx="32.532" cy="32.308" r="13.271" fill="#1EA7FD" opacity=".6"/><path id="Combined-Shape" fill="#87E6E5" d="M24.00025,22.1417324 C26.897967,24.5762286 28.7397972,28.2268506 28.7397972,32.3076552 C28.7397972,36.3884597 26.897967,40.0390817 24.00025,42.4735779 C21.1018087,40.038637 19.2602028,36.3882111 19.2602028,32.3076552 C19.2602028,28.2815316 21.0530043,24.6741393 23.8838362,22.2402492 Z"/><path id="Combined-Shape" fill="#FBD178" d="M32.5316349,19.0362231 C33.9415155,19.0362231 35.3000478,19.2560712 36.5748203,19.6633557 C35.0489179,25.3104816 29.8909911,29.4637769 23.7630101,29.4637769 C22.3527608,29.4637769 20.9938866,29.2438138 19.7188247,28.8363247 C21.2451195,23.1900077 26.403293,19.0362231 32.5316349,19.0362231 Z"/><path id="Combined-Shape" fill="#FFF" d="M24.00025,22.1417324 L24.0124326,22.1519799 C24.1747744,22.288701 24.3337918,22.4292434 24.4893463,22.5734686 L24.3896855,22.4820008 C24.4671836,22.552408 24.5438453,22.6237194 24.619654,22.6959185 L24.4893463,22.5734686 C24.5690639,22.6473803 24.6478719,22.7222591 24.7257519,22.7980864 L24.619654,22.6959185 C24.6907654,22.7636441 24.7611262,22.8321506 24.8307226,22.9014245 L24.7257519,22.7980864 C24.8120661,22.8821258 24.8972403,22.9673303 24.981249,23.0536745 L24.8307226,22.9014245 C24.9073006,22.9776475 24.9829531,23.0547994 25.0576619,23.132862 L25.057852,23.1330605 C25.3140855,23.4007967 25.559391,23.679459 25.7928375,23.9681079 L25.7230574,23.8825538 C25.7985998,23.9743942 25.8729325,24.0672672 25.9460311,24.1611484 L25.7928375,23.9681079 C25.8624256,24.0541514 25.93096,24.1410823 25.998421,24.228881 L25.9460311,24.1611484 C26.0074362,24.2400115 26.0679704,24.319586 26.1276194,24.3998576 L25.998421,24.228881 C26.0663495,24.317288 26.1331896,24.4065749 26.1989214,24.4967216 L26.1276194,24.3998576 C26.204848,24.5037867 26.2805926,24.6088841 26.3548219,24.7151187 L26.1989214,24.4967216 C26.2678555,24.59126 26.3355706,24.6867441 26.4020436,24.7831507 L26.3548219,24.7151187 C26.4130013,24.798383 26.4702498,24.8823459 26.5265523,24.9669921 L26.4020436,24.7831507 C26.4678788,24.8786322 26.5324956,24.9750187 26.5958716,25.0722875 L26.5959296,25.0723765 C26.736338,25.2878741 26.870709,25.5077955 26.9987399,25.7318073 L26.9410662,25.6319089 C26.9973106,25.7283602 27.0523736,25.8255849 27.1062352,25.9235633 L26.9987399,25.7318073 C27.0539848,25.8284676 27.1080492,25.9258895 27.1609136,26.0240532 L27.1606656,26.0235927 C27.2696676,26.2259984 27.3733426,26.4310837 27.4717677,26.6391379 L27.4715275,26.6386302 C27.5541941,26.8133735 27.6329386,26.9896914 27.7079006,27.1679911 C27.7630163,27.299081 27.8161443,27.431391 27.8671831,27.5647345 L27.804312,27.4036517 C27.8391482,27.4912057 27.8730792,27.5792182 27.9060936,27.6676774 L27.8671831,27.5647345 C27.906613,27.6677486 27.9447959,27.7713796 27.9817136,27.8756091 L27.9060936,27.6676774 C27.946474,27.7758735 27.9854831,27.884738 28.0230997,27.9942498 L27.9817136,27.8756091 C28.0144978,27.9681688 28.0462842,28.0612004 28.0770597,28.1546911 L28.0230997,27.9942498 C28.0618265,28.1069941 28.0990774,28.2204244 28.1348294,28.3345177 L28.0770597,28.1546911 C28.1112208,28.2584663 28.1441365,28.3628071 28.175789,28.4676958 L28.1756797,28.4673338 L28.2408136,28.6893554 C28.2284694,28.6937793 28.2161167,28.6981854 28.2037557,28.7025737 L28.2404554,28.6889694 C27.9517707,28.7925384 27.6584322,28.8863659 27.3608394,28.97006 L27.3609965,28.9702524 C27.0695498,29.0519815 26.7741843,29.1241944 26.4751174,29.1863314 L26.5385665,29.1730829 C26.3901218,29.2046704 26.2407589,29.2337757 26.0905233,29.2603535 L26.4751174,29.1863314 C26.3367402,29.215082 26.1975707,29.2416755 26.0576458,29.2660754 L26.0905233,29.2603535 C25.9366833,29.2875689 25.7819282,29.312134 25.6263069,29.334 L26.0576458,29.2660754 C25.9017815,29.2932549 25.7449801,29.3177127 25.5872928,29.3393985 L25.6263069,29.334 C25.493366,29.3526793 25.3597929,29.3693888 25.2256182,29.3840982 L25.5872928,29.3393985 C25.4326976,29.360659 25.277251,29.3792552 25.1210012,29.3951396 L25.2256182,29.3840982 C25.0570566,29.4025774 24.8875455,29.4178998 24.7171453,29.4300052 L25.1210012,29.3951396 C24.9661341,29.4108835 24.810478,29.4239634 24.6540799,29.4343333 L24.7171453,29.4300052 C24.5612618,29.4410793 24.4046342,29.4494611 24.2473088,29.4551045 L24.6540799,29.4343333 C24.5098436,29.4438967 24.3649762,29.4511552 24.2195147,29.4560724 L24.2473088,29.4551045 C24.0865878,29.4608697 23.9251385,29.4637769 23.7630101,29.4637769 L23.3130142,29.4562912 C23.2993121,29.4558347 23.2856153,29.4553574 23.2719237,29.4548593 C22.9596275,29.4434959 22.6502324,29.4213577 22.3439491,29.3888006 L22.3886972,29.3934808 C22.2468147,29.3788837 22.105595,29.3620515 21.9650736,29.3430199 L22.3439491,29.3888006 C22.1914515,29.3725905 22.0397254,29.3537976 21.8888152,29.3324664 L21.9650736,29.3430199 C21.8025527,29.3210088 21.6409661,29.2960557 21.4803691,29.2682161 L21.8888152,29.3324664 C21.7352182,29.3107553 21.5824665,29.2864149 21.4306071,29.2594919 L21.4803691,29.2682161 C21.3506285,29.2457255 21.2215338,29.221351 21.0931142,29.1951218 L21.4306071,29.2594919 C21.2772401,29.2323016 21.1247833,29.2024774 20.973285,29.1700676 L21.0931142,29.1951218 C20.9267071,29.1611338 20.7614335,29.1240315 20.5973571,29.0838786 L20.973285,29.1700676 C20.825476,29.138447 20.6785795,29.1043653 20.5326403,29.0678674 L20.5973571,29.0838786 C20.4596684,29.0501832 20.3228227,29.0143396 20.1868576,28.9763851 L20.5326403,29.0678674 C20.3930822,29.0329653 20.2543997,28.9958536 20.1166319,28.9565718 L20.1169729,28.956669 L19.7188247,28.8363247 L19.7188247,28.8363247 L19.7880988,28.5894836 C19.8166627,28.4914193 19.8463277,28.3938241 19.8770797,28.2967124 L19.8480041,28.389868 C19.888904,28.2573207 19.931824,28.1256601 19.9767281,27.9949221 L19.8770797,28.2967124 C19.9117081,28.1873592 19.9477148,28.0786191 19.9850793,27.9705124 L19.9853117,27.9700125 C20.1152243,27.5939638 20.2618428,27.2250995 20.4240731,26.8647811 L20.345088,27.0439391 C20.3899401,26.9402428 20.4360767,26.8372321 20.4834778,26.7349269 L20.4240731,26.8647811 C20.461061,26.78263 20.4988604,26.7009231 20.5374612,26.6196707 L20.4834778,26.7349269 C20.5344734,26.6248636 20.5869326,26.515617 20.6408302,26.4072119 L20.5374612,26.6196707 C20.5871241,26.5151329 20.6381134,26.4113474 20.6904074,26.308336 L20.6408302,26.4072119 C20.681671,26.3250682 20.7233378,26.2434076 20.7658197,26.1622412 L20.7658807,26.1619302 C20.8435258,26.013775 20.923959,25.866962 21.0070529,25.7218685 C21.2050227,25.3759931 21.4182299,25.0398756 21.6456589,24.7144306 L21.5286537,24.8848257 C21.5876708,24.7975143 21.6476996,24.7109431 21.7087233,24.6251289 L21.6456589,24.7144306 C21.6993229,24.6376387 21.7537788,24.5614411 21.8090146,24.4858495 L21.7087233,24.6251289 C21.7826333,24.5211934 21.8580028,24.4183683 21.9348018,24.3166836 L21.8090146,24.4858495 C21.8722751,24.3992759 21.9365587,24.3134973 22.0018475,24.2285315 L22.0016895,24.2288802 C22.3179789,23.8171232 22.6576794,23.4247699 23.0189296,23.053491 L22.8296293,23.2521975 C22.9033796,23.1732135 22.9780829,23.095131 23.0537208,23.0179683 L23.0189296,23.053491 C23.083529,22.9870982 23.1488175,22.9213793 23.2147836,22.8563459 L23.0537208,23.0179683 C23.131055,22.9390752 23.2093662,22.8611436 23.2886348,22.7841931 L23.2147836,22.8563459 C23.2821211,22.7899605 23.3501645,22.7242893 23.4189017,22.6593447 L23.2886348,22.7841931 C23.3852399,22.6904132 23.4832671,22.5980904 23.582681,22.5072602 L23.4189017,22.6593447 C23.4912637,22.5909753 23.5643945,22.523411 23.6382797,22.4566663 L23.582681,22.5072602 C23.6715916,22.4260264 23.7616113,22.3459865 23.8527148,22.2671658 L23.8525967,22.2671923 C23.8915062,22.2336043 23.9304941,22.2002638 23.9696766,22.1671464 L24.00025,22.1417324 Z"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/colors</title><g id="illustration/colors" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><circle id="Oval" cx="23.763" cy="16.192" r="13.271" fill="#FC521F" opacity=".6"/><circle id="Oval-Copy" cx="15.468" cy="32.308" r="13.271" fill="#66BF3C" opacity=".6"/><path id="Combined-Shape" fill="#FF5F95" d="M15.4683651,19.0362231 C21.5434817,19.0362231 26.6652087,23.1181689 28.2404554,28.6889694 C26.8420385,29.1906678 25.3344184,29.4637769 23.7630101,29.4637769 C17.6878936,29.4637769 12.5661666,25.3818311 10.9909199,19.8110306 C12.3898993,19.3092302 13.8972501,19.0362231 15.4683651,19.0362231 Z"/><circle id="Oval-Copy-2" cx="32.532" cy="32.308" r="13.271" fill="#1EA7FD" opacity=".6"/><path id="Combined-Shape" fill="#87E6E5" d="M24.00025,22.1417324 C26.897967,24.5762286 28.7397972,28.2268506 28.7397972,32.3076552 C28.7397972,36.3884597 26.897967,40.0390817 24.00025,42.4735779 C21.1018087,40.038637 19.2602028,36.3882111 19.2602028,32.3076552 C19.2602028,28.2815316 21.0530043,24.6741393 23.8838362,22.2402492 Z"/><path id="Combined-Shape" fill="#FBD178" d="M32.5316349,19.0362231 C33.9415155,19.0362231 35.3000478,19.2560712 36.5748203,19.6633557 C35.0489179,25.3104816 29.8909911,29.4637769 23.7630101,29.4637769 C22.3527608,29.4637769 20.9938866,29.2438138 19.7188247,28.8363247 C21.2451195,23.1900077 26.403293,19.0362231 32.5316349,19.0362231 Z"/><path id="Combined-Shape" fill="#FFF" d="M24.00025,22.1417324 L24.0124326,22.1519799 C24.1747744,22.288701 24.3337918,22.4292434 24.4893463,22.5734686 L24.3896855,22.4820008 C24.4671836,22.552408 24.5438453,22.6237194 24.619654,22.6959185 L24.4893463,22.5734686 C24.5690639,22.6473803 24.6478719,22.7222591 24.7257519,22.7980864 L24.619654,22.6959185 C24.6907654,22.7636441 24.7611262,22.8321506 24.8307226,22.9014245 L24.7257519,22.7980864 C24.8120661,22.8821258 24.8972403,22.9673303 24.981249,23.0536745 L24.8307226,22.9014245 C24.9073006,22.9776475 24.9829531,23.0547994 25.0576619,23.132862 L25.057852,23.1330605 C25.3140855,23.4007967 25.559391,23.679459 25.7928375,23.9681079 L25.7230574,23.8825538 C25.7985998,23.9743942 25.8729325,24.0672672 25.9460311,24.1611484 L25.7928375,23.9681079 C25.8624256,24.0541514 25.93096,24.1410823 25.998421,24.228881 L25.9460311,24.1611484 C26.0074362,24.2400115 26.0679704,24.319586 26.1276194,24.3998576 L25.998421,24.228881 C26.0663495,24.317288 26.1331896,24.4065749 26.1989214,24.4967216 L26.1276194,24.3998576 C26.204848,24.5037867 26.2805926,24.6088841 26.3548219,24.7151187 L26.1989214,24.4967216 C26.2678555,24.59126 26.3355706,24.6867441 26.4020436,24.7831507 L26.3548219,24.7151187 C26.4130013,24.798383 26.4702498,24.8823459 26.5265523,24.9669921 L26.4020436,24.7831507 C26.4678788,24.8786322 26.5324956,24.9750187 26.5958716,25.0722875 L26.5959296,25.0723765 C26.736338,25.2878741 26.870709,25.5077955 26.9987399,25.7318073 L26.9410662,25.6319089 C26.9973106,25.7283602 27.0523736,25.8255849 27.1062352,25.9235633 L26.9987399,25.7318073 C27.0539848,25.8284676 27.1080492,25.9258895 27.1609136,26.0240532 L27.1606656,26.0235927 C27.2696676,26.2259984 27.3733426,26.4310837 27.4717677,26.6391379 L27.4715275,26.6386302 C27.5541941,26.8133735 27.6329386,26.9896914 27.7079006,27.1679911 C27.7630163,27.299081 27.8161443,27.431391 27.8671831,27.5647345 L27.804312,27.4036517 C27.8391482,27.4912057 27.8730792,27.5792182 27.9060936,27.6676774 L27.8671831,27.5647345 C27.906613,27.6677486 27.9447959,27.7713796 27.9817136,27.8756091 L27.9060936,27.6676774 C27.946474,27.7758735 27.9854831,27.884738 28.0230997,27.9942498 L27.9817136,27.8756091 C28.0144978,27.9681688 28.0462842,28.0612004 28.0770597,28.1546911 L28.0230997,27.9942498 C28.0618265,28.1069941 28.0990774,28.2204244 28.1348294,28.3345177 L28.0770597,28.1546911 C28.1112208,28.2584663 28.1441365,28.3628071 28.175789,28.4676958 L28.1756797,28.4673338 L28.2408136,28.6893554 C28.2284694,28.6937793 28.2161167,28.6981854 28.2037557,28.7025737 L28.2404554,28.6889694 C27.9517707,28.7925384 27.6584322,28.8863659 27.3608394,28.97006 L27.3609965,28.9702524 C27.0695498,29.0519815 26.7741843,29.1241944 26.4751174,29.1863314 L26.5385665,29.1730829 C26.3901218,29.2046704 26.2407589,29.2337757 26.0905233,29.2603535 L26.4751174,29.1863314 C26.3367402,29.215082 26.1975707,29.2416755 26.0576458,29.2660754 L26.0905233,29.2603535 C25.9366833,29.2875689 25.7819282,29.312134 25.6263069,29.334 L26.0576458,29.2660754 C25.9017815,29.2932549 25.7449801,29.3177127 25.5872928,29.3393985 L25.6263069,29.334 C25.493366,29.3526793 25.3597929,29.3693888 25.2256182,29.3840982 L25.5872928,29.3393985 C25.4326976,29.360659 25.277251,29.3792552 25.1210012,29.3951396 L25.2256182,29.3840982 C25.0570566,29.4025774 24.8875455,29.4178998 24.7171453,29.4300052 L25.1210012,29.3951396 C24.9661341,29.4108835 24.810478,29.4239634 24.6540799,29.4343333 L24.7171453,29.4300052 C24.5612618,29.4410793 24.4046342,29.4494611 24.2473088,29.4551045 L24.6540799,29.4343333 C24.5098436,29.4438967 24.3649762,29.4511552 24.2195147,29.4560724 L24.2473088,29.4551045 C24.0865878,29.4608697 23.9251385,29.4637769 23.7630101,29.4637769 L23.3130142,29.4562912 C23.2993121,29.4558347 23.2856153,29.4553574 23.2719237,29.4548593 C22.9596275,29.4434959 22.6502324,29.4213577 22.3439491,29.3888006 L22.3886972,29.3934808 C22.2468147,29.3788837 22.105595,29.3620515 21.9650736,29.3430199 L22.3439491,29.3888006 C22.1914515,29.3725905 22.0397254,29.3537976 21.8888152,29.3324664 L21.9650736,29.3430199 C21.8025527,29.3210088 21.6409661,29.2960557 21.4803691,29.2682161 L21.8888152,29.3324664 C21.7352182,29.3107553 21.5824665,29.2864149 21.4306071,29.2594919 L21.4803691,29.2682161 C21.3506285,29.2457255 21.2215338,29.221351 21.0931142,29.1951218 L21.4306071,29.2594919 C21.2772401,29.2323016 21.1247833,29.2024774 20.973285,29.1700676 L21.0931142,29.1951218 C20.9267071,29.1611338 20.7614335,29.1240315 20.5973571,29.0838786 L20.973285,29.1700676 C20.825476,29.138447 20.6785795,29.1043653 20.5326403,29.0678674 L20.5973571,29.0838786 C20.4596684,29.0501832 20.3228227,29.0143396 20.1868576,28.9763851 L20.5326403,29.0678674 C20.3930822,29.0329653 20.2543997,28.9958536 20.1166319,28.9565718 L20.1169729,28.956669 L19.7188247,28.8363247 L19.7188247,28.8363247 L19.7880988,28.5894836 C19.8166627,28.4914193 19.8463277,28.3938241 19.8770797,28.2967124 L19.8480041,28.389868 C19.888904,28.2573207 19.931824,28.1256601 19.9767281,27.9949221 L19.8770797,28.2967124 C19.9117081,28.1873592 19.9477148,28.0786191 19.9850793,27.9705124 L19.9853117,27.9700125 C20.1152243,27.5939638 20.2618428,27.2250995 20.4240731,26.8647811 L20.345088,27.0439391 C20.3899401,26.9402428 20.4360767,26.8372321 20.4834778,26.7349269 L20.4240731,26.8647811 C20.461061,26.78263 20.4988604,26.7009231 20.5374612,26.6196707 L20.4834778,26.7349269 C20.5344734,26.6248636 20.5869326,26.515617 20.6408302,26.4072119 L20.5374612,26.6196707 C20.5871241,26.5151329 20.6381134,26.4113474 20.6904074,26.308336 L20.6408302,26.4072119 C20.681671,26.3250682 20.7233378,26.2434076 20.7658197,26.1622412 L20.7658807,26.1619302 C20.8435258,26.013775 20.923959,25.866962 21.0070529,25.7218685 C21.2050227,25.3759931 21.4182299,25.0398756 21.6456589,24.7144306 L21.5286537,24.8848257 C21.5876708,24.7975143 21.6476996,24.7109431 21.7087233,24.6251289 L21.6456589,24.7144306 C21.6993229,24.6376387 21.7537788,24.5614411 21.8090146,24.4858495 L21.7087233,24.6251289 C21.7826333,24.5211934 21.8580028,24.4183683 21.9348018,24.3166836 L21.8090146,24.4858495 C21.8722751,24.3992759 21.9365587,24.3134973 22.0018475,24.2285315 L22.0016895,24.2288802 C22.3179789,23.8171232 22.6576794,23.4247699 23.0189296,23.053491 L22.8296293,23.2521975 C22.9033796,23.1732135 22.9780829,23.095131 23.0537208,23.0179683 L23.0189296,23.053491 C23.083529,22.9870982 23.1488175,22.9213793 23.2147836,22.8563459 L23.0537208,23.0179683 C23.131055,22.9390752 23.2093662,22.8611436 23.2886348,22.7841931 L23.2147836,22.8563459 C23.2821211,22.7899605 23.3501645,22.7242893 23.4189017,22.6593447 L23.2886348,22.7841931 C23.3852399,22.6904132 23.4832671,22.5980904 23.582681,22.5072602 L23.4189017,22.6593447 C23.4912637,22.5909753 23.5643945,22.523411 23.6382797,22.4566663 L23.582681,22.5072602 C23.6715916,22.4260264 23.7616113,22.3459865 23.8527148,22.2671658 L23.8525967,22.2671923 C23.8915062,22.2336043 23.9304941,22.2002638 23.9696766,22.1671464 L24.00025,22.1417324 Z"/></g></svg>
diff --git a/ui/packages/components/src/stories/assets/comments.svg b/ui/packages/components/src/stories/assets/comments.svg
index 6493a139f..be4f20a00 100644
--- a/ui/packages/components/src/stories/assets/comments.svg
+++ b/ui/packages/components/src/stories/assets/comments.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/comments</title><g id="illustration/comments" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Path" fill="#96D07C" d="M2.52730803,17.9196415 C2.44329744,17.9745167 2.36370847,18.000488 2.29303375,18.000488 C2.1197031,18.000488 2,17.8443588 2,17.5752855 L2,4 C2,1.790861 3.790861,3.23296945e-13 6,3.23296945e-13 L33.9995117,3.23296945e-13 C36.2086507,3.23296945e-13 37.9995117,1.790861 37.9995117,4 L37.9995117,9.999512 C37.9995117,12.208651 36.2086507,13.999512 33.9995117,13.999512 L8,13.999512 C7.83499225,13.999512 7.6723181,13.9895206 7.51254954,13.9701099 L2.52730803,17.9196415 Z"/><path id="Path" fill="#73E1E0" d="M7.51066,44.9703679 L2.52730803,47.9186655 C2.44329744,47.9735407 2.36370847,47.999512 2.29303375,47.999512 C2.1197031,47.999512 2,47.8433828 2,47.5743095 L2,35 C2,32.790861 3.790861,31 6,31 L26,31 C28.209139,31 30,32.790861 30,35 L30,41 C30,43.209139 28.209139,45 26,45 L8,45 C7.8343417,45 7.67103544,44.9899297 7.51066,44.9703679 Z"/><path id="Path" fill="#FFD476" d="M46,19.5 L46,33.0747975 C46,33.3438708 45.8802969,33.5 45.7069663,33.5 C45.6362915,33.5 45.5567026,33.4740287 45.472692,33.4191535 L40.4887103,29.4704446 C40.3285371,29.489956 40.1654415,29.5 40,29.5 L18,29.5 C15.790861,29.5 14,27.709139 14,25.5 L14,19.5 C14,17.290861 15.790861,15.5 18,15.5 L42,15.5 C44.209139,15.5 46,17.290861 46,19.5 Z"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/comments</title><g id="illustration/comments" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Path" fill="#96D07C" d="M2.52730803,17.9196415 C2.44329744,17.9745167 2.36370847,18.000488 2.29303375,18.000488 C2.1197031,18.000488 2,17.8443588 2,17.5752855 L2,4 C2,1.790861 3.790861,3.23296945e-13 6,3.23296945e-13 L33.9995117,3.23296945e-13 C36.2086507,3.23296945e-13 37.9995117,1.790861 37.9995117,4 L37.9995117,9.999512 C37.9995117,12.208651 36.2086507,13.999512 33.9995117,13.999512 L8,13.999512 C7.83499225,13.999512 7.6723181,13.9895206 7.51254954,13.9701099 L2.52730803,17.9196415 Z"/><path id="Path" fill="#73E1E0" d="M7.51066,44.9703679 L2.52730803,47.9186655 C2.44329744,47.9735407 2.36370847,47.999512 2.29303375,47.999512 C2.1197031,47.999512 2,47.8433828 2,47.5743095 L2,35 C2,32.790861 3.790861,31 6,31 L26,31 C28.209139,31 30,32.790861 30,35 L30,41 C30,43.209139 28.209139,45 26,45 L8,45 C7.8343417,45 7.67103544,44.9899297 7.51066,44.9703679 Z"/><path id="Path" fill="#FFD476" d="M46,19.5 L46,33.0747975 C46,33.3438708 45.8802969,33.5 45.7069663,33.5 C45.6362915,33.5 45.5567026,33.4740287 45.472692,33.4191535 L40.4887103,29.4704446 C40.3285371,29.489956 40.1654415,29.5 40,29.5 L18,29.5 C15.790861,29.5 14,27.709139 14,25.5 L14,19.5 C14,17.290861 15.790861,15.5 18,15.5 L42,15.5 C44.209139,15.5 46,17.290861 46,19.5 Z"/></g></svg>
diff --git a/ui/packages/components/src/stories/assets/direction.svg b/ui/packages/components/src/stories/assets/direction.svg
index 65676ac27..933ab2443 100644
--- a/ui/packages/components/src/stories/assets/direction.svg
+++ b/ui/packages/components/src/stories/assets/direction.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/direction</title><g id="illustration/direction" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#FFD476" d="M23.4917015,33.6030641 L2.93840258,31.4321033 C2.38917316,31.3740904 1.99096346,30.8818233 2.04897631,30.3325939 C2.0747515,30.0885705 2.18934861,29.8625419 2.37095722,29.6975265 L34.2609105,0.721285325 C34.6696614,0.349881049 35.3021022,0.38015648 35.6735064,0.788907393 C35.9232621,1.06377731 36.0001133,1.45442096 35.8730901,1.80341447 L24.5364357,32.9506164 C24.3793473,33.3822133 23.9484565,33.6513092 23.4917015,33.6030641 L23.4917015,33.6030641 Z"/><path id="Combined-Shape-Copy" fill="#FFC445" d="M24.3163597,33.2881029 C24.0306575,33.0138462 23.9337246,32.5968232 24.069176,32.2246735 L35.091923,1.9399251 C35.2266075,1.56988243 35.5659249,1.31333613 35.9586669,1.28460955 C36.5094802,1.24432106 36.9886628,1.65818318 37.0289513,2.20899647 L40.2437557,46.1609256 C40.2644355,46.4436546 40.1641446,46.7218752 39.9678293,46.9263833 C39.5853672,47.3248067 38.9523344,47.3377458 38.5539111,46.9552837 L24.3163597,33.2881029 L24.3163597,33.2881029 Z"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/direction</title><g id="illustration/direction" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#FFD476" d="M23.4917015,33.6030641 L2.93840258,31.4321033 C2.38917316,31.3740904 1.99096346,30.8818233 2.04897631,30.3325939 C2.0747515,30.0885705 2.18934861,29.8625419 2.37095722,29.6975265 L34.2609105,0.721285325 C34.6696614,0.349881049 35.3021022,0.38015648 35.6735064,0.788907393 C35.9232621,1.06377731 36.0001133,1.45442096 35.8730901,1.80341447 L24.5364357,32.9506164 C24.3793473,33.3822133 23.9484565,33.6513092 23.4917015,33.6030641 L23.4917015,33.6030641 Z"/><path id="Combined-Shape-Copy" fill="#FFC445" d="M24.3163597,33.2881029 C24.0306575,33.0138462 23.9337246,32.5968232 24.069176,32.2246735 L35.091923,1.9399251 C35.2266075,1.56988243 35.5659249,1.31333613 35.9586669,1.28460955 C36.5094802,1.24432106 36.9886628,1.65818318 37.0289513,2.20899647 L40.2437557,46.1609256 C40.2644355,46.4436546 40.1641446,46.7218752 39.9678293,46.9263833 C39.5853672,47.3248067 38.9523344,47.3377458 38.5539111,46.9552837 L24.3163597,33.2881029 L24.3163597,33.2881029 Z"/></g></svg>
diff --git a/ui/packages/components/src/stories/assets/flow.svg b/ui/packages/components/src/stories/assets/flow.svg
index 8ac27db40..5467a7012 100644
--- a/ui/packages/components/src/stories/assets/flow.svg
+++ b/ui/packages/components/src/stories/assets/flow.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/flow</title><g id="illustration/flow" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#79C9FC" fill-rule="nonzero" d="M30,29 C32.7614237,29 35,26.7614237 35,24 C35,14.6111593 27.3888407,7 18,7 C8.61115925,7 1,14.6111593 1,24 C1,33.3888407 8.61115925,41 18,41 C19.3333404,41 20.6447683,40.8466238 21.9154603,40.5471706 C19.5096374,39.3319645 17.5510566,37.8612875 16.0456579,36.1314815 C14.1063138,33.9030427 12.769443,31.0725999 12.0293806,27.6556449 C11.360469,26.565281 11,25.3082308 11,24 C11,20.1340068 14.1340068,17 18,17 C21.8659932,17 25,20.1340068 25,24 C25,26.125 27.7040312,29 30,29 Z"/><path id="Combined-Shape-Copy" fill="#FFC445" fill-rule="nonzero" d="M42,29 C44.7614237,29 47,26.7614237 47,24 C47,14.6111593 39.3888407,7 30,7 C20.6111593,7 13,14.6111593 13,24 C13,33.3888407 20.6111593,41 30,41 C31.3333404,41 32.6447683,40.8466238 33.9154603,40.5471706 C31.5096374,39.3319645 29.4051056,37.9781963 28.0456579,36.1314815 C26.0625,33.4375 23,27.1875 23,24 C23,20.1340068 26.1340068,17 30,17 C33.8659932,17 37,20.1340068 37,24 C37.02301,26.3435241 39.7040312,29 42,29 Z" transform="translate(30.000000, 24.000000) scale(-1, -1) translate(-30.000000, -24.000000)"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/flow</title><g id="illustration/flow" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#79C9FC" fill-rule="nonzero" d="M30,29 C32.7614237,29 35,26.7614237 35,24 C35,14.6111593 27.3888407,7 18,7 C8.61115925,7 1,14.6111593 1,24 C1,33.3888407 8.61115925,41 18,41 C19.3333404,41 20.6447683,40.8466238 21.9154603,40.5471706 C19.5096374,39.3319645 17.5510566,37.8612875 16.0456579,36.1314815 C14.1063138,33.9030427 12.769443,31.0725999 12.0293806,27.6556449 C11.360469,26.565281 11,25.3082308 11,24 C11,20.1340068 14.1340068,17 18,17 C21.8659932,17 25,20.1340068 25,24 C25,26.125 27.7040312,29 30,29 Z"/><path id="Combined-Shape-Copy" fill="#FFC445" fill-rule="nonzero" d="M42,29 C44.7614237,29 47,26.7614237 47,24 C47,14.6111593 39.3888407,7 30,7 C20.6111593,7 13,14.6111593 13,24 C13,33.3888407 20.6111593,41 30,41 C31.3333404,41 32.6447683,40.8466238 33.9154603,40.5471706 C31.5096374,39.3319645 29.4051056,37.9781963 28.0456579,36.1314815 C26.0625,33.4375 23,27.1875 23,24 C23,20.1340068 26.1340068,17 30,17 C33.8659932,17 37,20.1340068 37,24 C37.02301,26.3435241 39.7040312,29 42,29 Z" transform="translate(30.000000, 24.000000) scale(-1, -1) translate(-30.000000, -24.000000)"/></g></svg>
diff --git a/ui/packages/components/src/stories/assets/plugin.svg b/ui/packages/components/src/stories/assets/plugin.svg
index 29e5c690c..8bc9ca193 100644
--- a/ui/packages/components/src/stories/assets/plugin.svg
+++ b/ui/packages/components/src/stories/assets/plugin.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/plugin</title><g id="illustration/plugin" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#79C9FC" d="M26,15.3994248 C26,15.4091303 26,15.4188459 26,15.4285714 L26,21.4694881 C25.8463595,21.4969567 25.6941676,21.51275 25.5873784,21.51275 C25.4974117,21.51275 25.4230979,21.4768034 25.377756,21.4206259 L25.2660784,21.2822603 L25.1317423,21.1657666 C24.2436317,20.3956144 23.100098,19.9633214 21.895551,19.9633214 C19.2039137,19.9633214 17,22.1075558 17,24.7804643 C17,27.4533728 19.2039137,29.5976071 21.895551,29.5976071 C23.1972122,29.5976071 24.3149423,29.2878193 25.1231445,28.3613697 C25.4542273,27.9818463 25.568273,27.9073214 25.5873784,27.9073214 C25.681532,27.9073214 25.8352452,27.9239643 26,27.9524591 L26,32.5714286 C26,32.5811541 26,32.5908697 26,32.6005752 L26,33 C26,35.209139 24.209139,37 22,37 L4,37 C1.790861,37 0,35.209139 0,33 L0,15 C0,12.790861 1.790861,11 4,11 L22,11 C24.209139,11 26,12.790861 26,15 L26,15.3994248 Z"/><path id="Path" fill="#87E6E5" d="M27.9998779,32.5714286 C27.9998779,33.3604068 28.6572726,34 29.4682101,34 L46.5315458,34 C47.3424832,34 47.9998779,33.3604068 47.9998779,32.5714286 L47.9998779,15.4285714 C47.9998779,14.6395932 47.3424832,14 46.5315458,14 L29.4682101,14 C28.6572726,14 27.9998779,14.6395932 27.9998779,15.4285714 L27.9998779,21.8355216 C27.9334367,22.2650514 27.8567585,22.6454496 27.746391,22.8084643 C27.4245309,23.2838571 26.2402709,23.51275 25.5873784,23.51275 C24.8705773,23.51275 24.2322714,23.1857725 23.8214379,22.6767605 C23.3096996,22.2329909 22.6349941,21.9633214 21.895551,21.9633214 C20.2963823,21.9633214 19,23.2245992 19,24.7804643 C19,26.3363293 20.2963823,27.5976071 21.895551,27.5976071 C22.5398535,27.5976071 23.2399343,27.477727 23.6160247,27.0466112 C24.1396029,26.4464286 24.7367044,25.9073214 25.5873784,25.9073214 C26.2402709,25.9073214 27.5912951,26.1766031 27.8226692,26.6116071 C27.8819199,26.7230038 27.9403239,26.921677 27.9998779,27.1556219 L27.9998779,32.5714286 Z"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/plugin</title><g id="illustration/plugin" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#79C9FC" d="M26,15.3994248 C26,15.4091303 26,15.4188459 26,15.4285714 L26,21.4694881 C25.8463595,21.4969567 25.6941676,21.51275 25.5873784,21.51275 C25.4974117,21.51275 25.4230979,21.4768034 25.377756,21.4206259 L25.2660784,21.2822603 L25.1317423,21.1657666 C24.2436317,20.3956144 23.100098,19.9633214 21.895551,19.9633214 C19.2039137,19.9633214 17,22.1075558 17,24.7804643 C17,27.4533728 19.2039137,29.5976071 21.895551,29.5976071 C23.1972122,29.5976071 24.3149423,29.2878193 25.1231445,28.3613697 C25.4542273,27.9818463 25.568273,27.9073214 25.5873784,27.9073214 C25.681532,27.9073214 25.8352452,27.9239643 26,27.9524591 L26,32.5714286 C26,32.5811541 26,32.5908697 26,32.6005752 L26,33 C26,35.209139 24.209139,37 22,37 L4,37 C1.790861,37 0,35.209139 0,33 L0,15 C0,12.790861 1.790861,11 4,11 L22,11 C24.209139,11 26,12.790861 26,15 L26,15.3994248 Z"/><path id="Path" fill="#87E6E5" d="M27.9998779,32.5714286 C27.9998779,33.3604068 28.6572726,34 29.4682101,34 L46.5315458,34 C47.3424832,34 47.9998779,33.3604068 47.9998779,32.5714286 L47.9998779,15.4285714 C47.9998779,14.6395932 47.3424832,14 46.5315458,14 L29.4682101,14 C28.6572726,14 27.9998779,14.6395932 27.9998779,15.4285714 L27.9998779,21.8355216 C27.9334367,22.2650514 27.8567585,22.6454496 27.746391,22.8084643 C27.4245309,23.2838571 26.2402709,23.51275 25.5873784,23.51275 C24.8705773,23.51275 24.2322714,23.1857725 23.8214379,22.6767605 C23.3096996,22.2329909 22.6349941,21.9633214 21.895551,21.9633214 C20.2963823,21.9633214 19,23.2245992 19,24.7804643 C19,26.3363293 20.2963823,27.5976071 21.895551,27.5976071 C22.5398535,27.5976071 23.2399343,27.477727 23.6160247,27.0466112 C24.1396029,26.4464286 24.7367044,25.9073214 25.5873784,25.9073214 C26.2402709,25.9073214 27.5912951,26.1766031 27.8226692,26.6116071 C27.8819199,26.7230038 27.9403239,26.921677 27.9998779,27.1556219 L27.9998779,32.5714286 Z"/></g></svg>
diff --git a/ui/packages/components/src/stories/assets/repo.svg b/ui/packages/components/src/stories/assets/repo.svg
index f386ee902..a906e675b 100644
--- a/ui/packages/components/src/stories/assets/repo.svg
+++ b/ui/packages/components/src/stories/assets/repo.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/repo</title><g id="illustration/repo" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Rectangle-62-Copy" fill="#B7F0EF" d="M27.2217723,9.04506931 L41.2217723,6.2682098 C43.3886973,5.83840648 45.4937616,7.2466219 45.9235649,9.41354696 C45.9743993,9.66983721 46,9.93049166 46,10.1917747 L46,32.581381 C46,34.4904961 44.650862,36.1335143 42.7782277,36.5049459 L28.7782277,39.2818054 C26.6113027,39.7116087 24.5062384,38.3033933 24.0764351,36.1364682 C24.0256007,35.880178 24,35.6195235 24,35.3582405 L24,12.9686342 C24,11.0595191 25.349138,9.4165009 27.2217723,9.04506931 Z" opacity=".7"/><path id="Combined-Shape" fill="#87E6E5" d="M6.77822775,6.2682098 L20.7782277,9.04506931 C22.650862,9.4165009 24,11.0595191 24,12.9686342 L24,35.3582405 C24,37.5673795 22.209139,39.3582405 20,39.3582405 C19.738717,39.3582405 19.4780625,39.3326398 19.2217723,39.2818054 L5.22177225,36.5049459 C3.34913798,36.1335143 2,34.4904961 2,32.581381 L2,10.1917747 C2,7.98263571 3.790861,6.19177471 6,6.19177471 C6.26128305,6.19177471 6.5219375,6.21737537 6.77822775,6.2682098 Z"/><path id="Rectangle-63-Copy-2" fill="#61C1FD" d="M22,10 C23.1666667,10.2291667 24.0179036,10.625 24.5537109,11.1875 C25.0895182,11.75 25.5716146,12.875 26,14.5625 C26,29.3020833 26,37.5208333 26,39.21875 C26,40.9166667 26.4241536,42.9583333 27.2724609,45.34375 L24.5537109,41.875 L22.9824219,45.34375 C22.327474,43.1979167 22,41.2291667 22,39.4375 C22,37.6458333 22,27.8333333 22,10 Z"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/repo</title><g id="illustration/repo" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Rectangle-62-Copy" fill="#B7F0EF" d="M27.2217723,9.04506931 L41.2217723,6.2682098 C43.3886973,5.83840648 45.4937616,7.2466219 45.9235649,9.41354696 C45.9743993,9.66983721 46,9.93049166 46,10.1917747 L46,32.581381 C46,34.4904961 44.650862,36.1335143 42.7782277,36.5049459 L28.7782277,39.2818054 C26.6113027,39.7116087 24.5062384,38.3033933 24.0764351,36.1364682 C24.0256007,35.880178 24,35.6195235 24,35.3582405 L24,12.9686342 C24,11.0595191 25.349138,9.4165009 27.2217723,9.04506931 Z" opacity=".7"/><path id="Combined-Shape" fill="#87E6E5" d="M6.77822775,6.2682098 L20.7782277,9.04506931 C22.650862,9.4165009 24,11.0595191 24,12.9686342 L24,35.3582405 C24,37.5673795 22.209139,39.3582405 20,39.3582405 C19.738717,39.3582405 19.4780625,39.3326398 19.2217723,39.2818054 L5.22177225,36.5049459 C3.34913798,36.1335143 2,34.4904961 2,32.581381 L2,10.1917747 C2,7.98263571 3.790861,6.19177471 6,6.19177471 C6.26128305,6.19177471 6.5219375,6.21737537 6.77822775,6.2682098 Z"/><path id="Rectangle-63-Copy-2" fill="#61C1FD" d="M22,10 C23.1666667,10.2291667 24.0179036,10.625 24.5537109,11.1875 C25.0895182,11.75 25.5716146,12.875 26,14.5625 C26,29.3020833 26,37.5208333 26,39.21875 C26,40.9166667 26.4241536,42.9583333 27.2724609,45.34375 L24.5537109,41.875 L22.9824219,45.34375 C22.327474,43.1979167 22,41.2291667 22,39.4375 C22,37.6458333 22,27.8333333 22,10 Z"/></g></svg>
diff --git a/ui/packages/components/src/stories/assets/stackalt.svg b/ui/packages/components/src/stories/assets/stackalt.svg
index 9b7ad2743..7746eb31a 100644
--- a/ui/packages/components/src/stories/assets/stackalt.svg
+++ b/ui/packages/components/src/stories/assets/stackalt.svg
@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/stackalt</title><g id="illustration/stackalt" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#FFAE00" d="M23.8628277,0 L23.8628277,48 L3.32291648,36.2491883 L3.32155653,11.9499781 L23.8628277,0 Z M23.8670509,0 L44.408322,11.9499781 L44.4069621,36.2491883 L23.8670509,48 L23.8670509,0 Z" opacity=".196"/><path id="Rectangle-46-Copy-3" fill="#66BF3C" d="M15.8232279,19.1155258 L24.7368455,21.4714881 C29.6053842,22.7582937 33.4077423,26.5606518 34.694548,31.4291905 L37.0505103,40.3428082 C37.6150232,42.4786032 36.3412474,44.6676353 34.2054524,45.2321482 C33.5569474,45.4035549 32.87575,45.4091235 32.2245294,45.2483418 L23.3459013,43.0562718 C18.2976962,41.809906 14.3561301,37.8683399 13.1097642,32.8201348 L10.9176943,23.9415066 C10.3881737,21.7967682 11.6975664,19.6288529 13.8423049,19.0993322 C14.4935255,18.9385505 15.1747229,18.9441191 15.8232279,19.1155258 Z" opacity=".5" transform="translate(23.999997, 32.166058) rotate(-45.000000) translate(-23.999997, -32.166058)"/><path id="Rectangle-46-Copy-2" fill="#FFAE00" d="M15.8232279,11.2216893 L24.7368455,13.5776516 C29.6053842,14.8644572 33.4077423,18.6668153 34.694548,23.5353541 L37.0505103,32.4489717 C37.6150232,34.5847667 36.3412474,36.7737988 34.2054524,37.3383117 C33.5569474,37.5097184 32.87575,37.515287 32.2245294,37.3545053 L23.3459013,35.1624353 C18.2976962,33.9160695 14.3561301,29.9745034 13.1097642,24.9262983 L10.9176943,16.0476701 C10.3881737,13.9029317 11.6975664,11.7350164 13.8423049,11.2054957 C14.4935255,11.044714 15.1747229,11.0502826 15.8232279,11.2216893 Z" opacity=".5" transform="translate(23.999997, 24.272222) rotate(-45.000000) translate(-23.999997, -24.272222)"/><path id="Rectangle-46-Copy" fill="#FC521F" d="M15.8232279,3.32785281 L24.7368455,5.68381509 C29.6053842,6.97062075 33.4077423,10.7729788 34.694548,15.6415176 L37.0505103,24.5551352 C37.6150232,26.6909302 36.3412474,28.8799623 34.2054524,29.4444752 C33.5569474,29.6158819 32.87575,29.6214505 32.2245294,29.4606688 L23.3459013,27.2685988 C18.2976962,26.022233 14.3561301,22.0806669 13.1097642,17.0324618 L10.9176943,8.15383364 C10.3881737,6.00909519 11.6975664,3.84117987 13.8423049,3.31165925 C14.4935255,3.15087753 15.1747229,3.15644615 15.8232279,3.32785281 Z" opacity=".5" transform="translate(23.999997, 16.378385) rotate(-45.000000) translate(-23.999997, -16.378385)"/></g></svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48" version="1.1" viewBox="0 0 48 48"><title>illustration/stackalt</title><g id="illustration/stackalt" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><path id="Combined-Shape" fill="#FFAE00" d="M23.8628277,0 L23.8628277,48 L3.32291648,36.2491883 L3.32155653,11.9499781 L23.8628277,0 Z M23.8670509,0 L44.408322,11.9499781 L44.4069621,36.2491883 L23.8670509,48 L23.8670509,0 Z" opacity=".196"/><path id="Rectangle-46-Copy-3" fill="#66BF3C" d="M15.8232279,19.1155258 L24.7368455,21.4714881 C29.6053842,22.7582937 33.4077423,26.5606518 34.694548,31.4291905 L37.0505103,40.3428082 C37.6150232,42.4786032 36.3412474,44.6676353 34.2054524,45.2321482 C33.5569474,45.4035549 32.87575,45.4091235 32.2245294,45.2483418 L23.3459013,43.0562718 C18.2976962,41.809906 14.3561301,37.8683399 13.1097642,32.8201348 L10.9176943,23.9415066 C10.3881737,21.7967682 11.6975664,19.6288529 13.8423049,19.0993322 C14.4935255,18.9385505 15.1747229,18.9441191 15.8232279,19.1155258 Z" opacity=".5" transform="translate(23.999997, 32.166058) rotate(-45.000000) translate(-23.999997, -32.166058)"/><path id="Rectangle-46-Copy-2" fill="#FFAE00" d="M15.8232279,11.2216893 L24.7368455,13.5776516 C29.6053842,14.8644572 33.4077423,18.6668153 34.694548,23.5353541 L37.0505103,32.4489717 C37.6150232,34.5847667 36.3412474,36.7737988 34.2054524,37.3383117 C33.5569474,37.5097184 32.87575,37.515287 32.2245294,37.3545053 L23.3459013,35.1624353 C18.2976962,33.9160695 14.3561301,29.9745034 13.1097642,24.9262983 L10.9176943,16.0476701 C10.3881737,13.9029317 11.6975664,11.7350164 13.8423049,11.2054957 C14.4935255,11.044714 15.1747229,11.0502826 15.8232279,11.2216893 Z" opacity=".5" transform="translate(23.999997, 24.272222) rotate(-45.000000) translate(-23.999997, -24.272222)"/><path id="Rectangle-46-Copy" fill="#FC521F" d="M15.8232279,3.32785281 L24.7368455,5.68381509 C29.6053842,6.97062075 33.4077423,10.7729788 34.694548,15.6415176 L37.0505103,24.5551352 C37.6150232,26.6909302 36.3412474,28.8799623 34.2054524,29.4444752 C33.5569474,29.6158819 32.87575,29.6214505 32.2245294,29.4606688 L23.3459013,27.2685988 C18.2976962,26.022233 14.3561301,22.0806669 13.1097642,17.0324618 L10.9176943,8.15383364 C10.3881737,6.00909519 11.6975664,3.84117987 13.8423049,3.31165925 C14.4935255,3.15087753 15.1747229,3.15644615 15.8232279,3.32785281 Z" opacity=".5" transform="translate(23.999997, 16.378385) rotate(-45.000000) translate(-23.999997, -16.378385)"/></g></svg>
diff --git a/ui/packages/editor/src/components/Editor.vue b/ui/packages/editor/src/components/Editor.vue
index fced2ed45..ab11dbc01 100644
--- a/ui/packages/editor/src/components/Editor.vue
+++ b/ui/packages/editor/src/components/Editor.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import { Editor, EditorContent } from "@/tiptap/vue-3";
-import EditorHeader from "./EditorHeader.vue";
-import EditorBubbleMenu from "./EditorBubbleMenu.vue";
-import { watch, type CSSProperties, type PropType } from "vue";
 import { i18n } from "@/locales";
+import { Editor, EditorContent } from "@/tiptap/vue-3";
+import { watch, type CSSProperties, type PropType } from "vue";
+import EditorBubbleMenu from "./EditorBubbleMenu.vue";
+import EditorHeader from "./EditorHeader.vue";
 
 const props = defineProps({
   editor: {
diff --git a/ui/packages/editor/src/components/EditorBubbleMenu.vue b/ui/packages/editor/src/components/EditorBubbleMenu.vue
index 83a8d736d..0be44f3ef 100644
--- a/ui/packages/editor/src/components/EditorBubbleMenu.vue
+++ b/ui/packages/editor/src/components/EditorBubbleMenu.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
-import type { PropType } from "vue";
-import type { AnyExtension, Editor } from "@/tiptap/vue-3";
-import BubbleMenu from "@/components/bubble/BubbleMenu.vue";
-import type { NodeBubbleMenu } from "@/types";
 import BubbleItem from "@/components/bubble/BubbleItem.vue";
+import BubbleMenu from "@/components/bubble/BubbleMenu.vue";
 import type { EditorState, EditorView } from "@/tiptap/pm";
+import type { AnyExtension, Editor } from "@/tiptap/vue-3";
+import type { NodeBubbleMenu } from "@/types";
+import type { PropType } from "vue";
 
 const props = defineProps({
   editor: {
diff --git a/ui/packages/editor/src/components/EditorHeader.vue b/ui/packages/editor/src/components/EditorHeader.vue
index 73ff34468..ed85f0a14 100644
--- a/ui/packages/editor/src/components/EditorHeader.vue
+++ b/ui/packages/editor/src/components/EditorHeader.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { Dropdown as VDropdown, Menu as VMenu } from "floating-vue";
-import { type AnyExtension, Editor } from "@/tiptap/vue-3";
-import MdiPlusCircle from "~icons/mdi/plus-circle";
+import { Editor, type AnyExtension } from "@/tiptap/vue-3";
 import type { ToolbarItem, ToolboxItem } from "@/types";
+import { Dropdown as VDropdown, Menu as VMenu } from "floating-vue";
+import MdiPlusCircle from "~icons/mdi/plus-circle";
 
 const props = defineProps({
   editor: {
diff --git a/ui/packages/editor/src/components/block/BlockActionInput.vue b/ui/packages/editor/src/components/block/BlockActionInput.vue
index 1236d9755..e8d9d774f 100644
--- a/ui/packages/editor/src/components/block/BlockActionInput.vue
+++ b/ui/packages/editor/src/components/block/BlockActionInput.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { computed } from "vue";
 import { vTooltip } from "floating-vue";
+import { computed } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/editor/src/components/block/BlockCard.vue b/ui/packages/editor/src/components/block/BlockCard.vue
index 1558e17c9..8d16184c5 100644
--- a/ui/packages/editor/src/components/block/BlockCard.vue
+++ b/ui/packages/editor/src/components/block/BlockCard.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
-import type { Editor } from "@/tiptap/vue-3";
 import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
-import MdiArrowULeftBottom from "~icons/mdi/arrow-u-left-bottom";
-import BlockActionSeparator from "./BlockActionSeparator.vue";
-import BlockActionButton from "./BlockActionButton.vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
+import MdiArrowULeftBottom from "~icons/mdi/arrow-u-left-bottom";
+import BlockActionButton from "./BlockActionButton.vue";
+import BlockActionSeparator from "./BlockActionSeparator.vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/editor/src/components/bubble/BubbleItem.vue b/ui/packages/editor/src/components/bubble/BubbleItem.vue
index 4e0694a16..787d31bb5 100644
--- a/ui/packages/editor/src/components/bubble/BubbleItem.vue
+++ b/ui/packages/editor/src/components/bubble/BubbleItem.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { vTooltip, Dropdown as VDropdown } from "floating-vue";
 import type { Editor } from "@/tiptap/vue-3";
+import { Dropdown as VDropdown, vTooltip } from "floating-vue";
 import { ref, type Component } from "vue";
 
 const props = withDefaults(
diff --git a/ui/packages/editor/src/components/bubble/BubbleMenu.vue b/ui/packages/editor/src/components/bubble/BubbleMenu.vue
index dd5e3b69e..6709f707b 100644
--- a/ui/packages/editor/src/components/bubble/BubbleMenu.vue
+++ b/ui/packages/editor/src/components/bubble/BubbleMenu.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts" name="BubbleMenu">
-import { ref, type PropType, onMounted, onBeforeUnmount } from "vue";
+import { onBeforeUnmount, onMounted, ref, type PropType } from "vue";
 import {
   BubbleMenuPlugin,
   type BubbleMenuPluginProps,
diff --git a/ui/packages/editor/src/components/bubble/BubbleMenuPlugin.ts b/ui/packages/editor/src/components/bubble/BubbleMenuPlugin.ts
index 31ca50fe0..6366b9faa 100644
--- a/ui/packages/editor/src/components/bubble/BubbleMenuPlugin.ts
+++ b/ui/packages/editor/src/components/bubble/BubbleMenuPlugin.ts
@@ -1,12 +1,12 @@
+import type { EditorView } from "@/tiptap/pm";
+import { EditorState, Plugin, PluginKey } from "@/tiptap/pm";
 import {
   Editor,
   isNodeSelection,
   isTextSelection,
   posToDOMRect,
 } from "@/tiptap/vue-3";
-import { EditorState, Plugin, PluginKey } from "@/tiptap/pm";
-import type { EditorView } from "@/tiptap/pm";
-import tippy, { type Instance, type Props, sticky } from "tippy.js";
+import tippy, { sticky, type Instance, type Props } from "tippy.js";
 
 export interface TippyOptionProps extends Props {
   fixed?: boolean;
diff --git a/ui/packages/editor/src/components/common/ColorPickerDropdown.vue b/ui/packages/editor/src/components/common/ColorPickerDropdown.vue
index 45e05a3b3..a56dcf882 100644
--- a/ui/packages/editor/src/components/common/ColorPickerDropdown.vue
+++ b/ui/packages/editor/src/components/common/ColorPickerDropdown.vue
@@ -1,11 +1,11 @@
 <script lang="ts" setup>
+import { i18n } from "@/locales";
+import type { Payload } from "@ckpack/vue-color";
+import { Sketch } from "@ckpack/vue-color";
 import { Dropdown as VDropdown } from "floating-vue";
+import tailwindcssColors from "tailwindcss/colors";
 import MdiChevronRight from "~icons/mdi/chevron-right";
 import MdiPalette from "~icons/mdi/palette";
-import { Sketch } from "@ckpack/vue-color";
-import type { Payload } from "@ckpack/vue-color";
-import tailwindcssColors from "tailwindcss/colors";
-import { i18n } from "@/locales";
 
 interface Color {
   color: string;
diff --git a/ui/packages/editor/src/components/index.ts b/ui/packages/editor/src/components/index.ts
index f7b773067..d3904c63f 100644
--- a/ui/packages/editor/src/components/index.ts
+++ b/ui/packages/editor/src/components/index.ts
@@ -11,5 +11,5 @@ export * from "./toolbar";
 export * from "./toolbox";
 
 export { default as RichTextEditor } from "./Editor.vue";
-export * from "./EditorHeader.vue";
 export * from "./EditorBubbleMenu.vue";
+export * from "./EditorHeader.vue";
diff --git a/ui/packages/editor/src/components/toolbar/ToolbarItem.vue b/ui/packages/editor/src/components/toolbar/ToolbarItem.vue
index a7b6d3953..3c9f962a3 100644
--- a/ui/packages/editor/src/components/toolbar/ToolbarItem.vue
+++ b/ui/packages/editor/src/components/toolbar/ToolbarItem.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import type { Component } from "vue";
-import { vTooltip } from "floating-vue";
-import MdiMenuDown from "~icons/mdi/menu-down";
 import type { ToolbarItem } from "@/types";
+import { vTooltip } from "floating-vue";
+import type { Component } from "vue";
+import MdiMenuDown from "~icons/mdi/menu-down";
 
 withDefaults(
   defineProps<{
diff --git a/ui/packages/editor/src/components/toolbox/ToolboxItem.vue b/ui/packages/editor/src/components/toolbox/ToolboxItem.vue
index 096a91975..871b9e7e6 100644
--- a/ui/packages/editor/src/components/toolbox/ToolboxItem.vue
+++ b/ui/packages/editor/src/components/toolbox/ToolboxItem.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import type { Component } from "vue";
 import type { Editor } from "@/tiptap/vue-3";
+import type { Component } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/editor/src/dev/App.vue b/ui/packages/editor/src/dev/App.vue
index 9a682b395..b0540671a 100644
--- a/ui/packages/editor/src/dev/App.vue
+++ b/ui/packages/editor/src/dev/App.vue
@@ -1,52 +1,52 @@
 <script lang="ts" setup>
 import { useLocalStorage } from "@vueuse/core";
 import {
+  ExtensionAudio,
   ExtensionBlockquote,
   ExtensionBold,
   ExtensionBulletList,
+  ExtensionClearFormat,
   ExtensionCode,
+  ExtensionCodeBlock,
+  ExtensionColor,
+  ExtensionColumn,
+  ExtensionColumns,
+  ExtensionCommands,
   ExtensionDocument,
+  ExtensionDraggable,
   ExtensionDropcursor,
+  ExtensionFontSize,
+  ExtensionFormatBrush,
   ExtensionGapcursor,
   ExtensionHardBreak,
   ExtensionHeading,
+  ExtensionHighlight,
   ExtensionHistory,
   ExtensionHorizontalRule,
-  ExtensionItalic,
-  ExtensionOrderedList,
-  ExtensionStrike,
-  ExtensionText,
+  ExtensionIframe,
   ExtensionImage,
-  ExtensionTaskList,
+  ExtensionIndent,
+  ExtensionItalic,
   ExtensionLink,
-  ExtensionTextAlign,
-  ExtensionUnderline,
-  ExtensionTable,
+  ExtensionListKeymap,
+  ExtensionNodeSelected,
+  ExtensionOrderedList,
+  ExtensionPlaceholder,
+  ExtensionRangeSelection,
+  ExtensionSearchAndReplace,
+  ExtensionStrike,
   ExtensionSubscript,
   ExtensionSuperscript,
-  ExtensionPlaceholder,
-  ExtensionHighlight,
-  ExtensionCommands,
-  ExtensionIframe,
-  ExtensionVideo,
-  ExtensionAudio,
-  ExtensionCodeBlock,
-  ExtensionColor,
-  ExtensionFontSize,
-  lowlight,
-  RichTextEditor,
-  useEditor,
-  ExtensionIndent,
-  ExtensionDraggable,
-  ExtensionColumns,
-  ExtensionColumn,
-  ExtensionNodeSelected,
+  ExtensionTable,
+  ExtensionTaskList,
+  ExtensionText,
+  ExtensionTextAlign,
   ExtensionTrailingNode,
-  ExtensionListKeymap,
-  ExtensionSearchAndReplace,
-  ExtensionClearFormat,
-  ExtensionFormatBrush,
-  ExtensionRangeSelection,
+  ExtensionUnderline,
+  ExtensionVideo,
+  RichTextEditor,
+  lowlight,
+  useEditor,
 } from "../index";
 
 const content = useLocalStorage("content", "");
diff --git a/ui/packages/editor/src/extensions/audio/AudioView.vue b/ui/packages/editor/src/extensions/audio/AudioView.vue
index b8f52eee8..99319ca42 100644
--- a/ui/packages/editor/src/extensions/audio/AudioView.vue
+++ b/ui/packages/editor/src/extensions/audio/AudioView.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import type { Node as ProseMirrorNode, Decoration } from "@/tiptap/pm";
+import { i18n } from "@/locales";
+import type { Decoration, Node as ProseMirrorNode } from "@/tiptap/pm";
 import type { Editor, Node } from "@/tiptap/vue-3";
 import { NodeViewWrapper } from "@/tiptap/vue-3";
 import { computed, onMounted, ref } from "vue";
-import { i18n } from "@/locales";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/packages/editor/src/extensions/audio/BubbleItemAudioLink.vue b/ui/packages/editor/src/extensions/audio/BubbleItemAudioLink.vue
index 6b52354f6..9abb09a61 100644
--- a/ui/packages/editor/src/extensions/audio/BubbleItemAudioLink.vue
+++ b/ui/packages/editor/src/extensions/audio/BubbleItemAudioLink.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
+import { i18n } from "@/locales";
 import type { Editor } from "@/tiptap/vue-3";
 import { computed, type Component } from "vue";
 import Audio from "./index";
-import { i18n } from "@/locales";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/packages/editor/src/extensions/audio/index.ts b/ui/packages/editor/src/extensions/audio/index.ts
index 81ada3578..611fa0d89 100644
--- a/ui/packages/editor/src/extensions/audio/index.ts
+++ b/ui/packages/editor/src/extensions/audio/index.ts
@@ -1,29 +1,29 @@
-import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
-import {
-  Editor,
-  isActive,
-  mergeAttributes,
-  Node,
-  nodeInputRule,
-  type Range,
-  VueNodeViewRenderer,
-} from "@/tiptap/vue-3";
-import type { EditorState } from "@/tiptap/pm";
-import { markRaw } from "vue";
-import AudioView from "./AudioView.vue";
-import MdiMusicCircleOutline from "~icons/mdi/music-circle-outline";
+import { BlockActionSeparator } from "@/components";
+import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
 import ToolboxItemVue from "@/components/toolbox/ToolboxItem.vue";
 import { i18n } from "@/locales";
+import type { EditorState } from "@/tiptap/pm";
+import {
+  Editor,
+  Node,
+  VueNodeViewRenderer,
+  isActive,
+  mergeAttributes,
+  nodeInputRule,
+  type Range,
+} from "@/tiptap/vue-3";
+import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
+import { deleteNode } from "@/utils";
+import { markRaw } from "vue";
+import MdiLinkVariant from "~icons/mdi/link-variant";
+import MdiMotionPlay from "~icons/mdi/motion-play";
+import MdiMotionPlayOutline from "~icons/mdi/motion-play-outline";
+import MdiMusicCircleOutline from "~icons/mdi/music-circle-outline";
 import MdiPlayCircle from "~icons/mdi/play-circle";
 import MdiPlayCircleOutline from "~icons/mdi/play-circle-outline";
-import MdiMotionPlayOutline from "~icons/mdi/motion-play-outline";
-import MdiMotionPlay from "~icons/mdi/motion-play";
-import { BlockActionSeparator } from "@/components";
-import BubbleItemAudioLink from "./BubbleItemAudioLink.vue";
-import MdiLinkVariant from "~icons/mdi/link-variant";
 import MdiShare from "~icons/mdi/share";
-import { deleteNode } from "@/utils";
-import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
+import AudioView from "./AudioView.vue";
+import BubbleItemAudioLink from "./BubbleItemAudioLink.vue";
 
 declare module "@/tiptap" {
   interface Commands<ReturnType> {
diff --git a/ui/packages/editor/src/extensions/blockquote/index.ts b/ui/packages/editor/src/extensions/blockquote/index.ts
index 592791b1d..81f556c2c 100644
--- a/ui/packages/editor/src/extensions/blockquote/index.ts
+++ b/ui/packages/editor/src/extensions/blockquote/index.ts
@@ -1,11 +1,11 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapBlockquote from "@tiptap/extension-blockquote";
-import type { BlockquoteOptions } from "@tiptap/extension-blockquote";
 import ToolbarItemVue from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatQuoteOpen from "~icons/mdi/format-quote-open";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { BlockquoteOptions } from "@tiptap/extension-blockquote";
+import TiptapBlockquote from "@tiptap/extension-blockquote";
+import { markRaw } from "vue";
+import MdiFormatQuoteOpen from "~icons/mdi/format-quote-open";
 
 const Blockquote = TiptapBlockquote.extend<
   ExtensionOptions & BlockquoteOptions
diff --git a/ui/packages/editor/src/extensions/bold/index.ts b/ui/packages/editor/src/extensions/bold/index.ts
index 111c5b08b..987ee4f83 100644
--- a/ui/packages/editor/src/extensions/bold/index.ts
+++ b/ui/packages/editor/src/extensions/bold/index.ts
@@ -1,11 +1,11 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapBold from "@tiptap/extension-bold";
-import type { BoldOptions } from "@tiptap/extension-bold";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatBold from "~icons/mdi/format-bold";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { BoldOptions } from "@tiptap/extension-bold";
+import TiptapBold from "@tiptap/extension-bold";
+import { markRaw } from "vue";
+import MdiFormatBold from "~icons/mdi/format-bold";
 
 const Bold = TiptapBold.extend<ExtensionOptions & BoldOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/bullet-list/index.ts b/ui/packages/editor/src/extensions/bullet-list/index.ts
index 9949e3aec..ea823043a 100644
--- a/ui/packages/editor/src/extensions/bullet-list/index.ts
+++ b/ui/packages/editor/src/extensions/bullet-list/index.ts
@@ -1,12 +1,12 @@
-import type { Editor, Range } from "@/tiptap/vue-3";
-import TiptapBulletList from "@tiptap/extension-bullet-list";
-import type { BulletListOptions } from "@tiptap/extension-bullet-list";
-import ExtensionListItem from "@tiptap/extension-list-item";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatListBulleted from "~icons/mdi/format-list-bulleted";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor, Range } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { BulletListOptions } from "@tiptap/extension-bullet-list";
+import TiptapBulletList from "@tiptap/extension-bullet-list";
+import ExtensionListItem from "@tiptap/extension-list-item";
+import { markRaw } from "vue";
+import MdiFormatListBulleted from "~icons/mdi/format-list-bulleted";
 
 const BulletList = TiptapBulletList.extend<
   ExtensionOptions & BulletListOptions
diff --git a/ui/packages/editor/src/extensions/clear-format/index.ts b/ui/packages/editor/src/extensions/clear-format/index.ts
index 5d2c8b9e6..5ba3b6442 100644
--- a/ui/packages/editor/src/extensions/clear-format/index.ts
+++ b/ui/packages/editor/src/extensions/clear-format/index.ts
@@ -1,10 +1,10 @@
+import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
+import { i18n } from "@/locales";
 import type { Editor } from "@/tiptap";
 import { Extension } from "@/tiptap";
 import type { ExtensionOptions } from "@/types";
 import { markRaw } from "vue";
 import MdiEraser from "~icons/mdi/eraser";
-import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import { i18n } from "@/locales";
 
 const clearFormat = Extension.create<ExtensionOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/code-block/CodeBlockViewRenderer.vue b/ui/packages/editor/src/extensions/code-block/CodeBlockViewRenderer.vue
index e6f675c84..f18ea49ae 100644
--- a/ui/packages/editor/src/extensions/code-block/CodeBlockViewRenderer.vue
+++ b/ui/packages/editor/src/extensions/code-block/CodeBlockViewRenderer.vue
@@ -1,13 +1,13 @@
 <script lang="ts" setup>
-import type { Node as ProseMirrorNode, Decoration } from "@/tiptap/pm";
+import { i18n } from "@/locales";
+import type { Decoration, Node as ProseMirrorNode } from "@/tiptap/pm";
 import type { Editor, Node } from "@/tiptap/vue-3";
 import { NodeViewContent, NodeViewWrapper } from "@/tiptap/vue-3";
-import lowlight from "./lowlight";
+import { useTimeout } from "@vueuse/core";
 import { computed } from "vue";
 import BxBxsCopy from "~icons/bx/bxs-copy";
 import IconCheckboxCircle from "~icons/ri/checkbox-circle-line";
-import { useTimeout } from "@vueuse/core";
-import { i18n } from "@/locales";
+import lowlight from "./lowlight";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/packages/editor/src/extensions/code-block/code-block.ts b/ui/packages/editor/src/extensions/code-block/code-block.ts
index 561dde37d..275dcf6e7 100644
--- a/ui/packages/editor/src/extensions/code-block/code-block.ts
+++ b/ui/packages/editor/src/extensions/code-block/code-block.ts
@@ -1,12 +1,7 @@
-import {
-  Editor,
-  type Range,
-  type CommandProps,
-  isActive,
-  findParentNode,
-  VueNodeViewRenderer,
-  isNodeActive,
-} from "@/tiptap/vue-3";
+import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
+import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
+import ToolboxItem from "@/components/toolbox/ToolboxItem.vue";
+import { i18n } from "@/locales";
 import {
   EditorState,
   Plugin,
@@ -14,16 +9,21 @@ import {
   TextSelection,
   type Transaction,
 } from "@/tiptap/pm";
-import CodeBlockLowlight from "@tiptap/extension-code-block-lowlight";
-import type { CodeBlockLowlightOptions } from "@tiptap/extension-code-block-lowlight";
-import CodeBlockViewRenderer from "./CodeBlockViewRenderer.vue";
-import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiCodeBracesBox from "~icons/mdi/code-braces-box";
-import { markRaw } from "vue";
-import { i18n } from "@/locales";
-import ToolboxItem from "@/components/toolbox/ToolboxItem.vue";
-import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
+import {
+  Editor,
+  VueNodeViewRenderer,
+  findParentNode,
+  isActive,
+  isNodeActive,
+  type CommandProps,
+  type Range,
+} from "@/tiptap/vue-3";
 import { deleteNode } from "@/utils";
+import type { CodeBlockLowlightOptions } from "@tiptap/extension-code-block-lowlight";
+import CodeBlockLowlight from "@tiptap/extension-code-block-lowlight";
+import { markRaw } from "vue";
+import MdiCodeBracesBox from "~icons/mdi/code-braces-box";
+import CodeBlockViewRenderer from "./CodeBlockViewRenderer.vue";
 
 export interface CustomCodeBlockLowlightOptions
   extends CodeBlockLowlightOptions {
diff --git a/ui/packages/editor/src/extensions/code-block/lowlight.ts b/ui/packages/editor/src/extensions/code-block/lowlight.ts
index eb1238926..6512cc45a 100644
--- a/ui/packages/editor/src/extensions/code-block/lowlight.ts
+++ b/ui/packages/editor/src/extensions/code-block/lowlight.ts
@@ -1,6 +1,6 @@
-import { common, createLowlight } from "lowlight";
-import xml from "highlight.js/lib/languages/xml";
 import dart from "highlight.js/lib/languages/dart";
+import xml from "highlight.js/lib/languages/xml";
+import { common, createLowlight } from "lowlight";
 
 const lowlight = createLowlight(common);
 lowlight.register("html", xml);
diff --git a/ui/packages/editor/src/extensions/code/index.ts b/ui/packages/editor/src/extensions/code/index.ts
index c1d21eeb4..0475fe242 100644
--- a/ui/packages/editor/src/extensions/code/index.ts
+++ b/ui/packages/editor/src/extensions/code/index.ts
@@ -1,11 +1,11 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapCode from "@tiptap/extension-code";
-import type { CodeOptions } from "@tiptap/extension-code";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiCodeTags from "~icons/mdi/code-tags";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { CodeOptions } from "@tiptap/extension-code";
+import TiptapCode from "@tiptap/extension-code";
+import { markRaw } from "vue";
+import MdiCodeTags from "~icons/mdi/code-tags";
 
 const Code = TiptapCode.extend<ExtensionOptions & CodeOptions>({
   exitable: true,
diff --git a/ui/packages/editor/src/extensions/color/ColorToolbarItem.vue b/ui/packages/editor/src/extensions/color/ColorToolbarItem.vue
index 028bf10b3..bb96c348b 100644
--- a/ui/packages/editor/src/extensions/color/ColorToolbarItem.vue
+++ b/ui/packages/editor/src/extensions/color/ColorToolbarItem.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import { ToolbarItem } from "@/components";
-import type { Component } from "vue";
-import type { Editor } from "@/tiptap/vue-3";
 import ColorPickerDropdown from "@/components/common/ColorPickerDropdown.vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
+import type { Component } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/editor/src/extensions/color/index.ts b/ui/packages/editor/src/extensions/color/index.ts
index cdf465a9b..281ec0177 100644
--- a/ui/packages/editor/src/extensions/color/index.ts
+++ b/ui/packages/editor/src/extensions/color/index.ts
@@ -1,12 +1,12 @@
-import type { ExtensionOptions } from "@/types";
-import TiptapColor from "@tiptap/extension-color";
-import type { ColorOptions } from "@tiptap/extension-color";
-import TiptapTextStyle from "@tiptap/extension-text-style";
+import { i18n } from "@/locales";
 import type { Editor } from "@/tiptap/vue-3";
+import type { ExtensionOptions } from "@/types";
+import type { ColorOptions } from "@tiptap/extension-color";
+import TiptapColor from "@tiptap/extension-color";
+import TiptapTextStyle from "@tiptap/extension-text-style";
 import { markRaw } from "vue";
 import MdiFormatColor from "~icons/mdi/format-color";
 import ColorToolbarItem from "./ColorToolbarItem.vue";
-import { i18n } from "@/locales";
 
 const Color = TiptapColor.extend<ColorOptions & ExtensionOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/columns/columns.ts b/ui/packages/editor/src/extensions/columns/columns.ts
index aa45a240f..e1060f19d 100644
--- a/ui/packages/editor/src/extensions/columns/columns.ts
+++ b/ui/packages/editor/src/extensions/columns/columns.ts
@@ -1,23 +1,23 @@
-import {
-  Editor,
-  findParentNode,
-  isActive,
-  mergeAttributes,
-  Node,
-  type Range,
-} from "@/tiptap/vue-3";
-import { Node as PMNode, EditorState, TextSelection } from "@/tiptap/pm";
-import type { NodeType, Schema } from "@/tiptap/pm";
-import { markRaw } from "vue";
-import Column from "./column";
-import RiInsertColumnLeft from "~icons/ri/insert-column-left";
-import RiInsertColumnRight from "~icons/ri/insert-column-right";
-import RiDeleteColumn from "~icons/ri/delete-column";
 import { BlockActionSeparator, ToolboxItem } from "@/components";
 import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
 import { i18n } from "@/locales";
+import type { NodeType, Schema } from "@/tiptap/pm";
+import { EditorState, Node as PMNode, TextSelection } from "@/tiptap/pm";
+import {
+  Editor,
+  Node,
+  findParentNode,
+  isActive,
+  mergeAttributes,
+  type Range,
+} from "@/tiptap/vue-3";
 import { deleteNode } from "@/utils";
+import { markRaw } from "vue";
 import MdiCollage from "~icons/mdi/collage";
+import RiDeleteColumn from "~icons/ri/delete-column";
+import RiInsertColumnLeft from "~icons/ri/insert-column-left";
+import RiInsertColumnRight from "~icons/ri/insert-column-right";
+import Column from "./column";
 
 declare module "@/tiptap" {
   interface Commands<ReturnType> {
diff --git a/ui/packages/editor/src/extensions/columns/index.ts b/ui/packages/editor/src/extensions/columns/index.ts
index 9acd56e3b..3a8e8b155 100644
--- a/ui/packages/editor/src/extensions/columns/index.ts
+++ b/ui/packages/editor/src/extensions/columns/index.ts
@@ -1,2 +1,2 @@
-export { default as ExtensionColumns } from "./columns";
 export { default as ExtensionColumn } from "./column";
+export { default as ExtensionColumns } from "./columns";
diff --git a/ui/packages/editor/src/extensions/commands-menu/CommandsView.vue b/ui/packages/editor/src/extensions/commands-menu/CommandsView.vue
index 17fe8d27f..bc72c8f47 100644
--- a/ui/packages/editor/src/extensions/commands-menu/CommandsView.vue
+++ b/ui/packages/editor/src/extensions/commands-menu/CommandsView.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
-import { type PropType, ref, watch } from "vue";
-import type { CommandMenuItem } from "@/types";
 import { i18n } from "@/locales";
+import type { CommandMenuItem } from "@/types";
 import scrollIntoView from "scroll-into-view-if-needed";
+import { ref, watch, type PropType } from "vue";
 
 const props = defineProps({
   items: {
diff --git a/ui/packages/editor/src/extensions/commands-menu/commands.ts b/ui/packages/editor/src/extensions/commands-menu/commands.ts
index a8edacf8e..218da31a8 100644
--- a/ui/packages/editor/src/extensions/commands-menu/commands.ts
+++ b/ui/packages/editor/src/extensions/commands-menu/commands.ts
@@ -1,15 +1,15 @@
 import {
   Extension,
   VueRenderer,
-  type Editor,
   type AnyExtension,
+  type Editor,
   type Range,
 } from "@/tiptap/vue-3";
-import Suggestion from "@tiptap/suggestion";
 import type { CommandMenuItem } from "@/types";
+import Suggestion from "@tiptap/suggestion";
 import type { Instance } from "tippy.js";
-import CommandsView from "./CommandsView.vue";
 import tippy from "tippy.js";
+import CommandsView from "./CommandsView.vue";
 
 export default Extension.create({
   name: "commands-menu",
diff --git a/ui/packages/editor/src/extensions/draggable/index.ts b/ui/packages/editor/src/extensions/draggable/index.ts
index 147ef90e0..c9a8036f8 100644
--- a/ui/packages/editor/src/extensions/draggable/index.ts
+++ b/ui/packages/editor/src/extensions/draggable/index.ts
@@ -1,20 +1,20 @@
-import { Editor, Extension } from "@/tiptap/vue-3";
+import {} from "@/tiptap";
+import type { EditorView } from "@/tiptap/pm";
 import {
-  Fragment,
-  Node,
-  NodeType,
-  ResolvedPos,
-  Slice,
-  NodeSelection,
-  Plugin,
-  PluginKey,
   Decoration,
   DecorationSet,
+  Fragment,
+  Node,
+  NodeSelection,
+  NodeType,
+  Plugin,
+  PluginKey,
+  ResolvedPos,
+  Slice,
   // @ts-ignore
   __serializeForClipboard as serializeForClipboard,
 } from "@/tiptap/pm";
-import {} from "@/tiptap";
-import type { EditorView } from "@/tiptap/pm";
+import { Editor, Extension } from "@/tiptap/vue-3";
 import type { DraggableItem, ExtensionOptions } from "@/types";
 
 // https://developer.mozilla.org/zh-CN/docs/Web/API/HTML_Drag_and_Drop_API
diff --git a/ui/packages/editor/src/extensions/font-size/index.ts b/ui/packages/editor/src/extensions/font-size/index.ts
index fec0315d5..1e1b7525a 100644
--- a/ui/packages/editor/src/extensions/font-size/index.ts
+++ b/ui/packages/editor/src/extensions/font-size/index.ts
@@ -1,9 +1,9 @@
 import { ToolbarItem, ToolbarSubItem } from "@/components";
+import { i18n } from "@/locales";
 import { Extension, type Editor } from "@/tiptap/vue-3";
+import TiptapTextStyle from "@tiptap/extension-text-style";
 import { markRaw } from "vue";
 import MdiFormatSize from "~icons/mdi/format-size";
-import TiptapTextStyle from "@tiptap/extension-text-style";
-import { i18n } from "@/locales";
 
 export type FontSizeOptions = {
   types: string[];
diff --git a/ui/packages/editor/src/extensions/heading/index.ts b/ui/packages/editor/src/extensions/heading/index.ts
index 82235d2ea..7c93154c7 100644
--- a/ui/packages/editor/src/extensions/heading/index.ts
+++ b/ui/packages/editor/src/extensions/heading/index.ts
@@ -1,22 +1,22 @@
-import { mergeAttributes, type Editor, type Range } from "@/tiptap/vue-3";
-import TiptapParagraph from "@/extensions/paragraph";
-import TiptapHeading from "@tiptap/extension-heading";
-import type { HeadingOptions } from "@tiptap/extension-heading";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
 import ToolbarSubItem from "@/components/toolbar/ToolbarSubItem.vue";
-import MdiFormatParagraph from "~icons/mdi/format-paragraph";
-import MdiFormatHeaderPound from "~icons/mdi/format-header-pound";
+import TiptapParagraph from "@/extensions/paragraph";
+import { i18n } from "@/locales";
+import { AttrStep, Plugin, PluginKey } from "@/tiptap";
+import { mergeAttributes, type Editor, type Range } from "@/tiptap/vue-3";
+import type { ExtensionOptions } from "@/types";
+import { generateAnchorId } from "@/utils";
+import type { HeadingOptions } from "@tiptap/extension-heading";
+import TiptapHeading from "@tiptap/extension-heading";
+import { markRaw } from "vue";
 import MdiFormatHeader1 from "~icons/mdi/format-header-1";
 import MdiFormatHeader2 from "~icons/mdi/format-header-2";
 import MdiFormatHeader3 from "~icons/mdi/format-header-3";
 import MdiFormatHeader4 from "~icons/mdi/format-header-4";
 import MdiFormatHeader5 from "~icons/mdi/format-header-5";
 import MdiFormatHeader6 from "~icons/mdi/format-header-6";
-import { markRaw } from "vue";
-import { i18n } from "@/locales";
-import type { ExtensionOptions } from "@/types";
-import { AttrStep, Plugin, PluginKey } from "@/tiptap";
-import { generateAnchorId } from "@/utils";
+import MdiFormatHeaderPound from "~icons/mdi/format-header-pound";
+import MdiFormatParagraph from "~icons/mdi/format-paragraph";
 
 const Blockquote = TiptapHeading.extend<ExtensionOptions & HeadingOptions>({
   renderHTML({ node, HTMLAttributes }) {
diff --git a/ui/packages/editor/src/extensions/highlight/HighlightBubbleItem.vue b/ui/packages/editor/src/extensions/highlight/HighlightBubbleItem.vue
index 706c908a9..622e5086d 100644
--- a/ui/packages/editor/src/extensions/highlight/HighlightBubbleItem.vue
+++ b/ui/packages/editor/src/extensions/highlight/HighlightBubbleItem.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
 import { BubbleItem } from "@/components";
 import ColorPickerDropdown from "@/components/common/ColorPickerDropdown.vue";
-import MdiFormatColorMarkerCancel from "~icons/mdi/format-color-marker-cancel";
 import { i18n } from "@/locales";
 import type { Editor } from "@/tiptap/vue-3";
 import type { Component } from "vue";
+import MdiFormatColorMarkerCancel from "~icons/mdi/format-color-marker-cancel";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/packages/editor/src/extensions/highlight/HighlightToolbarItem.vue b/ui/packages/editor/src/extensions/highlight/HighlightToolbarItem.vue
index cc0fa4b4e..f54c351c9 100644
--- a/ui/packages/editor/src/extensions/highlight/HighlightToolbarItem.vue
+++ b/ui/packages/editor/src/extensions/highlight/HighlightToolbarItem.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
 import { ToolbarItem } from "@/components";
-import type { Component } from "vue";
-import type { Editor } from "@/tiptap/vue-3";
 import ColorPickerDropdown from "@/components/common/ColorPickerDropdown.vue";
-import MdiFormatColorMarkerCancel from "~icons/mdi/format-color-marker-cancel";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
+import type { Component } from "vue";
+import MdiFormatColorMarkerCancel from "~icons/mdi/format-color-marker-cancel";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/packages/editor/src/extensions/highlight/index.ts b/ui/packages/editor/src/extensions/highlight/index.ts
index c060316ea..8f3ce38c7 100644
--- a/ui/packages/editor/src/extensions/highlight/index.ts
+++ b/ui/packages/editor/src/extensions/highlight/index.ts
@@ -1,10 +1,10 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapHighlight from "@tiptap/extension-highlight";
-import type { HighlightOptions } from "@tiptap/extension-highlight";
-import MdiFormatColorHighlight from "~icons/mdi/format-color-highlight";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { HighlightOptions } from "@tiptap/extension-highlight";
+import TiptapHighlight from "@tiptap/extension-highlight";
+import { markRaw } from "vue";
+import MdiFormatColorHighlight from "~icons/mdi/format-color-highlight";
 import HighlightToolbarItem from "./HighlightToolbarItem.vue";
 
 const Highlight = TiptapHighlight.extend<ExtensionOptions & HighlightOptions>({
diff --git a/ui/packages/editor/src/extensions/history/index.ts b/ui/packages/editor/src/extensions/history/index.ts
index 5edac4bd2..58fc54527 100644
--- a/ui/packages/editor/src/extensions/history/index.ts
+++ b/ui/packages/editor/src/extensions/history/index.ts
@@ -1,12 +1,12 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapHistory from "@tiptap/extension-history";
-import type { HistoryOptions } from "@tiptap/extension-history";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiUndoVariant from "~icons/mdi/undo-variant";
-import MdiRedoVariant from "~icons/mdi/redo-variant";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { HistoryOptions } from "@tiptap/extension-history";
+import TiptapHistory from "@tiptap/extension-history";
+import { markRaw } from "vue";
+import MdiRedoVariant from "~icons/mdi/redo-variant";
+import MdiUndoVariant from "~icons/mdi/undo-variant";
 
 const History = TiptapHistory.extend<ExtensionOptions & HistoryOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/image/BubbleItemImageSize.vue b/ui/packages/editor/src/extensions/image/BubbleItemImageSize.vue
index 2419b94e6..691be1175 100644
--- a/ui/packages/editor/src/extensions/image/BubbleItemImageSize.vue
+++ b/ui/packages/editor/src/extensions/image/BubbleItemImageSize.vue
@@ -1,17 +1,17 @@
 <script setup lang="ts">
-import { i18n } from "@/locales";
-import type { Editor } from "@/tiptap/vue-3";
-import { computed, type Component } from "vue";
-import Image from "./index";
 import {
   BlockActionButton,
   BlockActionInput,
   BlockActionSeparator,
 } from "@/components";
+import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
+import { computed, type Component } from "vue";
 import MdiBackupRestore from "~icons/mdi/backup-restore";
 import MdiImageSizeSelectActual from "~icons/mdi/image-size-select-actual";
 import MdiImageSizeSelectLarge from "~icons/mdi/image-size-select-large";
 import MdiImageSizeSelectSmall from "~icons/mdi/image-size-select-small";
+import Image from "./index";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/packages/editor/src/extensions/image/ImageView.vue b/ui/packages/editor/src/extensions/image/ImageView.vue
index 837f5e748..a63f705ef 100644
--- a/ui/packages/editor/src/extensions/image/ImageView.vue
+++ b/ui/packages/editor/src/extensions/image/ImageView.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import { i18n } from "@/locales";
+import type { Decoration, Node as ProseMirrorNode } from "@/tiptap/pm";
 import type { Editor, Node } from "@/tiptap/vue-3";
 import { NodeViewWrapper } from "@/tiptap/vue-3";
-import type { Node as ProseMirrorNode, Decoration } from "@/tiptap/pm";
 import { computed, onMounted, ref } from "vue";
 import Image from "./index";
 
diff --git a/ui/packages/editor/src/extensions/image/index.ts b/ui/packages/editor/src/extensions/image/index.ts
index 4e39cec6d..2bdd21a95 100644
--- a/ui/packages/editor/src/extensions/image/index.ts
+++ b/ui/packages/editor/src/extensions/image/index.ts
@@ -1,33 +1,33 @@
-import TiptapImage from "@tiptap/extension-image";
+import { BlockActionSeparator } from "@/components";
+import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
+import ToolboxItem from "@/components/toolbox/ToolboxItem.vue";
+import { i18n } from "@/locales";
+import type { EditorState } from "@/tiptap/pm";
 import {
   isActive,
   mergeAttributes,
   VueNodeViewRenderer,
   type Editor,
 } from "@/tiptap/vue-3";
-import type { EditorState } from "@/tiptap/pm";
-import ImageView from "./ImageView.vue";
-import type { ImageOptions } from "@tiptap/extension-image";
 import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
-import ToolboxItem from "@/components/toolbox/ToolboxItem.vue";
-import MdiFileImageBox from "~icons/mdi/file-image-box";
+import { deleteNode } from "@/utils";
+import type { ImageOptions } from "@tiptap/extension-image";
+import TiptapImage from "@tiptap/extension-image";
 import { markRaw } from "vue";
-import { i18n } from "@/locales";
-import BubbleItemImageSize from "./BubbleItemImageSize.vue";
-import BubbleItemImageAlt from "./BubbleItemImageAlt.vue";
-import BubbleItemVideoLink from "./BubbleItemImageLink.vue";
-import BubbleItemImageHref from "./BubbleItemImageHref.vue";
-import { BlockActionSeparator } from "@/components";
-import MdiFormatAlignLeft from "~icons/mdi/format-align-left";
+import MdiFileImageBox from "~icons/mdi/file-image-box";
 import MdiFormatAlignCenter from "~icons/mdi/format-align-center";
-import MdiFormatAlignRight from "~icons/mdi/format-align-right";
 import MdiFormatAlignJustify from "~icons/mdi/format-align-justify";
+import MdiFormatAlignLeft from "~icons/mdi/format-align-left";
+import MdiFormatAlignRight from "~icons/mdi/format-align-right";
+import MdiLink from "~icons/mdi/link";
 import MdiLinkVariant from "~icons/mdi/link-variant";
 import MdiShare from "~icons/mdi/share";
 import MdiTextBoxEditOutline from "~icons/mdi/text-box-edit-outline";
-import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
-import { deleteNode } from "@/utils";
-import MdiLink from "~icons/mdi/link";
+import BubbleItemImageAlt from "./BubbleItemImageAlt.vue";
+import BubbleItemImageHref from "./BubbleItemImageHref.vue";
+import BubbleItemVideoLink from "./BubbleItemImageLink.vue";
+import BubbleItemImageSize from "./BubbleItemImageSize.vue";
+import ImageView from "./ImageView.vue";
 
 const Image = TiptapImage.extend<ExtensionOptions & ImageOptions>({
   inline() {
diff --git a/ui/packages/editor/src/extensions/indent/index.ts b/ui/packages/editor/src/extensions/indent/index.ts
index b822e9b70..32b6dc912 100644
--- a/ui/packages/editor/src/extensions/indent/index.ts
+++ b/ui/packages/editor/src/extensions/indent/index.ts
@@ -1,10 +1,10 @@
 import {
+  CoreEditor,
+  Extension,
+  isList,
   type CommandProps,
   type Extensions,
   type KeyboardShortcutCommand,
-  Extension,
-  isList,
-  CoreEditor,
 } from "@/tiptap";
 import { TextSelection, Transaction } from "@/tiptap/pm";
 
diff --git a/ui/packages/editor/src/extensions/index.ts b/ui/packages/editor/src/extensions/index.ts
index 1f0ec1192..eeb830e56 100644
--- a/ui/packages/editor/src/extensions/index.ts
+++ b/ui/packages/editor/src/extensions/index.ts
@@ -1,51 +1,51 @@
 // Tiptap official extensions
-import ExtensionHistory from "./history";
-import ExtensionHeading from "./heading";
-import ExtensionBold from "./bold";
-import ExtensionItalic from "./italic";
-import ExtensionStrike from "./strike";
-import ExtensionUnderline from "./underline";
-import ExtensionHighlight from "./highlight";
-import ExtensionBlockquote from "./blockquote";
-import ExtensionCode from "./code";
-import ExtensionSuperscript from "./superscript";
-import ExtensionSubscript from "./subscript";
-import ExtensionBulletList from "./bullet-list";
-import ExtensionOrderedList from "./ordered-list";
-import ExtensionTaskList from "./task-list";
-import ExtensionListKeymap from "./list-keymap";
-import ExtensionTable from "./table";
-import ExtensionTextAlign from "./text-align";
-import ExtensionTextStyle from "@tiptap/extension-text-style";
-import ExtensionLink from "./link";
-import ExtensionColor from "./color";
-import ExtensionFontSize from "./font-size";
+import { i18n } from "@/locales";
+import ExtensionDocument from "@tiptap/extension-document";
 import ExtensionDropcursor from "@tiptap/extension-dropcursor";
 import ExtensionGapcursor from "@tiptap/extension-gapcursor";
 import ExtensionHardBreak from "@tiptap/extension-hard-break";
 import ExtensionHorizontalRule from "@tiptap/extension-horizontal-rule";
-import ExtensionDocument from "@tiptap/extension-document";
-import ExtensionParagraph from "./paragraph";
 import ExtensionPlaceholder from "@tiptap/extension-placeholder";
-import { i18n } from "@/locales";
+import ExtensionTextStyle from "@tiptap/extension-text-style";
+import ExtensionBlockquote from "./blockquote";
+import ExtensionBold from "./bold";
+import ExtensionBulletList from "./bullet-list";
+import ExtensionCode from "./code";
+import ExtensionColor from "./color";
+import ExtensionFontSize from "./font-size";
+import ExtensionHeading from "./heading";
+import ExtensionHighlight from "./highlight";
+import ExtensionHistory from "./history";
+import ExtensionItalic from "./italic";
+import ExtensionLink from "./link";
+import ExtensionListKeymap from "./list-keymap";
+import ExtensionOrderedList from "./ordered-list";
+import ExtensionParagraph from "./paragraph";
+import ExtensionStrike from "./strike";
+import ExtensionSubscript from "./subscript";
+import ExtensionSuperscript from "./superscript";
+import ExtensionTable from "./table";
+import ExtensionTaskList from "./task-list";
+import ExtensionTextAlign from "./text-align";
+import ExtensionUnderline from "./underline";
 
 // Custom extensions
-import { ExtensionCommands } from "../extensions/commands-menu";
 import { ExtensionCodeBlock, lowlight } from "@/extensions/code-block";
-import ExtensionIframe from "./iframe";
-import ExtensionVideo from "./video";
+import { ExtensionCommands } from "../extensions/commands-menu";
 import ExtensionAudio from "./audio";
+import ExtensionClearFormat from "./clear-format";
+import { ExtensionColumn, ExtensionColumns } from "./columns";
+import ExtensionDraggable from "./draggable";
+import ExtensionFormatBrush from "./format-brush";
+import ExtensionIframe from "./iframe";
 import ExtensionImage from "./image";
 import ExtensionIndent from "./indent";
-import { ExtensionColumns, ExtensionColumn } from "./columns";
-import ExtensionText from "./text";
-import ExtensionDraggable from "./draggable";
 import ExtensionNodeSelected from "./node-selected";
-import ExtensionTrailingNode from "./trailing-node";
-import ExtensionSearchAndReplace from "./search-and-replace";
-import ExtensionClearFormat from "./clear-format";
-import ExtensionFormatBrush from "./format-brush";
 import { ExtensionRangeSelection, RangeSelection } from "./range-selection";
+import ExtensionSearchAndReplace from "./search-and-replace";
+import ExtensionText from "./text";
+import ExtensionTrailingNode from "./trailing-node";
+import ExtensionVideo from "./video";
 
 const allExtensions = [
   ExtensionBlockquote,
@@ -109,52 +109,52 @@ const allExtensions = [
 ];
 
 export {
-  allExtensions,
+  ExtensionAudio,
   ExtensionBlockquote,
   ExtensionBold,
   ExtensionBulletList,
+  ExtensionClearFormat,
   ExtensionCode,
+  ExtensionCodeBlock,
+  ExtensionColor,
+  ExtensionColumn,
+  ExtensionColumns,
+  ExtensionCommands,
   ExtensionDocument,
+  ExtensionDraggable,
   ExtensionDropcursor,
+  ExtensionFontSize,
+  ExtensionFormatBrush,
   ExtensionGapcursor,
   ExtensionHardBreak,
   ExtensionHeading,
+  ExtensionHighlight,
   ExtensionHistory,
   ExtensionHorizontalRule,
-  ExtensionItalic,
-  ExtensionOrderedList,
-  ExtensionStrike,
-  ExtensionText,
+  ExtensionIframe,
   ExtensionImage,
-  ExtensionTaskList,
+  ExtensionIndent,
+  ExtensionItalic,
   ExtensionLink,
-  ExtensionTextAlign,
-  ExtensionTextStyle,
-  ExtensionUnderline,
-  ExtensionTable,
-  ExtensionSubscript,
-  ExtensionSuperscript,
+  ExtensionListKeymap,
+  ExtensionNodeSelected,
+  ExtensionOrderedList,
   ExtensionParagraph,
   ExtensionPlaceholder,
-  ExtensionHighlight,
-  ExtensionCommands,
-  ExtensionCodeBlock,
-  lowlight,
-  ExtensionIframe,
-  ExtensionVideo,
-  ExtensionAudio,
-  ExtensionColor,
-  ExtensionFontSize,
-  ExtensionIndent,
-  ExtensionDraggable,
-  ExtensionColumns,
-  ExtensionColumn,
-  ExtensionNodeSelected,
-  ExtensionTrailingNode,
-  ExtensionListKeymap,
-  ExtensionSearchAndReplace,
-  ExtensionClearFormat,
-  ExtensionFormatBrush,
   ExtensionRangeSelection,
+  ExtensionSearchAndReplace,
+  ExtensionStrike,
+  ExtensionSubscript,
+  ExtensionSuperscript,
+  ExtensionTable,
+  ExtensionTaskList,
+  ExtensionText,
+  ExtensionTextAlign,
+  ExtensionTextStyle,
+  ExtensionTrailingNode,
+  ExtensionUnderline,
+  ExtensionVideo,
   RangeSelection,
+  allExtensions,
+  lowlight,
 };
diff --git a/ui/packages/editor/src/extensions/italic/index.ts b/ui/packages/editor/src/extensions/italic/index.ts
index b513abbe1..2378602f2 100644
--- a/ui/packages/editor/src/extensions/italic/index.ts
+++ b/ui/packages/editor/src/extensions/italic/index.ts
@@ -1,11 +1,11 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapItalic from "@tiptap/extension-italic";
-import type { ItalicOptions } from "@tiptap/extension-italic";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatItalic from "~icons/mdi/format-italic";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { ItalicOptions } from "@tiptap/extension-italic";
+import TiptapItalic from "@tiptap/extension-italic";
+import { markRaw } from "vue";
+import MdiFormatItalic from "~icons/mdi/format-italic";
 
 const Italic = TiptapItalic.extend<ExtensionOptions & ItalicOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/link/LinkBubbleButton.vue b/ui/packages/editor/src/extensions/link/LinkBubbleButton.vue
index 8425cdc85..7461fa669 100644
--- a/ui/packages/editor/src/extensions/link/LinkBubbleButton.vue
+++ b/ui/packages/editor/src/extensions/link/LinkBubbleButton.vue
@@ -1,11 +1,11 @@
 <script lang="ts" setup>
-import { computed, type Component } from "vue";
-import { vTooltip, Dropdown as VDropdown } from "floating-vue";
-import MdiLinkVariant from "~icons/mdi/link-variant";
 import { i18n } from "@/locales";
 import { type Editor } from "@/tiptap/vue-3";
-import { test } from "linkifyjs";
 import { TextSelection } from "@tiptap/pm/state";
+import { Dropdown as VDropdown, vTooltip } from "floating-vue";
+import { test } from "linkifyjs";
+import { computed, type Component } from "vue";
+import MdiLinkVariant from "~icons/mdi/link-variant";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/packages/editor/src/extensions/link/index.ts b/ui/packages/editor/src/extensions/link/index.ts
index 0769aad1b..508209803 100644
--- a/ui/packages/editor/src/extensions/link/index.ts
+++ b/ui/packages/editor/src/extensions/link/index.ts
@@ -1,7 +1,7 @@
-import TiptapLink from "@tiptap/extension-link";
-import type { LinkOptions } from "@tiptap/extension-link";
-import type { ExtensionOptions } from "@/types";
 import { mergeAttributes } from "@/tiptap/vue-3";
+import type { ExtensionOptions } from "@/types";
+import type { LinkOptions } from "@tiptap/extension-link";
+import TiptapLink from "@tiptap/extension-link";
 
 const Link = TiptapLink.extend<ExtensionOptions & LinkOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/list-keymap/index.ts b/ui/packages/editor/src/extensions/list-keymap/index.ts
index fb08a07a1..075ba7403 100644
--- a/ui/packages/editor/src/extensions/list-keymap/index.ts
+++ b/ui/packages/editor/src/extensions/list-keymap/index.ts
@@ -1,9 +1,9 @@
+import { Editor } from "@tiptap/core";
 import {
   listHelpers,
   ListKeymap,
   type ListKeymapOptions,
 } from "@tiptap/extension-list-keymap";
-import { Editor } from "@tiptap/core";
 
 /**
  *  Optimize the listKeymap extension until the issue with @tiptap/extension-list-keymap is resolved.
diff --git a/ui/packages/editor/src/extensions/node-selected/index.ts b/ui/packages/editor/src/extensions/node-selected/index.ts
index 8c184500e..726946e86 100644
--- a/ui/packages/editor/src/extensions/node-selected/index.ts
+++ b/ui/packages/editor/src/extensions/node-selected/index.ts
@@ -1,6 +1,6 @@
 import { Extension } from "@/tiptap/vue-3";
 
-import { Plugin, PluginKey, Decoration, DecorationSet } from "@/tiptap/pm";
+import { Decoration, DecorationSet, Plugin, PluginKey } from "@/tiptap/pm";
 
 export interface NodeSelectedOptions {
   className: string;
diff --git a/ui/packages/editor/src/extensions/ordered-list/index.ts b/ui/packages/editor/src/extensions/ordered-list/index.ts
index d0185f11d..ce0118133 100644
--- a/ui/packages/editor/src/extensions/ordered-list/index.ts
+++ b/ui/packages/editor/src/extensions/ordered-list/index.ts
@@ -1,12 +1,12 @@
-import type { Editor, Range } from "@/tiptap/vue-3";
-import TiptapOrderedList from "@tiptap/extension-ordered-list";
-import type { OrderedListOptions } from "@tiptap/extension-ordered-list";
-import ExtensionListItem from "@tiptap/extension-list-item";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatListNumbered from "~icons/mdi/format-list-numbered";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor, Range } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import ExtensionListItem from "@tiptap/extension-list-item";
+import type { OrderedListOptions } from "@tiptap/extension-ordered-list";
+import TiptapOrderedList from "@tiptap/extension-ordered-list";
+import { markRaw } from "vue";
+import MdiFormatListNumbered from "~icons/mdi/format-list-numbered";
 
 const OrderedList = TiptapOrderedList.extend<
   ExtensionOptions & OrderedListOptions
diff --git a/ui/packages/editor/src/extensions/paragraph/index.ts b/ui/packages/editor/src/extensions/paragraph/index.ts
index d9bf56d62..c421ed8f4 100644
--- a/ui/packages/editor/src/extensions/paragraph/index.ts
+++ b/ui/packages/editor/src/extensions/paragraph/index.ts
@@ -1,12 +1,12 @@
-import TiptapParagraph from "@tiptap/extension-paragraph";
-import type { ParagraphOptions } from "@tiptap/extension-paragraph";
-import type { ExtensionOptions, ToolbarItem as TypeToolbarItem } from "@/types";
-import type { Editor } from "@/tiptap";
-import { markRaw } from "vue";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import TablerLineHeight from "~icons/tabler/line-height";
-import { i18n } from "@/locales";
 import ToolbarSubItem from "@/components/toolbar/ToolbarSubItem.vue";
+import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap";
+import type { ExtensionOptions, ToolbarItem as TypeToolbarItem } from "@/types";
+import type { ParagraphOptions } from "@tiptap/extension-paragraph";
+import TiptapParagraph from "@tiptap/extension-paragraph";
+import { markRaw } from "vue";
+import TablerLineHeight from "~icons/tabler/line-height";
 
 const Paragraph = TiptapParagraph.extend<ExtensionOptions & ParagraphOptions>({
   addAttributes() {
diff --git a/ui/packages/editor/src/extensions/range-selection/index.ts b/ui/packages/editor/src/extensions/range-selection/index.ts
index 2be5c5a56..fe59b2cfb 100644
--- a/ui/packages/editor/src/extensions/range-selection/index.ts
+++ b/ui/packages/editor/src/extensions/range-selection/index.ts
@@ -160,4 +160,4 @@ const ExtensionRangeSelection = Extension.create({
   },
 });
 
-export { RangeSelection, ExtensionRangeSelection };
+export { ExtensionRangeSelection, RangeSelection };
diff --git a/ui/packages/editor/src/extensions/range-selection/range-selection.ts b/ui/packages/editor/src/extensions/range-selection/range-selection.ts
index 378c471ff..20633ee24 100644
--- a/ui/packages/editor/src/extensions/range-selection/range-selection.ts
+++ b/ui/packages/editor/src/extensions/range-selection/range-selection.ts
@@ -1,9 +1,9 @@
 import {
+  EditorState,
+  Node,
   ResolvedPos,
   Selection,
-  Node,
   type Mappable,
-  EditorState,
 } from "@/tiptap/pm";
 
 /**
diff --git a/ui/packages/editor/src/extensions/search-and-replace/SearchAndReplace.vue b/ui/packages/editor/src/extensions/search-and-replace/SearchAndReplace.vue
index 475e80f60..a0d3914c8 100644
--- a/ui/packages/editor/src/extensions/search-and-replace/SearchAndReplace.vue
+++ b/ui/packages/editor/src/extensions/search-and-replace/SearchAndReplace.vue
@@ -1,16 +1,16 @@
 <script setup lang="ts" name="BubbleMenu">
-import { ref, type PropType, watch, computed, nextTick } from "vue";
-import type { PluginKey, Editor } from "@/tiptap";
-import type { SearchAndReplacePluginState } from "./SearchAndReplacePlugin";
+import { i18n } from "@/locales";
+import type { Editor, PluginKey } from "@/tiptap";
+import { computed, nextTick, ref, watch, type PropType } from "vue";
+import LucideReplace from "~icons/lucide/replace";
+import LucideReplaceAll from "~icons/lucide/replace-all";
+import MdiArrowDown from "~icons/mdi/arrow-down";
+import MdiArrowUp from "~icons/mdi/arrow-up";
+import MdiClose from "~icons/mdi/close";
 import MdiFormatLetterCase from "~icons/mdi/format-letter-case";
 import MdiFormatLetterMatches from "~icons/mdi/format-letter-matches";
 import MdiRegex from "~icons/mdi/regex";
-import MdiArrowUp from "~icons/mdi/arrow-up";
-import MdiArrowDown from "~icons/mdi/arrow-down";
-import MdiClose from "~icons/mdi/close";
-import LucideReplace from "~icons/lucide/replace";
-import LucideReplaceAll from "~icons/lucide/replace-all";
-import { i18n } from "@/locales";
+import type { SearchAndReplacePluginState } from "./SearchAndReplacePlugin";
 
 const props = defineProps({
   editor: {
diff --git a/ui/packages/editor/src/extensions/search-and-replace/index.ts b/ui/packages/editor/src/extensions/search-and-replace/index.ts
index 5717a57a2..3d9dca717 100644
--- a/ui/packages/editor/src/extensions/search-and-replace/index.ts
+++ b/ui/packages/editor/src/extensions/search-and-replace/index.ts
@@ -1,15 +1,15 @@
+import { ToolbarItem } from "@/components";
+import { i18n } from "@/locales";
+import { EditorState } from "@/tiptap/pm";
 import { Editor, Extension } from "@/tiptap/vue-3";
+import type { ExtensionOptions } from "@/types";
+import { h, markRaw, render } from "vue";
+import MdiTextBoxSearchOutline from "~icons/mdi/text-box-search-outline";
+import SearchAndReplaceVue from "./SearchAndReplace.vue";
 import {
   SearchAndReplacePlugin,
   searchAndReplacePluginKey,
 } from "./SearchAndReplacePlugin";
-import SearchAndReplaceVue from "./SearchAndReplace.vue";
-import { h, markRaw, render } from "vue";
-import { EditorState } from "@/tiptap/pm";
-import type { ExtensionOptions } from "@/types";
-import { i18n } from "@/locales";
-import { ToolbarItem } from "@/components";
-import MdiTextBoxSearchOutline from "~icons/mdi/text-box-search-outline";
 
 declare module "@/tiptap" {
   interface Commands<ReturnType> {
diff --git a/ui/packages/editor/src/extensions/strike/index.ts b/ui/packages/editor/src/extensions/strike/index.ts
index 9f1b1f4d2..1606ed846 100644
--- a/ui/packages/editor/src/extensions/strike/index.ts
+++ b/ui/packages/editor/src/extensions/strike/index.ts
@@ -1,11 +1,11 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapStrike from "@tiptap/extension-strike";
-import type { StrikeOptions } from "@tiptap/extension-strike";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatStrikethrough from "~icons/mdi/format-strikethrough";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { StrikeOptions } from "@tiptap/extension-strike";
+import TiptapStrike from "@tiptap/extension-strike";
+import { markRaw } from "vue";
+import MdiFormatStrikethrough from "~icons/mdi/format-strikethrough";
 
 const Strike = TiptapStrike.extend<ExtensionOptions & StrikeOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/subscript/index.ts b/ui/packages/editor/src/extensions/subscript/index.ts
index df9ed5466..f14e31d13 100644
--- a/ui/packages/editor/src/extensions/subscript/index.ts
+++ b/ui/packages/editor/src/extensions/subscript/index.ts
@@ -1,11 +1,11 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapSubscript from "@tiptap/extension-subscript";
-import type { SubscriptExtensionOptions } from "@tiptap/extension-subscript";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatSubscript from "~icons/mdi/format-subscript";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { SubscriptExtensionOptions } from "@tiptap/extension-subscript";
+import TiptapSubscript from "@tiptap/extension-subscript";
+import { markRaw } from "vue";
+import MdiFormatSubscript from "~icons/mdi/format-subscript";
 
 const Subscript = TiptapSubscript.extend<
   ExtensionOptions & SubscriptExtensionOptions
diff --git a/ui/packages/editor/src/extensions/superscript/index.ts b/ui/packages/editor/src/extensions/superscript/index.ts
index 48a3ac5c2..a1ca48b7b 100644
--- a/ui/packages/editor/src/extensions/superscript/index.ts
+++ b/ui/packages/editor/src/extensions/superscript/index.ts
@@ -1,11 +1,11 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapSuperscript from "@tiptap/extension-superscript";
-import type { SuperscriptExtensionOptions } from "@tiptap/extension-superscript";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatSuperscript from "~icons/mdi/format-superscript";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { SuperscriptExtensionOptions } from "@tiptap/extension-superscript";
+import TiptapSuperscript from "@tiptap/extension-superscript";
+import { markRaw } from "vue";
+import MdiFormatSuperscript from "~icons/mdi/format-superscript";
 
 const Superscript = TiptapSuperscript.extend<
   ExtensionOptions & SuperscriptExtensionOptions
diff --git a/ui/packages/editor/src/extensions/table/index.ts b/ui/packages/editor/src/extensions/table/index.ts
index a904fae5f..68b981ba1 100644
--- a/ui/packages/editor/src/extensions/table/index.ts
+++ b/ui/packages/editor/src/extensions/table/index.ts
@@ -1,43 +1,43 @@
-import TiptapTable, {
-  type TableOptions,
-  createColGroup,
-} from "@tiptap/extension-table";
+import { BlockActionSeparator, ToolboxItem } from "@/components";
+import { i18n } from "@/locales";
 import {
-  isActive,
-  type Editor,
-  type Range,
-  mergeAttributes,
-  isNodeActive,
   CoreEditor,
   findParentNode,
+  isActive,
+  isNodeActive,
+  mergeAttributes,
+  type Editor,
+  type Range,
 } from "@/tiptap";
 import {
-  type Node as ProseMirrorNode,
-  type NodeView,
-  type EditorState,
-  type DOMOutputSpec,
   TextSelection,
+  type DOMOutputSpec,
+  type EditorState,
+  type NodeView,
+  type Node as ProseMirrorNode,
 } from "@/tiptap/pm";
-import TableCell from "./table-cell";
-import TableRow from "./table-row";
-import TableHeader from "./table-header";
+import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
+import TiptapTable, {
+  createColGroup,
+  type TableOptions,
+} from "@tiptap/extension-table";
+import { markRaw } from "vue";
+import FluentTableColumnTopBottom24Regular from "~icons/fluent/table-column-top-bottom-24-regular";
 import MdiTable from "~icons/mdi/table";
-import MdiTablePlus from "~icons/mdi/table-plus";
-import MdiTableColumnPlusBefore from "~icons/mdi/table-column-plus-before";
 import MdiTableColumnPlusAfter from "~icons/mdi/table-column-plus-after";
-import MdiTableRowPlusAfter from "~icons/mdi/table-row-plus-after";
-import MdiTableRowPlusBefore from "~icons/mdi/table-row-plus-before";
+import MdiTableColumnPlusBefore from "~icons/mdi/table-column-plus-before";
 import MdiTableColumnRemove from "~icons/mdi/table-column-remove";
-import MdiTableRowRemove from "~icons/mdi/table-row-remove";
-import MdiTableRemove from "~icons/mdi/table-remove";
 import MdiTableHeadersEye from "~icons/mdi/table-headers-eye";
 import MdiTableMergeCells from "~icons/mdi/table-merge-cells";
+import MdiTablePlus from "~icons/mdi/table-plus";
+import MdiTableRemove from "~icons/mdi/table-remove";
+import MdiTableRowPlusAfter from "~icons/mdi/table-row-plus-after";
+import MdiTableRowPlusBefore from "~icons/mdi/table-row-plus-before";
+import MdiTableRowRemove from "~icons/mdi/table-row-remove";
 import MdiTableSplitCell from "~icons/mdi/table-split-cell";
-import FluentTableColumnTopBottom24Regular from "~icons/fluent/table-column-top-bottom-24-regular";
-import { markRaw } from "vue";
-import { i18n } from "@/locales";
-import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
-import { BlockActionSeparator, ToolboxItem } from "@/components";
+import TableCell from "./table-cell";
+import TableHeader from "./table-header";
+import TableRow from "./table-row";
 import {
   findNextCell,
   findPreviousCell,
diff --git a/ui/packages/editor/src/extensions/table/table-cell.ts b/ui/packages/editor/src/extensions/table/table-cell.ts
index 0849c9d88..f44553a67 100644
--- a/ui/packages/editor/src/extensions/table/table-cell.ts
+++ b/ui/packages/editor/src/extensions/table/table-cell.ts
@@ -1,11 +1,15 @@
-import { mergeAttributes, Node } from "@/tiptap/vue-3";
+import { i18n } from "@/locales";
 import {
-  Plugin,
-  PluginKey,
+  addRowAfter,
   Decoration,
   DecorationSet,
-  addRowAfter,
+  Plugin,
+  PluginKey,
 } from "@/tiptap/pm";
+import { mergeAttributes, Node } from "@/tiptap/vue-3";
+import { Tooltip } from "floating-vue";
+import { h, render } from "vue";
+import MdiPlus from "~icons/mdi/plus";
 import {
   getCellsInColumn,
   isRowSelected,
@@ -13,11 +17,6 @@ import {
   selectRow,
   selectTable,
 } from "./util";
-import { Tooltip } from "floating-vue";
-import { h } from "vue";
-import MdiPlus from "~icons/mdi/plus";
-import { render } from "vue";
-import { i18n } from "@/locales";
 
 export interface TableCellOptions {
   HTMLAttributes: Record<string, any>;
diff --git a/ui/packages/editor/src/extensions/table/table-header.ts b/ui/packages/editor/src/extensions/table/table-header.ts
index bcc0e3d5a..65ccb9477 100644
--- a/ui/packages/editor/src/extensions/table/table-header.ts
+++ b/ui/packages/editor/src/extensions/table/table-header.ts
@@ -1,17 +1,16 @@
-import { mergeAttributes, Node } from "@/tiptap/vue-3";
+import { i18n } from "@/locales";
 import {
-  Plugin,
-  PluginKey,
+  addColumnAfter,
   Decoration,
   DecorationSet,
-  addColumnAfter,
+  Plugin,
+  PluginKey,
 } from "@/tiptap/pm";
-import { getCellsInRow, isColumnSelected, selectColumn } from "./util";
-import { render } from "vue";
+import { mergeAttributes, Node } from "@/tiptap/vue-3";
 import { Tooltip } from "floating-vue";
-import { h } from "vue";
+import { h, render } from "vue";
 import MdiPlus from "~icons/mdi/plus";
-import { i18n } from "@/locales";
+import { getCellsInRow, isColumnSelected, selectColumn } from "./util";
 
 export interface TableCellOptions {
   HTMLAttributes: Record<string, any>;
diff --git a/ui/packages/editor/src/extensions/table/util.ts b/ui/packages/editor/src/extensions/table/util.ts
index ef9252df1..4cabe2b07 100644
--- a/ui/packages/editor/src/extensions/table/util.ts
+++ b/ui/packages/editor/src/extensions/table/util.ts
@@ -1,6 +1,6 @@
-import { findParentNode } from "@/tiptap/vue-3";
-import { Node, CellSelection, TableMap, selectedRect } from "@/tiptap/pm";
 import type { EditorState, Rect, Selection, Transaction } from "@/tiptap/pm";
+import { CellSelection, Node, TableMap, selectedRect } from "@/tiptap/pm";
+import { findParentNode } from "@/tiptap/vue-3";
 
 export const selectTable = (tr: Transaction) => {
   const table = findTable(tr.selection);
diff --git a/ui/packages/editor/src/extensions/task-list/index.ts b/ui/packages/editor/src/extensions/task-list/index.ts
index 04b8b3e73..81b22d09a 100644
--- a/ui/packages/editor/src/extensions/task-list/index.ts
+++ b/ui/packages/editor/src/extensions/task-list/index.ts
@@ -1,12 +1,12 @@
-import type { Editor, Range } from "@/tiptap/vue-3";
-import TiptapTaskList from "@tiptap/extension-task-list";
-import type { TaskListOptions } from "@tiptap/extension-task-list";
-import ExtensionTaskItem from "@tiptap/extension-task-item";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatListCheckbox from "~icons/mdi/format-list-checkbox";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor, Range } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import ExtensionTaskItem from "@tiptap/extension-task-item";
+import type { TaskListOptions } from "@tiptap/extension-task-list";
+import TiptapTaskList from "@tiptap/extension-task-list";
+import { markRaw } from "vue";
+import MdiFormatListCheckbox from "~icons/mdi/format-list-checkbox";
 
 const TaskList = TiptapTaskList.extend<ExtensionOptions & TaskListOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/text-align/index.ts b/ui/packages/editor/src/extensions/text-align/index.ts
index 94eea7e34..e01ad1f3d 100644
--- a/ui/packages/editor/src/extensions/text-align/index.ts
+++ b/ui/packages/editor/src/extensions/text-align/index.ts
@@ -1,15 +1,15 @@
-import { type Editor } from "@/tiptap/vue-3";
-import TiptapTextAlign from "@tiptap/extension-text-align";
-import type { TextAlignOptions } from "@tiptap/extension-text-align";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatAlignLeft from "~icons/mdi/format-align-left";
-import MdiFormatAlignCenter from "~icons/mdi/format-align-center";
-import MdiFormatAlignRight from "~icons/mdi/format-align-right";
-import MdiFormatAlignJustify from "~icons/mdi/format-align-justify";
-import { markRaw } from "vue";
-import { i18n } from "@/locales";
-import type { ExtensionOptions } from "@/types";
 import ToolbarSubItem from "@/components/toolbar/ToolbarSubItem.vue";
+import { i18n } from "@/locales";
+import { type Editor } from "@/tiptap/vue-3";
+import type { ExtensionOptions } from "@/types";
+import type { TextAlignOptions } from "@tiptap/extension-text-align";
+import TiptapTextAlign from "@tiptap/extension-text-align";
+import { markRaw } from "vue";
+import MdiFormatAlignCenter from "~icons/mdi/format-align-center";
+import MdiFormatAlignJustify from "~icons/mdi/format-align-justify";
+import MdiFormatAlignLeft from "~icons/mdi/format-align-left";
+import MdiFormatAlignRight from "~icons/mdi/format-align-right";
 
 const iconComponent = {
   left: MdiFormatAlignLeft,
diff --git a/ui/packages/editor/src/extensions/text/index.ts b/ui/packages/editor/src/extensions/text/index.ts
index a1a895392..b3d0a3889 100644
--- a/ui/packages/editor/src/extensions/text/index.ts
+++ b/ui/packages/editor/src/extensions/text/index.ts
@@ -1,23 +1,23 @@
-import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
-import { Text as TiptapText } from "@tiptap/extension-text";
-import { markRaw } from "vue";
 import ColorBubbleItem from "@/extensions/color/ColorBubbleItem.vue";
 import HighlightBubbleItem from "@/extensions/highlight/HighlightBubbleItem.vue";
 import LinkBubbleButton from "@/extensions/link/LinkBubbleButton.vue";
+import { i18n } from "@/locales";
+import type { EditorState } from "@/tiptap/pm";
+import { isActive, isTextSelection } from "@/tiptap/vue-3";
+import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
+import { Text as TiptapText } from "@tiptap/extension-text";
+import { markRaw } from "vue";
 import MdiCodeTags from "~icons/mdi/code-tags";
+import MdiFormatBold from "~icons/mdi/format-bold";
 import MdiFormatColor from "~icons/mdi/format-color";
 import MdiFormatColorHighlight from "~icons/mdi/format-color-highlight";
 import MdiFormatItalic from "~icons/mdi/format-italic";
-import MdiLinkVariantOff from "~icons/mdi/link-variant-off";
-import MdiShare from "~icons/mdi/share";
 import MdiFormatStrikethrough from "~icons/mdi/format-strikethrough";
 import MdiFormatSubscript from "~icons/mdi/format-subscript";
 import MdiFormatSuperscript from "~icons/mdi/format-superscript";
 import MdiFormatUnderline from "~icons/mdi/format-underline";
-import { isActive, isTextSelection } from "@/tiptap/vue-3";
-import type { EditorState } from "@/tiptap/pm";
-import MdiFormatBold from "~icons/mdi/format-bold";
-import { i18n } from "@/locales";
+import MdiLinkVariantOff from "~icons/mdi/link-variant-off";
+import MdiShare from "~icons/mdi/share";
 
 const OTHER_BUBBLE_MENU_TYPES = [
   "audio",
diff --git a/ui/packages/editor/src/extensions/trailing-node/index.ts b/ui/packages/editor/src/extensions/trailing-node/index.ts
index e1da7e050..da2ec5c2e 100644
--- a/ui/packages/editor/src/extensions/trailing-node/index.ts
+++ b/ui/packages/editor/src/extensions/trailing-node/index.ts
@@ -1,5 +1,5 @@
-import { Extension } from "@/tiptap/vue-3";
 import { Plugin, PluginKey } from "@/tiptap/pm";
+import { Extension } from "@/tiptap/vue-3";
 
 /**
  * @param {object} args Arguments as deconstructable object
diff --git a/ui/packages/editor/src/extensions/underline/index.ts b/ui/packages/editor/src/extensions/underline/index.ts
index 3c9bddfbd..d32566526 100644
--- a/ui/packages/editor/src/extensions/underline/index.ts
+++ b/ui/packages/editor/src/extensions/underline/index.ts
@@ -1,11 +1,11 @@
-import type { Editor } from "@/tiptap/vue-3";
-import TiptapUnderline from "@tiptap/extension-underline";
-import type { UnderlineOptions } from "@tiptap/extension-underline";
 import ToolbarItem from "@/components/toolbar/ToolbarItem.vue";
-import MdiFormatUnderline from "~icons/mdi/format-underline";
-import { markRaw } from "vue";
 import { i18n } from "@/locales";
+import type { Editor } from "@/tiptap/vue-3";
 import type { ExtensionOptions } from "@/types";
+import type { UnderlineOptions } from "@tiptap/extension-underline";
+import TiptapUnderline from "@tiptap/extension-underline";
+import { markRaw } from "vue";
+import MdiFormatUnderline from "~icons/mdi/format-underline";
 
 const Underline = TiptapUnderline.extend<ExtensionOptions & UnderlineOptions>({
   addOptions() {
diff --git a/ui/packages/editor/src/extensions/video/BubbleItemVideoSize.vue b/ui/packages/editor/src/extensions/video/BubbleItemVideoSize.vue
index 3c71e5873..ce122ddcb 100644
--- a/ui/packages/editor/src/extensions/video/BubbleItemVideoSize.vue
+++ b/ui/packages/editor/src/extensions/video/BubbleItemVideoSize.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
 import { BlockActionInput } from "@/components";
+import { i18n } from "@/locales";
 import type { Editor } from "@/tiptap/vue-3";
 import { computed, type Component } from "vue";
 import Video from "./index";
-import { i18n } from "@/locales";
 const props = defineProps<{
   editor: Editor;
   isActive?: ({ editor }: { editor: Editor }) => boolean;
diff --git a/ui/packages/editor/src/extensions/video/VideoView.vue b/ui/packages/editor/src/extensions/video/VideoView.vue
index e19d91600..443b3d07a 100644
--- a/ui/packages/editor/src/extensions/video/VideoView.vue
+++ b/ui/packages/editor/src/extensions/video/VideoView.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import type { Node as ProseMirrorNode, Decoration } from "@/tiptap/pm";
+import { i18n } from "@/locales";
+import type { Decoration, Node as ProseMirrorNode } from "@/tiptap/pm";
 import type { Editor, Node } from "@/tiptap/vue-3";
 import { NodeViewWrapper } from "@/tiptap/vue-3";
 import { computed, onMounted, ref } from "vue";
-import { i18n } from "@/locales";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/packages/editor/src/extensions/video/index.ts b/ui/packages/editor/src/extensions/video/index.ts
index df661cec6..4b4867de5 100644
--- a/ui/packages/editor/src/extensions/video/index.ts
+++ b/ui/packages/editor/src/extensions/video/index.ts
@@ -1,39 +1,39 @@
-import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
-import {
-  Editor,
-  isActive,
-  mergeAttributes,
-  Node,
-  nodeInputRule,
-  type Range,
-  VueNodeViewRenderer,
-} from "@/tiptap/vue-3";
-import type { EditorState } from "@/tiptap/pm";
-import { markRaw } from "vue";
-import VideoView from "./VideoView.vue";
-import MdiVideo from "~icons/mdi/video";
+import { BlockActionSeparator } from "@/components";
+import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
 import ToolboxItem from "@/components/toolbox/ToolboxItem.vue";
 import { i18n } from "@/locales";
-import { BlockActionSeparator } from "@/components";
-import BubbleItemVideoSize from "./BubbleItemVideoSize.vue";
-import BubbleItemVideoLink from "./BubbleItemVideoLink.vue";
-import MdiImageSizeSelectActual from "~icons/mdi/image-size-select-actual";
-import MdiImageSizeSelectSmall from "~icons/mdi/image-size-select-small";
-import MdiImageSizeSelectLarge from "~icons/mdi/image-size-select-large";
-import MdiFormatAlignLeft from "~icons/mdi/format-align-left";
-import MdiFormatAlignCenter from "~icons/mdi/format-align-center";
-import MdiFormatAlignRight from "~icons/mdi/format-align-right";
-import MdiFormatAlignJustify from "~icons/mdi/format-align-justify";
+import type { EditorState } from "@/tiptap/pm";
+import {
+  Editor,
+  Node,
+  VueNodeViewRenderer,
+  isActive,
+  mergeAttributes,
+  nodeInputRule,
+  type Range,
+} from "@/tiptap/vue-3";
+import type { ExtensionOptions, NodeBubbleMenu } from "@/types";
+import { deleteNode } from "@/utils";
+import { markRaw } from "vue";
 import MdiCogPlay from "~icons/mdi/cog-play";
 import MdiCogPlayOutline from "~icons/mdi/cog-play-outline";
+import MdiFormatAlignCenter from "~icons/mdi/format-align-center";
+import MdiFormatAlignJustify from "~icons/mdi/format-align-justify";
+import MdiFormatAlignLeft from "~icons/mdi/format-align-left";
+import MdiFormatAlignRight from "~icons/mdi/format-align-right";
+import MdiImageSizeSelectActual from "~icons/mdi/image-size-select-actual";
+import MdiImageSizeSelectLarge from "~icons/mdi/image-size-select-large";
+import MdiImageSizeSelectSmall from "~icons/mdi/image-size-select-small";
+import MdiLinkVariant from "~icons/mdi/link-variant";
+import MdiMotionPlay from "~icons/mdi/motion-play";
+import MdiMotionPlayOutline from "~icons/mdi/motion-play-outline";
 import MdiPlayCircle from "~icons/mdi/play-circle";
 import MdiPlayCircleOutline from "~icons/mdi/play-circle-outline";
-import MdiMotionPlayOutline from "~icons/mdi/motion-play-outline";
-import MdiMotionPlay from "~icons/mdi/motion-play";
-import MdiLinkVariant from "~icons/mdi/link-variant";
 import MdiShare from "~icons/mdi/share";
-import { deleteNode } from "@/utils";
-import MdiDeleteForeverOutline from "@/components/icon/MdiDeleteForeverOutline.vue";
+import MdiVideo from "~icons/mdi/video";
+import BubbleItemVideoLink from "./BubbleItemVideoLink.vue";
+import BubbleItemVideoSize from "./BubbleItemVideoSize.vue";
+import VideoView from "./VideoView.vue";
 declare module "@/tiptap" {
   interface Commands<ReturnType> {
     video: {
diff --git a/ui/packages/editor/src/index.ts b/ui/packages/editor/src/index.ts
index 965540617..444579db3 100644
--- a/ui/packages/editor/src/index.ts
+++ b/ui/packages/editor/src/index.ts
@@ -1,10 +1,10 @@
+import "floating-vue/dist/style.css";
+import "github-markdown-css/github-markdown-light.css";
+import "highlight.js/styles/github.css";
 import type { App, Plugin } from "vue";
 import { RichTextEditor } from "./components";
 import "./styles/index.scss";
 import "./styles/tailwind.css";
-import "floating-vue/dist/style.css";
-import "github-markdown-css/github-markdown-light.css";
-import "highlight.js/styles/github.css";
 
 const plugin: Plugin = {
   install(app: App) {
@@ -14,8 +14,8 @@ const plugin: Plugin = {
 
 export default plugin;
 
-export * from "./tiptap";
-export * from "./extensions";
 export * from "./components";
+export * from "./extensions";
+export * from "./tiptap";
 export * from "./utils";
 // TODO: export * from "./types";
diff --git a/ui/packages/editor/src/tiptap/index.ts b/ui/packages/editor/src/tiptap/index.ts
index 4341c0ef8..bf861ff40 100644
--- a/ui/packages/editor/src/tiptap/index.ts
+++ b/ui/packages/editor/src/tiptap/index.ts
@@ -1,25 +1,25 @@
-export * from "./vue-3";
 export * from "./core";
+export { Editor as CoreEditor } from "./core";
 export * from "./pm";
+export {
+  InputRule as PMInputRule,
+  Mark as PMMark,
+  Node as PMNode,
+  textblockTypeInputRule as pmTextblockTypeInputRule,
+  wrappingInputRule as pmWrappingInputRule,
+  type Command as PMCommand,
+  type NodeRange as PMNodeRange,
+  type NodeView as PMNodeView,
+} from "./pm";
+export * from "./vue-3";
 export {
   Editor,
-  type Command,
   InputRule,
   Mark,
-  type NodeRange,
   Node,
   NodeView,
   textblockTypeInputRule,
   wrappingInputRule,
+  type Command,
+  type NodeRange,
 } from "./vue-3";
-export { Editor as CoreEditor } from "./core";
-export {
-  type Command as PMCommand,
-  InputRule as PMInputRule,
-  Mark as PMMark,
-  type NodeRange as PMNodeRange,
-  Node as PMNode,
-  type NodeView as PMNodeView,
-  textblockTypeInputRule as pmTextblockTypeInputRule,
-  wrappingInputRule as pmWrappingInputRule,
-} from "./pm";
diff --git a/ui/packages/editor/src/tiptap/pm/index.ts b/ui/packages/editor/src/tiptap/pm/index.ts
index 3d6507beb..e703045c6 100644
--- a/ui/packages/editor/src/tiptap/pm/index.ts
+++ b/ui/packages/editor/src/tiptap/pm/index.ts
@@ -6,12 +6,12 @@ export * from "@tiptap/pm/gapcursor";
 export * from "@tiptap/pm/history";
 export * from "@tiptap/pm/inputrules";
 export * from "@tiptap/pm/keymap";
-export * from "@tiptap/pm/menu";
-export * from "@tiptap/pm/model";
 export * from "@tiptap/pm/markdown";
 export { schema as markDownSchema } from "@tiptap/pm/markdown";
-export { schema } from "@tiptap/pm/schema-basic";
+export * from "@tiptap/pm/menu";
+export * from "@tiptap/pm/model";
 export * from "@tiptap/pm/schema-basic";
+export { schema } from "@tiptap/pm/schema-basic";
 export * from "@tiptap/pm/schema-list";
 export * from "@tiptap/pm/state";
 export * from "@tiptap/pm/tables";
diff --git a/ui/packages/editor/src/types/index.ts b/ui/packages/editor/src/types/index.ts
index 2c6c1c8d7..ec55f7f06 100644
--- a/ui/packages/editor/src/types/index.ts
+++ b/ui/packages/editor/src/types/index.ts
@@ -1,12 +1,12 @@
-import type { Editor, Range } from "@/tiptap/vue-3";
 import type {
-  Node,
-  ResolvedPos,
-  Slice,
   EditorState,
   EditorView,
+  Node,
+  ResolvedPos,
   Selection,
+  Slice,
 } from "@/tiptap/pm";
+import type { Editor, Range } from "@/tiptap/vue-3";
 import type { Component } from "vue";
 export interface ToolbarItem {
   priority: number;
diff --git a/ui/packages/editor/src/utils/index.ts b/ui/packages/editor/src/utils/index.ts
index 531a9ab32..47005e971 100644
--- a/ui/packages/editor/src/utils/index.ts
+++ b/ui/packages/editor/src/utils/index.ts
@@ -1,2 +1,2 @@
-export * from "./delete-node";
 export * from "./anchor";
+export * from "./delete-node";
diff --git a/ui/packages/editor/vite.config.ts b/ui/packages/editor/vite.config.ts
index 3297e478f..d3378549d 100644
--- a/ui/packages/editor/vite.config.ts
+++ b/ui/packages/editor/vite.config.ts
@@ -1,10 +1,10 @@
 import { fileURLToPath, URL } from "node:url";
 
-import { defineConfig } from "vite";
-import Vue from "@vitejs/plugin-vue";
-import Icons from "unplugin-icons/vite";
-import path from "node:path";
 import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite";
+import Vue from "@vitejs/plugin-vue";
+import path from "node:path";
+import Icons from "unplugin-icons/vite";
+import { defineConfig } from "vite";
 
 export default defineConfig({
   plugins: [
diff --git a/ui/packages/shared/src/index.ts b/ui/packages/shared/src/index.ts
index 5462c9e1a..5b483ac05 100644
--- a/ui/packages/shared/src/index.ts
+++ b/ui/packages/shared/src/index.ts
@@ -1,14 +1,14 @@
-export * from "./types/plugin";
-export * from "./types/menus";
 export * from "./core/plugins";
-export * from "./states/pages";
 export * from "./states/attachment-selector";
-export * from "./states/editor";
-export * from "./states/plugin-tab";
-export * from "./states/comment-subject-ref";
 export * from "./states/backup";
-export * from "./states/plugin-installation-tabs";
+export * from "./states/comment-subject-ref";
+export * from "./states/editor";
 export * from "./states/entity";
-export * from "./states/theme-list-tabs";
 export * from "./states/operation";
+export * from "./states/pages";
+export * from "./states/plugin-installation-tabs";
+export * from "./states/plugin-tab";
+export * from "./states/theme-list-tabs";
 export * from "./states/user-tab";
+export * from "./types/menus";
+export * from "./types/plugin";
diff --git a/ui/src/assets/logo.svg b/ui/src/assets/logo.svg
index 6ecadc235..b1106fae1 100644
--- a/ui/src/assets/logo.svg
+++ b/ui/src/assets/logo.svg
@@ -1 +1 @@
-<svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 2144 877" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientTransform="matrix(0 -848.921 848.921 0 1308.8 875.397)" gradientUnits="userSpaceOnUse" x1="0" x2="1" y1="0" y2="0"><stop offset="0" stop-color="#0050b5"/><stop offset="1" stop-color="#0b87fd"/></linearGradient><linearGradient id="b" gradientTransform="matrix(0 472.459 -473.895 0 587.619 -.861651)" gradientUnits="userSpaceOnUse" x1="0" x2="1" y1="0" y2="0"><stop offset="0" stop-color="#0048af"/><stop offset="1" stop-color="#003580"/></linearGradient><linearGradient id="c" gradientTransform="matrix(0 898.506 -901.236 0 162.421 -12.1337)" gradientUnits="userSpaceOnUse" x1="0" x2="1" y1="0" y2="0"><stop offset="0" stop-color="#0b89ff"/><stop offset="1" stop-color="#004eb2"/></linearGradient><g fill="url(#a)"><path d="m1028.16 339.331c148.249 0 268.609 120.36 268.609 268.609s-120.36 268.608-268.609 268.608-268.608-120.359-268.608-268.608 120.359-268.609 268.608-268.609zm0 119.152c82.488 0 149.457 66.969 149.457 149.457 0 82.487-66.969 149.456-149.457 149.456-82.487 0-149.456-66.969-149.456-149.456 0-82.488 66.969-149.457 149.456-149.457z"/><path d="m1874.58 339.331c148.249 0 268.608 120.36 268.608 268.609s-120.359 268.608-268.608 268.608-268.609-120.359-268.609-268.608 120.36-268.609 268.609-268.609zm0 119.152c82.487 0 149.456 66.969 149.456 149.457 0 82.487-66.969 149.456-149.456 149.456-82.488 0-149.457-66.969-149.457-149.456 0-82.488 66.969-149.457 149.457-149.457z"/><path d="m1309.27 377.585c0-10.083-7.222-18.719-17.146-20.504-19.618-3.528-51.9-9.334-74.172-13.34-6.073-1.092-12.318.564-17.052 4.522-4.734 3.959-7.469 9.812-7.469 15.983v491.469c0 5.525 2.195 10.824 6.102 14.731s9.206 6.102 14.731 6.102h74.173c5.525 0 10.824-2.195 14.731-6.102s6.102-9.206 6.102-14.731c0-84.425 0-400.286 0-478.13z"/><path d="m1542.59 72.033c0-8.288-3.292-16.237-9.153-22.097-5.86-5.861-13.809-9.153-22.097-9.153-23.867 0-56.609 0-80.477 0-8.288 0-16.236 3.292-22.097 9.153-5.86 5.86-9.153 13.809-9.153 22.097v773.265c0 8.288 3.293 16.237 9.153 22.097 5.861 5.861 13.809 9.153 22.097 9.153h80.477c8.288 0 16.237-3.292 22.097-9.153 5.861-5.86 9.153-13.809 9.153-22.097 0-131.79 0-641.475 0-773.265z" fill-rule="nonzero"/></g><path d="m506.409 822.063c0 13.815 5.494 27.062 15.271 36.821 9.777 9.76 23.034 15.23 36.848 15.206 18.674-.034 39.711-.072 58.369-.105 28.696-.052 51.932-23.329 51.932-52.026v-769.586c0-13.798-5.481-27.031-15.238-36.788-9.756-9.757-22.99-15.238-36.788-15.238h-58.368c-13.798 0-27.031 5.481-36.788 15.238s-15.238 22.99-15.238 36.788z" fill="url(#b)" fill-rule="nonzero"/><path d="m616.746 322.662c13.813 0 27.061 5.487 36.829 15.255 9.767 9.768 15.254 23.015 15.254 36.829v447.062c0 13.814-5.487 27.061-15.254 36.829-9.768 9.767-23.016 15.255-36.829 15.255-18.632 0-39.622 0-58.254 0-13.813 0-27.061-5.488-36.828-15.255-9.768-9.768-15.255-23.015-15.255-36.829 0-68.223 0-187.159 0-255.383 0-13.813-5.487-27.061-15.255-36.828-9.767-9.768-23.015-15.255-36.828-15.255-129.249 0-454.326 0-454.326 0v-191.68z" fill="#0051b0" fill-rule="nonzero"/><path d="m0 822.101c0 13.817 5.497 27.067 15.277 36.827 9.781 9.76 23.043 15.229 36.86 15.199 18.675-.04 39.713-.085 58.368-.124 28.69-.062 51.916-23.337 51.916-52.027 0-155.205 0-614.509 0-769.714 0-28.69-23.226-51.965-51.916-52.026-18.655-.04-39.693-.085-58.368-.125-13.817-.029-27.079 5.439-36.86 15.199-9.78 9.76-15.277 23.01-15.277 36.827v769.964z" fill="url(#c)" fill-rule="nonzero"/></svg>
\ No newline at end of file
+<svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 2144 877" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientTransform="matrix(0 -848.921 848.921 0 1308.8 875.397)" gradientUnits="userSpaceOnUse" x1="0" x2="1" y1="0" y2="0"><stop offset="0" stop-color="#0050b5"/><stop offset="1" stop-color="#0b87fd"/></linearGradient><linearGradient id="b" gradientTransform="matrix(0 472.459 -473.895 0 587.619 -.861651)" gradientUnits="userSpaceOnUse" x1="0" x2="1" y1="0" y2="0"><stop offset="0" stop-color="#0048af"/><stop offset="1" stop-color="#003580"/></linearGradient><linearGradient id="c" gradientTransform="matrix(0 898.506 -901.236 0 162.421 -12.1337)" gradientUnits="userSpaceOnUse" x1="0" x2="1" y1="0" y2="0"><stop offset="0" stop-color="#0b89ff"/><stop offset="1" stop-color="#004eb2"/></linearGradient><g fill="url(#a)"><path d="m1028.16 339.331c148.249 0 268.609 120.36 268.609 268.609s-120.36 268.608-268.609 268.608-268.608-120.359-268.608-268.608 120.359-268.609 268.608-268.609zm0 119.152c82.488 0 149.457 66.969 149.457 149.457 0 82.487-66.969 149.456-149.457 149.456-82.487 0-149.456-66.969-149.456-149.456 0-82.488 66.969-149.457 149.456-149.457z"/><path d="m1874.58 339.331c148.249 0 268.608 120.36 268.608 268.609s-120.359 268.608-268.608 268.608-268.609-120.359-268.609-268.608 120.36-268.609 268.609-268.609zm0 119.152c82.487 0 149.456 66.969 149.456 149.457 0 82.487-66.969 149.456-149.456 149.456-82.488 0-149.457-66.969-149.457-149.456 0-82.488 66.969-149.457 149.457-149.457z"/><path d="m1309.27 377.585c0-10.083-7.222-18.719-17.146-20.504-19.618-3.528-51.9-9.334-74.172-13.34-6.073-1.092-12.318.564-17.052 4.522-4.734 3.959-7.469 9.812-7.469 15.983v491.469c0 5.525 2.195 10.824 6.102 14.731s9.206 6.102 14.731 6.102h74.173c5.525 0 10.824-2.195 14.731-6.102s6.102-9.206 6.102-14.731c0-84.425 0-400.286 0-478.13z"/><path d="m1542.59 72.033c0-8.288-3.292-16.237-9.153-22.097-5.86-5.861-13.809-9.153-22.097-9.153-23.867 0-56.609 0-80.477 0-8.288 0-16.236 3.292-22.097 9.153-5.86 5.86-9.153 13.809-9.153 22.097v773.265c0 8.288 3.293 16.237 9.153 22.097 5.861 5.861 13.809 9.153 22.097 9.153h80.477c8.288 0 16.237-3.292 22.097-9.153 5.861-5.86 9.153-13.809 9.153-22.097 0-131.79 0-641.475 0-773.265z" fill-rule="nonzero"/></g><path d="m506.409 822.063c0 13.815 5.494 27.062 15.271 36.821 9.777 9.76 23.034 15.23 36.848 15.206 18.674-.034 39.711-.072 58.369-.105 28.696-.052 51.932-23.329 51.932-52.026v-769.586c0-13.798-5.481-27.031-15.238-36.788-9.756-9.757-22.99-15.238-36.788-15.238h-58.368c-13.798 0-27.031 5.481-36.788 15.238s-15.238 22.99-15.238 36.788z" fill="url(#b)" fill-rule="nonzero"/><path d="m616.746 322.662c13.813 0 27.061 5.487 36.829 15.255 9.767 9.768 15.254 23.015 15.254 36.829v447.062c0 13.814-5.487 27.061-15.254 36.829-9.768 9.767-23.016 15.255-36.829 15.255-18.632 0-39.622 0-58.254 0-13.813 0-27.061-5.488-36.828-15.255-9.768-9.768-15.255-23.015-15.255-36.829 0-68.223 0-187.159 0-255.383 0-13.813-5.487-27.061-15.255-36.828-9.767-9.768-23.015-15.255-36.828-15.255-129.249 0-454.326 0-454.326 0v-191.68z" fill="#0051b0" fill-rule="nonzero"/><path d="m0 822.101c0 13.817 5.497 27.067 15.277 36.827 9.781 9.76 23.043 15.229 36.86 15.199 18.675-.04 39.713-.085 58.368-.124 28.69-.062 51.916-23.337 51.916-52.027 0-155.205 0-614.509 0-769.714 0-28.69-23.226-51.965-51.916-52.026-18.655-.04-39.693-.085-58.368-.125-13.817-.029-27.079 5.439-36.86 15.199-9.78 9.76-15.277 23.01-15.277 36.827v769.964z" fill="url(#c)" fill-rule="nonzero"/></svg>
diff --git a/ui/src/components/base-app/BaseApp.vue b/ui/src/components/base-app/BaseApp.vue
index 28f7d7be0..edad2d161 100644
--- a/ui/src/components/base-app/BaseApp.vue
+++ b/ui/src/components/base-app/BaseApp.vue
@@ -1,16 +1,16 @@
 <script lang="ts" setup>
-import { RouterView } from "vue-router";
-import { computed, inject, onMounted, reactive } from "vue";
+import { useAppTitle } from "@/composables/use-title";
+import { i18n } from "@/locales";
+import { useGlobalInfoStore } from "@/stores/global-info";
+import type { FormKitConfig } from "@formkit/core";
 import { useFavicon } from "@vueuse/core";
 import {
   useOverlayScrollbars,
   type UseOverlayScrollbarsParams,
 } from "overlayscrollbars-vue";
-import type { FormKitConfig } from "@formkit/core";
-import { i18n } from "@/locales";
-import { useGlobalInfoStore } from "@/stores/global-info";
 import { storeToRefs } from "pinia";
-import { useAppTitle } from "@/composables/use-title";
+import { computed, inject, onMounted, reactive } from "vue";
+import { RouterView } from "vue-router";
 
 useAppTitle();
 
diff --git a/ui/src/components/codemirror/Codemirror.vue b/ui/src/components/codemirror/Codemirror.vue
index 6d132b65e..c675c667f 100644
--- a/ui/src/components/codemirror/Codemirror.vue
+++ b/ui/src/components/codemirror/Codemirror.vue
@@ -1,15 +1,15 @@
 <script lang="ts" setup>
-import { onBeforeUnmount, onMounted, shallowRef, watch } from "vue";
+import { css } from "@codemirror/lang-css";
+import { html } from "@codemirror/lang-html";
+import { javascript } from "@codemirror/lang-javascript";
+import { json } from "@codemirror/lang-json";
+import { LanguageSupport, StreamLanguage } from "@codemirror/language";
+import { yaml } from "@codemirror/legacy-modes/mode/yaml";
 import type { EditorStateConfig } from "@codemirror/state";
 import { EditorState } from "@codemirror/state";
 import { EditorView } from "@codemirror/view";
 import { basicSetup } from "codemirror";
-import { LanguageSupport, StreamLanguage } from "@codemirror/language";
-import { yaml } from "@codemirror/legacy-modes/mode/yaml";
-import { html } from "@codemirror/lang-html";
-import { javascript } from "@codemirror/lang-javascript";
-import { css } from "@codemirror/lang-css";
-import { json } from "@codemirror/lang-json";
+import { onBeforeUnmount, onMounted, shallowRef, watch } from "vue";
 
 const presetLanguages = {
   yaml: StreamLanguage.define(yaml),
diff --git a/ui/src/components/common/LocaleChange.vue b/ui/src/components/common/LocaleChange.vue
index e3cda199a..6aaed4044 100644
--- a/ui/src/components/common/LocaleChange.vue
+++ b/ui/src/components/common/LocaleChange.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
+import { getBrowserLanguage, i18n, locales } from "@/locales";
 import { useLocalStorage } from "@vueuse/core";
-import { locales, getBrowserLanguage, i18n } from "@/locales";
 import { watch } from "vue";
 import MdiTranslate from "~icons/mdi/translate";
 
diff --git a/ui/src/components/editor/DefaultEditor.vue b/ui/src/components/editor/DefaultEditor.vue
index 125e66e79..c71eda4ca 100644
--- a/ui/src/components/editor/DefaultEditor.vue
+++ b/ui/src/components/editor/DefaultEditor.vue
@@ -32,6 +32,7 @@ import {
   ExtensionNodeSelected,
   ExtensionOrderedList,
   ExtensionPlaceholder,
+  ExtensionRangeSelection,
   ExtensionSearchAndReplace,
   ExtensionStrike,
   ExtensionSubscript,
@@ -49,7 +50,6 @@ import {
   ToolboxItem,
   lowlight,
   type AnyExtension,
-  ExtensionRangeSelection,
 } from "@halo-dev/richtext-editor";
 // ui custom extension
 import { i18n } from "@/locales";
diff --git a/ui/src/components/editor/components/EditorLinkObtain.vue b/ui/src/components/editor/components/EditorLinkObtain.vue
index 085b9b4ea..adbb4ca0c 100644
--- a/ui/src/components/editor/components/EditorLinkObtain.vue
+++ b/ui/src/components/editor/components/EditorLinkObtain.vue
@@ -1,16 +1,15 @@
 <script setup lang="ts">
-import { VButton, VSpace, VDropdown } from "@halo-dev/components";
+import HasPermission from "@/components/permission/HasPermission.vue";
+import { i18n } from "@/locales";
+import type { Attachment } from "@halo-dev/api-client";
+import { VButton, VDropdown, VSpace } from "@halo-dev/components";
+import type { AttachmentLike } from "@halo-dev/console-shared";
 import type { CoreEditor } from "@halo-dev/richtext-editor";
 import { useFileDialog } from "@vueuse/core";
-import type { AttachmentLike } from "@halo-dev/console-shared";
-import { getAttachmentUrl, type AttachmentAttr } from "../utils/attachment";
-import { i18n } from "@/locales";
-import { onUnmounted, ref } from "vue";
-import { watch } from "vue";
-import { uploadFile } from "../utils/upload";
-import type { Attachment } from "@halo-dev/api-client";
 import type { AxiosRequestConfig } from "axios";
-import HasPermission from "@/components/permission/HasPermission.vue";
+import { onUnmounted, ref, watch } from "vue";
+import { getAttachmentUrl, type AttachmentAttr } from "../utils/attachment";
+import { uploadFile } from "../utils/upload";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/editor/extensions/audio/AudioView.vue b/ui/src/components/editor/extensions/audio/AudioView.vue
index 38d9111e5..fb5d8ac61 100644
--- a/ui/src/components/editor/extensions/audio/AudioView.vue
+++ b/ui/src/components/editor/extensions/audio/AudioView.vue
@@ -1,11 +1,11 @@
 <script lang="ts" setup>
+import { VButton } from "@halo-dev/components";
 import type { NodeViewProps } from "@halo-dev/richtext-editor";
 import { computed, ref } from "vue";
-import type { AttachmentAttr } from "../../utils/attachment";
 import RiFileMusicLine from "~icons/ri/file-music-line";
 import { EditorLinkObtain } from "../../components";
-import { VButton } from "@halo-dev/components";
 import InlineBlockBox from "../../components/InlineBlockBox.vue";
+import type { AttachmentAttr } from "../../utils/attachment";
 
 const props = defineProps<NodeViewProps>();
 
diff --git a/ui/src/components/editor/extensions/audio/index.ts b/ui/src/components/editor/extensions/audio/index.ts
index 539e610bc..0bb9a40d5 100644
--- a/ui/src/components/editor/extensions/audio/index.ts
+++ b/ui/src/components/editor/extensions/audio/index.ts
@@ -1,6 +1,6 @@
+import type { Attachment } from "@halo-dev/api-client";
 import { ExtensionAudio, VueNodeViewRenderer } from "@halo-dev/richtext-editor";
 import type { AxiosRequestConfig } from "axios";
-import type { Attachment } from "@halo-dev/api-client";
 import AudioView from "./AudioView.vue";
 
 interface UiAudioOptions {
diff --git a/ui/src/components/editor/extensions/image/ImageView.vue b/ui/src/components/editor/extensions/image/ImageView.vue
index ef53dd73f..6f548425c 100644
--- a/ui/src/components/editor/extensions/image/ImageView.vue
+++ b/ui/src/components/editor/extensions/image/ImageView.vue
@@ -1,17 +1,17 @@
 <script lang="ts" setup>
+import { IconImageAddLine, VButton } from "@halo-dev/components";
 import {
   Editor,
+  type Decoration,
   type Node,
   type PMNode,
-  type Decoration,
 } from "@halo-dev/richtext-editor";
 import { computed, onMounted, ref } from "vue";
-import Image from "./index";
-import { fileToBase64 } from "../../utils/upload";
-import { VButton, IconImageAddLine } from "@halo-dev/components";
-import { type AttachmentAttr } from "../../utils/attachment";
 import { EditorLinkObtain } from "../../components";
 import InlineBlockBox from "../../components/InlineBlockBox.vue";
+import { type AttachmentAttr } from "../../utils/attachment";
+import { fileToBase64 } from "../../utils/upload";
+import Image from "./index";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/src/components/editor/extensions/image/index.ts b/ui/src/components/editor/extensions/image/index.ts
index e109fcfde..81b10484d 100644
--- a/ui/src/components/editor/extensions/image/index.ts
+++ b/ui/src/components/editor/extensions/image/index.ts
@@ -1,7 +1,7 @@
-import { ExtensionImage, VueNodeViewRenderer } from "@halo-dev/richtext-editor";
-import ImageView from "./ImageView.vue";
-import type { AxiosRequestConfig } from "axios";
 import type { Attachment } from "@halo-dev/api-client";
+import { ExtensionImage, VueNodeViewRenderer } from "@halo-dev/richtext-editor";
+import type { AxiosRequestConfig } from "axios";
+import ImageView from "./ImageView.vue";
 
 export interface ImageOptions {
   inline: boolean;
diff --git a/ui/src/components/editor/extensions/index.ts b/ui/src/components/editor/extensions/index.ts
index 024d2f36e..4875d9dce 100644
--- a/ui/src/components/editor/extensions/index.ts
+++ b/ui/src/components/editor/extensions/index.ts
@@ -1,10 +1,10 @@
-import UiExtensionImage from "./image";
-import UiExtensionVideo from "./video";
-import UiExtensionUpload from "./upload";
 import UiExtensionAudio from "./audio";
+import UiExtensionImage from "./image";
+import UiExtensionUpload from "./upload";
+import UiExtensionVideo from "./video";
 export {
+  UiExtensionAudio,
   UiExtensionImage,
   UiExtensionUpload,
   UiExtensionVideo,
-  UiExtensionAudio,
 };
diff --git a/ui/src/components/editor/extensions/video/VideoView.vue b/ui/src/components/editor/extensions/video/VideoView.vue
index 9d4546ff8..3a103cdbe 100644
--- a/ui/src/components/editor/extensions/video/VideoView.vue
+++ b/ui/src/components/editor/extensions/video/VideoView.vue
@@ -1,12 +1,16 @@
 <script lang="ts" setup>
-import type { PMNode, Decoration } from "@halo-dev/richtext-editor";
-import type { Editor, Node } from "@halo-dev/richtext-editor";
+import { VButton } from "@halo-dev/components";
+import type {
+  Decoration,
+  Editor,
+  Node,
+  PMNode,
+} from "@halo-dev/richtext-editor";
 import { computed, ref } from "vue";
-import type { AttachmentAttr } from "../../utils/attachment";
 import RiVideoAddLine from "~icons/ri/video-add-line";
 import { EditorLinkObtain } from "../../components";
-import { VButton } from "@halo-dev/components";
 import InlineBlockBox from "../../components/InlineBlockBox.vue";
+import type { AttachmentAttr } from "../../utils/attachment";
 
 const props = defineProps<{
   editor: Editor;
diff --git a/ui/src/components/editor/extensions/video/index.ts b/ui/src/components/editor/extensions/video/index.ts
index c72fa2387..6e83770af 100644
--- a/ui/src/components/editor/extensions/video/index.ts
+++ b/ui/src/components/editor/extensions/video/index.ts
@@ -1,6 +1,6 @@
+import type { Attachment } from "@halo-dev/api-client";
 import { ExtensionVideo, VueNodeViewRenderer } from "@halo-dev/richtext-editor";
 import type { AxiosRequestConfig } from "axios";
-import type { Attachment } from "@halo-dev/api-client";
 import VideoView from "./VideoView.vue";
 
 interface UiVideoOptions {
diff --git a/ui/src/components/editor/utils/attachment.ts b/ui/src/components/editor/utils/attachment.ts
index 8a56b7c9f..5d6f640c4 100644
--- a/ui/src/components/editor/utils/attachment.ts
+++ b/ui/src/components/editor/utils/attachment.ts
@@ -1,5 +1,5 @@
-import type { Content } from "@halo-dev/richtext-editor";
 import type { AttachmentLike } from "@halo-dev/console-shared";
+import type { Content } from "@halo-dev/richtext-editor";
 
 export function getContents(attachments: AttachmentLike[]): Content[] {
   return attachments
diff --git a/ui/src/components/editor/utils/upload.ts b/ui/src/components/editor/utils/upload.ts
index e1bd3b028..f812e0bd5 100644
--- a/ui/src/components/editor/utils/upload.ts
+++ b/ui/src/components/editor/utils/upload.ts
@@ -1,11 +1,11 @@
 // image drag and paste upload
-import { CoreEditor } from "@halo-dev/richtext-editor";
+import { usePermission } from "@/utils/permission";
 import type { Attachment } from "@halo-dev/api-client";
+import { CoreEditor } from "@halo-dev/richtext-editor";
+import type { AxiosRequestConfig } from "axios";
+import ExtensionAudio from "../extensions/audio";
 import Image from "../extensions/image";
 import ExtensionVideo from "../extensions/video";
-import ExtensionAudio from "../extensions/audio";
-import type { AxiosRequestConfig } from "axios";
-import { usePermission } from "@/utils/permission";
 
 export interface FileProps {
   file: File;
diff --git a/ui/src/components/entity/EntityDropdownItems.vue b/ui/src/components/entity/EntityDropdownItems.vue
index d9c0dbccd..ad80e5b43 100644
--- a/ui/src/components/entity/EntityDropdownItems.vue
+++ b/ui/src/components/entity/EntityDropdownItems.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts" generic="T">
-import type { OperationItem } from "@halo-dev/console-shared";
-import { VDropdown } from "@halo-dev/components";
 import { usePermission } from "@/utils/permission";
+import { VDropdown } from "@halo-dev/components";
+import type { OperationItem } from "@halo-dev/console-shared";
 
 const { currentUserHasPermission } = usePermission();
 
diff --git a/ui/src/components/filter/CategoryFilterDropdown.vue b/ui/src/components/filter/CategoryFilterDropdown.vue
index cf62a4bf5..603fa9705 100644
--- a/ui/src/components/filter/CategoryFilterDropdown.vue
+++ b/ui/src/components/filter/CategoryFilterDropdown.vue
@@ -1,15 +1,15 @@
 <script lang="ts" setup>
+import { setFocus } from "@/formkit/utils/focus";
+import { usePostCategory } from "@console/modules/contents/posts/categories/composables/use-post-category";
 import type { Category } from "@halo-dev/api-client";
 import {
+  IconArrowDown,
+  VDropdown,
   VEntity,
   VEntityField,
-  VDropdown,
-  IconArrowDown,
 } from "@halo-dev/components";
-import { setFocus } from "@/formkit/utils/focus";
-import { computed, ref, watch } from "vue";
 import Fuse from "fuse.js";
-import { usePostCategory } from "@console/modules/contents/posts/categories/composables/use-post-category";
+import { computed, ref, watch } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/filter/TagFilterDropdown.vue b/ui/src/components/filter/TagFilterDropdown.vue
index 365f8481c..6b8f867d4 100644
--- a/ui/src/components/filter/TagFilterDropdown.vue
+++ b/ui/src/components/filter/TagFilterDropdown.vue
@@ -1,16 +1,16 @@
 <script lang="ts" setup>
+import { setFocus } from "@/formkit/utils/focus";
+import PostTag from "@console/modules/contents/posts/tags/components/PostTag.vue";
+import { usePostTag } from "@console/modules/contents/posts/tags/composables/use-post-tag";
 import type { Tag } from "@halo-dev/api-client";
 import {
+  IconArrowDown,
+  VDropdown,
   VEntity,
   VEntityField,
-  VDropdown,
-  IconArrowDown,
 } from "@halo-dev/components";
-import { setFocus } from "@/formkit/utils/focus";
-import { computed, ref, watch } from "vue";
 import Fuse from "fuse.js";
-import { usePostTag } from "@console/modules/contents/posts/tags/composables/use-post-tag";
-import PostTag from "@console/modules/contents/posts/tags/components/PostTag.vue";
+import { computed, ref, watch } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/filter/UserFilterDropdown.vue b/ui/src/components/filter/UserFilterDropdown.vue
index 1a290134d..6c4366b84 100644
--- a/ui/src/components/filter/UserFilterDropdown.vue
+++ b/ui/src/components/filter/UserFilterDropdown.vue
@@ -1,6 +1,7 @@
 <script lang="ts" setup>
-import type { User } from "@halo-dev/api-client";
+import { setFocus } from "@/formkit/utils/focus";
 import { useUserFetch } from "@console/modules/system/users/composables/use-user";
+import type { User } from "@halo-dev/api-client";
 import {
   IconArrowDown,
   VAvatar,
@@ -8,9 +9,8 @@ import {
   VEntity,
   VEntityField,
 } from "@halo-dev/components";
-import { setFocus } from "@/formkit/utils/focus";
-import { computed, ref, watch } from "vue";
 import Fuse from "fuse.js";
+import { computed, ref, watch } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/form/AnnotationsForm.vue b/ui/src/components/form/AnnotationsForm.vue
index e0463893d..d21079bb5 100644
--- a/ui/src/components/form/AnnotationsForm.vue
+++ b/ui/src/components/form/AnnotationsForm.vue
@@ -1,21 +1,21 @@
 <script lang="ts" setup>
 import {
+  reset,
+  submitForm,
   type FormKitNode,
   type FormKitSchemaCondition,
   type FormKitSchemaNode,
-  reset,
-  submitForm,
 } from "@formkit/core";
 
 import { IconArrowRight } from "@halo-dev/components";
 
-import { computed, nextTick, onMounted, ref, watch } from "vue";
-import { coreApiClient } from "@halo-dev/api-client";
-import type { AnnotationSetting } from "@halo-dev/api-client";
-import { cloneDeep } from "lodash-es";
-import { getValidationMessages } from "@formkit/validation";
-import { useThemeStore } from "@console/stores/theme";
 import { randomUUID } from "@/utils/id";
+import { useThemeStore } from "@console/stores/theme";
+import { getValidationMessages } from "@formkit/validation";
+import type { AnnotationSetting } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
+import { cloneDeep } from "lodash-es";
+import { computed, nextTick, onMounted, ref, watch } from "vue";
 
 const themeStore = useThemeStore();
 
diff --git a/ui/src/components/global-search/GlobalSearchModal.vue b/ui/src/components/global-search/GlobalSearchModal.vue
index 85fc29d8d..76125798a 100644
--- a/ui/src/components/global-search/GlobalSearchModal.vue
+++ b/ui/src/components/global-search/GlobalSearchModal.vue
@@ -1,5 +1,7 @@
 <script lang="ts" setup>
-import { type RouteLocationRaw, useRoute, useRouter } from "vue-router";
+import { usePermission } from "@/utils/permission";
+import { useThemeStore } from "@console/stores/theme";
+import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
 import {
   IconBookRead,
   IconFolder,
@@ -12,14 +14,12 @@ import {
   VEntityField,
   VModal,
 } from "@halo-dev/components";
-import { type Component, computed, markRaw, onMounted, ref, watch } from "vue";
-import Fuse from "fuse.js";
-import { consoleApiClient, coreApiClient } from "@halo-dev/api-client";
-import { usePermission } from "@/utils/permission";
-import { useThemeStore } from "@console/stores/theme";
-import { storeToRefs } from "pinia";
-import { useI18n } from "vue-i18n";
 import { useEventListener } from "@vueuse/core";
+import Fuse from "fuse.js";
+import { storeToRefs } from "pinia";
+import { computed, markRaw, onMounted, ref, watch, type Component } from "vue";
+import { useI18n } from "vue-i18n";
+import { useRoute, useRouter, type RouteLocationRaw } from "vue-router";
 
 const router = useRouter();
 const route = useRoute();
diff --git a/ui/src/components/icon/AttachmentFileTypeIcon.vue b/ui/src/components/icon/AttachmentFileTypeIcon.vue
index 125b58a17..a47967631 100644
--- a/ui/src/components/icon/AttachmentFileTypeIcon.vue
+++ b/ui/src/components/icon/AttachmentFileTypeIcon.vue
@@ -1,36 +1,36 @@
 <script lang="ts" setup>
-import VscodeIconsDefaultFile from "~icons/vscode-icons/default-file";
-import VscodeIconsFileTypeImage from "~icons/vscode-icons/file-type-image";
-import VscodeIconsFileTypePhotoshop from "~icons/vscode-icons/file-type-photoshop";
-import VscodeIconsFileTypeAi from "~icons/vscode-icons/file-type-ai";
-import VscodeIconsFileTypeWord from "~icons/vscode-icons/file-type-word";
-import VscodeIconsFileTypePowerpoint from "~icons/vscode-icons/file-type-powerpoint";
-import VscodeIconsFileTypeExcel from "~icons/vscode-icons/file-type-excel";
-import VscodeIconsFileTypeText from "~icons/vscode-icons/file-type-text";
-import VscodeIconsFileTypeJson from "~icons/vscode-icons/file-type-json";
-import VscodeIconsFileTypeHtml from "~icons/vscode-icons/file-type-html";
-import VscodeIconsFileTypeYaml from "~icons/vscode-icons/file-type-yaml";
-import VscodeIconsFileTypeXml from "~icons/vscode-icons/file-type-xml";
-import VscodeIconsFileTypeJava from "~icons/vscode-icons/file-type-java";
-import VscodeIconsFileTypeJar from "~icons/vscode-icons/file-type-jar";
-import VscodeIconsFileTypeClass from "~icons/vscode-icons/file-type-class";
-import VscodeIconsFileTypeJsOfficial from "~icons/vscode-icons/file-type-js-official";
-import VscodeIconsFileTypeTypescriptOfficial from "~icons/vscode-icons/file-type-typescript-official";
-import VscodeIconsFileTypeVue from "~icons/vscode-icons/file-type-vue";
-import VscodeIconsFileTypeGo from "~icons/vscode-icons/file-type-go";
-import VscodeIconsFileTypeC from "~icons/vscode-icons/file-type-c";
-import VscodeIconsFileTypeCpp from "~icons/vscode-icons/file-type-cpp";
-import VscodeIconsFileTypeAstro from "~icons/vscode-icons/file-type-astro";
-import VscodeIconsFileTypeBat from "~icons/vscode-icons/file-type-bat";
-import VscodeIconsFileTypeCss from "~icons/vscode-icons/file-type-css";
-import VscodeIconsFileTypeDb from "~icons/vscode-icons/file-type-db";
-import VscodeIconsFileTypeGradle from "~icons/vscode-icons/file-type-gradle";
-import VscodeIconsFileTypeMarkdown from "~icons/vscode-icons/file-type-markdown";
-import VscodeIconsFileTypePython from "~icons/vscode-icons/file-type-python";
-import VscodeIconsFileTypeShell from "~icons/vscode-icons/file-type-shell";
-import VscodeIconsFileTypePhp3 from "~icons/vscode-icons/file-type-php3";
 import { extname } from "path-browserify";
 import { computed, markRaw } from "vue";
+import VscodeIconsDefaultFile from "~icons/vscode-icons/default-file";
+import VscodeIconsFileTypeAi from "~icons/vscode-icons/file-type-ai";
+import VscodeIconsFileTypeAstro from "~icons/vscode-icons/file-type-astro";
+import VscodeIconsFileTypeBat from "~icons/vscode-icons/file-type-bat";
+import VscodeIconsFileTypeC from "~icons/vscode-icons/file-type-c";
+import VscodeIconsFileTypeClass from "~icons/vscode-icons/file-type-class";
+import VscodeIconsFileTypeCpp from "~icons/vscode-icons/file-type-cpp";
+import VscodeIconsFileTypeCss from "~icons/vscode-icons/file-type-css";
+import VscodeIconsFileTypeDb from "~icons/vscode-icons/file-type-db";
+import VscodeIconsFileTypeExcel from "~icons/vscode-icons/file-type-excel";
+import VscodeIconsFileTypeGo from "~icons/vscode-icons/file-type-go";
+import VscodeIconsFileTypeGradle from "~icons/vscode-icons/file-type-gradle";
+import VscodeIconsFileTypeHtml from "~icons/vscode-icons/file-type-html";
+import VscodeIconsFileTypeImage from "~icons/vscode-icons/file-type-image";
+import VscodeIconsFileTypeJar from "~icons/vscode-icons/file-type-jar";
+import VscodeIconsFileTypeJava from "~icons/vscode-icons/file-type-java";
+import VscodeIconsFileTypeJsOfficial from "~icons/vscode-icons/file-type-js-official";
+import VscodeIconsFileTypeJson from "~icons/vscode-icons/file-type-json";
+import VscodeIconsFileTypeMarkdown from "~icons/vscode-icons/file-type-markdown";
+import VscodeIconsFileTypePhotoshop from "~icons/vscode-icons/file-type-photoshop";
+import VscodeIconsFileTypePhp3 from "~icons/vscode-icons/file-type-php3";
+import VscodeIconsFileTypePowerpoint from "~icons/vscode-icons/file-type-powerpoint";
+import VscodeIconsFileTypePython from "~icons/vscode-icons/file-type-python";
+import VscodeIconsFileTypeShell from "~icons/vscode-icons/file-type-shell";
+import VscodeIconsFileTypeText from "~icons/vscode-icons/file-type-text";
+import VscodeIconsFileTypeTypescriptOfficial from "~icons/vscode-icons/file-type-typescript-official";
+import VscodeIconsFileTypeVue from "~icons/vscode-icons/file-type-vue";
+import VscodeIconsFileTypeWord from "~icons/vscode-icons/file-type-word";
+import VscodeIconsFileTypeXml from "~icons/vscode-icons/file-type-xml";
+import VscodeIconsFileTypeYaml from "~icons/vscode-icons/file-type-yaml";
 
 const FileTypeIconsMap = {
   // image
diff --git a/ui/src/components/login/LoginForm.vue b/ui/src/components/login/LoginForm.vue
index 2e3e9eedc..3e0e0d421 100644
--- a/ui/src/components/login/LoginForm.vue
+++ b/ui/src/components/login/LoginForm.vue
@@ -1,17 +1,16 @@
 <script lang="ts" setup>
+import { ERROR_MFA_REQUIRED_TYPE } from "@/constants/error-types";
 import { setFocus } from "@/formkit/utils/focus";
 import { useUserStore } from "@/stores/user";
 import { randomUUID } from "@/utils/id";
-import axios from "axios";
-import { AxiosError } from "axios";
-import { Toast, VButton } from "@halo-dev/components";
-import { onMounted, ref } from "vue";
-import qs from "qs";
-import { submitForm, reset } from "@formkit/core";
-import { JSEncrypt } from "jsencrypt";
+import { reset, submitForm } from "@formkit/core";
 import { consoleApiClient } from "@halo-dev/api-client";
+import { Toast, VButton } from "@halo-dev/components";
+import axios, { AxiosError } from "axios";
+import { JSEncrypt } from "jsencrypt";
+import qs from "qs";
+import { onMounted, ref } from "vue";
 import { useI18n } from "vue-i18n";
-import { ERROR_MFA_REQUIRED_TYPE } from "@/constants/error-types";
 import MfaForm from "./MfaForm.vue";
 
 const { t } = useI18n();
diff --git a/ui/src/components/login/LoginModal.vue b/ui/src/components/login/LoginModal.vue
index 12635e474..8e8b8195e 100644
--- a/ui/src/components/login/LoginModal.vue
+++ b/ui/src/components/login/LoginModal.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
-import { Toast, VModal } from "@halo-dev/components";
 import LoginForm from "@/components/login/LoginForm.vue";
 import { useUserStore } from "@/stores/user";
+import { Toast, VModal } from "@halo-dev/components";
+import { ref } from "vue";
 import { useI18n } from "vue-i18n";
 import SocialAuthProviders from "./SocialAuthProviders.vue";
-import { ref } from "vue";
 
 const userStore = useUserStore();
 const { t } = useI18n();
diff --git a/ui/src/components/login/MfaForm.vue b/ui/src/components/login/MfaForm.vue
index 052592233..e92e84ee0 100644
--- a/ui/src/components/login/MfaForm.vue
+++ b/ui/src/components/login/MfaForm.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import { submitForm } from "@formkit/core";
 import { Toast, VButton } from "@halo-dev/components";
-import qs from "qs";
 import axios from "axios";
+import qs from "qs";
 
 const emit = defineEmits<{
   (event: "succeed"): void;
diff --git a/ui/src/components/login/SocialAuthProviderItem.vue b/ui/src/components/login/SocialAuthProviderItem.vue
index a2062583d..3306f53be 100644
--- a/ui/src/components/login/SocialAuthProviderItem.vue
+++ b/ui/src/components/login/SocialAuthProviderItem.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import type { SocialAuthProvider } from "@/types";
 import { useRouteQuery } from "@vueuse/router";
-import { inject, ref } from "vue";
 import type { Ref } from "vue";
+import { inject, ref } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/login/SocialAuthProviders.vue b/ui/src/components/login/SocialAuthProviders.vue
index 5bcb9a47d..bc7b275c1 100644
--- a/ui/src/components/login/SocialAuthProviders.vue
+++ b/ui/src/components/login/SocialAuthProviders.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { ref, provide } from "vue";
 import type { Ref } from "vue";
+import { provide, ref } from "vue";
 
 // auth providers
 import { useGlobalInfoFetch } from "@console/composables/use-global-info";
diff --git a/ui/src/components/menu/RoutesMenu.tsx b/ui/src/components/menu/RoutesMenu.tsx
index a85253487..8f40db102 100644
--- a/ui/src/components/menu/RoutesMenu.tsx
+++ b/ui/src/components/menu/RoutesMenu.tsx
@@ -1,10 +1,10 @@
+import { VMenu, VMenuItem, VMenuLabel } from "@halo-dev/components";
+import type { MenuGroupType, MenuItemType } from "@halo-dev/console-shared";
 import type { Component, PropType } from "vue";
 import { computed, defineComponent } from "vue";
-import type { MenuGroupType, MenuItemType } from "@halo-dev/console-shared";
-import { VMenu, VMenuItem, VMenuLabel } from "@halo-dev/components";
+import { useI18n } from "vue-i18n";
 import type { RouteLocationMatched } from "vue-router";
 import { useRoute, useRouter } from "vue-router";
-import { useI18n } from "vue-i18n";
 
 const RoutesMenu = defineComponent({
   name: "RoutesMenu",
diff --git a/ui/src/components/preview/UrlPreviewModal.vue b/ui/src/components/preview/UrlPreviewModal.vue
index 6217d02dc..ad02d83d2 100644
--- a/ui/src/components/preview/UrlPreviewModal.vue
+++ b/ui/src/components/preview/UrlPreviewModal.vue
@@ -1,17 +1,16 @@
 <script lang="ts" setup>
 import { axiosInstance } from "@halo-dev/api-client";
 import {
-  VModal,
-  IconLink,
-  VTabbar,
   IconComputer,
-  IconTablet,
+  IconLink,
   IconPhone,
+  IconTablet,
   VLoading,
+  VModal,
+  VTabbar,
 } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
-import { toRefs } from "vue";
-import { computed, markRaw, ref } from "vue";
+import { computed, markRaw, ref, toRefs } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/signup/SignupForm.vue b/ui/src/components/signup/SignupForm.vue
index 535296fb0..22faad4b9 100644
--- a/ui/src/components/signup/SignupForm.vue
+++ b/ui/src/components/signup/SignupForm.vue
@@ -1,13 +1,13 @@
 <script lang="ts" setup>
-import { computed, type ComputedRef, onMounted, reactive, ref } from "vue";
-import { submitForm } from "@formkit/core";
-import { Toast, VButton } from "@halo-dev/components";
-import { publicApiClient } from "@halo-dev/api-client";
-import { useRouteQuery } from "@vueuse/router";
-import { useI18n } from "vue-i18n";
-import { useMutation } from "@tanstack/vue-query";
-import { useIntervalFn } from "@vueuse/shared";
 import { useGlobalInfoStore } from "@/stores/global-info";
+import { submitForm } from "@formkit/core";
+import { publicApiClient } from "@halo-dev/api-client";
+import { Toast, VButton } from "@halo-dev/components";
+import { useMutation } from "@tanstack/vue-query";
+import { useRouteQuery } from "@vueuse/router";
+import { useIntervalFn } from "@vueuse/shared";
+import { computed, onMounted, reactive, ref, type ComputedRef } from "vue";
+import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
 
diff --git a/ui/src/components/sticky-block/StickyBlock.vue b/ui/src/components/sticky-block/StickyBlock.vue
index 96f9b7bb5..33646af48 100644
--- a/ui/src/components/sticky-block/StickyBlock.vue
+++ b/ui/src/components/sticky-block/StickyBlock.vue
@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useEventListener } from "@vueuse/core";
-import { ref, onMounted } from "vue";
+import { onMounted, ref } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/upload/UppyUpload.vue b/ui/src/components/upload/UppyUpload.vue
index 2d5cde326..cf97738be 100644
--- a/ui/src/components/upload/UppyUpload.vue
+++ b/ui/src/components/upload/UppyUpload.vue
@@ -1,19 +1,19 @@
 <script lang="ts" setup>
-import { Dashboard } from "@uppy/vue";
-import "@uppy/core/dist/style.css";
-import "@uppy/dashboard/dist/style.css";
+import { i18n } from "@/locales";
+import type { ProblemDetail } from "@/setup/setupApiClient";
+import { Toast } from "@halo-dev/components";
 import type { Restrictions } from "@uppy/core";
 import Uppy, { type SuccessResponse } from "@uppy/core";
-import XHRUpload from "@uppy/xhr-upload";
+import "@uppy/core/dist/style.css";
+import "@uppy/dashboard/dist/style.css";
 import ImageEditor from "@uppy/image-editor";
 import "@uppy/image-editor/dist/style.min.css";
+import en_US from "@uppy/locales/lib/en_US";
 import zh_CN from "@uppy/locales/lib/zh_CN";
 import zh_TW from "@uppy/locales/lib/zh_TW";
-import en_US from "@uppy/locales/lib/en_US";
+import { Dashboard } from "@uppy/vue";
+import XHRUpload from "@uppy/xhr-upload";
 import { computed, onUnmounted } from "vue";
-import { Toast } from "@halo-dev/components";
-import type { ProblemDetail } from "@/setup/setupApiClient";
-import { i18n } from "@/locales";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/user-avatar/UserAvatar.vue b/ui/src/components/user-avatar/UserAvatar.vue
index 191ebc84d..8fb7f2c3e 100644
--- a/ui/src/components/user-avatar/UserAvatar.vue
+++ b/ui/src/components/user-avatar/UserAvatar.vue
@@ -1,25 +1,24 @@
 <script lang="ts" setup>
+import { rbacAnnotations } from "@/constants/annotations";
+import { usePermission } from "@/utils/permission";
 import { consoleApiClient } from "@halo-dev/api-client";
 import {
-  IconRiPencilFill,
+  Dialog,
   IconAddCircle,
-  VButton,
+  IconRiPencilFill,
+  Toast,
   VAvatar,
+  VButton,
   VDropdown,
   VDropdownItem,
+  VLoading,
   VModal,
   VSpace,
-  Toast,
-  Dialog,
-  VLoading,
 } from "@halo-dev/components";
-import { ref, defineAsyncComponent, type Ref, toRefs } from "vue";
-import { usePermission } from "@/utils/permission";
 import { useQuery, useQueryClient } from "@tanstack/vue-query";
-import { useI18n } from "vue-i18n";
 import { useFileDialog } from "@vueuse/core";
-import { computed } from "vue";
-import { rbacAnnotations } from "@/constants/annotations";
+import { computed, defineAsyncComponent, ref, toRefs, type Ref } from "vue";
+import { useI18n } from "vue-i18n";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/components/user-avatar/UserAvatarCropper.vue b/ui/src/components/user-avatar/UserAvatarCropper.vue
index 878bcb821..b4fb094b1 100644
--- a/ui/src/components/user-avatar/UserAvatarCropper.vue
+++ b/ui/src/components/user-avatar/UserAvatarCropper.vue
@@ -1,20 +1,16 @@
 <script setup lang="ts">
 import {
-  IconZoomInLine,
-  IconZoomOutLine,
   IconArrowLeftRightLine,
   IconArrowUpDownLine,
   IconRefreshLine,
   IconRiUpload2Fill,
+  IconZoomInLine,
+  IconZoomOutLine,
 } from "@halo-dev/components";
-import { type Ref } from "vue";
-import { ref, watch } from "vue";
-import "cropperjs/dist/cropper.css";
 import Cropper from "cropperjs";
-import { onMounted } from "vue";
-import { computed } from "vue";
+import "cropperjs/dist/cropper.css";
 import type { Component } from "vue";
-import { markRaw } from "vue";
+import { computed, markRaw, onMounted, ref, watch, type Ref } from "vue";
 import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
diff --git a/ui/src/composables/use-auto-save-content.ts b/ui/src/composables/use-auto-save-content.ts
index ecded5a92..d7f8f8d05 100644
--- a/ui/src/composables/use-auto-save-content.ts
+++ b/ui/src/composables/use-auto-save-content.ts
@@ -1,7 +1,6 @@
-import { useWindowFocus } from "@vueuse/core";
+import { useTimeoutFn, useWindowFocus } from "@vueuse/core";
 import { watch, type Ref } from "vue";
 import { onBeforeRouteLeave } from "vue-router";
-import { useTimeoutFn } from "@vueuse/core";
 import type { ContentCache } from "./use-content-cache";
 
 export function useAutoSaveContent(
diff --git a/ui/src/composables/use-content-cache.ts b/ui/src/composables/use-content-cache.ts
index 9dc0599fd..e00ca3f22 100644
--- a/ui/src/composables/use-content-cache.ts
+++ b/ui/src/composables/use-content-cache.ts
@@ -1,13 +1,13 @@
-import { useLocalStorage } from "@vueuse/core";
 import { Toast } from "@halo-dev/components";
+import { useLocalStorage } from "@vueuse/core";
+import { debounce } from "lodash-es";
 import { computed, type Ref } from "vue";
+import { useI18n } from "vue-i18n";
 export interface ContentCache {
   name: string;
   content?: string;
   version: number;
 }
-import { debounce } from "lodash-es";
-import { useI18n } from "vue-i18n";
 
 interface useContentCacheReturn {
   handleResetCache: () => void;
diff --git a/ui/src/composables/use-role.ts b/ui/src/composables/use-role.ts
index cc3cd8050..b486cd443 100644
--- a/ui/src/composables/use-role.ts
+++ b/ui/src/composables/use-role.ts
@@ -1,18 +1,18 @@
-import type { Role } from "@halo-dev/api-client";
-import {
-  computed,
-  type ComputedRef,
-  onMounted,
-  onUnmounted,
-  type Ref,
-  ref,
-} from "vue";
-import { roleLabels } from "@/constants/labels";
 import { rbacAnnotations } from "@/constants/annotations";
+import { roleLabels } from "@/constants/labels";
+import { resolveDeepDependencies } from "@/utils/role";
+import type { Role } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
 import { Toast } from "@halo-dev/components";
+import {
+  computed,
+  onMounted,
+  onUnmounted,
+  ref,
+  type ComputedRef,
+  type Ref,
+} from "vue";
 import { useI18n } from "vue-i18n";
-import { resolveDeepDependencies } from "@/utils/role";
 
 interface RoleTemplateGroup {
   module: string | null | undefined;
diff --git a/ui/src/composables/use-route-menu-generator.ts b/ui/src/composables/use-route-menu-generator.ts
index 1a27e05c0..da4ead0f5 100644
--- a/ui/src/composables/use-route-menu-generator.ts
+++ b/ui/src/composables/use-route-menu-generator.ts
@@ -1,12 +1,12 @@
 import { useRoleStore } from "@/stores/role";
-import type { MenuGroupType, MenuItemType } from "@halo-dev/console-shared";
-import { onMounted, ref, type Ref } from "vue";
-import { sortBy } from "lodash-es";
 import { hasPermission } from "@/utils/permission";
+import type { MenuGroupType, MenuItemType } from "@halo-dev/console-shared";
+import { sortBy } from "lodash-es";
+import { onMounted, ref, type Ref } from "vue";
 import {
   useRouter,
-  type RouteRecordRaw,
   type RouteRecordNormalized,
+  type RouteRecordRaw,
 } from "vue-router";
 
 interface useRouteMenuGeneratorReturn {
diff --git a/ui/src/composables/use-title.ts b/ui/src/composables/use-title.ts
index 5e1f2c68a..4e879e3d7 100644
--- a/ui/src/composables/use-title.ts
+++ b/ui/src/composables/use-title.ts
@@ -1,10 +1,10 @@
-import { storeToRefs } from "pinia";
-import { useGlobalInfoStore } from "@/stores/global-info";
-import { useRoute } from "vue-router";
-import { useTitle } from "@vueuse/core";
-import { computed, type Ref } from "vue";
 import { AppName } from "@/constants/app";
+import { useGlobalInfoStore } from "@/stores/global-info";
+import { useTitle } from "@vueuse/core";
+import { storeToRefs } from "pinia";
+import { computed, type Ref } from "vue";
 import { useI18n } from "vue-i18n";
+import { useRoute } from "vue-router";
 
 export function useAppTitle(baseTitle?: Ref<string>) {
   const { globalInfo } = storeToRefs(useGlobalInfoStore());
diff --git a/ui/src/formkit/formkit.config.ts b/ui/src/formkit/formkit.config.ts
index 34df47daf..b16d518e8 100644
--- a/ui/src/formkit/formkit.config.ts
+++ b/ui/src/formkit/formkit.config.ts
@@ -1,34 +1,34 @@
+import { en, zh } from "@formkit/i18n";
+import { group as nativeGroup } from "@formkit/inputs";
 import { generateClasses } from "@formkit/themes";
-import theme from "./theme";
-import { zh, en } from "@formkit/i18n";
 import type { DefaultConfigOptions } from "@formkit/vue";
+import { attachment } from "./inputs/attachment";
+import { attachmentGroupSelect } from "./inputs/attachment-group-select";
+import { attachmentPolicySelect } from "./inputs/attachment-policy-select";
+import { categoryCheckbox } from "./inputs/category-checkbox";
+import { categorySelect } from "./inputs/category-select";
+import { code } from "./inputs/code";
 import { form } from "./inputs/form";
 import { group } from "./inputs/group";
-import { group as nativeGroup } from "@formkit/inputs";
-import { attachment } from "./inputs/attachment";
-import { code } from "./inputs/code";
-import { repeater } from "./inputs/repeater";
-import { menuCheckbox } from "./inputs/menu-checkbox";
-import { menuRadio } from "./inputs/menu-radio";
-import { menuItemSelect } from "./inputs/menu-item-select";
-import { postSelect } from "./inputs/post-select";
-import { singlePageSelect } from "./inputs/singlePage-select";
-import { tagSelect } from "./inputs/tag-select";
-import { categorySelect } from "./inputs/category-select";
-import { categoryCheckbox } from "./inputs/category-checkbox";
-import { tagCheckbox } from "./inputs/tag-checkbox";
-import { roleSelect } from "./inputs/role-select";
-import { attachmentPolicySelect } from "./inputs/attachment-policy-select";
-import { attachmentGroupSelect } from "./inputs/attachment-group-select";
-import { password } from "./inputs/password";
-import { verificationForm } from "./inputs/verify-form";
 import { list } from "./inputs/list";
+import { menuCheckbox } from "./inputs/menu-checkbox";
+import { menuItemSelect } from "./inputs/menu-item-select";
+import { menuRadio } from "./inputs/menu-radio";
+import { password } from "./inputs/password";
+import { postSelect } from "./inputs/post-select";
+import { repeater } from "./inputs/repeater";
+import { roleSelect } from "./inputs/role-select";
+import { singlePageSelect } from "./inputs/singlePage-select";
+import { tagCheckbox } from "./inputs/tag-checkbox";
+import { tagSelect } from "./inputs/tag-select";
+import { verificationForm } from "./inputs/verify-form";
+import theme from "./theme";
 
-import radioAlt from "./plugins/radio-alt";
-import stopImplicitSubmission from "./plugins/stop-implicit-submission";
-import passwordPreventAutocomplete from "./plugins/password-prevent-autocomplete";
-import requiredAsterisk from "./plugins/required-asterisk";
 import autoScrollToErrors from "./plugins/auto-scroll-to-errors";
+import passwordPreventAutocomplete from "./plugins/password-prevent-autocomplete";
+import radioAlt from "./plugins/radio-alt";
+import requiredAsterisk from "./plugins/required-asterisk";
+import stopImplicitSubmission from "./plugins/stop-implicit-submission";
 
 const config: DefaultConfigOptions = {
   config: {
diff --git a/ui/src/formkit/inputs/attachment-group-select.ts b/ui/src/formkit/inputs/attachment-group-select.ts
index 29bb3e19f..76e2dceba 100644
--- a/ui/src/formkit/inputs/attachment-group-select.ts
+++ b/ui/src/formkit/inputs/attachment-group-select.ts
@@ -1,6 +1,6 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
-import { select, selects, defaultIcon } from "@formkit/inputs";
+import { defaultIcon, select, selects } from "@formkit/inputs";
+import { coreApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/attachment-policy-select.ts b/ui/src/formkit/inputs/attachment-policy-select.ts
index 73f1595fd..97d495c73 100644
--- a/ui/src/formkit/inputs/attachment-policy-select.ts
+++ b/ui/src/formkit/inputs/attachment-policy-select.ts
@@ -1,6 +1,6 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
-import { select, selects, defaultIcon } from "@formkit/inputs";
+import { defaultIcon, select, selects } from "@formkit/inputs";
+import { coreApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/attachment/AttachmentInput.vue b/ui/src/formkit/inputs/attachment/AttachmentInput.vue
index 7096f05b9..6c70addb5 100644
--- a/ui/src/formkit/inputs/attachment/AttachmentInput.vue
+++ b/ui/src/formkit/inputs/attachment/AttachmentInput.vue
@@ -1,9 +1,9 @@
 <script lang="ts" setup>
+import AttachmentSelectorModal from "@console/modules/contents/attachments/components/AttachmentSelectorModal.vue";
 import type { FormKitFrameworkContext } from "@formkit/core";
 import { IconFolder } from "@halo-dev/components";
-import AttachmentSelectorModal from "@console/modules/contents/attachments/components/AttachmentSelectorModal.vue";
-import { ref, type PropType } from "vue";
 import type { AttachmentLike } from "@halo-dev/console-shared";
+import { ref, type PropType } from "vue";
 
 const props = defineProps({
   context: {
diff --git a/ui/src/formkit/inputs/category-checkbox.ts b/ui/src/formkit/inputs/category-checkbox.ts
index 46e133846..f3eec6861 100644
--- a/ui/src/formkit/inputs/category-checkbox.ts
+++ b/ui/src/formkit/inputs/category-checkbox.ts
@@ -1,6 +1,6 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
 import { checkbox, checkboxes, defaultIcon } from "@formkit/inputs";
+import { coreApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/category-select/CategorySelect.vue b/ui/src/formkit/inputs/category-select/CategorySelect.vue
index 77f42b0c7..5f68c403f 100644
--- a/ui/src/formkit/inputs/category-select/CategorySelect.vue
+++ b/ui/src/formkit/inputs/category-select/CategorySelect.vue
@@ -1,20 +1,20 @@
 <script lang="ts" setup>
-import type { FormKitFrameworkContext } from "@formkit/core";
-import type { Category } from "@halo-dev/api-client";
-import { computed, provide, ref, watch, type PropType, type Ref } from "vue";
-import { IconArrowRight } from "@halo-dev/components";
+import HasPermission from "@/components/permission/HasPermission.vue";
+import { usePermission } from "@/utils/permission";
 import { usePostCategory } from "@console/modules/contents/posts/categories/composables/use-post-category";
 import type { CategoryTree } from "@console/modules/contents/posts/categories/utils";
 import { convertTreeToCategories } from "@console/modules/contents/posts/categories/utils";
-import CategoryListItem from "./components/CategoryListItem.vue";
+import type { FormKitFrameworkContext } from "@formkit/core";
+import type { Category } from "@halo-dev/api-client";
+import { coreApiClient } from "@halo-dev/api-client";
+import { IconArrowRight } from "@halo-dev/components";
 import { onClickOutside } from "@vueuse/core";
 import Fuse from "fuse.js";
+import { slugify } from "transliteration";
+import { computed, provide, ref, watch, type PropType, type Ref } from "vue";
+import CategoryListItem from "./components/CategoryListItem.vue";
 import CategoryTag from "./components/CategoryTag.vue";
 import SearchResultListItem from "./components/SearchResultListItem.vue";
-import { coreApiClient } from "@halo-dev/api-client";
-import { usePermission } from "@/utils/permission";
-import { slugify } from "transliteration";
-import HasPermission from "@/components/permission/HasPermission.vue";
 
 const { currentUserHasPermission } = usePermission();
 
diff --git a/ui/src/formkit/inputs/category-select/components/CategoryTag.vue b/ui/src/formkit/inputs/category-select/components/CategoryTag.vue
index 1f6ca4515..5cbf6dd8a 100644
--- a/ui/src/formkit/inputs/category-select/components/CategoryTag.vue
+++ b/ui/src/formkit/inputs/category-select/components/CategoryTag.vue
@@ -2,8 +2,8 @@
 import type { CategoryTree } from "@console/modules/contents/posts/categories/utils";
 import { getCategoryPath } from "@console/modules/contents/posts/categories/utils";
 import type { Category } from "@halo-dev/api-client";
-import { computed, inject, ref, type Ref } from "vue";
 import { IconClose } from "@halo-dev/components";
+import { computed, inject, ref, type Ref } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/src/formkit/inputs/group.ts b/ui/src/formkit/inputs/group.ts
index a58dd8889..bbc1c79b7 100644
--- a/ui/src/formkit/inputs/group.ts
+++ b/ui/src/formkit/inputs/group.ts
@@ -2,13 +2,13 @@ import type { FormKitTypeDefinition } from "@formkit/core";
 
 import {
   disablesChildren,
-  outer,
   fieldset,
-  legend,
   help,
   inner,
+  legend,
   message,
   messages,
+  outer,
 } from "@formkit/inputs";
 
 export const group: FormKitTypeDefinition = {
diff --git a/ui/src/formkit/inputs/list/AddButton.vue b/ui/src/formkit/inputs/list/AddButton.vue
index 52be837ba..f75139154 100644
--- a/ui/src/formkit/inputs/list/AddButton.vue
+++ b/ui/src/formkit/inputs/list/AddButton.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { VButton, IconAddCircle } from "@halo-dev/components";
 import type { FormKitFrameworkContext } from "@formkit/core";
+import { IconAddCircle, VButton } from "@halo-dev/components";
 import type { PropType } from "vue";
 
 const props = defineProps({
diff --git a/ui/src/formkit/inputs/list/index.ts b/ui/src/formkit/inputs/list/index.ts
index 05631cf72..cf9706aec 100644
--- a/ui/src/formkit/inputs/list/index.ts
+++ b/ui/src/formkit/inputs/list/index.ts
@@ -1,19 +1,28 @@
 import type { FormKitTypeDefinition } from "@formkit/core";
 
+import { i18n } from "@/locales";
 import {
+  $if,
   disablesChildren,
-  renamesRadios,
   fieldset,
-  messages,
-  message,
-  outer,
-  legend,
   help,
   inner,
+  legend,
+  message,
+  messages,
+  outer,
   prefix,
-  $if,
+  renamesRadios,
   suffix,
 } from "@formkit/inputs";
+import {
+  IconAddCircle,
+  IconArrowDownCircleLine,
+  IconArrowUpCircleLine,
+  IconCloseCircle,
+} from "@halo-dev/components";
+import AddButton from "./AddButton.vue";
+import { lists } from "./features/lists";
 import {
   addButton,
   content,
@@ -34,15 +43,6 @@ import {
   upControl,
   upIcon,
 } from "./sections";
-import { i18n } from "@/locales";
-import {
-  IconAddCircle,
-  IconArrowDownCircleLine,
-  IconArrowUpCircleLine,
-  IconCloseCircle,
-} from "@halo-dev/components";
-import AddButton from "./AddButton.vue";
-import { lists } from "./features/lists";
 
 /**
  * Input definition for a dynamic list input.
diff --git a/ui/src/formkit/inputs/list/listSection.ts b/ui/src/formkit/inputs/list/listSection.ts
index 816c6ae01..d0e3d00fd 100644
--- a/ui/src/formkit/inputs/list/listSection.ts
+++ b/ui/src/formkit/inputs/list/listSection.ts
@@ -1,9 +1,9 @@
 import {
   isComponent,
   isDOM,
-  type FormKitSchemaNode,
   type FormKitExtendableSchemaRoot,
   type FormKitSchemaCondition,
+  type FormKitSchemaNode,
   type FormKitSectionsSchema,
 } from "@formkit/core";
 import {
diff --git a/ui/src/formkit/inputs/menu-checkbox.ts b/ui/src/formkit/inputs/menu-checkbox.ts
index f728e30ca..f94147fd2 100644
--- a/ui/src/formkit/inputs/menu-checkbox.ts
+++ b/ui/src/formkit/inputs/menu-checkbox.ts
@@ -1,6 +1,6 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
 import { checkbox, checkboxes, defaultIcon } from "@formkit/inputs";
+import { coreApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/menu-item-select.ts b/ui/src/formkit/inputs/menu-item-select.ts
index 7903600a7..b0aba46e8 100644
--- a/ui/src/formkit/inputs/menu-item-select.ts
+++ b/ui/src/formkit/inputs/menu-item-select.ts
@@ -1,6 +1,6 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
-import { select, selects, defaultIcon } from "@formkit/inputs";
+import { defaultIcon, select, selects } from "@formkit/inputs";
+import { coreApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/menu-radio.ts b/ui/src/formkit/inputs/menu-radio.ts
index 4d14b4682..aecba8dca 100644
--- a/ui/src/formkit/inputs/menu-radio.ts
+++ b/ui/src/formkit/inputs/menu-radio.ts
@@ -1,6 +1,6 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
-import { radio, radios, defaultIcon } from "@formkit/inputs";
+import { defaultIcon, radio, radios } from "@formkit/inputs";
+import { coreApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/password/index.ts b/ui/src/formkit/inputs/password/index.ts
index 36d5b2a2b..c86e1d7c3 100644
--- a/ui/src/formkit/inputs/password/index.ts
+++ b/ui/src/formkit/inputs/password/index.ts
@@ -1,16 +1,16 @@
 import type { FormKitTypeDefinition } from "@formkit/core";
 import {
-  outer,
-  inner,
-  wrapper,
-  label,
   help,
-  messages,
-  message,
   icon,
+  inner,
+  label,
+  message,
+  messages,
+  outer,
   prefix,
   suffix,
   textInput,
+  wrapper,
 } from "@formkit/inputs";
 import RevealButton from "./RevealButton.vue";
 
diff --git a/ui/src/formkit/inputs/post-select.ts b/ui/src/formkit/inputs/post-select.ts
index 83df8699e..bfa08853d 100644
--- a/ui/src/formkit/inputs/post-select.ts
+++ b/ui/src/formkit/inputs/post-select.ts
@@ -1,7 +1,7 @@
 import { postLabels } from "@/constants/labels";
-import { consoleApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
-import { select, selects, defaultIcon } from "@formkit/inputs";
+import { defaultIcon, select, selects } from "@formkit/inputs";
+import { consoleApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/repeater/AddButton.vue b/ui/src/formkit/inputs/repeater/AddButton.vue
index 52be837ba..f75139154 100644
--- a/ui/src/formkit/inputs/repeater/AddButton.vue
+++ b/ui/src/formkit/inputs/repeater/AddButton.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
-import { VButton, IconAddCircle } from "@halo-dev/components";
 import type { FormKitFrameworkContext } from "@formkit/core";
+import { IconAddCircle, VButton } from "@halo-dev/components";
 import type { PropType } from "vue";
 
 const props = defineProps({
diff --git a/ui/src/formkit/inputs/repeater/index.ts b/ui/src/formkit/inputs/repeater/index.ts
index b39e082c6..11493428e 100644
--- a/ui/src/formkit/inputs/repeater/index.ts
+++ b/ui/src/formkit/inputs/repeater/index.ts
@@ -1,17 +1,25 @@
 import type { FormKitTypeDefinition } from "@formkit/core";
 
+import { i18n } from "@/locales";
 import {
-  outer,
+  $if,
   fieldset,
-  legend,
   help,
   inner,
-  prefix,
-  $if,
-  suffix,
-  messages,
+  legend,
   message,
+  messages,
+  outer,
+  prefix,
+  suffix,
 } from "@formkit/inputs";
+import {
+  IconAddCircle,
+  IconArrowDownCircleLine,
+  IconArrowUpCircleLine,
+  IconCloseCircle,
+} from "@halo-dev/components";
+import AddButton from "./AddButton.vue";
 import { repeats } from "./features/repeats";
 import {
   addButton,
@@ -34,14 +42,6 @@ import {
   upControl,
   upIcon,
 } from "./sections";
-import {
-  IconAddCircle,
-  IconCloseCircle,
-  IconArrowUpCircleLine,
-  IconArrowDownCircleLine,
-} from "@halo-dev/components";
-import AddButton from "./AddButton.vue";
-import { i18n } from "@/locales";
 
 /**
  * Input definition for a repeater input.
diff --git a/ui/src/formkit/inputs/repeater/repeaterSection.ts b/ui/src/formkit/inputs/repeater/repeaterSection.ts
index bf6f8818d..d0cb1971a 100644
--- a/ui/src/formkit/inputs/repeater/repeaterSection.ts
+++ b/ui/src/formkit/inputs/repeater/repeaterSection.ts
@@ -1,9 +1,9 @@
 import {
   isComponent,
   isDOM,
-  type FormKitSchemaNode,
   type FormKitExtendableSchemaRoot,
   type FormKitSchemaCondition,
+  type FormKitSchemaNode,
   type FormKitSectionsSchema,
 } from "@formkit/core";
 import {
diff --git a/ui/src/formkit/inputs/role-select.ts b/ui/src/formkit/inputs/role-select.ts
index 81bedf0b9..ff98269c4 100644
--- a/ui/src/formkit/inputs/role-select.ts
+++ b/ui/src/formkit/inputs/role-select.ts
@@ -1,9 +1,9 @@
 import { rbacAnnotations } from "@/constants/annotations";
 import { roleLabels } from "@/constants/labels";
-import { coreApiClient } from "@halo-dev/api-client";
-import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
-import { select, selects, defaultIcon } from "@formkit/inputs";
 import { i18n } from "@/locales";
+import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
+import { defaultIcon, select, selects } from "@formkit/inputs";
+import { coreApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/singlePage-select.ts b/ui/src/formkit/inputs/singlePage-select.ts
index 6c882961c..3e6ee27cd 100644
--- a/ui/src/formkit/inputs/singlePage-select.ts
+++ b/ui/src/formkit/inputs/singlePage-select.ts
@@ -1,7 +1,7 @@
 import { singlePageLabels } from "@/constants/labels";
-import { consoleApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
-import { select, selects, defaultIcon } from "@formkit/inputs";
+import { defaultIcon, select, selects } from "@formkit/inputs";
+import { consoleApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/tag-checkbox.ts b/ui/src/formkit/inputs/tag-checkbox.ts
index d29373948..748f7b529 100644
--- a/ui/src/formkit/inputs/tag-checkbox.ts
+++ b/ui/src/formkit/inputs/tag-checkbox.ts
@@ -1,6 +1,6 @@
-import { coreApiClient } from "@halo-dev/api-client";
 import type { FormKitNode, FormKitTypeDefinition } from "@formkit/core";
 import { checkbox, checkboxes, defaultIcon } from "@formkit/inputs";
+import { coreApiClient } from "@halo-dev/api-client";
 
 function optionsHandler(node: FormKitNode) {
   node.on("created", async () => {
diff --git a/ui/src/formkit/inputs/tag-select/TagSelect.vue b/ui/src/formkit/inputs/tag-select/TagSelect.vue
index 6137a0973..54ea0c43c 100644
--- a/ui/src/formkit/inputs/tag-select/TagSelect.vue
+++ b/ui/src/formkit/inputs/tag-select/TagSelect.vue
@@ -1,20 +1,20 @@
 <script lang="ts" setup>
-import { coreApiClient } from "@halo-dev/api-client";
+import HasPermission from "@/components/permission/HasPermission.vue";
+import { usePermission } from "@/utils/permission";
+import PostTag from "@console/modules/contents/posts/tags/components/PostTag.vue";
+import { usePostTag } from "@console/modules/contents/posts/tags/composables/use-post-tag";
 import type { FormKitFrameworkContext } from "@formkit/core";
 import type { Tag } from "@halo-dev/api-client";
-import { computed, ref, watch, type PropType } from "vue";
-import PostTag from "@console/modules/contents/posts/tags/components/PostTag.vue";
+import { coreApiClient } from "@halo-dev/api-client";
 import {
-  IconCheckboxCircle,
   IconArrowRight,
+  IconCheckboxCircle,
   IconClose,
 } from "@halo-dev/components";
 import { onClickOutside } from "@vueuse/core";
 import Fuse from "fuse.js";
-import { usePermission } from "@/utils/permission";
 import { slugify } from "transliteration";
-import { usePostTag } from "@console/modules/contents/posts/tags/composables/use-post-tag";
-import HasPermission from "@/components/permission/HasPermission.vue";
+import { computed, ref, watch, type PropType } from "vue";
 
 const { currentUserHasPermission } = usePermission();
 
diff --git a/ui/src/formkit/inputs/verify-form/VerificationButton.vue b/ui/src/formkit/inputs/verify-form/VerificationButton.vue
index b181ba648..96b403580 100644
--- a/ui/src/formkit/inputs/verify-form/VerificationButton.vue
+++ b/ui/src/formkit/inputs/verify-form/VerificationButton.vue
@@ -1,14 +1,14 @@
 <script lang="ts" setup>
+import { i18n } from "@/locales";
+import { createMessage, type FormKitFrameworkContext } from "@formkit/core";
+import { axiosInstance } from "@halo-dev/api-client";
 import {
-  VButton,
-  Toast,
   IconCheckboxCircle,
   IconErrorWarning,
+  Toast,
+  VButton,
 } from "@halo-dev/components";
-import { createMessage, type FormKitFrameworkContext } from "@formkit/core";
 import type { PropType } from "vue";
-import { i18n } from "@/locales";
-import { axiosInstance } from "@halo-dev/api-client";
 import { nextTick, onMounted, ref } from "vue";
 
 const props = defineProps({
diff --git a/ui/src/formkit/inputs/verify-form/index.ts b/ui/src/formkit/inputs/verify-form/index.ts
index 8ddc4b26f..25b311111 100644
--- a/ui/src/formkit/inputs/verify-form/index.ts
+++ b/ui/src/formkit/inputs/verify-form/index.ts
@@ -5,8 +5,8 @@ import {
   message,
   messages,
 } from "@formkit/inputs";
-import { default as verifyFeature } from "./features";
 import VerificationButton from "./VerificationButton.vue";
+import { default as verifyFeature } from "./features";
 
 export const verifyInput = createSection("verificationForm", () => ({
   $el: "div",
diff --git a/ui/src/setup/setupComponents.ts b/ui/src/setup/setupComponents.ts
index 64c831716..b19ee2407 100644
--- a/ui/src/setup/setupComponents.ts
+++ b/ui/src/setup/setupComponents.ts
@@ -1,17 +1,17 @@
-import { defineAsyncComponent, type App } from "vue";
 import { vClosePopper, VLoading, vTooltip } from "@halo-dev/components";
 import { Dropdown } from "floating-vue";
 import "floating-vue/dist/style.css";
+import { defineAsyncComponent, type App } from "vue";
 // @ts-ignore
-import VueGridLayout from "vue-grid-layout";
-import { defaultConfig, plugin as FormKit } from "@formkit/vue";
-import FormKitConfig from "@/formkit/formkit.config";
-import FilterDropdown from "@/components/filter/FilterDropdown.vue";
 import FilterCleanButton from "@/components/filter/FilterCleanButton.vue";
-import SearchInput from "@/components/input/SearchInput.vue";
+import FilterDropdown from "@/components/filter/FilterDropdown.vue";
 import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
 import AttachmentFileTypeIcon from "@/components/icon/AttachmentFileTypeIcon.vue";
+import SearchInput from "@/components/input/SearchInput.vue";
 import HasPermission from "@/components/permission/HasPermission.vue";
+import FormKitConfig from "@/formkit/formkit.config";
+import { defaultConfig, plugin as FormKit } from "@formkit/vue";
+import VueGridLayout from "vue-grid-layout";
 
 export function setupComponents(app: App) {
   app.use(VueGridLayout);
diff --git a/ui/src/setup/setupStyles.ts b/ui/src/setup/setupStyles.ts
index 4d1db644f..d6a7ffa5b 100644
--- a/ui/src/setup/setupStyles.ts
+++ b/ui/src/setup/setupStyles.ts
@@ -1,5 +1,5 @@
-import "@halo-dev/richtext-editor/dist/style.css";
-import "@halo-dev/components/dist/style.css";
-import "@/styles/tailwind.css";
 import "@/styles/index.css";
+import "@/styles/tailwind.css";
+import "@halo-dev/components/dist/style.css";
+import "@halo-dev/richtext-editor/dist/style.css";
 import "overlayscrollbars/overlayscrollbars.css";
diff --git a/ui/src/setup/setupVueQuery.ts b/ui/src/setup/setupVueQuery.ts
index 439e9284f..330087c93 100644
--- a/ui/src/setup/setupVueQuery.ts
+++ b/ui/src/setup/setupVueQuery.ts
@@ -1,8 +1,8 @@
-import type { App } from "vue";
 import {
   VueQueryPlugin,
   type VueQueryPluginOptions,
 } from "@tanstack/vue-query";
+import type { App } from "vue";
 
 const networkMode = import.meta.env.PROD ? "online" : "always";
 
diff --git a/ui/src/stores/global-info.ts b/ui/src/stores/global-info.ts
index cd083ef44..5745776be 100644
--- a/ui/src/stores/global-info.ts
+++ b/ui/src/stores/global-info.ts
@@ -1,7 +1,7 @@
-import { defineStore } from "pinia";
 import type { GlobalInfo } from "@/types";
-import { ref } from "vue";
 import axios from "axios";
+import { defineStore } from "pinia";
+import { ref } from "vue";
 
 export const useGlobalInfoStore = defineStore("global-info", () => {
   const globalInfo = ref<GlobalInfo>();
diff --git a/ui/src/stores/plugin.ts b/ui/src/stores/plugin.ts
index 3cdebe7d0..7d2818b20 100644
--- a/ui/src/stores/plugin.ts
+++ b/ui/src/stores/plugin.ts
@@ -1,5 +1,5 @@
-import { defineStore } from "pinia";
 import type { PluginModule } from "@halo-dev/console-shared";
+import { defineStore } from "pinia";
 import { computed, ref } from "vue";
 
 export const usePluginModuleStore = defineStore("plugin", () => {
diff --git a/ui/src/stores/role.ts b/ui/src/stores/role.ts
index 26af3a9bf..f3f5bf986 100644
--- a/ui/src/stores/role.ts
+++ b/ui/src/stores/role.ts
@@ -1,5 +1,5 @@
-import { defineStore } from "pinia";
 import type { UserPermission } from "@halo-dev/api-client";
+import { defineStore } from "pinia";
 import { ref } from "vue";
 
 export const useRoleStore = defineStore("role", () => {
diff --git a/ui/src/stores/user.ts b/ui/src/stores/user.ts
index 082e5e634..441851bb6 100644
--- a/ui/src/stores/user.ts
+++ b/ui/src/stores/user.ts
@@ -1,5 +1,5 @@
-import { consoleApiClient } from "@halo-dev/api-client";
 import type { Role, User } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import { defineStore } from "pinia";
 
 interface UserStoreState {
diff --git a/ui/src/utils/date.ts b/ui/src/utils/date.ts
index b1e4da04e..0ef2a85a0 100644
--- a/ui/src/utils/date.ts
+++ b/ui/src/utils/date.ts
@@ -1,11 +1,11 @@
 import { i18n } from "@/locales";
 import dayjs from "dayjs";
-import "dayjs/locale/zh-cn";
 import "dayjs/locale/en";
+import "dayjs/locale/zh-cn";
 import "dayjs/locale/zh-tw";
+import relativeTime from "dayjs/plugin/relativeTime";
 import timezone from "dayjs/plugin/timezone";
 import utc from "dayjs/plugin/utc";
-import relativeTime from "dayjs/plugin/relativeTime";
 dayjs.extend(timezone);
 dayjs.extend(utc);
 dayjs.extend(relativeTime);
diff --git a/ui/uc-src/layouts/BasicLayout.vue b/ui/uc-src/layouts/BasicLayout.vue
index b946b0c75..5db0136d3 100644
--- a/ui/uc-src/layouts/BasicLayout.vue
+++ b/ui/uc-src/layouts/BasicLayout.vue
@@ -1,29 +1,29 @@
 <script lang="ts" setup>
+import LoginModal from "@/components/login/LoginModal.vue";
+import { RoutesMenu } from "@/components/menu/RoutesMenu";
+import { useRouteMenuGenerator } from "@/composables/use-route-menu-generator";
+import { rbacAnnotations } from "@/constants/annotations";
+import { useUserStore } from "@/stores/user";
+import { coreMenuGroups } from "@console/router/constant";
 import {
-  IconMore,
-  IconUserSettings,
-  VTag,
-  VAvatar,
   Dialog,
   IconLogoutCircleRLine,
+  IconMore,
   IconSettings3Line,
+  IconUserSettings,
+  VAvatar,
+  VTag,
 } from "@halo-dev/components";
-import { RoutesMenu } from "@/components/menu/RoutesMenu";
-import IconLogo from "~icons/core/logo?width=5rem&height=2rem";
-import { RouterView, useRoute, useRouter } from "vue-router";
-import { computed, onMounted, reactive, ref } from "vue";
 import axios from "axios";
-import LoginModal from "@/components/login/LoginModal.vue";
-import { coreMenuGroups } from "@console/router/constant";
-import { useUserStore } from "@/stores/user";
-import { rbacAnnotations } from "@/constants/annotations";
-import { defineStore, storeToRefs } from "pinia";
-import { useI18n } from "vue-i18n";
 import {
   useOverlayScrollbars,
   type UseOverlayScrollbarsParams,
 } from "overlayscrollbars-vue";
-import { useRouteMenuGenerator } from "@/composables/use-route-menu-generator";
+import { defineStore, storeToRefs } from "pinia";
+import { computed, onMounted, reactive, ref } from "vue";
+import { useI18n } from "vue-i18n";
+import { RouterView, useRoute, useRouter } from "vue-router";
+import IconLogo from "~icons/core/logo?width=5rem&height=2rem";
 
 const route = useRoute();
 const router = useRouter();
diff --git a/ui/uc-src/main.ts b/ui/uc-src/main.ts
index 44757a976..071543843 100644
--- a/ui/uc-src/main.ts
+++ b/ui/uc-src/main.ts
@@ -1,18 +1,18 @@
+import { getBrowserLanguage, i18n, setupI18n } from "@/locales";
+import { setupApiClient } from "@/setup/setupApiClient";
+import { setupComponents } from "@/setup/setupComponents";
 import "@/setup/setupStyles";
+import { setupVueQuery } from "@/setup/setupVueQuery";
+import { useGlobalInfoStore } from "@/stores/global-info";
+import { useRoleStore } from "@/stores/role";
+import { useUserStore } from "@/stores/user";
+import { hasPermission } from "@/utils/permission";
+import { consoleApiClient } from "@halo-dev/api-client";
+import router from "@uc/router";
+import { setupCoreModules, setupPluginModules } from "@uc/setup/setupModules";
+import { createPinia } from "pinia";
 import { createApp, type DirectiveBinding } from "vue";
 import App from "./App.vue";
-import { setupVueQuery } from "@/setup/setupVueQuery";
-import { setupComponents } from "@/setup/setupComponents";
-import { getBrowserLanguage, i18n, setupI18n } from "@/locales";
-import { createPinia } from "pinia";
-import { setupCoreModules, setupPluginModules } from "@uc/setup/setupModules";
-import router from "@uc/router";
-import { useUserStore } from "@/stores/user";
-import { consoleApiClient } from "@halo-dev/api-client";
-import { useRoleStore } from "@/stores/role";
-import { hasPermission } from "@/utils/permission";
-import { useGlobalInfoStore } from "@/stores/global-info";
-import { setupApiClient } from "@/setup/setupApiClient";
 
 const app = createApp(App);
 
diff --git a/ui/uc-src/modules/contents/posts/PostEditor.vue b/ui/uc-src/modules/contents/posts/PostEditor.vue
index b3afd33d3..b6c4dd231 100644
--- a/ui/uc-src/modules/contents/posts/PostEditor.vue
+++ b/ui/uc-src/modules/contents/posts/PostEditor.vue
@@ -1,6 +1,16 @@
 <script lang="ts" setup>
+import EditorProviderSelector from "@/components/dropdown-selector/EditorProviderSelector.vue";
+import HasPermission from "@/components/permission/HasPermission.vue";
+import { useAutoSaveContent } from "@/composables/use-auto-save-content";
+import { useContentCache } from "@/composables/use-content-cache";
 import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points";
-import type { EditorProvider } from "@halo-dev/console-shared";
+import { useSessionKeepAlive } from "@/composables/use-session-keep-alive";
+import { contentAnnotations } from "@/constants/annotations";
+import { randomUUID } from "@/utils/id";
+import { usePermission } from "@/utils/permission";
+import { useSaveKeybinding } from "@console/composables/use-save-keybinding";
+import type { Content, Post, Snapshot } from "@halo-dev/api-client";
+import { ucApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconBookRead,
@@ -12,28 +22,18 @@ import {
   VPageHeader,
   VSpace,
 } from "@halo-dev/components";
-import EditorProviderSelector from "@/components/dropdown-selector/EditorProviderSelector.vue";
+import type { EditorProvider } from "@halo-dev/console-shared";
+import { useMutation } from "@tanstack/vue-query";
+import { usePostUpdateMutate } from "@uc/modules/contents/posts/composables/use-post-update-mutate";
+import { useLocalStorage } from "@vueuse/core";
+import { useRouteQuery } from "@vueuse/router";
+import type { AxiosRequestConfig } from "axios";
 import type { ComputedRef } from "vue";
 import { computed, nextTick, onMounted, provide, ref, toRef, watch } from "vue";
-import { useLocalStorage } from "@vueuse/core";
-import type { Content, Post, Snapshot } from "@halo-dev/api-client";
-import { randomUUID } from "@/utils/id";
-import { contentAnnotations } from "@/constants/annotations";
-import { useRouteQuery } from "@vueuse/router";
-import { ucApiClient } from "@halo-dev/api-client";
-import { useRouter } from "vue-router";
 import { useI18n } from "vue-i18n";
-import { useMutation } from "@tanstack/vue-query";
-import { useSaveKeybinding } from "@console/composables/use-save-keybinding";
+import { useRouter } from "vue-router";
 import PostCreationModal from "./components/PostCreationModal.vue";
 import PostSettingEditModal from "./components/PostSettingEditModal.vue";
-import HasPermission from "@/components/permission/HasPermission.vue";
-import { useSessionKeepAlive } from "@/composables/use-session-keep-alive";
-import { usePermission } from "@/utils/permission";
-import type { AxiosRequestConfig } from "axios";
-import { useContentCache } from "@/composables/use-content-cache";
-import { useAutoSaveContent } from "@/composables/use-auto-save-content";
-import { usePostUpdateMutate } from "@uc/modules/contents/posts/composables/use-post-update-mutate";
 
 const router = useRouter();
 const { t } = useI18n();
diff --git a/ui/uc-src/modules/contents/posts/PostList.vue b/ui/uc-src/modules/contents/posts/PostList.vue
index 66acb34e0..d059cc693 100644
--- a/ui/uc-src/modules/contents/posts/PostList.vue
+++ b/ui/uc-src/modules/contents/posts/PostList.vue
@@ -1,6 +1,6 @@
 <script lang="ts" setup>
+import { postLabels } from "@/constants/labels";
 import { ucApiClient } from "@halo-dev/api-client";
-import { useQuery } from "@tanstack/vue-query";
 import {
   IconAddCircle,
   IconBookRead,
@@ -13,10 +13,10 @@ import {
   VPagination,
   VSpace,
 } from "@halo-dev/components";
-import PostListItem from "./components/PostListItem.vue";
+import { useQuery } from "@tanstack/vue-query";
 import { useRouteQuery } from "@vueuse/router";
 import { computed, watch } from "vue";
-import { postLabels } from "@/constants/labels";
+import PostListItem from "./components/PostListItem.vue";
 
 const page = useRouteQuery<number>("page", 1, {
   transform: Number,
diff --git a/ui/uc-src/modules/contents/posts/components/PostCreationModal.vue b/ui/uc-src/modules/contents/posts/components/PostCreationModal.vue
index 90fb4440e..e3e834338 100644
--- a/ui/uc-src/modules/contents/posts/components/PostCreationModal.vue
+++ b/ui/uc-src/modules/contents/posts/components/PostCreationModal.vue
@@ -1,14 +1,14 @@
 <script lang="ts" setup>
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
-import { ref } from "vue";
-import PostSettingForm from "./PostSettingForm.vue";
-import type { Content, Post } from "@halo-dev/api-client";
-import type { PostFormState } from "../types";
-import { useMutation } from "@tanstack/vue-query";
-import { useI18n } from "vue-i18n";
-import { randomUUID } from "@/utils/id";
 import { contentAnnotations } from "@/constants/annotations";
+import { randomUUID } from "@/utils/id";
+import type { Content, Post } from "@halo-dev/api-client";
 import { ucApiClient } from "@halo-dev/api-client";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
+import { useMutation } from "@tanstack/vue-query";
+import { ref } from "vue";
+import { useI18n } from "vue-i18n";
+import type { PostFormState } from "../types";
+import PostSettingForm from "./PostSettingForm.vue";
 
 const { t } = useI18n();
 
diff --git a/ui/uc-src/modules/contents/posts/components/PostListItem.vue b/ui/uc-src/modules/contents/posts/components/PostListItem.vue
index 8e0c78e2e..4e47ec7e5 100644
--- a/ui/uc-src/modules/contents/posts/components/PostListItem.vue
+++ b/ui/uc-src/modules/contents/posts/components/PostListItem.vue
@@ -1,4 +1,11 @@
 <script lang="ts" setup>
+import StatusDotField from "@/components/entity-fields/StatusDotField.vue";
+import HasPermission from "@/components/permission/HasPermission.vue";
+import { postLabels } from "@/constants/labels";
+import { formatDatetime } from "@/utils/date";
+import PostTag from "@console/modules/contents/posts/tags/components/PostTag.vue";
+import type { ListedPost } from "@halo-dev/api-client";
+import { ucApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconExternalLinkLine,
@@ -15,16 +22,9 @@ import {
   VSpace,
   VStatusDot,
 } from "@halo-dev/components";
-import type { ListedPost } from "@halo-dev/api-client";
-import { computed } from "vue";
-import { postLabels } from "@/constants/labels";
-import PostTag from "@console/modules/contents/posts/tags/components/PostTag.vue";
-import { formatDatetime } from "@/utils/date";
-import StatusDotField from "@/components/entity-fields/StatusDotField.vue";
-import { useI18n } from "vue-i18n";
-import HasPermission from "@/components/permission/HasPermission.vue";
-import { ucApiClient } from "@halo-dev/api-client";
 import { useQueryClient } from "@tanstack/vue-query";
+import { computed } from "vue";
+import { useI18n } from "vue-i18n";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();
diff --git a/ui/uc-src/modules/contents/posts/components/PostSettingEditModal.vue b/ui/uc-src/modules/contents/posts/components/PostSettingEditModal.vue
index 17522d21f..120915c61 100644
--- a/ui/uc-src/modules/contents/posts/components/PostSettingEditModal.vue
+++ b/ui/uc-src/modules/contents/posts/components/PostSettingEditModal.vue
@@ -1,12 +1,12 @@
 <script lang="ts" setup>
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
-import PostSettingForm from "./PostSettingForm.vue";
-import type { PostFormState } from "../types";
+import { toDatetimeLocal } from "@/utils/date";
 import type { Post } from "@halo-dev/api-client";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
+import { usePostUpdateMutate } from "@uc/modules/contents/posts/composables/use-post-update-mutate";
 import { ref } from "vue";
 import { useI18n } from "vue-i18n";
-import { toDatetimeLocal } from "@/utils/date";
-import { usePostUpdateMutate } from "@uc/modules/contents/posts/composables/use-post-update-mutate";
+import type { PostFormState } from "../types";
+import PostSettingForm from "./PostSettingForm.vue";
 
 const { t } = useI18n();
 
diff --git a/ui/uc-src/modules/contents/posts/components/PostSettingForm.vue b/ui/uc-src/modules/contents/posts/components/PostSettingForm.vue
index 7f465be85..2e03719dc 100644
--- a/ui/uc-src/modules/contents/posts/components/PostSettingForm.vue
+++ b/ui/uc-src/modules/contents/posts/components/PostSettingForm.vue
@@ -1,13 +1,12 @@
 <script lang="ts" setup>
-import { IconRefreshLine } from "@halo-dev/components";
-import type { PostFormState } from "../types";
-import { formatDatetime, toISOString } from "@/utils/date";
-import { computed } from "vue";
-import useSlugify from "@console/composables/use-slugify";
-import { FormType } from "@/types/slug";
-import { ref } from "vue";
 import HasPermission from "@/components/permission/HasPermission.vue";
+import { FormType } from "@/types/slug";
+import { formatDatetime, toISOString } from "@/utils/date";
+import useSlugify from "@console/composables/use-slugify";
+import { IconRefreshLine } from "@halo-dev/components";
+import { computed, ref } from "vue";
 import { useI18n } from "vue-i18n";
+import type { PostFormState } from "../types";
 
 const { t } = useI18n();
 
diff --git a/ui/uc-src/modules/contents/posts/composables/use-post-update-mutate.ts b/ui/uc-src/modules/contents/posts/composables/use-post-update-mutate.ts
index 392917484..121b4ea58 100644
--- a/ui/uc-src/modules/contents/posts/composables/use-post-update-mutate.ts
+++ b/ui/uc-src/modules/contents/posts/composables/use-post-update-mutate.ts
@@ -1,7 +1,7 @@
-import { useMutation } from "@tanstack/vue-query";
 import type { Post } from "@halo-dev/api-client";
 import { ucApiClient } from "@halo-dev/api-client";
 import { Toast } from "@halo-dev/components";
+import { useMutation } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
 
 export function usePostUpdateMutate() {
diff --git a/ui/uc-src/modules/contents/posts/module.ts b/ui/uc-src/modules/contents/posts/module.ts
index 54f820600..a676904b0 100644
--- a/ui/uc-src/modules/contents/posts/module.ts
+++ b/ui/uc-src/modules/contents/posts/module.ts
@@ -1,9 +1,9 @@
+import { IconBookRead } from "@halo-dev/components";
 import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@uc/layouts/BasicLayout.vue";
-import { IconBookRead } from "@halo-dev/components";
-import PostList from "./PostList.vue";
 import { markRaw } from "vue";
 import PostEditor from "./PostEditor.vue";
+import PostList from "./PostList.vue";
 
 export default definePlugin({
   ucRoutes: [
diff --git a/ui/uc-src/modules/notifications/Notifications.vue b/ui/uc-src/modules/notifications/Notifications.vue
index 9040340c3..3d0a8e6f6 100644
--- a/ui/uc-src/modules/notifications/Notifications.vue
+++ b/ui/uc-src/modules/notifications/Notifications.vue
@@ -11,11 +11,11 @@ import {
   VTabbar,
 } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
-import { computed } from "vue";
 import { useRouteQuery } from "@vueuse/router";
-import NotificationListItem from "./components/NotificationListItem.vue";
 import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
+import { computed } from "vue";
 import NotificationContent from "./components/NotificationContent.vue";
+import NotificationListItem from "./components/NotificationListItem.vue";
 
 const { currentUser } = useUserStore();
 
diff --git a/ui/uc-src/modules/notifications/components/NotificationContent.vue b/ui/uc-src/modules/notifications/components/NotificationContent.vue
index 562a7cb90..cc079b8f8 100644
--- a/ui/uc-src/modules/notifications/components/NotificationContent.vue
+++ b/ui/uc-src/modules/notifications/components/NotificationContent.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import type { Notification } from "@halo-dev/api-client";
-import { computed } from "vue";
 import { OverlayScrollbarsComponent } from "overlayscrollbars-vue";
+import { computed } from "vue";
 
 const props = withDefaults(
   defineProps<{
diff --git a/ui/uc-src/modules/notifications/components/NotificationListItem.vue b/ui/uc-src/modules/notifications/components/NotificationListItem.vue
index 232a69cd7..96d21ca0c 100644
--- a/ui/uc-src/modules/notifications/components/NotificationListItem.vue
+++ b/ui/uc-src/modules/notifications/components/NotificationListItem.vue
@@ -1,12 +1,11 @@
 <script lang="ts" setup>
 import { useUserStore } from "@/stores/user";
-import { ucApiClient } from "@halo-dev/api-client";
 import { relativeTimeTo } from "@/utils/date";
 import type { Notification } from "@halo-dev/api-client";
-import { useMutation, useQueryClient } from "@tanstack/vue-query";
+import { ucApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast, VStatusDot } from "@halo-dev/components";
-import { watch } from "vue";
-import { ref } from "vue";
+import { useMutation, useQueryClient } from "@tanstack/vue-query";
+import { ref, watch } from "vue";
 import { useI18n } from "vue-i18n";
 
 const queryClient = useQueryClient();
diff --git a/ui/uc-src/modules/notifications/module.ts b/ui/uc-src/modules/notifications/module.ts
index 53472106f..d96e8719c 100644
--- a/ui/uc-src/modules/notifications/module.ts
+++ b/ui/uc-src/modules/notifications/module.ts
@@ -1,6 +1,6 @@
+import { IconNotificationBadgeLine } from "@halo-dev/components";
 import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@uc/layouts/BasicLayout.vue";
-import { IconNotificationBadgeLine } from "@halo-dev/components";
 import { markRaw } from "vue";
 import Notifications from "./Notifications.vue";
 
diff --git a/ui/uc-src/modules/profile/Profile.vue b/ui/uc-src/modules/profile/Profile.vue
index cf346fce0..cee42b209 100644
--- a/ui/uc-src/modules/profile/Profile.vue
+++ b/ui/uc-src/modules/profile/Profile.vue
@@ -1,8 +1,8 @@
 <script lang="ts" setup>
 import UserAvatar from "@/components/user-avatar/UserAvatar.vue";
 import { usePluginModuleStore } from "@/stores/plugin";
-import { consoleApiClient } from "@halo-dev/api-client";
 import type { DetailedUser } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import {
   VButton,
   VDropdown,
diff --git a/ui/uc-src/modules/profile/components/EmailVerifyModal.vue b/ui/uc-src/modules/profile/components/EmailVerifyModal.vue
index 60ad3040f..985b1798d 100644
--- a/ui/uc-src/modules/profile/components/EmailVerifyModal.vue
+++ b/ui/uc-src/modules/profile/components/EmailVerifyModal.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
 import { useUserStore } from "@/stores/user";
-import { consoleApiClient } from "@halo-dev/api-client";
 import type { VerifyCodeRequest } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import { useMutation, useQueryClient } from "@tanstack/vue-query";
 import { useIntervalFn } from "@vueuse/shared";
diff --git a/ui/uc-src/modules/profile/components/PasswordChangeModal.vue b/ui/uc-src/modules/profile/components/PasswordChangeModal.vue
index 75e976b00..f688893e9 100644
--- a/ui/uc-src/modules/profile/components/PasswordChangeModal.vue
+++ b/ui/uc-src/modules/profile/components/PasswordChangeModal.vue
@@ -1,10 +1,10 @@
 <script lang="ts" setup>
-import { VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
-import { onMounted, ref } from "vue";
-import { consoleApiClient } from "@halo-dev/api-client";
-import { cloneDeep } from "lodash-es";
 import { setFocus } from "@/formkit/utils/focus";
+import { consoleApiClient } from "@halo-dev/api-client";
+import { VButton, VModal, VSpace } from "@halo-dev/components";
+import { cloneDeep } from "lodash-es";
+import { onMounted, ref } from "vue";
 
 const emit = defineEmits<{
   (event: "close"): void;
diff --git a/ui/uc-src/modules/profile/components/PersonalAccessTokenCreationModal.vue b/ui/uc-src/modules/profile/components/PersonalAccessTokenCreationModal.vue
index c84564ece..3a0ecb5f4 100644
--- a/ui/uc-src/modules/profile/components/PersonalAccessTokenCreationModal.vue
+++ b/ui/uc-src/modules/profile/components/PersonalAccessTokenCreationModal.vue
@@ -1,17 +1,17 @@
 <script lang="ts" setup>
 import SubmitButton from "@/components/button/SubmitButton.vue";
+import { useRoleTemplateSelection } from "@/composables/use-role";
 import { patAnnotations, rbacAnnotations } from "@/constants/annotations";
-import { ucApiClient } from "@halo-dev/api-client";
+import { roleLabels } from "@/constants/labels";
+import { useRoleStore } from "@/stores/role";
 import { toISOString } from "@/utils/date";
+import type { PatSpec, PersonalAccessToken } from "@halo-dev/api-client";
+import { ucApiClient } from "@halo-dev/api-client";
 import { Dialog, Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import { useMutation, useQueryClient } from "@tanstack/vue-query";
 import { useClipboard } from "@vueuse/core";
-import type { PatSpec, PersonalAccessToken } from "@halo-dev/api-client";
 import { computed, ref } from "vue";
-import { useRoleTemplateSelection } from "@/composables/use-role";
-import { useRoleStore } from "@/stores/role";
 import { useI18n } from "vue-i18n";
-import { roleLabels } from "@/constants/labels";
 
 const queryClient = useQueryClient();
 const { t } = useI18n();
diff --git a/ui/uc-src/modules/profile/components/PersonalAccessTokenListItem.vue b/ui/uc-src/modules/profile/components/PersonalAccessTokenListItem.vue
index 621e1b7b1..5b736c16c 100644
--- a/ui/uc-src/modules/profile/components/PersonalAccessTokenListItem.vue
+++ b/ui/uc-src/modules/profile/components/PersonalAccessTokenListItem.vue
@@ -1,7 +1,7 @@
 <script lang="ts" setup>
-import { ucApiClient } from "@halo-dev/api-client";
 import { formatDatetime, relativeTimeTo } from "@/utils/date";
 import type { PersonalAccessToken } from "@halo-dev/api-client";
+import { ucApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   Toast,
diff --git a/ui/uc-src/modules/profile/components/ProfileEditingModal.vue b/ui/uc-src/modules/profile/components/ProfileEditingModal.vue
index dade1e9e5..d60546fff 100644
--- a/ui/uc-src/modules/profile/components/ProfileEditingModal.vue
+++ b/ui/uc-src/modules/profile/components/ProfileEditingModal.vue
@@ -1,21 +1,21 @@
 <script lang="ts" setup>
 // core libs
-import { onMounted, ref } from "vue";
-import { consoleApiClient } from "@halo-dev/api-client";
 import type { User } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
+import { onMounted, ref } from "vue";
 
 // components
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import SubmitButton from "@/components/button/SubmitButton.vue";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 
 // libs
 import { cloneDeep } from "lodash-es";
 
 // hooks
 import { setFocus } from "@/formkit/utils/focus";
-import { useI18n } from "vue-i18n";
-import { useQueryClient } from "@tanstack/vue-query";
 import { useUserStore } from "@/stores/user";
+import { useQueryClient } from "@tanstack/vue-query";
+import { useI18n } from "vue-i18n";
 import EmailVerifyModal from "./EmailVerifyModal.vue";
 
 const { t } = useI18n();
diff --git a/ui/uc-src/modules/profile/composables/use-user.ts b/ui/uc-src/modules/profile/composables/use-user.ts
index 04ccc456f..b35a24613 100644
--- a/ui/uc-src/modules/profile/composables/use-user.ts
+++ b/ui/uc-src/modules/profile/composables/use-user.ts
@@ -1,7 +1,7 @@
-import type { Ref } from "vue";
-import { onMounted, ref } from "vue";
 import type { User } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
+import type { Ref } from "vue";
+import { onMounted, ref } from "vue";
 
 interface useUserFetchReturn {
   users: Ref<User[]>;
diff --git a/ui/uc-src/modules/profile/module.ts b/ui/uc-src/modules/profile/module.ts
index 773d9a500..efea34072 100644
--- a/ui/uc-src/modules/profile/module.ts
+++ b/ui/uc-src/modules/profile/module.ts
@@ -1,6 +1,6 @@
+import { IconAccountCircleLine } from "@halo-dev/components";
 import { definePlugin } from "@halo-dev/console-shared";
 import BasicLayout from "@uc/layouts/BasicLayout.vue";
-import { IconAccountCircleLine } from "@halo-dev/components";
 import { markRaw } from "vue";
 import Profile from "./Profile.vue";
 
diff --git a/ui/uc-src/modules/profile/tabs/Detail.vue b/ui/uc-src/modules/profile/tabs/Detail.vue
index 450b69b99..7aaa68e01 100644
--- a/ui/uc-src/modules/profile/tabs/Detail.vue
+++ b/ui/uc-src/modules/profile/tabs/Detail.vue
@@ -1,4 +1,8 @@
 <script lang="ts" setup>
+import { rbacAnnotations } from "@/constants/annotations";
+import { formatDatetime } from "@/utils/date";
+import type { DetailedUser, ListedAuthProvider } from "@halo-dev/api-client";
+import { consoleApiClient } from "@halo-dev/api-client";
 import {
   Dialog,
   IconUserSettings,
@@ -8,16 +12,12 @@ import {
   VDescriptionItem,
   VTag,
 } from "@halo-dev/components";
-import { computed, ref } from "vue";
-import type { DetailedUser, ListedAuthProvider } from "@halo-dev/api-client";
-import { rbacAnnotations } from "@/constants/annotations";
-import { formatDatetime } from "@/utils/date";
 import { useQuery } from "@tanstack/vue-query";
-import { consoleApiClient } from "@halo-dev/api-client";
 import axios from "axios";
+import { computed, ref } from "vue";
 import { useI18n } from "vue-i18n";
-import EmailVerifyModal from "../components/EmailVerifyModal.vue";
 import RiVerifiedBadgeLine from "~icons/ri/verified-badge-line";
+import EmailVerifyModal from "../components/EmailVerifyModal.vue";
 
 withDefaults(defineProps<{ user?: DetailedUser }>(), { user: undefined });
 
diff --git a/ui/uc-src/modules/profile/tabs/NotificationPreferences.vue b/ui/uc-src/modules/profile/tabs/NotificationPreferences.vue
index 4e91d16dd..332e8f1d5 100644
--- a/ui/uc-src/modules/profile/tabs/NotificationPreferences.vue
+++ b/ui/uc-src/modules/profile/tabs/NotificationPreferences.vue
@@ -1,14 +1,14 @@
 <script lang="ts" setup>
-import { ucApiClient } from "@halo-dev/api-client";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
+import HasPermission from "@/components/permission/HasPermission.vue";
 import type {
   DetailedUser,
   ReasonTypeNotifierRequest,
 } from "@halo-dev/api-client";
+import { ucApiClient } from "@halo-dev/api-client";
 import { VLoading, VSwitch } from "@halo-dev/components";
-import { computed } from "vue";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
 import { cloneDeep } from "lodash-es";
-import HasPermission from "@/components/permission/HasPermission.vue";
+import { computed } from "vue";
 
 const props = withDefaults(defineProps<{ user?: DetailedUser }>(), {
   user: undefined,
diff --git a/ui/uc-src/modules/profile/tabs/PersonalAccessTokens.vue b/ui/uc-src/modules/profile/tabs/PersonalAccessTokens.vue
index 86e71f36a..9d2bcba5f 100644
--- a/ui/uc-src/modules/profile/tabs/PersonalAccessTokens.vue
+++ b/ui/uc-src/modules/profile/tabs/PersonalAccessTokens.vue
@@ -1,4 +1,6 @@
 <script lang="ts" setup>
+import type { PersonalAccessToken } from "@halo-dev/api-client";
+import { ucApiClient } from "@halo-dev/api-client";
 import {
   IconAddCircle,
   VButton,
@@ -6,10 +8,8 @@ import {
   VLoading,
   VSpace,
 } from "@halo-dev/components";
-import { ref } from "vue";
-import { ucApiClient } from "@halo-dev/api-client";
-import type { PersonalAccessToken } from "@halo-dev/api-client";
 import { useQuery } from "@tanstack/vue-query";
+import { ref } from "vue";
 import PersonalAccessTokenCreationModal from "../components/PersonalAccessTokenCreationModal.vue";
 import PersonalAccessTokenListItem from "../components/PersonalAccessTokenListItem.vue";
 
diff --git a/ui/uc-src/modules/profile/tabs/TwoFactor.vue b/ui/uc-src/modules/profile/tabs/TwoFactor.vue
index bf5e09bfe..eadbf4f61 100644
--- a/ui/uc-src/modules/profile/tabs/TwoFactor.vue
+++ b/ui/uc-src/modules/profile/tabs/TwoFactor.vue
@@ -1,7 +1,6 @@
 <script lang="ts" setup>
-import TotpConfigureModal from "./components/TotpConfigureModal.vue";
-import TotpDeletionModal from "./components/TotpDeletionModal.vue";
-import { ref } from "vue";
+import StatusDotField from "@/components/entity-fields/StatusDotField.vue";
+import { ucApiClient } from "@halo-dev/api-client";
 import {
   VButton,
   VEntity,
@@ -10,11 +9,12 @@ import {
   VSpace,
 } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
-import { ucApiClient } from "@halo-dev/api-client";
-import StatusDotField from "@/components/entity-fields/StatusDotField.vue";
+import { ref } from "vue";
 import RiShieldKeyholeLine from "~icons/ri/shield-keyhole-line";
-import TwoFactorEnableModal from "./components/TwoFactorEnableModal.vue";
+import TotpConfigureModal from "./components/TotpConfigureModal.vue";
+import TotpDeletionModal from "./components/TotpDeletionModal.vue";
 import TwoFactorDisableModal from "./components/TwoFactorDisableModal.vue";
+import TwoFactorEnableModal from "./components/TwoFactorEnableModal.vue";
 
 const { data: settings, isLoading } = useQuery({
   queryKey: ["two-factor-settings"],
diff --git a/ui/uc-src/modules/profile/tabs/components/TotpConfigureModal.vue b/ui/uc-src/modules/profile/tabs/components/TotpConfigureModal.vue
index 40a85be4a..d2255ffd2 100644
--- a/ui/uc-src/modules/profile/tabs/components/TotpConfigureModal.vue
+++ b/ui/uc-src/modules/profile/tabs/components/TotpConfigureModal.vue
@@ -1,11 +1,10 @@
 <script lang="ts" setup>
+import type { TotpRequest } from "@halo-dev/api-client";
 import { ucApiClient } from "@halo-dev/api-client";
+import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
 import { useQRCode } from "@vueuse/integrations/useQRCode";
-import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
-import { computed } from "vue";
-import type { TotpRequest } from "@halo-dev/api-client";
-import { ref } from "vue";
+import { computed, ref } from "vue";
 
 const queryClient = useQueryClient();
 
diff --git a/ui/uc-src/router/index.ts b/ui/uc-src/router/index.ts
index 98df46a39..49e24ba85 100644
--- a/ui/uc-src/router/index.ts
+++ b/ui/uc-src/router/index.ts
@@ -1,10 +1,10 @@
+import routesConfig from "@uc/router/routes.config";
 import {
   createRouter,
   createWebHistory,
   type RouteLocationNormalized,
   type RouteLocationNormalizedLoaded,
 } from "vue-router";
-import routesConfig from "@uc/router/routes.config";
 import { setupAuthCheckGuard } from "./guards/auth-check";
 import { setupPermissionGuard } from "./guards/permission";
 
diff --git a/ui/uc-src/router/routes.config.ts b/ui/uc-src/router/routes.config.ts
index 417d3856e..e065b7032 100644
--- a/ui/uc-src/router/routes.config.ts
+++ b/ui/uc-src/router/routes.config.ts
@@ -1,9 +1,9 @@
-import type { RouteRecordRaw } from "vue-router";
-import NotFound from "@/views/exceptions/NotFound.vue";
+import GatewayLayout from "@/layouts/GatewayLayout.vue";
 import Forbidden from "@/views/exceptions/Forbidden.vue";
+import NotFound from "@/views/exceptions/NotFound.vue";
 import BasicLayout from "@uc/layouts/BasicLayout.vue";
 import ResetPassword from "@uc/views/ResetPassword.vue";
-import GatewayLayout from "@/layouts/GatewayLayout.vue";
+import type { RouteRecordRaw } from "vue-router";
 
 export const routes: Array<RouteRecordRaw> = [
   {
diff --git a/ui/uc-src/setup/setupModules.ts b/ui/uc-src/setup/setupModules.ts
index 31cc4da28..dd67050aa 100644
--- a/ui/uc-src/setup/setupModules.ts
+++ b/ui/uc-src/setup/setupModules.ts
@@ -1,13 +1,13 @@
 import { i18n } from "@/locales";
+import { usePluginModuleStore } from "@/stores/plugin";
+import { loadStyle } from "@/utils/load-style";
+import { Toast } from "@halo-dev/components";
+import type { PluginModule, RouteRecordAppend } from "@halo-dev/console-shared";
 import modules from "@uc/modules";
 import router from "@uc/router";
-import { usePluginModuleStore } from "@/stores/plugin";
-import type { PluginModule, RouteRecordAppend } from "@halo-dev/console-shared";
 import { useScriptTag } from "@vueuse/core";
-import { Toast } from "@halo-dev/components";
 import type { App } from "vue";
 import type { RouteRecordRaw } from "vue-router";
-import { loadStyle } from "@/utils/load-style";
 
 export function setupCoreModules(app: App) {
   modules.forEach((module) => {
diff --git a/ui/vite.config.ts b/ui/vite.config.ts
index 57d74b1a2..f5ccc933a 100644
--- a/ui/vite.config.ts
+++ b/ui/vite.config.ts
@@ -1,6 +1,6 @@
+import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite";
 import path from "path";
 import { Plugin } from "vite";
-import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite";
 import { createViteConfig } from "./src/vite/config-builder";
 
 export default ({ mode }: { mode: string }) => {
diff --git a/ui/vite.uc.config.ts b/ui/vite.uc.config.ts
index d8280ae1f..58e21a492 100644
--- a/ui/vite.uc.config.ts
+++ b/ui/vite.uc.config.ts
@@ -1,7 +1,7 @@
-import path from "path";
 import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite";
-import { createViteConfig } from "./src/vite/config-builder";
+import path from "path";
 import { Plugin } from "vite";
+import { createViteConfig } from "./src/vite/config-builder";
 
 export default ({ mode }: { mode: string }) => {
   return createViteConfig({
diff --git a/ui/vitest.config.ts b/ui/vitest.config.ts
index 8f159d5fd..84a920b2d 100644
--- a/ui/vitest.config.ts
+++ b/ui/vitest.config.ts
@@ -1,9 +1,9 @@
-import { defineConfig } from "vitest/config";
-import { fileURLToPath, URL } from "url";
 import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite";
-import { sharedPlugins } from "./src/vite/config-builder";
 import path from "path";
+import { fileURLToPath, URL } from "url";
 import type { Plugin } from "vite";
+import { defineConfig } from "vitest/config";
+import { sharedPlugins } from "./src/vite/config-builder";
 
 export default defineConfig({
   plugins: [