From c9405fa2906de3b897e5328a0d4ff141589f4b25 Mon Sep 17 00:00:00 2001
From: ludchieng <lud.chieng@hotmail.fr>
Date: Tue, 24 Jan 2023 23:17:24 +0100
Subject: [PATCH] chore: add linter rules

---
 .eslintrc.js                                  |  2 +
 src/App.vue                                   | 14 +--
 src/components/AppHeader.vue                  | 23 +++--
 src/components/AppNav.vue                     | 70 +++++++++++----
 src/components/AppView.vue                    |  3 +-
 src/components/LineIcon.vue                   |  2 +-
 src/components/LineMap/LineMap.vue            | 12 +--
 src/components/LineMap/LineMapDrawingCell.vue | 86 ++++++++++++++++---
 src/components/LineMap/LineMapLabelCell.vue   | 12 ++-
 src/components/LineMap/LineMapTable.vue       | 24 ++++--
 src/components/Stop/StopHeader.vue            |  6 +-
 src/components/Stop/StopPrevNextStops.vue     |  4 +-
 src/components/Stop/StopSchedules.vue         | 44 ++++++----
 .../Stop/StopSchedulesDetailsTimes.vue        |  4 +-
 ...topSchedulesDetailsTimesNonStopPassage.vue |  6 +-
 src/components/Stop/StopSchedulesVisits.vue   | 37 ++++++--
 .../UiSchedulesDetailsTimeInline.vue          |  4 +-
 .../UiSchedulesDetailsTimeWrapped.vue         | 16 +++-
 src/components/ui/UiIcon.vue                  |  2 +-
 src/components/ui/UiTime.vue                  | 18 ++--
 src/pages/SettingsPage.vue                    |  7 +-
 src/pages/TimetablesLinePage.vue              |  2 +-
 src/pages/TimetablesStopPage.vue              | 16 ++--
 23 files changed, 292 insertions(+), 122 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index a87c751..8131582 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -5,6 +5,8 @@ module.exports = {
   },
   extends: [
     'plugin:vue/essential',
+    'plugin:vue/strongly-recommended',
+    'plugin:vue/recommended',
     '@vue/standard',
     '@vue/typescript/recommended',
   ],
