🎨 Sort imports

src/App.vue

@@ -14,12 +14,14 @@ import { useFavicon, usePreferredDark } from '@vueuse/core'
 import { storeToRefs } from 'pinia'
 import { useQuasar } from 'quasar'
 import { computed } from 'vue'
+
 import Layout from '~/components/Layout.vue'
 import { useAnnotation } from '~/hooks/annotation.js'
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'
 import { usePreferenceStore } from '~/store/preference.js'
+
 import { useMainStore } from './store/index.js'
 
 const mainStore = useMainStore()

src/components/ActionLabelThumbnailPreview.vue

@@ -52,6 +52,7 @@
 
 <script setup>
 import { computed, ref } from 'vue'
+
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'
 import { useMainStore } from '~/store/index.js'

src/components/ActionThumbnailPreview.vue

@@ -74,6 +74,7 @@
 
 <script setup>
 import { computed, ref } from 'vue'
+
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'

src/components/Drawer.vue

@@ -40,9 +40,11 @@
 
 <script setup>
 import { storeToRefs } from 'pinia'
+
 import VersionBadge from '~/components/VersionBadge.vue'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useMainStore } from '~/store/index.js'
+
 import DrawerAnnotationControl from './DrawerAnnotationControl.vue'
 import DrawerVideoControl from './DrawerVideoControl.vue'
 

src/components/DrawerAnnotationControl.vue

@@ -43,6 +43,7 @@
 
 <script setup>
 import { storeToRefs } from 'pinia'
+
 import { useAnnotation } from '~/hooks/annotation.js'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useMainStore } from '~/store/index.js'

src/components/DrawerVideoControl.vue

@@ -50,6 +50,7 @@
 
 <script setup>
 import { storeToRefs } from 'pinia'
+
 import { useVideo } from '~/hooks/video.js'
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'

src/components/Layout.vue

@@ -104,12 +104,14 @@
 <script setup>
 import { storeToRefs } from 'pinia'
 import { computed } from 'vue'
+
 import VideoLoaderV1 from '~/components/VideoLoaderV1.vue'
 import VideoLoaderV2 from '~/components/VideoLoaderV2.vue'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'
 import { useMainStore } from '~/store/index.js'
 import { usePreferenceStore } from '~/store/preference.js'
+
 import Drawer from './Drawer.vue'
 
 const mainStore = useMainStore()

src/components/MonacoCodeEditor.vue

@@ -5,10 +5,9 @@
 <script setup>
 import 'monaco-editor/esm/vs/editor/editor.all.js'
 import * as monaco from 'monaco-editor/esm/vs/editor/editor.api'
-import 'monaco-editor/esm/vs/editor/standalone/browser/inspectTokens/inspectTokens.js'
 import 'monaco-editor/esm/vs/editor/standalone/browser/iPadShowKeyboard/iPadShowKeyboard.js'
+import 'monaco-editor/esm/vs/editor/standalone/browser/inspectTokens/inspectTokens.js'
 import 'monaco-editor/esm/vs/language/json/monaco.contribution'
-
 import { useQuasar } from 'quasar'
 import { onMounted, onUnmounted, ref, watch } from 'vue'
 

src/components/VideoLoaderV1.vue

@@ -17,6 +17,7 @@
 
 <script setup>
 import { nextTick } from 'vue'
+
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { usePreferenceStore } from '~/store/preference.js'

src/components/VideoLoaderV2.vue

@@ -2,6 +2,7 @@
 
 <script setup>
 import { onMounted, watch } from 'vue'
+
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { usePreferenceStore } from '~/store/preference.js'

src/hooks/annotation.js

@@ -1,5 +1,6 @@
 import { copyToClipboard, exportFile } from 'quasar'
 import { ref } from 'vue'
+
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'

src/hooks/frameIndicator.js

