CharacterBadges rename and Characters routing, fix Season component text fetching breaking dependent breadcrumb calculations

client/src/components/Episode.vue

@@ -8,7 +8,7 @@
             <template v-if="ready">
                 <h3 class="card-title">"{{ episode.title }}"</h3>
                 <span>{{ episode.description }}</span>
-                <CharacterList v-if="episode && episode.characters" :characters="episode.characters"></CharacterList>
+                <CharacterBadges v-if="episode && episode.characters" :characters="episode.characters"></CharacterBadges>
             </template>
             <template v-else>
                 <Skeleton style="width: 30%;"></Skeleton>
@@ -59,7 +59,7 @@
 
 <script>
 import QuoteList from "./QuoteList.vue";
-import CharacterList from "./CharacterList.vue";
+import CharacterBadges from "./CharacterBadges.vue";
 import Skeleton from './Skeleton.vue';
 import {types} from "@/mutation_types";
 
@@ -67,7 +67,7 @@ export default {
     name: "Episode",
     components: {
         QuoteList,
-        CharacterList,
+        CharacterBadges,
         Skeleton,
     },
     created() {

client/src/components/Season.vue

@@ -1,7 +1,7 @@
 <template>
     <div>
         <b-breadcrumb :items="breadcrumbs"></b-breadcrumb>
-        <b-card>
+        <b-card v-if="ready">
             <b-list-group>
                 <b-list-group-item v-for="episode in season.episodes" :key="episode.episode_id">
                     <b-row align-v="start" align-content="start">
@@ -48,6 +48,9 @@ export default {
         }
     },
     computed: {
+        ready() {
+            return this.$store.state.preloaded;
+        },
         breadcrumbs() {
             return [
                 {
@@ -61,7 +64,7 @@ export default {
             ]
         },
         season() {
-            return this.$store.state.preloaded ? this.$store.state.quoteData[this.$route.params.season - 1] : null;
+            return this.$store.state.quoteData[this.$route.params.season - 1];
         }
     }
 }

client/src/router.js

@@ -1,10 +1,11 @@
 import Vue from "vue";
 import Router from "vue-router";
-import Home from "./components/Home.vue";
-import Episode from "./components/Episode.vue";
-import SearchResults from "./components/SearchResults.vue";
-import Character from "./components/Character.vue";
-import Season from "./components/Season.vue";
+import Home from "@/components/Home.vue";
+import Episode from "@/components/Episode.vue";
+import SearchResults from "@/components/SearchResults.vue";
+import Character from "@/components/Character.vue";
+import Season from "@/components/Season.vue";
+import Characters from "@/components/Characters";
 
 Vue.use(Router);
 
@@ -16,6 +17,16 @@ export default new Router({
             name: "Home",
             component: Home,
         },
+        {
+            path: "/characters/",
+            name: "Characters",
+            component: Characters,
+        },
+        {
+            path: "/search_results",
+            name: "SearchResults",
+            component: SearchResults,
+        },
         {
             path: "/character/:character",
             name: "Character",
@@ -31,11 +42,6 @@ export default new Router({
             name: "Episode",
             component: Episode,
         },
-        {
-            path: "/search_results",
-            name: "SearchResults",
-            component: SearchResults,
-        },
         {
             path: "*",
         },