diff --git a/package.json b/package.json
index a9c98647..22753d96 100644
--- a/package.json
+++ b/package.json
@@ -153,7 +153,9 @@
         "rules": {
           "no-undef": 0,
           "no-unused-vars": 0,
-          "no-invalid-this": 0
+          "no-invalid-this": 0,
+          "indent": 0,
+          "@typescript-eslint/indent": [2, 2, { "SwitchCase": 1 }]
         }
       }
     ]
diff --git a/resources/assets/src/components/mixins/addClosetItem.js b/resources/assets/src/components/mixins/addClosetItem.ts
similarity index 73%
rename from resources/assets/src/components/mixins/addClosetItem.js
rename to resources/assets/src/components/mixins/addClosetItem.ts
index e632084f..01a9571a 100644
--- a/resources/assets/src/components/mixins/addClosetItem.js
+++ b/resources/assets/src/components/mixins/addClosetItem.ts
@@ -1,7 +1,11 @@
+import Vue from 'vue'
 import toastr from 'toastr'
 import { swal } from '../../js/notify'
 
-export default {
+export default Vue.extend<{
+  name: string,
+  tid: number
+}, { addClosetItem(): Promise<void> }, {}>({
   methods: {
     async addClosetItem() {
       const { dismiss, value } = await swal({
@@ -10,7 +14,7 @@ export default {
         inputValue: this.name,
         input: 'text',
         showCancelButton: true,
-        inputValidator: val => !val && this.$t('skinlib.emptyItemName'),
+        inputValidator: val => (!val && this.$t('skinlib.emptyItemName')) || null,
       })
       if (dismiss) {
         return
@@ -24,8 +28,8 @@ export default {
         swal({ type: 'success', text: msg })
         this.$emit('like-toggled', true)
       } else {
-        toastr.warning(msg)
+        toastr.warning(msg!)
       }
     },
   },
-}
+})
diff --git a/resources/assets/src/components/mixins/removeClosetItem.js b/resources/assets/src/components/mixins/removeClosetItem.ts
similarity index 78%
rename from resources/assets/src/components/mixins/removeClosetItem.js
rename to resources/assets/src/components/mixins/removeClosetItem.ts
index ee635d5b..82a30d6e 100644
--- a/resources/assets/src/components/mixins/removeClosetItem.js
+++ b/resources/assets/src/components/mixins/removeClosetItem.ts
@@ -1,7 +1,11 @@
+import Vue from 'vue'
 import toastr from 'toastr'
 import { swal } from '../../js/notify'
 
-export default {
+export default Vue.extend<{
+  name: string,
+  tid: number
+}, { removeClosetItem(): Promise<void> }, {}>({
   methods: {
     async removeClosetItem() {
       const { dismiss } = await swal({
@@ -21,8 +25,8 @@ export default {
         this.$emit('item-removed')
         swal({ type: 'success', text: msg })
       } else {
-        toastr.warning(msg)
+        toastr.warning(msg!)
       }
     },
   },
-}
+})
diff --git a/resources/assets/src/components/mixins/setAsAvatar.js b/resources/assets/src/components/mixins/setAsAvatar.ts
similarity index 69%
rename from resources/assets/src/components/mixins/setAsAvatar.js
rename to resources/assets/src/components/mixins/setAsAvatar.ts
index 1979815d..0baad2f1 100644
--- a/resources/assets/src/components/mixins/setAsAvatar.js
+++ b/resources/assets/src/components/mixins/setAsAvatar.ts
@@ -1,7 +1,10 @@
+import Vue from 'vue'
 import toastr from 'toastr'
 import { swal } from '../../js/notify'
 
-export default {
+export default Vue.extend<{
+  tid: number
+}, { setAsAvatar(): Promise<void> }, {}>({
   methods: {
     async setAsAvatar() {
       const { dismiss } = await swal({
@@ -19,13 +22,13 @@ export default {
         { tid: this.tid }
       )
       if (errno === 0) {
-        toastr.success(msg)
+        toastr.success(msg!)
 
-        Array.from(document.querySelectorAll('[alt="User Image"]'))
+        Array.from(document.querySelectorAll<HTMLImageElement>('[alt="User Image"]'))
           .forEach(el => (el.src += `?${new Date().getTime()}`))
       } else {
-        toastr.warning(msg)
+        toastr.warning(msg!)
       }
     },
   },
-}
+})