From 2a102188090acc8a8a1d698ee5fe166202f51943 Mon Sep 17 00:00:00 2001
From: Andreas Zweili <andreas@zweili.ch>
Date: Sat, 4 Sep 2021 16:44:16 +0200
Subject: [PATCH] migrate the ProjectsList according to the solution

---
 .../src/components/projects/ProjectsList.vue  | 25 +++++++++----------
 1 file changed, 12 insertions(+), 13 deletions(-)

diff --git a/2021-09-04_composition-13-demo-starting-project/src/components/projects/ProjectsList.vue b/2021-09-04_composition-13-demo-starting-project/src/components/projects/ProjectsList.vue
index 81bd65b..f0bcdbb 100644
--- a/2021-09-04_composition-13-demo-starting-project/src/components/projects/ProjectsList.vue
+++ b/2021-09-04_composition-13-demo-starting-project/src/components/projects/ProjectsList.vue
@@ -33,41 +33,40 @@ export default {
     const activeSearchTerm = ref('');
     const enteredSearchTerm = ref('');
 
-    const hasProjects = computed(function() {
-      return props.user.projects && availableProjects.value.length > 0;
-    });
     const availableProjects = computed(function() {
       if (activeSearchTerm.value) {
         return props.user.projects.filter(prj =>
-          prj.title.includes(activeSearchTerm)
+          prj.title.includes(activeSearchTerm.value)
         );
       }
       return props.user.projects;
     });
 
-    watch(enteredSearchTerm, function(val) {
+    const hasProjects = computed(function() {
+      return props.user.projects && availableProjects.value.length > 0;
+    });
+
+    watch(enteredSearchTerm, function(newValue) {
       setTimeout(() => {
-        if (val === enteredSearchTerm.value) {
-          activeSearchTerm.value = val;
+        if (newValue === enteredSearchTerm.value) {
+          activeSearchTerm.value = newValue;
         }
       }, 300);
     });
+    watch(props.user, function() {
+      enteredSearchTerm.value = '';
+    });
 
     function updateSearch(val) {
       enteredSearchTerm.value = val;
     }
 
-    function userSearch() {
-      enteredSearchTerm.value = '';
-    }
-
     return {
       enteredSearchTerm,
       activeSearchTerm,
       hasProjects,
       availableProjects,
-      updateSearch,
-      userSearch
+      updateSearch
     };
   }
 };