diff --git a/src/App.vue b/src/App.vue
index 2b22203..5019586 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -17,13 +17,6 @@ export default Vue.extend({
   components: {
     AppView,
   },
-  created () {
-    if (!lastUpdatedAt()) {
-      synchronize().then(() => {
-        window.location.href = '/'
-      })
-    }
-  },
   watch: {
     '$route.params.tab': {
       handler () {
@@ -71,6 +64,13 @@ export default Vue.extend({
       immediate: true,
     },
   },
+  created () {
+    if (!lastUpdatedAt()) {
+      synchronize().then(() => {
+        window.location.href = '/'
+      })
+    }
+  },
 })
 </script>
 
diff --git a/src/components/AppHeader.vue b/src/components/AppHeader.vue
index 25fa548..bb8e754 100644
--- a/src/components/AppHeader.vue
+++ b/src/components/AppHeader.vue
@@ -1,20 +1,27 @@
 <template>
   <header>
     <div>
-      <router-link v-if="$route.params.line"
+      <router-link
+        v-if="$route.params.line"
         class="icon-line"
         :to="`/timetables/${ $route.params.tab }/${ $route.params.line }`"
       >
-      <LineIcon
-        :lineSlugName="$route.params.line"
-        color="colors"
-        size="md"
-      />
+        <LineIcon
+          :line-slug-name="$route.params.line"
+          color="colors"
+          size="md"
+        />
       </router-link>
     </div>
     <div>
-      <router-link class="logo" :to="`/timetables/${ $route.params.tab || '' }`">
-        <img alt="Logo Alednavigo" src="@/assets/icon-light.png" />
+      <router-link
+        class="logo"
+        :to="`/timetables/${ $route.params.tab || '' }`"
+      >
+        <img
+          alt="Logo Alednavigo"
+          src="@/assets/icon-light.png"
+        >
       </router-link>
     </div>
     <div class="clock">
diff --git a/src/components/AppNav.vue b/src/components/AppNav.vue
index 7180a57..931c4f7 100644
--- a/src/components/AppNav.vue
+++ b/src/components/AppNav.vue
@@ -2,25 +2,37 @@
   <nav>
     <hr>
     <div class="nav-content">
-      <div v-if="showTabsList" class="nav-tabs-list">
+      <div
+        v-if="showTabsList"
+        class="nav-tabs-list"
+      >
         <ul>
-          <li v-for="({ line, stop, path }, i) in $store.state.tabs" :key="`/${i + 1}/${path}`"
+          <li
+            v-for="({ line, stop, path }, i) in $store.state.tabs"
+            :key="`/${i + 1}/${path}`"
             class="tab"
             :class="{ 'tab-active': tabIndex() === i }"
           >
-            <router-link class="tab-link" :to="`/timetables/${i + 1}/${path}`">
+            <router-link
+              class="tab-link"
+              :to="`/timetables/${i + 1}/${path}`"
+            >
               <span class="tab-label">
                 <LineIcon
-                  :lineSlugName="line"
+                  :line-slug-name="line"
                   :color="tabIndex() === i ? 'dark' : 'light'"
                   size="sm"
                 />
-                <span v-if="stop" class="tab-label-text">
+                <span
+                  v-if="stop"
+                  class="tab-label-text"
+                >
                   {{ getStop(line, stop).displayName }}
                 </span>
               </span>
             </router-link>
-            <button v-if="$store.state.tabs.length > 1"
+            <button
+              v-if="$store.state.tabs.length > 1"
               class="close-tab"
               @click="closeTab(i)"
             >
@@ -31,23 +43,40 @@
       </div>
 
       <div class="nav-controls">
-        <router-link class="to-settings" to="/settings">
-          <img class="icon-settings" src="/img/mui/more-vert.svg" />
+        <router-link
+          class="to-settings"
+          to="/settings"
+        >
+          <img
+            class="icon-settings"
+            src="/img/mui/more-vert.svg"
+          >
         </router-link>
         <div class="tabs-manager">
-          <ul v-if="!showTabsList" class="tabs">
-            <li v-for="({ line, stop, path }, i) in $store.state.tabs" :key="`/${i + 1}/${path}`"
+          <ul
+            v-if="!showTabsList"
+            class="tabs"
+          >
+            <li
+              v-for="({ line, stop, path }, i) in $store.state.tabs"
+              :key="`/${i + 1}/${path}`"
               class="tab"
               :class="{ 'tab-active': tabIndex() === i }"
             >
-              <router-link class="tab-link" :to="`/timetables/${i + 1}/${path}`">
+              <router-link
+                class="tab-link"
+                :to="`/timetables/${i + 1}/${path}`"
+              >
                 <span class="tab-label">
                   <LineIcon
-                    :lineSlugName="line"
+                    :line-slug-name="line"
                     :color="tabIndex() === i ? 'dark' : 'light'"
                     size="sm"
                   />
-                  <span v-if="stop" class="tab-label-text">
+                  <span
+                    v-if="stop"
+                    class="tab-label-text"
+                  >
                     {{ getStop(line, stop).displayName }}
                   </span>
                 </span>
@@ -55,11 +84,20 @@
             </li>
           </ul>
         </div>
-        <button class="add-tab" @click="addTab()">
+        <button
+          class="add-tab"
+          @click="addTab()"
+        >
           +
         </button>
-        <button class="btn-toggle-tabs-list" @click="showTabsList = !showTabsList">
-          <img class="icon-tabs-list" src="/img/mui/reorder.svg" />
+        <button
+          class="btn-toggle-tabs-list"
+          @click="showTabsList = !showTabsList"
+        >
+          <img
+            class="icon-tabs-list"
+            src="/img/mui/reorder.svg"
+          >
         </button>
       </div>
     </div>
diff --git a/src/components/AppView.vue b/src/components/AppView.vue
index 67959e9..64e9324 100644
--- a/src/components/AppView.vue
+++ b/src/components/AppView.vue
@@ -2,8 +2,7 @@
   <div>
     <AppHeader />
     <div class="tab">
-      <router-view>
-      </router-view>
+      <router-view />
     </div>
     <AppNav />
   </div>
diff --git a/src/components/LineIcon.vue b/src/components/LineIcon.vue
index bdaf0db..66a0951 100644
--- a/src/components/LineIcon.vue
+++ b/src/components/LineIcon.vue
@@ -4,7 +4,7 @@
     :src="`/img/lines-icons/${color}/${lineSlugName}.svg`"
     :alt="`${lineSlugName}`"
     :size="size"
-    :fadeIn="fadeIn"
+    :fade-in="fadeIn"
   />
 </template>
 
diff --git a/src/components/LineMap/LineMap.vue b/src/components/LineMap/LineMap.vue
index fc1e8a7..567737a 100644
--- a/src/components/LineMap/LineMap.vue
+++ b/src/components/LineMap/LineMap.vue
@@ -1,7 +1,7 @@
 <template>
   <LineMapTable
     :line="line"
-    :routeMap="routeMap"
+    :route-map="routeMap"
   />
 </template>
 
@@ -20,6 +20,11 @@ export default Vue.extend({
   data: () => ({
     routeMap: [] as RouteMapType,
   }),
+  watch: {
+    line () {
+      this.update()
+    },
+  },
   created () {
     this.update()
   },
@@ -28,11 +33,6 @@ export default Vue.extend({
       this.routeMap = getLineRouteMap(this.line)
     },
   },
-  watch: {
-    line () {
-      this.update()
-    },
-  },
 })
 </script>
 
diff --git a/src/components/LineMap/LineMapDrawingCell.vue b/src/components/LineMap/LineMapDrawingCell.vue
index 4104e9f..8b59a04 100644
--- a/src/components/LineMap/LineMapDrawingCell.vue
+++ b/src/components/LineMap/LineMapDrawingCell.vue
@@ -1,48 +1,108 @@
 <template>
-  <svg v-if="content === '*'" class="drawing-stop" viewBox="0 0 16 16">
-    <circle v-if="isLargeCircle" cx="8" cy="8" r="6"/>
-    <circle v-else cx="8" cy="8" r="4"/>
+  <svg
+    v-if="content === '*'"
+    class="drawing-stop"
+    viewBox="0 0 16 16"
+  >
+    <circle
+      v-if="isLargeCircle"
+      cx="8"
+      cy="8"
+      r="6"
+    />
+    <circle
+      v-else
+      cx="8"
+      cy="8"
+      r="4"
+    />
   </svg>
 
-  <svg v-else-if="content === '^'" class="drawing-path" viewBox="0 0 16 16">
+  <svg
+    v-else-if="content === '^'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,0 Z" />
     <path d="M0,8 a8,-8 0 0,1 8,-8 L0,0 Z" />
   </svg>
 
-  <svg v-else-if="content === 'v'" class="drawing-path" viewBox="0 0 16 16">
+  <svg
+    v-else-if="content === 'v'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+  >
     <path d="M0,8 a8,8 0 0,0 8,8 L0,16 Z" />
     <path d="M8,16 a8,-8 0 0,0 8,-8 L16,16 Z" />
   </svg>
 
-  <svg v-else-if="content === 'o\\'" class="drawing-path" viewBox="0 0 16 16">
+  <svg
+    v-else-if="content === 'o\\'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,0 Z" />
   </svg>
 
-  <svg v-else-if="content === 'o/'" class="drawing-path" viewBox="0 0 16 16" transform="rotate(90)">
+  <svg
+    v-else-if="content === 'o/'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+    transform="rotate(90)"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,0 Z" />
   </svg>
 
-  <svg v-else-if="content === '\\o'" class="drawing-path" viewBox="0 0 16 16" transform="rotate(180)">
+  <svg
+    v-else-if="content === '\\o'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+    transform="rotate(180)"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,0 Z" />
   </svg>
 
-  <svg v-else-if="content === '/o'" class="drawing-path" viewBox="0 0 16 16" transform="rotate(270)">
+  <svg
+    v-else-if="content === '/o'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+    transform="rotate(270)"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,0 Z" />
   </svg>
 
-  <svg v-else-if="content === '\\.'" class="drawing-path" viewBox="0 0 16 16">
+  <svg
+    v-else-if="content === '\\.'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,16 L0,16 L0 0 Z" />
   </svg>
 
-  <svg v-else-if="content === '/.'" class="drawing-path" viewBox="0 0 16 16" transform="rotate(90)">
+  <svg
+    v-else-if="content === '/.'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+    transform="rotate(90)"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,16 L0,16 L0 0 Z" />
   </svg>
 
-  <svg v-else-if="content === '.\\'" class="drawing-path" viewBox="0 0 16 16" transform="rotate(180)">
+  <svg
+    v-else-if="content === '.\\'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+    transform="rotate(180)"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,16 L0,16 L0 0 Z" />
   </svg>
 
-  <svg v-else-if="content === './'" class="drawing-path" viewBox="0 0 16 16" transform="rotate(270)">
+  <svg
+    v-else-if="content === './'"
+    class="drawing-path"
+    viewBox="0 0 16 16"
+    transform="rotate(270)"
+  >
     <path d="M8,0 a8,8 0 0,1 8,8 L16,16 L0,16 L0 0 Z" />
   </svg>
 
diff --git a/src/components/LineMap/LineMapLabelCell.vue b/src/components/LineMap/LineMapLabelCell.vue
index 2c0ce5c..8b5b167 100644
--- a/src/components/LineMap/LineMapLabelCell.vue
+++ b/src/components/LineMap/LineMapLabelCell.vue
@@ -1,5 +1,6 @@
 <template>
-  <router-link v-if="href"
+  <router-link
+    v-if="href"
     class="label-text"
     :to="href"
   >
@@ -8,15 +9,18 @@
       <LineIcon
         v-for="conn in lineConnections"
         :key="`${conn.line}/${conn.slugName}`"
-        :lineSlugName="conn.line"
+        :line-slug-name="conn.line"
         color="colors"
         size="sm"
-        fadeIn
+        fade-in
       />
     </div>
   </router-link>
 
-  <div v-else class="label-text">
+  <div
+    v-else
+    class="label-text"
+  >
     {{ stopName }}
     <div class="line-connections">
       <img
diff --git a/src/components/LineMap/LineMapTable.vue b/src/components/LineMap/LineMapTable.vue
index 23f2bd9..c25df89 100644
--- a/src/components/LineMap/LineMapTable.vue
+++ b/src/components/LineMap/LineMapTable.vue
@@ -1,19 +1,29 @@
 <template>
   <table>
-    <tr v-for="(row, i) in routeMap" :key="i">
-      <td v-for="(cell, j) in row.drawing" :key="j"
+    <tr
+      v-for="(row, i) in routeMap"
+      :key="i"
+    >
+      <td
+        v-for="(cell, j) in row.drawing"
+        :key="j"
         :class="{ filled: shouldBeFilledCell(cell) }"
       >
-        <DrawingCell :content="cell" :isLargeCircle="row.isTerminus || false" />
+        <DrawingCell
+          :content="cell"
+          :is-large-circle="row.isTerminus || false"
+        />
       </td>
 
-      <td v-if="row.slugName"
-        class="label" :class="{ 'label-terminus': row.isTerminus }"
+      <td
+        v-if="row.slugName"
+        class="label"
+        :class="{ 'label-terminus': row.isTerminus }"
       >
         <LabelCell
-          :stopName="row.displayName"
+          :stop-name="row.displayName"
           :href="`/timetables/${$route.params.tab}/${line}/${row.slugName}`"
-          :lineConnections="row.lineConnections"
+          :line-connections="row.lineConnections"
         />
       </td>
     </tr>
diff --git a/src/components/Stop/StopHeader.vue b/src/components/Stop/StopHeader.vue
index acea049..a76d216 100644
--- a/src/components/Stop/StopHeader.vue
+++ b/src/components/Stop/StopHeader.vue
@@ -3,11 +3,11 @@
     <div class="line-connections">
       <router-link
         v-for="conn in stop.lineConnections"
-       :key="`${conn.line}/${conn.slugName}`"
-       :to="`/timetables/${$route.params.tab}/${conn.line}/${conn.slugName}`"
+        :key="`${conn.line}/${conn.slugName}`"
+        :to="`/timetables/${$route.params.tab}/${conn.line}/${conn.slugName}`"
       >
         <LineIcon
-          :lineSlugName="conn.line"
+          :line-slug-name="conn.line"
           color="dark"
           size="md"
         />
diff --git a/src/components/Stop/StopPrevNextStops.vue b/src/components/Stop/StopPrevNextStops.vue
index d06aa72..aaf5279 100644
--- a/src/components/Stop/StopPrevNextStops.vue
+++ b/src/components/Stop/StopPrevNextStops.vue
@@ -1,10 +1,10 @@
 <template>
   <DesignPrevNext
-    :prevItems="stop.prevStops.slice().reverse().map(prevStop => ({
+    :prev-items="stop.prevStops.slice().reverse().map(prevStop => ({
       label: getStop($route.params.line, prevStop).displayName,
       link: `/timetables/${$route.params.tab}/${$route.params.line}/${prevStop}`,
     }))"
