chore: add prettier-plugin-organize-imports plugin to organize imports

Signed-off-by: Ryan Wang <[email protected]>

ui/.vscode/settings.json

@@ -30,9 +30,5 @@
   },
   "[yaml]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
-  },
-  "editor.codeActionsOnSave": {
-    "source.organizeImports": "explicit",
-    "source.fixAll": "never"
   }
 }

ui/console-src/modules/contents/attachments/AttachmentList.vue

@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import UserFilterDropdown from "@/components/filter/UserFilterDropdown.vue";
 import LazyImage from "@/components/image/LazyImage.vue";
+import LazyVideo from "@/components/video/LazyVideo.vue";
 import { isImage } from "@/utils/image";
 import type { Attachment, Group } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
@@ -31,16 +32,15 @@ import type { Ref } from "vue";
 import { computed, onMounted, provide, ref, watch } from "vue";
 import { useI18n } from "vue-i18n";
 import AttachmentDetailModal from "./components/AttachmentDetailModal.vue";
+import AttachmentError from "./components/AttachmentError.vue";
 import AttachmentGroupList from "./components/AttachmentGroupList.vue";
 import AttachmentListItem from "./components/AttachmentListItem.vue";
+import AttachmentLoading from "./components/AttachmentLoading.vue";
 import AttachmentPoliciesModal from "./components/AttachmentPoliciesModal.vue";
 import AttachmentUploadModal from "./components/AttachmentUploadModal.vue";
-import AttachmentLoading from "./components/AttachmentLoading.vue";
-import AttachmentError from "./components/AttachmentError.vue";
 import { useAttachmentControl } from "./composables/use-attachment";
 import { useFetchAttachmentGroup } from "./composables/use-attachment-group";
 import { useFetchAttachmentPolicy } from "./composables/use-attachment-policy";
-import LazyVideo from "@/components/video/LazyVideo.vue";
 
 const { t } = useI18n();
 

ui/console-src/modules/contents/comments/components/CommentListItem.vue

@@ -1,7 +1,9 @@
 <script lang="ts" setup>
+import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
 import { usePluginModuleStore } from "@/stores/plugin";
 import { formatDatetime } from "@/utils/date";
 import { usePermission } from "@/utils/permission";
