From c459863a0eec784637653cd231b7906599669de6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?No=C3=A9=20Viricel?= <noe.viricel@wazo-lab.io>
Date: Sun, 4 Oct 2020 15:36:29 +0200
Subject: [PATCH] Revert SearchInput logic to a simplified one + Redirect on
 results on page reload

---
 nuxt/components/SearchInput.vue | 77 ++++-----------------------------
 nuxt/middleware/redirect.js     |  3 ++
 2 files changed, 11 insertions(+), 69 deletions(-)
 create mode 100644 nuxt/middleware/redirect.js

diff --git a/nuxt/components/SearchInput.vue b/nuxt/components/SearchInput.vue
index ced1bf9..564a0d1 100644
--- a/nuxt/components/SearchInput.vue
+++ b/nuxt/components/SearchInput.vue
@@ -1,37 +1,13 @@
 <template>
   <div>
     <label>Type any movie title you want:</label>
-    <a-auto-complete
-      v-model="search"
-      :data-source="dataSource"
-      size="large"
-      style="width: 100%"
+    <a-input-search
       placeholder="Ex: Star Wars"
-      :allowClear="true"
-      :autoFocus="true"
-      not-found-content="0 Result"
-      :loading="fetching"
-      @select="onSelect"
+      enter-button
+      v-model="search"
+      size="large"
       @search="handleSearch"
-    >
-      <a-input-search enter-button size="large" />
-      <template slot="dataSource">
-        <a-select-option
-          v-for="(opt, index) in dataSource"
-          :key="index"
-          :label="opt.text"
-          :value="opt.value"
-        >
-          <div class="item-content">
-            <img class="item-thumbnail" :src="opt.poster" :alt="opt.text" />
-            <div class="item-infos">
-              {{ opt.text }}
-              <span>{{ opt.year }}</span>
-            </div>
-          </div>
-        </a-select-option>
-      </template>
-    </a-auto-complete>
+    />
     <a-alert
       v-if="!search || search.length < 3"
       message="Type at least 3 letters."
@@ -46,50 +22,13 @@ import { groupBy } from "lodash";
 export default {
   data() {
     return {
-      search: "",
-      fetching: false,
-      dataSource: []
+      search: ""
     };
   },
   methods: {
-    async getMovies(value) {
-      if (value && value.length >= 3) {
-        this.fetching = true;
-
-        const result = await this.$axios.$get("", {
-          params: {
-            apikey: "a4bf96a7",
-            s: value,
-            type: "movie"
-          }
-        });
-
-        if (result.Response === "True") {
-          const data = result.Search.map(movie => ({
-            text: movie.Title,
-            value: movie.imdbID,
-            poster: movie.Poster,
-            year: movie.Year
-          }));
-
-          this.dataSource = data;
-          this.fetching = false;
-        } else if (result.Response === "False") {
-          this.dataSource = [];
-        }
-      }
-    },
     handleSearch(value) {
-      this.getMovies(value);
-    },
-    handleChange(value) {
-      this.search = value;
-      this.getMovies(value);
-    },
-    onSelect(value) {
-      console.log(value);
-
-      //TODO: Fetch the selected Movies and redirect to result page
+      this.$store.commit("setSearch", value);
+      this.$router.push("/results");
     }
   }
 };
diff --git a/nuxt/middleware/redirect.js b/nuxt/middleware/redirect.js
new file mode 100644
index 0000000..b0e29b8
--- /dev/null
+++ b/nuxt/middleware/redirect.js
@@ -0,0 +1,3 @@
+export default function({ store, redirect, route }) {
+  if (store.state.search == "") return redirect("/");
+}