update

src/pages/ProjectsPage.vue

@@ -21,12 +21,12 @@
         v-if="projects.length!==0 || archiveProjects.length!==0"
         >
         <q-input
-          v-if="projects.length!== 0"
+          v-if="projects.length!==0"
           v-model="searchProject"
           clearable
           clear-icon="close"
           :placeholder="$t('projects__search')"
-          dense
+          dense filled
           class="col-grow q-px-md q-py-md"
           >
           <template #prepend>
@@ -61,16 +61,16 @@
                 />
               </q-item-section>
               <q-item-section>
-                <q-item-label lines="1" class="text-bold">{{ item.name }}</q-item-label>
+                <q-item-label lines="1" class="text-bold">
+                  {{ item.name }}
+                </q-item-label>
                 <q-item-label 
                   caption lines="2"
                   style="max-width: -webkit-fill-available; white-space: pre-line"
                   >
                   {{ item.description }}
                 </q-item-label>
-              </q-item-section>
-              <q-item-section side top>
-                <q-item-label lines="1" class="text-caption">
+                <q-item-label lines="1" class="text-caption text-grey">
                   <div class="flex items-center">           
                     <div class="flex items-center">
                       <q-icon name="mdi-chat-outline"/>
@@ -82,10 +82,12 @@
                     </div>
                   </div>
                 </q-item-label>
+              </q-item-section>
+              <q-item-section side>
                 <q-item-label>
                   <q-btn
                     color="grey"
-                    size="sm"
+                    size="md"
                     dense flat round
                     icon="mdi-pencil"
                     class="q-ml-sm"
@@ -225,7 +227,7 @@
 
   const router = useRouter()
   const projectsStore = useProjectsStore()
-  const projects = projectsStore.getProjects
+  const projects = computed(() => projectsStore.projects)
   const projectsInit = computed(() => projectsStore.isInit)
 
   const searchProject = ref('')
@@ -259,9 +261,9 @@
   }
 
   const displayProjects = computed(() => {
-    if (!searchProject.value || !(searchProject.value && searchProject.value.trim())) return projects
+    if (!searchProject.value || !(searchProject.value && searchProject.value.trim())) return projects.value
     const searchChatValue = searchProject.value.trim().toLowerCase()
-    const arrOut = projects
+    const arrOut = projects.value
       .filter((el: Project) =>
         el.name.toLowerCase().includes(searchChatValue) ||
         el.description && el.description.toLowerCase().includes(searchProject.value)