+import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
 import type {
   Extension,
   ListedComment,
@@ -34,18 +36,16 @@ import type {
 import { useMutation, useQuery, useQueryClient } from "@tanstack/vue-query";
 import {
   computed,
+  markRaw,
   onMounted,
   provide,
   ref,
   type Ref,
   toRefs,
-  markRaw,
 } from "vue";
 import { useI18n } from "vue-i18n";
 import ReplyCreationModal from "./ReplyCreationModal.vue";
 import ReplyListItem from "./ReplyListItem.vue";
-import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
-import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
 
 const { currentUserHasPermission } = usePermission();
 const { t } = useI18n();

ui/console-src/modules/contents/comments/components/ReplyListItem.vue

@@ -1,5 +1,7 @@
 <script lang="ts" setup>
+import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
 import { formatDatetime } from "@/utils/date";
+import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
 import type { ListedComment, ListedReply } from "@halo-dev/api-client";
 import { coreApiClient } from "@halo-dev/api-client";
 import {
@@ -15,11 +17,9 @@ import {
 } from "@halo-dev/components";
 import type { OperationItem } from "@halo-dev/console-shared";
 import { useQueryClient } from "@tanstack/vue-query";
-import { computed, inject, ref, type Ref, toRefs, markRaw } from "vue";
+import { computed, inject, markRaw, ref, type Ref, toRefs } from "vue";
 import { useI18n } from "vue-i18n";
 import ReplyCreationModal from "./ReplyCreationModal.vue";
-import { useOperationItemExtensionPoint } from "@console/composables/use-operation-extension-points";
-import EntityDropdownItems from "@/components/entity/EntityDropdownItems.vue";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();

ui/console-src/modules/contents/posts/tags/components/TagEditingModal.vue

@@ -23,10 +23,10 @@ import AnnotationsForm from "@/components/form/AnnotationsForm.vue";
 import { setFocus } from "@/formkit/utils/focus";
 import { FormType } from "@/types/slug";
 import useSlugify from "@console/composables/use-slugify";
+import { reset, submitForm } from "@formkit/core";
 import { cloneDeep } from "lodash-es";
 import { onMounted } from "vue";
 import { useI18n } from "vue-i18n";
-import { submitForm, reset } from "@formkit/core";
 
 const props = withDefaults(
   defineProps<{

ui/console-src/modules/system/plugins/components/entity-fields/ReloadField.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import { IconInformation, VButton } from "@halo-dev/components";
 import { PluginStatusPhaseEnum, type Plugin } from "@halo-dev/api-client";
+import { IconInformation, VButton } from "@halo-dev/components";
 import { computed } from "vue";
 
 const props = withDefaults(

ui/console-src/modules/system/users/components/UserCreationModal.vue

@@ -9,10 +9,10 @@ import SubmitButton from "@/components/button/SubmitButton.vue";
 import { Toast, VButton, VModal, VSpace } from "@halo-dev/components";
 
 // hooks
+import { PASSWORD_REGEX } from "@/constants/regex";
 import { setFocus } from "@/formkit/utils/focus";
 import { useQueryClient } from "@tanstack/vue-query";
 import { useI18n } from "vue-i18n";
-import { PASSWORD_REGEX } from "@/constants/regex";
 
 const { t } = useI18n();
 const queryClient = useQueryClient();

ui/package.json

@@ -143,6 +143,7 @@
     "postcss": "^8.4.21",
     "postcss-viewport-height-correction": "^1.1.1",
     "prettier": "^2.8.8",
+    "prettier-plugin-organize-imports": "^4.1.0",
     "prettier-plugin-tailwindcss": "^0.1.13",
     "randomstring": "^1.2.3",
     "rollup-plugin-gzip": "^3.1.0",

ui/prettier.config.cjs

@@ -1,3 +1,6 @@
 module.exports = {
-  plugins: [require("prettier-plugin-tailwindcss")],
+  plugins: [
+    require("prettier-plugin-tailwindcss"),
+    require("prettier-plugin-organize-imports"),
+  ],
 };

ui/src/components/editor/DefaultEditor.vue

@@ -90,14 +90,14 @@ import MdiFormatHeader5 from "~icons/mdi/format-header-5";
 import MdiFormatHeader6 from "~icons/mdi/format-header-6";
 import RiLayoutRightLine from "~icons/ri/layout-right-line";
 import { useAttachmentSelect } from "./composables/use-attachment";
+import { useExtension } from "./composables/use-extension";
 import {
   UiExtensionAudio,
   UiExtensionImage,
   UiExtensionUpload,
   UiExtensionVideo,
 } from "./extensions";
 import { getContents } from "./utils/attachment";
-import { useExtension } from "./composables/use-extension";
 
 const { t } = useI18n();
 const { currentUserHasPermission } = usePermission();

ui/src/formkit/inputs/select/MultipleSelect.vue

@@ -1,12 +1,12 @@
 <script lang="ts" setup>
-import MultipleSelectItem from "./MultipleSelectItem.vue";
-import MultipleOverflowItem from "./MultipleOverflowItem.vue";
-import { useDragAndDrop } from "@formkit/drag-and-drop/vue";
-import { watch } from "vue";
 import type {
   NodeDragEventData,
   NodeTouchEventData,
 } from "@formkit/drag-and-drop";
+import { useDragAndDrop } from "@formkit/drag-and-drop/vue";
+import { watch } from "vue";
+import MultipleOverflowItem from "./MultipleOverflowItem.vue";
+import MultipleSelectItem from "./MultipleSelectItem.vue";
 
 const props = defineProps<{
   selectedOptions: Array<{

ui/src/formkit/inputs/select/SelectDropdownContainer.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import { computed, watch } from "vue";
-import SelectOption from "./SelectOption.vue";
+import { i18n } from "@/locales";
 import { VEmpty, VLoading } from "@halo-dev/components";
 import { useTimeout } from "@vueuse/shared";
-import { i18n } from "@/locales";
+import { computed, watch } from "vue";
+import SelectOption from "./SelectOption.vue";
 
 const props = defineProps<{
   options?: Array<Record<string, unknown> & { label: string; value: string }>;

ui/uc-src/modules/profile/tabs/Devices.vue

@@ -1,8 +1,8 @@
 <script lang="ts" setup>
+import { ucApiClient } from "@halo-dev/api-client";
 import { VLoading } from "@halo-dev/components";
 import { useQuery } from "@tanstack/vue-query";
 import DeviceListItem from "./components/DeviceListItem.vue";
-import { ucApiClient } from "@halo-dev/api-client";
 
 const { data, isLoading } = useQuery({
   queryKey: ["uc:devices"],