diff --git a/Services/client/package.json b/Services/client/package.json
index e48520f..50e4cbb 100644
--- a/Services/client/package.json
+++ b/Services/client/package.json
@@ -29,7 +29,6 @@
     "vue-router": "^4.2.5"
   },
   "devDependencies": {
-    "@mayank1513/vue-tag-input": "^1.2.0",
     "@quasar/vite-plugin": "^1.6.0",
     "@rushstack/eslint-patch": "^1.6.0",
     "@types/jsdom": "^21.1.6",
diff --git a/Services/client/src/components/FileForm.vue b/Services/client/src/components/FileForm.vue
index 5a6f4ea..2103dd1 100644
--- a/Services/client/src/components/FileForm.vue
+++ b/Services/client/src/components/FileForm.vue
@@ -19,8 +19,8 @@ const props = withDefaults(
     mode: 'create' | 'edit'
     title?: string
     description?: string
-    keyword?: string
-    category?: string
+    keyword?: string[]
+    category?: string[]
   }>(),
   {
     open: false,
diff --git a/Services/client/src/components/FileItem.vue b/Services/client/src/components/FileItem.vue
index 4d4b530..4620a3d 100644
--- a/Services/client/src/components/FileItem.vue
+++ b/Services/client/src/components/FileItem.vue
@@ -15,12 +15,13 @@ const props = withDefaults(
   defineProps<{ action: boolean; viewMode: 'view_list' | 'view_module' }>(),
   {
     action: false,
-  },
+  }
 )
 const DEPT_NAME = ['ตู้เอกสาร', 'ลิ้นชัก', 'แฟ้ม', 'แฟ้มย่อย'] as const
 const { getFileInfo, getFileNameFormat } = useFileInfoStore()
-const { currentFolder, currentFile, currentDept, currentPath } =
-  storeToRefs(useTreeDataStore())
+const { currentFolder, currentFile, currentDept, currentPath } = storeToRefs(
+  useTreeDataStore()
+)
 const {
   createFolder,
   editFolder,
@@ -36,8 +37,8 @@ const currentIcon = computed(() =>
   currentDept.value === 0
     ? 'mdi-file-cabinet'
     : currentDept.value === 1
-      ? 'inbox'
-      : 'o_folder_open',
+    ? 'inbox'
+    : 'o_folder_open'
 )
 
 const dialogDeleteState = ref<boolean>(false)
@@ -56,8 +57,8 @@ const fileFormData = ref<{
   file?: File
   title?: string
   description?: string
-  keyword?: string
-  category?: string
+  keyword?: string[]
+  category?: string[]
 }>({})
 const fileFormType = ref<'edit' | 'create'>('create')
 const fileFormError = ref<{ fileExist?: boolean }>({})
@@ -109,10 +110,10 @@ function triggerFileEdit(
   value: {
     title: string
     description: string
-    keyword: string
-    category: string
+    keyword: string[]
+    category: string[]
   },
-  pathname: string,
+  pathname: string
 ) {
   fileFormState.value = true
   fileFormType.value = 'edit'
@@ -121,7 +122,7 @@ function triggerFileEdit(
     title: value.title,
     description: value.description,
     keyword: value.keyword,
-    category: value.keyword,
+    category: value.category,
   }
 }
 
@@ -136,7 +137,7 @@ async function submitFileForm(
     keyword: string[]
     category: string[]
   },
-  force = false,
+  force = false
 ) {
   currentParam.value = value
 
@@ -149,8 +150,8 @@ async function submitFileForm(
     await uploadFile(currentPath.value, value.file, {
       title: value.title,
       description: value.description,
-      keyword: value.keyword.join(''),
-      category: value.category.join(''),
+      keyword: value.keyword,
+      category: value.category,
     })
   } else {
     await updateFile(
@@ -158,10 +159,10 @@ async function submitFileForm(
       {
         title: value.title,
         description: value.description,
-        keyword: value.keyword.join(''),
-        category: value.category.join(''),
+        keyword: value.keyword,
+        category: value.category,
       },
-      value.file,
+      value.file
     )
   }
   fileFormData.value = {}
@@ -306,10 +307,10 @@ async function submitFileForm(
                   {
                     title: value.title,
                     description: value.description,
-                    keyword: value.keyword.join(','),
-                    category: value.category.join(','),
+                    keyword: value.keyword,
+                    category: value.category,
                   },
-                  value.pathname,
+                  value.pathname
                 )
             "
             @delete="() => triggerFileDelete(value.pathname)"
diff --git a/Services/client/src/stores/tree-data.ts b/Services/client/src/stores/tree-data.ts
index 7cee9f0..759c05a 100644
--- a/Services/client/src/stores/tree-data.ts
+++ b/Services/client/src/stores/tree-data.ts
@@ -246,8 +246,8 @@ export const useTreeDataStore = defineStore('changeCabinet', () => {
     metadata: {
       title: string
       description: string
-      keyword: string
-      category: string
+      keyword: string[]
+      category: string[]
     },
   ) {
     loader.show()
@@ -294,8 +294,8 @@ export const useTreeDataStore = defineStore('changeCabinet', () => {
     metadata: {
       title: string
       description: string
-      keyword: string
-      category: string
+      keyword: string[]
+      category: string[]
     },
     file?: File,
   ) {