-    :nextItems="stop.nextStops.slice().reverse().map(nextStop => ({
+    :next-items="stop.nextStops.slice().reverse().map(nextStop => ({
       label: getStop($route.params.line, nextStop).displayName,
       link: `/timetables/${$route.params.tab}/${$route.params.line}/${nextStop}`,
     }))"
diff --git a/src/components/Stop/StopSchedules.vue b/src/components/Stop/StopSchedules.vue
index 69c2865..25736af 100644
--- a/src/components/Stop/StopSchedules.vue
+++ b/src/components/Stop/StopSchedules.vue
@@ -3,16 +3,26 @@
     <pre v-if="debugData.size > 0">{{ Array.from(debugData).reduce((acc, line) => acc + `\n${line}`, '') }}</pre>
     <div :class="Object.entries(visitsByDirections).length ? 'fade-show' : 'hide'">
       <div
-        v-for="[direction, visits] in visitsByDirections" :key="direction"
+        v-for="[direction, visits] in visitsByDirections"
+        :key="direction"
         class="timetables"
       >
         <h2>{{ direction }}</h2>
         <div class="sync">
-          <span class="sync-time" :key="updateCounter">
+          <span
+            :key="updateCounter"
+            class="sync-time"
+          >
             {{ ((new Date().getTime() - updatedAt.getTime()) / 1000).toFixed(0) }}s
           </span>
