From 8bff32d5e03e3edd6d2b77b0606342c8032cdbf6 Mon Sep 17 00:00:00 2001
From: Moustafa Shaaban <Moustafa_Shaaban@zohomail.com>
Date: Fri, 1 Nov 2024 11:12:34 +0200
Subject: [PATCH] Updated the UI

---
 package-lock.json           | 79 +++++++++++++++++++++++++++++++++++++
 package.json                |  2 +
 src/components/NoteForm.vue |  2 +-
 src/main.js                 |  2 +
 4 files changed, 84 insertions(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index e8a675a..954eabb 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,11 +8,13 @@
       "name": "vite-project",
       "version": "0.0.0",
       "dependencies": {
+        "@primevue/themes": "^4.1.1",
         "@quasar/extras": "^1.16.9",
         "@vueuse/core": "^10.9.0",
         "lodash.uniqueid": "^4.0.1",
         "nanoid": "^5.0.6",
         "pinia": "^2.1.7",
+        "primevue": "^4.1.1",
         "quasar": "^2.14.6",
         "vue": "^3.4.19",
         "vue-multiselect": "^3.0.0",
@@ -409,6 +411,68 @@
       "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz",
       "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg=="
     },
+    "node_modules/@primeuix/styled": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/@primeuix/styled/-/styled-0.2.0.tgz",
+      "integrity": "sha512-3Q6bDrmwTW88tzJsFIFenC0VyXLj0+/wYw+TZnJ/4CCDfehR4WfTs4EZdpuFtYqvmbpJ6zWXAiwSCNdSYTZkyA==",
+      "license": "MIT",
+      "dependencies": {
+        "@primeuix/utils": "^0.2.0"
+      },
+      "engines": {
+        "node": ">=12.11.0"
+      }
+    },
+    "node_modules/@primeuix/utils": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/@primeuix/utils/-/utils-0.2.0.tgz",
+      "integrity": "sha512-AaDIeRFlsbkVTk2s0mlEjnGSLi31X669NVwo+n+AVAnBdDiQznjipNTpHbOobVBtjOKZize74PChK6uoaSBRUw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.11.0"
+      }
+    },
+    "node_modules/@primevue/core": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/@primevue/core/-/core-4.1.1.tgz",
+      "integrity": "sha512-jUDrTh3g0FskTdD6rCCsoWfxKky0R7959p7vnaNYI6wMLreaTL3yC3nzYlEniIpb+F51Sm3KJ1eSJBN6DnSB8Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@primeuix/styled": "^0.2.0",
+        "@primeuix/utils": "^0.2.0"
+      },
+      "engines": {
+        "node": ">=12.11.0"
+      },
+      "peerDependencies": {
+        "vue": "^3.0.0"
+      }
+    },
+    "node_modules/@primevue/icons": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/@primevue/icons/-/icons-4.1.1.tgz",
+      "integrity": "sha512-Ybeb+AHUsVybITuYNwS7goqWcXLLgCDSiCPoymyYwYkzn5qLakvJbQH1EX8lGOsrvqK0hG+s+n7Wm2MHJ8A72w==",
+      "license": "MIT",
+      "dependencies": {
+        "@primeuix/utils": "^0.2.0",
+        "@primevue/core": "4.1.1"
+      },
+      "engines": {
+        "node": ">=12.11.0"
+      }
+    },
+    "node_modules/@primevue/themes": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/@primevue/themes/-/themes-4.1.1.tgz",
+      "integrity": "sha512-ec2gBN2vP0ydGtGAzC0nYCFqYN7CzvXxnlJqcvcPIo3rP/pcdj+FkzAe3y2DMG3OorYtqdzoyGtBefQrx3v5ag==",
+      "license": "MIT",
+      "dependencies": {
+        "@primeuix/styled": "^0.2.0"
+      },
+      "engines": {
+        "node": ">=12.11.0"
+      }
+    },
     "node_modules/@quasar/extras": {
       "version": "1.16.9",
       "resolved": "https://registry.npmjs.org/@quasar/extras/-/extras-1.16.9.tgz",
@@ -1164,6 +1228,21 @@
         "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
       }
     },
+    "node_modules/primevue": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/primevue/-/primevue-4.1.1.tgz",
+      "integrity": "sha512-FeJkv7FhfePfUBoApW0qAhid6Znq18VgbGFZdmhUcxvOD49Y2Eo/k2Yn7ypPhRbRApWiaSRN0v/2G1I4AMj3xg==",
+      "license": "MIT",
+      "dependencies": {
+        "@primeuix/styled": "^0.2.0",
+        "@primeuix/utils": "^0.2.0",
+        "@primevue/core": "4.1.1",
+        "@primevue/icons": "4.1.1"
+      },
+      "engines": {
+        "node": ">=12.11.0"
+      }
+    },
     "node_modules/quasar": {
       "version": "2.14.6",
       "resolved": "https://registry.npmjs.org/quasar/-/quasar-2.14.6.tgz",
diff --git a/package.json b/package.json
index 0bb2d6a..b46aa85 100644
--- a/package.json
+++ b/package.json
@@ -9,11 +9,13 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@primevue/themes": "^4.1.1",
     "@quasar/extras": "^1.16.9",
     "@vueuse/core": "^10.9.0",
     "lodash.uniqueid": "^4.0.1",
     "nanoid": "^5.0.6",
     "pinia": "^2.1.7",
+    "primevue": "^4.1.1",
     "quasar": "^2.14.6",
     "vue": "^3.4.19",
     "vue-multiselect": "^3.0.0",
diff --git a/src/components/NoteForm.vue b/src/components/NoteForm.vue
index 8c83f24..6fa6339 100644
--- a/src/components/NoteForm.vue
+++ b/src/components/NoteForm.vue
@@ -81,7 +81,7 @@ function handleSubmit() {
               :options="noteTags" 
               :multiple="true" 
               :taggable="true"
-              :close-on-select="false"
+              :close-on-select="true"
               :clear-on-select="false"
             >
             </multiselect>
diff --git a/src/main.js b/src/main.js
index cf6b72e..b6ba16b 100644
--- a/src/main.js
+++ b/src/main.js
@@ -3,6 +3,8 @@ import { createPinia } from 'pinia'
 import 'vue-multiselect/dist/vue-multiselect.css'
 import App from './App.vue'
 import { Quasar, Dark, Notify, Dialog } from 'quasar'
+
+
 import router from './router'
 
 // Import icon libraries