Fixed eslint errors

web/package.json

@@ -5,8 +5,8 @@
     "dev": "vite",
     "build": "vue-tsc --noEmit && vite build",
     "serve": "vite preview",
-    "lint": "eslint \"src/**\"",
+    "lint": "eslint --ext .js,.vue src",
-    "format": "eslint --fix \"src/**\""
+    "format": "yarn run lint --fix"
   },
   "dependencies": {
     "vue": "^3.0.5",

web/src/App.vue

@@ -1,6 +1,8 @@
 <template>
-    <Nav />
+    <div>
-    <router-view />
+        <Nav />
+        <router-view />
+    </div>
 </template>
 
 <script lang="ts">

web/src/api/ivago.ts

@@ -3,11 +3,11 @@ export interface Street {
     city: string
 }
 
-export async function search (search_term: string): Promise<Street[]> {
+export async function search (searchTerm: string): Promise<Street[]> {
-    const base_url = import.meta.env.VITE_ENDPOINT as string
+    const baseURL = import.meta.env.VITE_ENDPOINT as string
 
-    const r = await fetch(`${base_url}/ivago/search?` + new URLSearchParams({
+    const r = await fetch(`${baseURL}/ivago/search?` + new URLSearchParams({
-        q: search_term
+        q: searchTerm
     }))
 
     if (!r.ok) {

web/src/components/HelloWorld.vue

@@ -1,51 +0,0 @@
-<template>
-    <h1>Fej Frontend</h1>
-
-    <input id="street" type="text" placeholder="street" v-model="street" />
-    <button :onClick="onSubmit">Search</button>
-
-    <ul>
-        <li v-for="res in results">{{res.name}} ({{res.city}})</li>
-    </ul>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue'
-import { Street, Ivago } from '../api/ivago'
-
-export default defineComponent({
-    name: 'HelloWorld',
-    data () {
-        return {
-            street: '',
-            results: [] as Street[]
-        }
-    },
-    methods: {
-        onSubmit () {
-            new Ivago(import.meta.env.VITE_ENDPOINT as string).search(this.$data.street)
-                .then(res => {
-                    this.$data.results = res
-                })
-        }
-    }
-})
-</script>
-
-<style scoped>
-a {
-  color: #42b983;
-}
-
-label {
-  margin: 0 0.5em;
-  font-weight: bold;
-}
-
-code {
-  background-color: #eee;
-  padding: 2px 4px;
-  border-radius: 4px;
-  color: #304455;
-}
-</style>

web/src/components/Home.vue

@@ -1,7 +1,9 @@
 <template>
-    <h1>Fej</h1>
+    <div>
-    <p>Welcome to Fej, my frontend/backend combo.</p>
+        <h1>Fej</h1>
-    <p>If you can see this, the cicd worked!</p>
+        <p>Welcome to Fej, my frontend/backend combo.</p>
+        <p>If you can see this, the cicd worked!</p>
+    </div>
 </template>
 
 <script lang="ts">

web/src/components/Ivago.vue

@@ -1,17 +1,27 @@
 <template>
-    <h1>Ivago</h1>
+    <div>
-    <input v-model="query" v-on:keyup.enter="search" type="text" placeholder="Street..." />
+        <h1>Ivago</h1>
-    <div id="scroll-list">
+        <input
-        <ul v-if="msg === ''">
+            v-model="query"
-            <li v-for="item in items">{{ item.name }} ({{ item.city }})</li>
+            v-on:keyup.enter="search"
-        </ul>
+            type="text"
-        <p v-else>{{ msg }}</p>
+            placeholder="Street..." />
+        <div id="scroll-list">
+            <ul v-if="msg === ''">
+                <li
+                    v-for="item in items"
+                    v-bind:key="`${item.name} (${item.city})`" >
+                    {{ item.name }} ({{ item.city }})
+                </li>
+            </ul>
+            <p v-else>{{ msg }}</p>
+        </div>
     </div>
 </template>
 
 <script lang="ts">
 import { defineComponent } from 'vue'
-import { Street, search as ivago_search } from '../api/ivago'
+import { Street, search as ivagoSearch } from '../api/ivago'
 
 export default defineComponent({
     name: 'Ivago',
@@ -32,7 +42,7 @@ export default defineComponent({
                 return
             }
 
-            ivago_search(this.query)
+            ivagoSearch(this.query)
                 .then((res: Street[]) => {
                     this.items = res
                     this.msg = ''