-          <button class="sync-btn" @click="update">
-            <img class="icon-settings" src="/img/mui/update.svg" />
+          <button
+            class="sync-btn"
+            @click="update"
+          >
+            <img
+              class="icon-settings"
+              src="/img/mui/update.svg"
+            >
             Synchroniser
           </button>
         </div>
@@ -45,6 +55,19 @@ export default Vue.extend({
     updateCounter: 0,
     updateInterval: 0,
   }),
+  computed: {
+    linesByRef () {
+      return getLinesByRef()
+    },
+  },
+  watch: {
+    stop () {
+      this.visitsByDirections = []
+      this.fetchAbortController.abort()
+      this.fetchAbortController = new AbortController()
+      this.update()
+    },
+  },
   created () {
     this.update()
     this.updateInterval = setInterval(() => {
@@ -68,19 +91,6 @@ export default Vue.extend({
         })
     },
   },
-  computed: {
-    linesByRef () {
-      return getLinesByRef()
-    },
-  },
-  watch: {
-    stop () {
-      this.visitsByDirections = []
-      this.fetchAbortController.abort()
-      this.fetchAbortController = new AbortController()
-      this.update()
-    },
-  },
 })
 </script>
 
diff --git a/src/components/Stop/StopSchedulesDetailsTimes.vue b/src/components/Stop/StopSchedulesDetailsTimes.vue
index 6644cf9..36015a7 100644
--- a/src/components/Stop/StopSchedulesDetailsTimes.vue
+++ b/src/components/Stop/StopSchedulesDetailsTimes.vue
@@ -10,7 +10,9 @@
       :sublabel="visit.arrivalStatus !== 'onTime' ? visit.arrivalStatus : null"
     />
     <div>
