housekeeping

src/components/Game.vue

@@ -46,7 +46,35 @@
         <!-- <pre class="text-dark small">{{ game.gog.price }}</pre> -->
         <h3 class="mb-2">
           {{ game.name }}
+          <b-button v-b-toggle.my-collapse>Toggle Collapse</b-button>
+
+          <b-collapse id="my-collapse">
+            <b-card title="Collapsible card">
+              <pre>{{ game }}</pre>
+              <!-- <div
+                class="mb-1"
+                rounded
+                v-for="alternativeName in game.alternative_names"
+                :key="alternativeName.id"
+              >
+                <b-avatar
+                  v-b-tooltip.hover
+                  :title="alternativeName.comment || null"
+                  size="sm"
+                  :src="`/static/img/country-flags/${getCountryCode(alternativeName.comment)}.svg`"
+                />
+
+                {{ alternativeName.name }}
+              </div> -->
+            </b-card>
+          </b-collapse>
+          <b-badge variant="success" v-if="game && game.steam && game.steam.metacritic">{{ game.steam.metacritic.score }}</b-badge>
+          <br />
           <!-- <b-badge variant="success" v-if="steamGame && steamGame.metacritic">{{ steamGame.metacritic.score }}</b-badge> -->
+
+          <b-badge v-b-modal.altNames>
+            <strong>Also known as:</strong>
+          </b-badge>
         </h3>
         <!-- <small>
           <pre class="text-dark">{{ steamGame }}</pre>

src/components/Game/SimilarGames.vue

@@ -45,7 +45,7 @@ export default {
   },
 
   computed: {
-    ...mapState(['game', 'games', 'activeGame']),
+    ...mapState(['game', 'games']),
 
     similarGameIds() {
       return this.game && this.game.similar_games;
@@ -68,12 +68,6 @@ export default {
         : '/static/no-image.jpg';
     },
 
-    loadGame(gameId) {
-      const { list } = this.activeGame;
-
-      this.$store.commit('SET_GAME_MODAL_DATA', { gameId, list });
-    },
-
     async loadGames() {
       this.similarGames = [];
 

src/components/GlobalSearch.vue

@@ -69,11 +69,6 @@ export default {
 
   methods: {
     openGame(gameId) {
-      // TODO: handle game detail view setting
-      // this.$store.commit('SET_GAME_MODAL_DATA', { gameId });
-      // this.$bvModal.show('game-modal');
-      this.$store.commit('SET_GAME_MODAL_DATA', { gameId });
-
       this.$router.push({
         name: 'game',
         params: {

src/components/ModalHeader.vue

@@ -12,7 +12,7 @@
 
     <b-button
       class="align-self-baseline"
-      variant="light"
+      variant="transparent"
       @click="$emit('close')"
     >
       <i class="fas fa-times fa-fw" aria-hidden />

src/components/Settings/GameDetailSettings.vue

@@ -2,11 +2,11 @@
   <div>
     <!-- TODO: use PEGI/ESRB logos -->
     <!-- <pre>{{ AGE_RATING_SYSTEMS }}</pre> -->
-    <!-- <div>
+    <div>
       <b-card v-for="rating in AGE_RATING_SYSTEMS" :key="rating.name">
         <pre class="text-dark">{{ rating }}</pre>
       </b-card>
-    </div> -->
+    </div>
 
     <b-form-group label="Game rating system:">
       <b-form-select