Merge pull request #2135 from doccano/enhancement/upgrade-frontend-package

Upgrade frontend dependencies

frontend/components/auth/SocialLogin.vue

@@ -15,7 +15,8 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 
 export default Vue.extend({
   props: {

frontend/components/comment/CommentList.vue

@@ -49,11 +49,12 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
 import { mdiMagnify } from '@mdi/js'
-import { DataOptions } from 'vuetify/types'
 import VueFilterDateFormat from '@vuejs-community/vue-filter-date-format'
 import VueFilterDateParse from '@vuejs-community/vue-filter-date-parse'
+import type { PropType } from 'vue'
+import Vue from 'vue'
+import { DataOptions } from 'vuetify/types'
 import { CommentReadDTO } from '~/services/application/comment/commentData'
 Vue.use(VueFilterDateFormat)
 Vue.use(VueFilterDateParse)

frontend/components/configAutoLabeling/ConfigCreationForm.vue

@@ -42,12 +42,12 @@
 
 <script lang="ts">
 import Vue from 'vue'
-import { StepCounter } from '@/domain/models/utils/stepper'
 import ConfigHeader from './form/ConfigHeader.vue'
 import ConfigTemplateName from './form/ConfigTemplateName.vue'
 import ConfigTemplate from './form/ConfigTemplate.vue'
 import ConfigParameters from './form/ConfigParameters.vue'
 import ConfigLabelMapping from './form/ConfigLabelMapping.vue'
+import { StepCounter } from '@/domain/models/utils/stepper'
 import { ConfigItem, Fields } from '~/domain/models/autoLabeling/config'
 
 export default Vue.extend({

frontend/components/configAutoLabeling/ConfigList.vue

@@ -50,9 +50,9 @@
 
 <script lang="ts">
 import Vue from 'vue'
+import ConfigCreationForm from './ConfigCreationForm.vue'
 import { ConfigItemResponse } from '@/repositories/autoLabeling/config/apiConfigRepository'
 import ConfirmForm from '@/components/utils/ConfirmForm.vue'
-import ConfigCreationForm from './ConfigCreationForm.vue'
 import { ConfigItemList } from '~/domain/models/autoLabeling/config'
 
 export default Vue.extend({

frontend/components/configAutoLabeling/form/ConfigTemplateName.vue

@@ -28,8 +28,8 @@
 </template>
 
 <script lang="ts">
-import { templateNameRules } from '@/rules/index'
 import Vue from 'vue'
+import { templateNameRules } from '@/rules/index'
 import { Project } from '~/domain/models/project/project'
 
 export default Vue.extend({

frontend/components/example/AudioList.vue

@@ -56,7 +56,8 @@
 
 <script lang="ts">
 import { mdiMagnify } from '@mdi/js'
-import Vue, { PropType } from 'vue'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import { DataOptions } from 'vuetify/types'
 import { ExampleDTO } from '~/services/application/example/exampleData'
 

frontend/components/example/DocumentList.vue

@@ -53,8 +53,9 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
 import { mdiMagnify } from '@mdi/js'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import { DataOptions } from 'vuetify/types'
 import { ExampleDTO } from '~/services/application/example/exampleData'
 

frontend/components/example/ImageList.vue

@@ -60,7 +60,8 @@
 
 <script lang="ts">
 import { mdiMagnify } from '@mdi/js'
-import Vue, { PropType } from 'vue'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import { DataOptions } from 'vuetify/types'
 import { ExampleDTO } from '~/services/application/example/exampleData'
 

frontend/components/label/FormCreate.vue

@@ -82,8 +82,9 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
 import { mdiReload } from '@mdi/js'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import { LabelDTO } from '~/services/application/label/labelData'
 
 export default Vue.extend({

frontend/components/label/LabelList.vue

@@ -43,8 +43,9 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
-import { mdiPencil, mdiMagnify } from '@mdi/js'
+import { mdiMagnify, mdiPencil } from '@mdi/js'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import { LabelDTO } from '~/services/application/label/labelData'
 
 export default Vue.extend({

frontend/components/member/FormCreate.vue

@@ -52,12 +52,13 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
 import { mdiAccount, mdiCreditCardOutline } from '@mdi/js'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import BaseCard from '@/components/utils/BaseCard.vue'
-import { UserDTO } from '~/services/application/user/userData'
-import { RoleDTO } from '~/services/application/role/roleData'
 import { MemberDTO } from '~/services/application/member/memberData'
+import { RoleDTO } from '~/services/application/role/roleData'
+import { UserDTO } from '~/services/application/user/userData'
 
 export default Vue.extend({
   components: {

frontend/components/metrics/LabelDistribution.vue

@@ -16,7 +16,8 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import BarChart from '@/components/metrics/ChartBar.vue'
 import { Distribution } from '~/domain/models/metrics/metrics'
 import { LabelDTO } from '~/services/application/label/labelData'

frontend/components/project/FormDelete.vue

@@ -20,8 +20,9 @@
 </template>
 
 <script lang="ts">
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import BaseCard from '@/components/utils/BaseCard.vue'
-import Vue, { PropType } from 'vue'
 import { Project } from '~/domain/models/project/project'
 
 export default Vue.extend({

frontend/components/project/ProjectList.vue

@@ -49,7 +49,8 @@
 import { mdiMagnify } from '@mdi/js'
 import { dateFormat } from '@vuejs-community/vue-filter-date-format'
 import { dateParse } from '@vuejs-community/vue-filter-date-parse'
-import Vue, { PropType } from 'vue'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import { DataOptions } from 'vuetify/types'
 import { Project } from '~/domain/models/project/project'
 

frontend/components/project/TagList.vue

@@ -14,7 +14,8 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 export default Vue.extend({
   props: {
     value: {

frontend/components/tasks/boundingBox/VBoundingBox.vue

@@ -36,15 +36,16 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
 import Konva from 'konva'
 import { Box } from 'konva/lib/shapes/Transformer.d'
-import LabelProps from '@/domain/models/tasks/shared/LabelProps'
+import type { PropType } from 'vue'
+import Vue from 'vue'
+import VRectangle from './VRectangle.vue'
 import BaseImage from '@/components/tasks/image/BaseImage.vue'
-import RectangleProps from '@/domain/models/tasks/boundingbox/RectangleProps'
 import Rectangle from '@/domain/models/tasks/boundingbox/Rectangle'
-import { transform, inverseTransform } from '@/domain/models/tasks/shared/Scaler'
-import VRectangle from './VRectangle.vue'
+import RectangleProps from '@/domain/models/tasks/boundingbox/RectangleProps'
+import LabelProps from '@/domain/models/tasks/shared/LabelProps'
+import { inverseTransform, transform } from '@/domain/models/tasks/shared/Scaler'
 
 export default Vue.extend({
   name: 'VBoundingBox',

frontend/components/tasks/boundingBox/VRectangle.vue

@@ -20,10 +20,11 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
 import Konva from 'konva'
+import type { PropType } from 'vue'
+import Vue from 'vue'
+import { inverseTransform, transform } from '@/domain/models/tasks/shared/Scaler'
 import Rectangle from '@/domain/models/tasks/boundingbox/Rectangle'
-import { transform, inverseTransform } from '@/domain/models/tasks/shared/Scaler'
 
 export default Vue.extend({
   props: {

frontend/components/tasks/segmentation/VEditingRegion.vue

@@ -29,9 +29,9 @@
 
 <script lang="ts">
 import Vue from 'vue'
-import Polygon from '@/domain/models/tasks/segmentation/Polygon'
 import VPolygon from './VPolygon.vue'
 import VPoint from './VPoint.vue'
+import Polygon from '@/domain/models/tasks/segmentation/Polygon'
 
 export default Vue.extend({
   components: {

frontend/components/tasks/segmentation/VRegion.vue

@@ -66,11 +66,11 @@
 import Vue from 'vue'
 import Konva from 'konva'
 import Flatten from '@flatten-js/core'
+import VPolygon from './VPolygon.vue'
+import VPoint from './VPoint.vue'
 import Polygon from '@/domain/models/tasks/segmentation/Polygon'
 import LineSegment from '@/domain/models/tasks/segmentation/LineSegment'
 import { transform } from '@/domain/models/tasks/shared/Scaler'
-import VPolygon from './VPolygon.vue'
-import VPoint from './VPoint.vue'
 import Point = Flatten.Point
 
 export default Vue.extend({

frontend/components/tasks/segmentation/VSegmentation.vue

@@ -42,15 +42,16 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
 import Konva from 'konva'
+import type { PropType } from 'vue'
+import Vue from 'vue'
+import VEditingRegion from './VEditingRegion.vue'
+import VRegion from './VRegion.vue'
+import BaseImage from '@/components/tasks/image/BaseImage.vue'
 import Polygon from '@/domain/models/tasks/segmentation/Polygon'
 import PolygonProps from '@/domain/models/tasks/segmentation/PolygonProps'
 import LabelProps from '@/domain/models/tasks/shared/LabelProps'
-import BaseImage from '@/components/tasks/image/BaseImage.vue'
 import { transform } from '@/domain/models/tasks/shared/Scaler'
-import VEditingRegion from './VEditingRegion.vue'
-import VRegion from './VRegion.vue'
 
 export default Vue.extend({
   name: 'VSegmentation',

frontend/components/tasks/sequenceLabeling/EntityEditor.vue

@@ -39,11 +39,12 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
 import VAnnotator from 'v-annotator'
+import type { PropType } from 'vue'
+import Vue from 'vue'
+import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
 import LabelingMenu from './LabelingMenu.vue'
 import { SpanDTO } from '~/services/application/tasks/sequenceLabeling/sequenceLabelingData'
-import 'vue-virtual-scroller/dist/vue-virtual-scroller.css'
 
 export default Vue.extend({
   components: {

frontend/components/tasks/sidebar/AnnotationProgress.vue

@@ -22,7 +22,8 @@
 </template>
 
 <script lang="ts">
-import Vue, { PropType } from 'vue'
+import type { PropType } from 'vue'
+import Vue from 'vue'
 import { MyProgress } from '@/domain/models/metrics/metrics'
 
 export default Vue.extend({

frontend/domain/models/project/project.ts

@@ -21,7 +21,7 @@ export const allProjectTypes = <const>[
   Segmentation,
   Speech2text
 ]
-export type ProjectType = typeof allProjectTypes[number]
+export type ProjectType = (typeof allProjectTypes)[number]
 const MIN_LENGTH = 1
 const MAX_PROJECT_NAME_LENGTH = 100
 

frontend/domain/models/tasks/boundingbox/Rectangle.ts

@@ -1,6 +1,6 @@
 import { v4 as uuidv4 } from 'uuid'
-import LabelProps from '@/domain/models/tasks/shared/LabelProps'
 import RectangleProps from './RectangleProps'
+import LabelProps from '@/domain/models/tasks/shared/LabelProps'
 
 export default class Rectangle {
   constructor(

frontend/domain/models/tasks/segmentation/Polygon.ts

@@ -1,9 +1,9 @@
 import { v4 as uuidv4 } from 'uuid'
 import Flatten from '@flatten-js/core'
-import LabelProps from '@/domain/models/tasks/shared/LabelProps'
 import LineSegment from './LineSegment'
 import PolygonProps from './PolygonProps'
 import ValidationError from './errors'
+import LabelProps from '@/domain/models/tasks/shared/LabelProps'
 import Point = Flatten.Point
 import Vector = Flatten.Vector
 

frontend/package.json

@@ -18,17 +18,18 @@
   },
   "dependencies": {
     "@flatten-js/core": "^1.3.4",
-    "@nuxt/vue-app": "^2.15.7",
-    "@nuxt/webpack": "^2.15.*",
+    "@nuxt/vue-app": "^2.16.0",
+    "@nuxt/webpack": "^2.16.0",
     "@nuxtjs/axios": "^5.13.6",
-    "@nuxtjs/composition-api": "^0.25.0",
+    "@nuxtjs/composition-api": "^0.33.1",
+    "@nuxtjs/i18n": "^7.3.1",
     "@nuxtjs/proxy": "^2.1.0",
     "@nuxtjs/vuetify": "^1.*",
     "@toast-ui/vue-editor": "^2.5.3",
     "@vuejs-community/vue-filter-date-format": "^1.6.3",
     "@vuejs-community/vue-filter-date-parse": "^1.1.6",
     "axios": "^0.21.1",
-    "chart.js": "^2.*",
+    "chart.js": "^2",
     "class-transformer": "^0.5.1",
     "codemirror": "^5.*",
     "consola": "^2.15.3",
@@ -47,7 +48,7 @@
     "uuid": "^8.3.2",
     "v-annotator": "0.1.28",
     "vue": "^2.6.14",
-    "vue-chartjs": "^3.5.1",
+    "vue-chartjs": "^3",
     "vue-filepond": "^6.0.3",
     "vue-konva": "2",
     "vue-shortkey": "^3.1.7",
@@ -64,13 +65,13 @@
     "@babel/eslint-parser": "^7.14.7",
     "@babel/preset-env": "^7.15.8",
     "@mdi/js": "^6.5.95",
-    "@nuxt/types": "^2.15.7",
+    "@nuxt/types": "^2.16.0",
     "@nuxt/typescript-build": "^2.1.0",
     "@nuxtjs/eslint-config": "^6.0.1",
     "@nuxtjs/eslint-config-typescript": "^6.0.1",
     "@nuxtjs/eslint-module": "^2.0.0",
     "@nuxtjs/google-analytics": "^2.4.0",
-    "@nuxtjs/google-fonts": "^1.3.0",
+    "@nuxtjs/google-fonts": "^2.0.0",
     "@types/lodash": "^4.14.171",
     "@types/uuid": "^8.3.4",
     "@types/wavesurfer.js": "^5.1.0",

frontend/pages/auth.vue

@@ -14,10 +14,10 @@
 </template>
 
 <script lang="ts">
-import FormLogin from '@/components/auth/FormLogin.vue'
-import SocialLogin from '@/components/auth/SocialLogin.vue'
 import Vue from 'vue'
 import { mapActions } from 'vuex'
+import FormLogin from '@/components/auth/FormLogin.vue'
+import SocialLogin from '@/components/auth/SocialLogin.vue'
 
 export default Vue.extend({
   components: {

frontend/pages/demo/image-caption/index.vue

@@ -63,8 +63,8 @@
 </template>
 
 <script>
-import ListMetadata from '@/components/tasks/metadata/ListMetadata'
 import { mdiPencil, mdiDeleteOutline } from '@mdi/js'
+import ListMetadata from '@/components/tasks/metadata/ListMetadata'
 
 export default {
   components: {

frontend/pages/projects/_id/comments/index.vue

@@ -25,9 +25,9 @@
 </template>
 
 <script lang="ts">
-import CommentList from '@/components/comment/CommentList.vue'
 import _ from 'lodash'
 import Vue from 'vue'
+import CommentList from '@/components/comment/CommentList.vue'
 import FormDelete from '~/components/comment/FormDelete.vue'
 import { Project } from '~/domain/models/project/project'
 import { getLinkToAnnotationPage } from '~/presenter/linkToAnnotationPage'

frontend/pages/projects/_id/dataset/index.vue

@@ -65,11 +65,11 @@
 </template>
 
 <script lang="ts">
+import _ from 'lodash'
+import Vue from 'vue'
 import DocumentList from '@/components/example/DocumentList.vue'
 import FormDelete from '@/components/example/FormDelete.vue'
 import FormDeleteBulk from '@/components/example/FormDeleteBulk.vue'
-import _ from 'lodash'
-import Vue from 'vue'
 import ActionMenu from '~/components/example/ActionMenu.vue'
 import AudioList from '~/components/example/AudioList.vue'
 import ImageList from '~/components/example/ImageList.vue'

frontend/pages/projects/_id/image-captioning/index.vue

@@ -41,15 +41,15 @@
 </template>
 
 <script>
+import { mdiFormatListBulleted, mdiText } from '@mdi/js'
+import { toRefs, useContext } from '@nuxtjs/composition-api'
+import _ from 'lodash'
 import LayoutText from '@/components/tasks/layout/LayoutText'
 import ListMetadata from '@/components/tasks/metadata/ListMetadata'
 import AnnotationProgress from '@/components/tasks/sidebar/AnnotationProgress.vue'
 import ToolbarLaptop from '@/components/tasks/toolbar/ToolbarLaptop'
 import ToolbarMobile from '@/components/tasks/toolbar/ToolbarMobile'
 import { useLabelList } from '@/composables/useLabelList'
-import { mdiFormatListBulleted, mdiText } from '@mdi/js'
-import { toRefs, useContext } from '@nuxtjs/composition-api'
-import _ from 'lodash'
 import Seq2seqBox from '~/components/tasks/seq2seq/Seq2seqBox'
 
 export default {

frontend/pages/projects/_id/image-classification/index.vue

@@ -54,6 +54,9 @@
 </template>
 
 <script>
+import { mdiFormatListBulleted, mdiText } from '@mdi/js'
+import { toRefs, useContext } from '@nuxtjs/composition-api'
+import _ from 'lodash'
 import LayoutText from '@/components/tasks/layout/LayoutText'
 import ListMetadata from '@/components/tasks/metadata/ListMetadata'
 import AnnotationProgress from '@/components/tasks/sidebar/AnnotationProgress.vue'
@@ -62,9 +65,6 @@ import LabelSelect from '@/components/tasks/textClassification/LabelSelect'
 import ToolbarLaptop from '@/components/tasks/toolbar/ToolbarLaptop'
 import ToolbarMobile from '@/components/tasks/toolbar/ToolbarMobile'
 import { useLabelList } from '@/composables/useLabelList'
-import { mdiFormatListBulleted, mdiText } from '@mdi/js'
-import { toRefs, useContext } from '@nuxtjs/composition-api'
-import _ from 'lodash'
 
 export default {
   components: {

frontend/pages/projects/_id/intent-detection-and-slot-filling/index.vue

@@ -46,6 +46,7 @@
   </layout-text>
 </template>
 <script>
+import { mapGetters } from 'vuex'
 import LayoutText from '@/components/tasks/layout/LayoutText'
 import ListMetadata from '@/components/tasks/metadata/ListMetadata'
 import EntityEditor from '@/components/tasks/sequenceLabeling/EntityEditor.vue'
@@ -53,7 +54,6 @@ import AnnotationProgress from '@/components/tasks/sidebar/AnnotationProgress.vu
 import LabelGroup from '@/components/tasks/textClassification/LabelGroup'
 import ToolbarLaptop from '@/components/tasks/toolbar/ToolbarLaptop'
 import ToolbarMobile from '@/components/tasks/toolbar/ToolbarMobile'
-import { mapGetters } from 'vuex'
 
 export default {
   components: {

frontend/pages/projects/_id/labels/index.vue

@@ -33,10 +33,10 @@
 </template>
 
 <script lang="ts">
+import Vue from 'vue'
 import ActionMenu from '@/components/label/ActionMenu.vue'
 import FormDelete from '@/components/label/FormDelete.vue'
 import LabelList from '@/components/label/LabelList.vue'
-import Vue from 'vue'
 import { Project } from '~/domain/models/project/project'
 import { LabelDTO } from '~/services/application/label/labelData'
 

frontend/pages/projects/_id/object-detection/index.vue

@@ -71,6 +71,9 @@
 </template>
 
 <script>
+import { mdiFormatListBulleted, mdiText } from '@mdi/js'
+import { toRefs, useContext } from '@nuxtjs/composition-api'
+import _ from 'lodash'
 import VBoundingBox from '@/components/tasks/boundingBox/VBoundingBox.vue'
 import RegionList from '@/components/tasks/image/RegionList.vue'
 import LayoutText from '@/components/tasks/layout/LayoutText'
@@ -80,9 +83,6 @@ import ButtonZoom from '@/components/tasks/toolbar/buttons/ButtonZoom.vue'
 import ToolbarLaptop from '@/components/tasks/toolbar/ToolbarLaptop'
 import ToolbarMobile from '@/components/tasks/toolbar/ToolbarMobile'
 import { useLabelList } from '@/composables/useLabelList'
-import { mdiFormatListBulleted, mdiText } from '@mdi/js'
-import { toRefs, useContext } from '@nuxtjs/composition-api'
-import _ from 'lodash'
 
 export default {
   components: {

frontend/pages/projects/_id/segmentation/index.vue

@@ -71,6 +71,9 @@
 </template>
 
 <script>
+import { mdiFormatListBulleted, mdiText } from '@mdi/js'
+import { toRefs, useContext } from '@nuxtjs/composition-api'
+import _ from 'lodash'
 import RegionList from '@/components/tasks/image/RegionList.vue'
 import LayoutText from '@/components/tasks/layout/LayoutText'
 import ListMetadata from '@/components/tasks/metadata/ListMetadata'
@@ -80,9 +83,6 @@ import ButtonZoom from '@/components/tasks/toolbar/buttons/ButtonZoom.vue'
 import ToolbarLaptop from '@/components/tasks/toolbar/ToolbarLaptop'
 import ToolbarMobile from '@/components/tasks/toolbar/ToolbarMobile'
 import { useLabelList } from '@/composables/useLabelList'
-import { mdiFormatListBulleted, mdiText } from '@mdi/js'
-import { toRefs, useContext } from '@nuxtjs/composition-api'
-import _ from 'lodash'
 
 export default {
   components: {

frontend/pages/projects/_id/sequence-labeling/index.vue

@@ -86,15 +86,15 @@
 </template>
 
 <script>
+import { mdiChevronDown, mdiChevronUp } from '@mdi/js'
+import _ from 'lodash'
+import { mapGetters } from 'vuex'
 import LayoutText from '@/components/tasks/layout/LayoutText'
 import ListMetadata from '@/components/tasks/metadata/ListMetadata'
 import EntityEditor from '@/components/tasks/sequenceLabeling/EntityEditor.vue'
 import AnnotationProgress from '@/components/tasks/sidebar/AnnotationProgress.vue'
 import ToolbarLaptop from '@/components/tasks/toolbar/ToolbarLaptop'
 import ToolbarMobile from '@/components/tasks/toolbar/ToolbarMobile'
-import { mdiChevronDown, mdiChevronUp } from '@mdi/js'
-import _ from 'lodash'
-import { mapGetters } from 'vuex'
 
 export default {
   components: {

frontend/pages/projects/_id/speech-to-text/index.vue

@@ -34,12 +34,12 @@
 </template>
 
 <script>
+import _ from 'lodash'
 import LayoutText from '@/components/tasks/layout/LayoutText'
 import ListMetadata from '@/components/tasks/metadata/ListMetadata'
 import AnnotationProgress from '@/components/tasks/sidebar/AnnotationProgress.vue'
 import ToolbarLaptop from '@/components/tasks/toolbar/ToolbarLaptop'
 import ToolbarMobile from '@/components/tasks/toolbar/ToolbarMobile'
-import _ from 'lodash'
 import AudioViewer from '~/components/tasks/audio/AudioViewer'
 import Seq2seqBox from '~/components/tasks/seq2seq/Seq2seqBox'
 

frontend/pages/projects/index.vue

@@ -27,10 +27,10 @@
 </template>
 
 <script lang="ts">
-import ProjectList from '@/components/project/ProjectList.vue'
 import _ from 'lodash'
 import Vue from 'vue'
 import { mapGetters } from 'vuex'
+import ProjectList from '@/components/project/ProjectList.vue'
 import FormDelete from '~/components/project/FormDelete.vue'
 import { Page } from '~/domain/models/page'
 import { Project } from '~/domain/models/project/project'

frontend/plugins/services.ts

@@ -1,3 +1,5 @@
+import { Plugin } from '@nuxt/types'
+import { repositories } from './repositories'
 import { AuthApplicationService } from '@/services/application/auth/authApplicationService'
 import { ConfigApplicationService } from '@/services/application/autoLabeling/configApplicationService'
 import { TemplateApplicationService } from '@/services/application/autoLabeling/templateApplicationService'
@@ -21,8 +23,6 @@ import { TextClassificationService } from '@/services/application/tasks/textClas
 import { CatalogApplicationService } from '@/services/application/upload/catalogApplicationService'
 import { ParseApplicationService } from '@/services/application/upload/parseApplicationService'
 import { UserApplicationService } from '@/services/application/user/userApplicationService'
-import { Plugin } from '@nuxt/types'
-import { repositories } from './repositories'
 
 export interface Services {
   categoryType: LabelApplicationService

frontend/repositories/project/apiProjectRepository.ts

@@ -4,7 +4,7 @@ import ApiService from '@/services/api.service'
 import { TagItem } from '~/domain/models/tag/tag'
 
 const sortableFieldList = ['name', 'projectType', 'createdAt', 'author'] as const
-type SortableFields = typeof sortableFieldList[number]
+type SortableFields = (typeof sortableFieldList)[number]
 
 export class SearchQuery {
   readonly limit: number = 10

frontend/services/application/celery/taskStatusApplicationService.ts

@@ -1,5 +1,5 @@
-import { TaskStatusRepository } from '@/domain/models/celery/taskStatusRepository'
 import { StatusDTO } from './statusData'
+import { TaskStatusRepository } from '@/domain/models/celery/taskStatusRepository'
 
 export class TaskStatusApplicationService {
   constructor(private readonly repository: TaskStatusRepository) {}

frontend/services/application/tasks/boundingBox/boundingBoxApplicationService.ts

@@ -1,6 +1,6 @@
-import { BoundingBox } from '@/domain/models/tasks/boundingBox'
 import { AnnotationApplicationService } from '../annotationApplicationService'
 import { BoundingBoxDTO } from './boundingBoxData'
+import { BoundingBox } from '@/domain/models/tasks/boundingBox'
 
 export class BoundingBoxApplicationService extends AnnotationApplicationService<BoundingBox> {
   public async list(projectId: string, exampleId: number): Promise<BoundingBoxDTO[]> {

frontend/services/application/tasks/segmentation/segmentationApplicationService.ts

@@ -1,6 +1,6 @@
-import { Segment } from '@/domain/models/tasks/segmentation'
 import { AnnotationApplicationService } from '../annotationApplicationService'
 import { SegmentationDTO } from './segmentationData'
+import { Segment } from '@/domain/models/tasks/segmentation'
 
 export class SegmentationApplicationService extends AnnotationApplicationService<Segment> {
   public async list(projectId: string, exampleId: number): Promise<SegmentationDTO[]> {

frontend/services/application/tasks/seq2seq/seq2seqApplicationService.ts

@@ -1,6 +1,6 @@
-import { TextLabel } from '@/domain/models/tasks/textLabel'
 import { AnnotationApplicationService } from '../annotationApplicationService'
 import { Seq2seqDTO } from './seq2seqData'
+import { TextLabel } from '@/domain/models/tasks/textLabel'
 
 export class Seq2seqApplicationService extends AnnotationApplicationService<TextLabel> {
   public async list(projectId: string, exampleId: number): Promise<Seq2seqDTO[]> {

frontend/services/application/tasks/sequenceLabeling/sequenceLabelingApplicationService.ts

@@ -1,10 +1,10 @@
+import { AnnotationApplicationService } from '../annotationApplicationService'
+import { RelationDTO } from './relationData'
+import { SpanDTO } from './sequenceLabelingData'
 import { APISpanRepository } from '@/repositories/tasks/apiSpanRepository'
 import { APIRelationRepository } from '@/repositories/tasks/apiRelationRepository'
 import { Span } from '@/domain/models/tasks/span'
 import { Relation } from '@/domain/models/tasks/relation'
-import { AnnotationApplicationService } from '../annotationApplicationService'
-import { RelationDTO } from './relationData'
-import { SpanDTO } from './sequenceLabelingData'
 
 export class SequenceLabelingApplicationService extends AnnotationApplicationService<Span> {
   constructor(

frontend/services/application/tasks/textClassification/textClassificationApplicationService.ts

@@ -1,6 +1,6 @@
-import { Category } from '@/domain/models/tasks/category'
 import { AnnotationApplicationService } from '../annotationApplicationService'
 import { TextClassificationDTO } from './textClassificationData'
+import { Category } from '@/domain/models/tasks/category'
 
 export class TextClassificationService extends AnnotationApplicationService<Category> {
   public async list(projectId: string, docId: number): Promise<TextClassificationDTO[]> {