-      <div v-if="visit.platform">Voie</div>
+      <div v-if="visit.platform">
+        Voie
+      </div>
       <div>{{ visit.platform }}</div>
     </div>
     <UiSchedulesDetailsTimeWrapped
diff --git a/src/components/Stop/StopSchedulesDetailsTimesNonStopPassage.vue b/src/components/Stop/StopSchedulesDetailsTimesNonStopPassage.vue
index 58d6d9d..c58d37f 100644
--- a/src/components/Stop/StopSchedulesDetailsTimesNonStopPassage.vue
+++ b/src/components/Stop/StopSchedulesDetailsTimesNonStopPassage.vue
@@ -6,11 +6,13 @@
         label="Passage sans arrêt"
         :time="toTime(visit.departureTime)"
         :sublabel="visit.departureStatus !== 'onTime' ? visit.departureStatus : null"
-        isTimeTextGray
+        is-time-text-gray
       />
     </div>
     <div>
-      <div v-if="visit.platform">Voie</div>
+      <div v-if="visit.platform">
+        Voie
+      </div>
       <div>{{ visit.platform }}</div>
     </div>
   </div>
diff --git a/src/components/Stop/StopSchedulesVisits.vue b/src/components/Stop/StopSchedulesVisits.vue
index 77c705d..6e20f18 100644
--- a/src/components/Stop/StopSchedulesVisits.vue
+++ b/src/components/Stop/StopSchedulesVisits.vue
@@ -1,22 +1,32 @@
 <template>
   <div>
