Merge pull request #1802 from doccano/enhancement/frontendLinter

[Enhancement] frontend linter

.github/workflows/ci.yml

@@ -3,13 +3,11 @@ name: doccano CI
 on: [push, pull_request]
 
 jobs:
-  build:
-
+  backend:
     runs-on: ubuntu-latest
     defaults:
       run:
         working-directory: ./backend
-
     steps:
     - uses: actions/checkout@v2
     - name: Set up Python 3.8
@@ -40,3 +38,20 @@ jobs:
     - name: Run tests
       run: |
         poetry run task test
+
+  frontend:
+    runs-on: ubuntu-latest
+    defaults:
+      run:
+        working-directory: ./frontend
+    steps:
+      - uses: actions/checkout@v2
+      - uses: actions/setup-node@v2
+        with:
+          node-version: '16'
+      - name: Install Yarn
+        run: npm install -g yarn
+      - name: Install npm modules
+        run: yarn install
+      - name: Lint
+        run: yarn lint

frontend/.eslintrc.js

@@ -19,12 +19,12 @@ module.exports = {
         message: 'Unexpected property on console object was called'
       }
     ],
-    'vue/valid-template-root': 'off',
-    'space-before-function-paren': ['error', 'never'],
+    // 'vue/valid-template-root': 'off',
+    // 'space-before-function-paren': ['error', 'never'],
     'no-useless-constructor': 'off',
-    '@typescript-eslint/no-useless-constructor': 'off',
-    'no-unused-vars': 'off',
-    '@typescript-eslint/no-unused-vars': 'off',
-    camelcase: 'off'
+    // '@typescript-eslint/no-useless-constructor': 'off',
+    // 'no-unused-vars': 'off',
+    // '@typescript-eslint/no-unused-vars': 'off',
+    'camelcase': 'off'
   }
 }

frontend/components/auth/FormLogin.vue

