From 1351e8b54c5f3d47f02e96fb08de7e41300f3d10 Mon Sep 17 00:00:00 2001
From: "magiodev.eth" <31893902+magiodev@users.noreply.github.com>
Date: Wed, 22 May 2024 15:13:15 +0200
Subject: [PATCH] fe minor changes (#19)

* raffle minor changes

* try catch around suggestChain

* env
---
 frontend-common/mixin/chain.js                       |  2 +-
 frontend-ms/.env.example                             |  2 +-
 frontend-ms/src/App.vue                              |  6 +++++-
 .../src/components/Common/RaffleComponent.vue        | 12 +++++-------
 .../src/components/Game/PlayersAllocations.vue       |  2 +-
 frontend/src/App.vue                                 |  6 +++++-
 frontend/src/components/Common/RaffleComponent.vue   |  6 +++---
 7 files changed, 21 insertions(+), 15 deletions(-)

diff --git a/frontend-common/mixin/chain.js b/frontend-common/mixin/chain.js
index 4b5e65d..6602ec9 100755
--- a/frontend-common/mixin/chain.js
+++ b/frontend-common/mixin/chain.js
@@ -11,7 +11,7 @@ const mxChain = {
 
   methods: {
     async suggestChain() {
-      await window.keplr.experimentalSuggestChain(JSON.parse(process.env.VUE_APP_CHAIN_INFO));
+      await window.keplr?.experimentalSuggestChain(JSON.parse(process.env.VUE_APP_CHAIN_INFO));
     },
 
     async allocateTokens(potId, amount) {
diff --git a/frontend-ms/.env.example b/frontend-ms/.env.example
index 06676ab..8f2fe17 100644
--- a/frontend-ms/.env.example
+++ b/frontend-ms/.env.example
@@ -11,7 +11,7 @@ VUE_APP_CHAIN_ID=osmo-test-5
 VUE_APP_BASE_FEE=0.0025
 VUE_APP_EXPLORER_BASE_URL=https://celatone.osmosis.zone
 
-VUE_APP_CONTRACT=osmo1t33we3pcqf9u3jn665r9nf0nl3yqav2dg33njdcfm8thl7hvv9ts53gfay
+VUE_APP_CONTRACT=osmo1zs6565tanh04s4nfd4vmftkc7mkq8sxgxsmtnczfe76ym9f0f49sdda7rp
 VUE_APP_CONTRACT_CW721=osmo1
 
 VUE_APP_INTERVAL_TIMEOUT=10000
diff --git a/frontend-ms/src/App.vue b/frontend-ms/src/App.vue
index 659d16d..f74aa29 100644
--- a/frontend-ms/src/App.vue
+++ b/frontend-ms/src/App.vue
@@ -40,7 +40,11 @@ export default {
   },
 
   async created() {
-    await this.suggestChain()
+    try {
+      await this.suggestChain()
+    } catch (e) {
+      //console.error(e)
+    }
     await this.fetchOnce();
     await this.fetchInterval()
     // we ensure that till this moment rest of UI is kept idle
diff --git a/frontend-ms/src/components/Common/RaffleComponent.vue b/frontend-ms/src/components/Common/RaffleComponent.vue
index 349f622..3345fb1 100755
--- a/frontend-ms/src/components/Common/RaffleComponent.vue
+++ b/frontend-ms/src/components/Common/RaffleComponent.vue
@@ -1,19 +1,19 @@
 <template>
   <div class="raffle-component row text-center" v-if="raffle?.nft?.id || Number(raffle.denom_amount)">
-    <div class="title col-12 py-2">
+    <div class="title col-12 pt-3">
       <h3 class="mb-0">Raffle Prizes!</h3>
     </div>
 
     <div class="col-4 offset-2 col-md-3 offset-md-3 raffle-item py-2">
-      <div class="pp-card p-2">
+      <div class="pp-card p-2 h-100">
         <h5 v-if="raffle?.nft?.id" class="text-pp-color-4">MS #{{ raffle.nft.id }}</h5>
         <img v-if="raffle?.nft?.imageUrl" class="nft-image mb-0" :src="raffle.nft.imageUrl" alt="MS"/>
       </div>
     </div>
 
     <div class="col-4 col-md-3 raffle-item py-2">
-      <div class="pp-card p-2">
-        <h5 v-if="raffle.denom_amount" class="text-pp-color-4">$</h5>
+      <div class="pp-card p-2 h-100">
+        <h5 v-if="raffle.denom_amount" class="text-pp-color-4">$OSMO</h5>
         <span class="text-pp-color-4">{{ displayAmount(raffle.denom_amount, 2) }}</span> <CoinComponent/>
       </div>
     </div>
@@ -40,9 +40,7 @@ export default {
 <style lang="scss" scoped>
 @import "@/assets/style";
 .raffle-component {
-  .title {
-    border-bottom: 1px solid $pp-color-4;
-  }
+
   .raffle-item {
     .nft-image {
       border-radius: 1em;
diff --git a/frontend-ms/src/components/Game/PlayersAllocations.vue b/frontend-ms/src/components/Game/PlayersAllocations.vue
index 34ef4c2..b0f6691 100644
--- a/frontend-ms/src/components/Game/PlayersAllocations.vue
+++ b/frontend-ms/src/components/Game/PlayersAllocations.vue
@@ -56,7 +56,7 @@
           </td>
         </tr>
         <tr>
-          <td>Denom Prize</td>
+          <td>$OSMO Prize</td>
           <td>
             {{ displayAmount(raffle.denom_amount, 2) }}
             <CoinComponent/>
diff --git a/frontend/src/App.vue b/frontend/src/App.vue
index 659d16d..f74aa29 100644
--- a/frontend/src/App.vue
+++ b/frontend/src/App.vue
@@ -40,7 +40,11 @@ export default {
   },
 
   async created() {
-    await this.suggestChain()
+    try {
+      await this.suggestChain()
+    } catch (e) {
+      //console.error(e)
+    }
     await this.fetchOnce();
     await this.fetchInterval()
     // we ensure that till this moment rest of UI is kept idle
diff --git a/frontend/src/components/Common/RaffleComponent.vue b/frontend/src/components/Common/RaffleComponent.vue
index cbd9b53..4daa9da 100755
--- a/frontend/src/components/Common/RaffleComponent.vue
+++ b/frontend/src/components/Common/RaffleComponent.vue
@@ -1,18 +1,18 @@
 <template>
   <div class="raffle-component row text-center" v-if="raffle?.nft?.id || Number(raffle.denom_amount)">
-    <div class="title col-12 py-2">
+    <div class="title col-12 pt-3">
       <h3 class="mb-0">Raffle Prizes!</h3>
     </div>
 
     <div class="col-4 offset-2 col-md-3 offset-md-3 raffle-item py-2">
-      <div class="pp-card p-2">
+      <div class="pp-card p-2 h-100">
         <h5 v-if="raffle?.nft?.id" class="text-pp-color-4">{NFT_NAME} #{{ raffle.nft.id }}</h5>
         <img v-if="raffle?.nft?.imageUrl" class="nft-image mb-0" :src="raffle.nft.imageUrl" alt="{NFT_NAME}"/>
       </div>
     </div>
 
     <div class="col-4 col-md-3 raffle-item py-2">
-      <div class="pp-card p-2">
+      <div class="pp-card p-2 h-100">
         <h5 v-if="raffle.denom_amount" class="text-pp-color-4">$DENOM</h5>
         <span class="text-pp-color-4">{{ displayAmount(raffle.denom_amount, 2) }}</span> <CoinComponent/>
       </div>