-    <details v-for="visit in visits" :key="visit.id" class="row">
+    <details
+      v-for="visit in visits"
+      :key="visit.id"
+      class="row"
+    >
       <summary class="visit">
         <div class="visit-code">
           {{ visit.journeyCode }}
         </div>
-        <div v-if="visit.departureStatus === 'cancelled' || visit.arrivalStatus === 'cancelled'"
+        <div
+          v-if="visit.departureStatus === 'cancelled' || visit.arrivalStatus === 'cancelled'"
           class="visit-time visit-time-cancelled"
         >
           &times;
         </div>
-        <div v-else-if="visit.nonStopPassage || !visit.departureTime"
-          class="visit-time visit-time-shrouded"
+        <div
+          v-else-if="visit.nonStopPassage || !visit.departureTime"
           :key="`0-${updateCounter}`"
+          class="visit-time visit-time-shrouded"
         >
           {{ ((visit.arrivalTime.valueOf() - Date.now()) / 1000 / 60).toFixed(0) }}
         </div>
-        <div v-else class="visit-time" :key="`1-${updateCounter}`">
+        <div
+          v-else
+          :key="`1-${updateCounter}`"
+          class="visit-time"
+        >
           {{ ((visit.time.valueOf() - Date.now()) / 1000 / 60).toFixed(0) }}
         </div>
         <div class="visit-destination">
@@ -24,7 +34,10 @@
         </div>
       </summary>
 
-      <div v-if="visit.operator === 'SNCF' && !visit.nonStopPassage" class="visit-details">
+      <div
+        v-if="visit.operator === 'SNCF' && !visit.nonStopPassage"
+        class="visit-details"
+      >
         <StopSchedulesDetailsTimes :visit="visit" />
         <UiSchedulesDetailsRow
           v-if="visit.journeyCode"
@@ -38,7 +51,10 @@
         />
       </div>
 
-      <div v-else-if="visit.operator === 'SNCF' && visit.nonStopPassage" class="visit-details">
+      <div
+        v-else-if="visit.operator === 'SNCF' && visit.nonStopPassage"
+        class="visit-details"
+      >
         <StopSchedulesDetailsTimesNonStopPassage :visit="visit" />
         <UiSchedulesDetailsRow
           v-if="visit.journeyCode"
@@ -52,10 +68,13 @@
         />
       </div>
 
-      <div v-else class="visit-details">
+      <div
+        v-else
+        class="visit-details"
+      >
         <StopSchedulesDetailsTimes
           :visit="visit"
-          isInline
+          is-inline
         />
         <UiSchedulesDetailsRow
           v-if="visit.journeyCode"
diff --git a/src/components/ui/Schedules/UiSchedulesDetailsTimeInline.vue b/src/components/ui/Schedules/UiSchedulesDetailsTimeInline.vue
index 0612cd6..862114c 100644
--- a/src/components/ui/Schedules/UiSchedulesDetailsTimeInline.vue
+++ b/src/components/ui/Schedules/UiSchedulesDetailsTimeInline.vue
@@ -1,6 +1,8 @@
 <template>
   <div>
-    <div class="label">{{ label }}</div>
+    <div class="label">
+      {{ label }}
+    </div>
     <div class="value">
       <UiTime :time="time" />
     </div>