@@ -54,7 +54,7 @@ export default Vue.extend({
   props: {
     login: {
       type: Function,
-      default: (username: string, password: string) => Promise
+      default: () => Promise
     }
   },
   data() {

frontend/composables/useLabelList.ts

@@ -1,4 +1,4 @@
-import { computed, reactive, useContext } from '@nuxtjs/composition-api'
+import { computed, reactive } from '@nuxtjs/composition-api'
 import { LabelDTO } from '@/services/application/label/labelData'
 import { CreateLabelCommand , UpdateLabelCommand } from '@/services/application/label/labelCommand'
 import { LabelApplicationService } from '@/services/application/label/labelApplicationService'
@@ -8,8 +8,6 @@ export const useLabelList = (service: LabelApplicationService) => {
     labels: [] as LabelDTO[]
   })
 
-  const { app } = useContext()
-
   const getLabelList = async(
     projectId: string
   ) => {

frontend/composables/useProjectItem.ts

@@ -1,4 +1,3 @@
-import _ from 'lodash'
 import { reactive, useContext } from '@nuxtjs/composition-api'
 import { ProjectDTO } from '@/services/application/project/projectData'
 

frontend/middleware/check-admin.js

@@ -6,7 +6,6 @@ export default _.debounce(async function({ app, store, route, redirect }) {
   } catch(e) {
     redirect('/projects')
   }
-  const userId = store.getters['auth/getUserId']
   const isProjectAdmin = await app.$services.member.isProjectAdmin(route.params.id)
   const projectRoot = app.localePath('/projects/' + route.params.id)
   const path = route.fullPath.replace(/\/$/g, '')

frontend/nuxt.config.js

@@ -144,7 +144,7 @@ export default {
     ** You can extend webpack config here
     */
     publicPath: process.env.PUBLIC_PATH || '/_nuxt/',
-    extend(config, ctx) {
+    extend(config, _) {
       // config.module.rules.push({
       //   test: /\.(txt|csv|conll|jsonl)$/i,
       //   loader: 'file-loader',

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

@@ -165,12 +165,12 @@ export default {
     },
     textFields() {
       const asArray = Object.entries(this.properties)
-      const textFields = asArray.filter(([key, value]) => !('enum' in value))
+      const textFields = asArray.filter(([_, value]) => !('enum' in value))
       return Object.fromEntries(textFields)
     },
     selectFields() {
       const asArray = Object.entries(this.properties)
-      const textFields = asArray.filter(([key, value]) => 'enum' in value)
+      const textFields = asArray.filter(([_, value]) => 'enum' in value)
       return Object.fromEntries(textFields)
     },
     acceptedFileTypes() {

frontend/plugins/services.ts

@@ -75,7 +75,7 @@ declare module 'vue/types/vue' {
   }
 }
 
-const plugin: Plugin = (context, inject) => {
+const plugin: Plugin = (_, inject) => {
   const memberRepository     = new APIMemberRepository()
   const userRepository       = new APIUserRepository()
   const roleRepository       = new APIRoleRepository()

frontend/repositories/comment/apiCommentRepository.ts

@@ -35,7 +35,7 @@ export class APICommentRepository implements CommentRepository {
 
   async delete(projectId: string, commentId: number): Promise<void> {
     const url = `/projects/${projectId}/comments/${commentId}`
-    const response = await this.request.delete(url)
+    await this.request.delete(url)
   }
 
   async deleteBulk(projectId: string, items: number[]): Promise<void> {

frontend/repositories/project/apiProjectRepository.ts

@@ -29,7 +29,7 @@ export class APIProjectRepository implements ProjectRepository {
 
   async update(item: ProjectWriteItem): Promise<void> {
     const url = `/projects/${item.id}`
-    const response = await this.request.patch(url, item.toObject())
+    await this.request.patch(url, item.toObject())
   }
 
   async bulkDelete(projectIds: number[]): Promise<void> {

frontend/repositories/tasks/sequenceLabeling/apiRelationRepository.ts

@@ -28,7 +28,7 @@ export class ApiRelationRepository implements RelationRepository {
 
     async delete(projectId: string, exampleId: number, relationId: number): Promise<void> {
         const url = `/projects/${projectId}/examples/${exampleId}/relations/${relationId}`
-        const response = await this.request.delete(url)
+        await this.request.delete(url)
     }
 
     async bulkDelete(projectId: string, exampleId: number, relationIds: number[]): Promise<void> {

frontend/services/application/autoLabeling/configApplicationService.ts

@@ -1,4 +1,4 @@
-import { ConfigRepository, ConfigTestResponse } from '~/domain/models/autoLabeling/configRepository'
+import { ConfigRepository } from '~/domain/models/autoLabeling/configRepository'
 import { ConfigItemList, ConfigItem } from '~/domain/models/autoLabeling/config'
 
 export class ConfigApplicationService {

frontend/services/application/label/labelApplicationService.ts

@@ -63,11 +63,6 @@ export class LabelApplicationService {
   async upload(projectId: string, file: File) {
     const formData = new FormData()
     formData.append('file', file)
-    const config = {
-      headers: {
-        'Content-Type': 'multipart/form-data'
-      }
-    }
     await this.repository.uploadFile(projectId, formData)
   }
 }

frontend/services/application/tag/tagApplicationService.ts

@@ -1,6 +1,5 @@
 import { TagDTO } from './tagData'
 import { TagRepository } from '~/domain/models/tag/tagRepository'
-import { TagItem } from '~/domain/models/tag/tag'
 
 
 export class TagApplicationService {

frontend/test/unit/components/tasks/toolbar/forms/formGuideline.spec.js

@@ -6,7 +6,7 @@ import FormGuideline from '@/components/tasks/toolbar/forms/FormGuideline'
 
 const $t = () => {}
 
-const factory = (values = {}) => {
+const factory = () => {
   return mount(FormGuideline, {
     propsData: {
       guidelineText: 'Hello'