@@ -40,7 +40,8 @@ export const frameIndicator = () => {
       const markerWidth = width * markerWidthUnit
       bgImageList.push(colorList[i])
       bgPositionList.push(
-        `${(10000 * frame) / (annotationStore.video.frames - 1) / (100 - markerWidth) - 0.5 * markerWidthUnit}% ${12 + positionHeightOffset
+        `${(10000 * frame) / (annotationStore.video.frames - 1) / (100 - markerWidth) - 0.5 * markerWidthUnit}% ${
+          12 + positionHeightOffset
         }px`
       )
       bgSizeList.push(`${markerWidth}% ${HEIGHT_MARKER}px`)

src/libs/annotationlib.js

@@ -1,8 +1,8 @@
 /**
  * Library for annotations
  */
-
 import deepClone from 'lodash.clonedeep'
+
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'
 import { usePreferenceStore } from '~/store/preference.js'

src/libs/utils.js

@@ -2,6 +2,7 @@
  * Utils
  */
 import { Dialog, Notify } from 'quasar'
+
 import { useAnnotationStore } from '~/store/annotation.js'
 
 export default {

src/pages/annotation/Annotation.vue

@@ -25,12 +25,13 @@
 import ActionTable from '~/pages/annotation/ActionTable.vue'
 import CanvasPanel from '~/pages/annotation/CanvasPanel.vue'
 import ControlPanel from '~/pages/annotation/ControlPanel.vue'
-import AnnotationSkeleton from './components/AnnotationSkeleton.vue'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'
 import { useMainStore } from '~/store/index.js'
 import { usePreferenceStore } from '~/store/preference.js'
+
 import KeyframePanel from './KeyframePanel.vue'
+import AnnotationSkeleton from './components/AnnotationSkeleton.vue'
 
 const annotationStore = useAnnotationStore()
 const configurationStore = useConfigurationStore()

src/pages/annotation/CanvasPanel.vue

@@ -138,13 +138,14 @@
 
 <script setup>
 import { computed, nextTick, onMounted, onUnmounted, ref, watch } from 'vue'
+
 import { ObjectAnnotation, RegionAnnotation, SkeletonAnnotation } from '~/libs/annotationlib.js'
 import utils from '~/libs/utils.js'
-import FilmStrip from '~/pages/annotation/components/FilmStrip.vue'
-import VideoPlayer from '~/pages/annotation/components/VideoPlayer.vue'
 import ObjectTable from '~/pages/annotation/ObjectTable.vue'
 import RegionTable from '~/pages/annotation/RegionTable.vue'
 import SkeletonTable from '~/pages/annotation/SkeletonTable.vue'
+import FilmStrip from '~/pages/annotation/components/FilmStrip.vue'
+import VideoPlayer from '~/pages/annotation/components/VideoPlayer.vue'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'
 import { useMainStore } from '~/store/index.js'

src/pages/annotation/ControlPanel.vue

@@ -172,6 +172,7 @@
 
 <script setup>
 import { computed, watch } from 'vue'
+
 import { ObjectAnnotation, RegionAnnotation, SkeletonAnnotation } from '~/libs/annotationlib.js'
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'

src/pages/annotation/ObjectTable.vue

@@ -11,6 +11,7 @@
 
 <script setup>
 import { ref } from 'vue'
+
 import TableBase from '~/pages/annotation/components/TableBase.vue'
 
 const props = defineProps({

src/pages/annotation/RegionTable.vue

@@ -51,6 +51,7 @@
 
 <script setup>
 import { ref } from 'vue'
+
 import TableBase from '~/pages/annotation/components/TableBase.vue'
 
 const props = defineProps({

src/pages/annotation/SkeletonTable.vue

@@ -55,6 +55,7 @@
 
 <script setup>
 import { ref } from 'vue'
+
 import TableBase from '~/pages/annotation/components/TableBase.vue'
 
 const props = defineProps({

src/pages/annotation/components/KeyframeTable.vue

@@ -120,6 +120,7 @@
 <script setup>
 import JSZip from 'jszip'
 import { exportFile } from 'quasar'
+
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { usePreferenceStore } from '~/store/preference.js'

src/pages/annotation/components/TableBase.vue

@@ -162,6 +162,7 @@
 
 <script setup>
 import { computed, ref } from 'vue'
+
 import utils from '~/libs/utils.js'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'

src/pages/configuration/ActionLabelTable.vue

@@ -55,10 +55,11 @@
 <script setup>
 import { storeToRefs } from 'pinia'
 import { computed } from 'vue'
+
+import ActionLabelThumbnailPreview from '~/components/ActionLabelThumbnailPreview.vue'
 import utils from '~/libs/utils.js'
 import TableBase from '~/pages/configuration/components/TableBase.vue'
 import { useConfigurationStore } from '~/store/configuration.js'
-import ActionLabelThumbnailPreview from '~/components/ActionLabelThumbnailPreview.vue'
 
 // Action
 const columnList = [

src/pages/configuration/Configuration.vue

@@ -30,8 +30,10 @@
 
 <script setup>
 import { exportFile } from 'quasar'
-import { useConfigurationStore } from '~/store/configuration.js'
+
 import utils from '~/libs/utils.js'
+import { useConfigurationStore } from '~/store/configuration.js'
+
 import ActionLabelTable from './ActionLabelTable.vue'
 import ObjectLabelTable from './ObjectLabelTable.vue'
 import SkeletonTypeTable from './SkeletonTypeTable.vue'

src/pages/configuration/ObjectLabelTable.vue

@@ -11,6 +11,7 @@
 
 <script setup>
 import { storeToRefs } from 'pinia'
+
 import utils from '~/libs/utils.js'
 import TableBase from '~/pages/configuration/components/TableBase.vue'
 import { useConfigurationStore } from '~/store/configuration.js'

src/pages/configuration/SkeletonTypeTable.vue

@@ -148,9 +148,11 @@
 <script setup>
 import { storeToRefs } from 'pinia'
 import { computed, nextTick } from 'vue'
+
 import utils from '~/libs/utils.js'
 import TableBase from '~/pages/configuration/components/TableBase.vue'
 import { useConfigurationStore } from '~/store/configuration.js'
+
 import SkeletonPreview from './components/SkeletonPreview.vue'
 
 // Skeleton

src/pages/configuration/components/SkeletonPreview.vue

@@ -18,6 +18,7 @@
 
 <script setup>
 import { onMounted, ref, watch } from 'vue'
+
 import { SkeletonAnnotation } from '~/libs/annotationlib.js'
 import { useConfigurationStore } from '~/store/configuration.js'
 

src/pages/configuration/components/TableBase.vue

@@ -137,9 +137,10 @@
 <script setup>
 import { storeToRefs } from 'pinia'
 import { computed, ref } from 'vue'
+
+import TableEditor from '~/pages/configuration/components/TableEditor.vue'
 import { useConfigurationStore } from '~/store/configuration.js'
 import { useMainStore } from '~/store/index.js'
-import TableEditor from '~/pages/configuration/components/TableEditor.vue'
 
 const props = defineProps({
   title: {

src/pages/configuration/components/TableEditor.vue

@@ -31,8 +31,10 @@
 </template>
 
 <script setup>
-import { ref, defineAsyncComponent } from 'vue'
+import { defineAsyncComponent, ref } from 'vue'
+
 import utils from '~/libs/utils.js'
+
 const MonacoCodeEditor = defineAsyncComponent(() => import('~/components/MonacoCodeEditor.vue'))
 
 const props = defineProps({

src/pages/preference/Preference.vue

@@ -296,6 +296,7 @@
 
 <script setup>
 import { storeToRefs } from 'pinia'
+
 import { usePreferenceStore } from '~/store/preference.js'
 
 const preferenceStore = usePreferenceStore()

src/router/index.js

@@ -1,7 +1,8 @@
 import { createRouter, createWebHashHistory } from 'vue-router'
+
+import Annotation from '~/pages/annotation/Annotation.vue'
 import { useAnnotationStore } from '~/store/annotation.js'
 import { useConfigurationStore } from '~/store/configuration.js'
-import Annotation from '~/pages/annotation/Annotation.vue'
 
 const router = createRouter({
   history: createWebHashHistory(),

src/store/annotation.js

@@ -1,10 +1,11 @@
 import deepClone from 'lodash.clonedeep'
 import { defineStore } from 'pinia'
 import { computed, reactive, toRefs, watch } from 'vue'
+
+import { ActionAnnotation, ObjectAnnotation, RegionAnnotation, SkeletonAnnotation } from '~/libs/annotationlib.js'
 import utils from '~/libs/utils.js'
 import { useMainStore } from '~/store/index.js'
 import { usePreferenceStore } from '~/store/preference.js'
-import { ActionAnnotation, ObjectAnnotation, RegionAnnotation, SkeletonAnnotation } from '~/libs/annotationlib.js'
 
 const DEFAULT_ANNOTATION = {
   video: {

src/store/configuration.js

@@ -1,6 +1,7 @@
 import deepClone from 'lodash.clonedeep'
 import { defineStore } from 'pinia'
 import { reactive, toRefs, watch } from 'vue'
+
 import { validateActionLabelData, validateObjectLabelData, validateSkeletonTypeData } from './validation.js'
 
 const OBJECT_LABEL_LS_KEY = 'objectLabelData'