diff --git a/src/components/ui/Schedules/UiSchedulesDetailsTimeWrapped.vue b/src/components/ui/Schedules/UiSchedulesDetailsTimeWrapped.vue
index 52fac08..2dfb597 100644
--- a/src/components/ui/Schedules/UiSchedulesDetailsTimeWrapped.vue
+++ b/src/components/ui/Schedules/UiSchedulesDetailsTimeWrapped.vue
@@ -1,8 +1,18 @@
 <template>
   <div class="schedules-details-time-wrapped">
-    <div class="label">{{ label }}</div>
-    <UiTime :time="time" :textGray="isTimeTextGray" />
-    <div v-if="sublabel" class="sublabel">{{ sublabel }}</div>
+    <div class="label">
+      {{ label }}
+    </div>
+    <UiTime
+      :time="time"
+      :text-gray="isTimeTextGray"
+    />
+    <div
+      v-if="sublabel"
+      class="sublabel"
+    >
+      {{ sublabel }}
+    </div>
   </div>
 </template>
 
diff --git a/src/components/ui/UiIcon.vue b/src/components/ui/UiIcon.vue
index db1de65..128db23 100644
--- a/src/components/ui/UiIcon.vue
+++ b/src/components/ui/UiIcon.vue
@@ -8,7 +8,7 @@
     }"
     :src="src"
     :alt="alt"
-  />
+  >
 </template>
 
 <script lang="ts">
diff --git a/src/components/ui/UiTime.vue b/src/components/ui/UiTime.vue
index e0e58c4..1546286 100644
--- a/src/components/ui/UiTime.vue
+++ b/src/components/ui/UiTime.vue
@@ -1,13 +1,13 @@
 <template>
-    <span
-      v-if="time.hh && time.mm && time.ss"
-      class="datetime"
-    >
-      <span :class="{ 'text-gray': textGray }">{{ time.hh }}</span>
-      <span class="separator">:</span>
-      <span :class="{ 'text-gray': textGray }">{{ time.mm }}</span>
-      <span class="seconds">{{ time.ss }}</span>
-    </span>
+  <span
+    v-if="time.hh && time.mm && time.ss"
+    class="datetime"
+  >
+    <span :class="{ 'text-gray': textGray }">{{ time.hh }}</span>
+    <span class="separator">:</span>
+    <span :class="{ 'text-gray': textGray }">{{ time.mm }}</span>
+    <span class="seconds">{{ time.ss }}</span>
+  </span>
 </template>
 
 <script lang="ts">
diff --git a/src/pages/SettingsPage.vue b/src/pages/SettingsPage.vue
index 50ffeec..0b60227 100644
--- a/src/pages/SettingsPage.vue
+++ b/src/pages/SettingsPage.vue
@@ -3,7 +3,12 @@
     <h1>Paramètres</h1>
     <fieldset>
       <legend>Schéma de lignes</legend>
-      <button class="btn-synchronize" @click="synchronize">Mettre à jour</button>
+      <button
+        class="btn-synchronize"
+        @click="synchronize"
+      >
+        Mettre à jour
+      </button>
       <p>Dernière mise à jour : {{ updatedAt.toLocaleString() }}</p>
     </fieldset>
   </div>
diff --git a/src/pages/TimetablesLinePage.vue b/src/pages/TimetablesLinePage.vue
index bf865a5..95b9ae5 100644
--- a/src/pages/TimetablesLinePage.vue
+++ b/src/pages/TimetablesLinePage.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="page">
-    <LineRouteMap :line="$route.params.line"/>
+    <LineRouteMap :line="$route.params.line" />
   </div>
 </template>
 
diff --git a/src/pages/TimetablesStopPage.vue b/src/pages/TimetablesStopPage.vue
index 0cfca3a..e1cb0a1 100644
--- a/src/pages/TimetablesStopPage.vue
+++ b/src/pages/TimetablesStopPage.vue
@@ -24,6 +24,14 @@ export default Vue.extend({
   data: () => ({
     stop: {} as StopType,
   }),
+  watch: {
+    '$route.path': {
+      handler () {
+        this.update()
+      },
+      deep: true,
+    },
+  },
   created () {
     this.update()
   },
@@ -33,14 +41,6 @@ export default Vue.extend({
       this.stop = getStop(this.$route.params.line, this.$route.params.stop)
     },
   },
-  watch: {
-    '$route.path': {
-      handler () {
-        this.update()
-      },
-      deep: true,
-    },
-  },
 })
 </script>