Purchase Card: fixes (#9803)

* prevent re-showing buy-modal after buying a card / fix class-badge in member-selection

* show notifications on card purchase

* move string to generic.json

* translation param "profileName"

website/client/app.vue

@@ -400,7 +400,16 @@ export default {
       if (item.purchaseType === 'card') {
         this.selectedSpellToBuy = item;
 
+        // hide the dialog
         this.$root.$emit('bv::hide::modal', 'buy-modal');
+        // remove the dialog from our modal-stack,
+        // the default hidden event is delayed
+        this.$root.$emit('bv::modal::hidden', {
+          target: {
+            id: 'buy-modal',
+          },
+        });
+
         this.$root.$emit('bv::show::modal', 'select-member-modal');
       }
     },
@@ -411,6 +420,7 @@ export default {
       if (this.selectedSpellToBuy.pinType === 'card') {
         const newUserGp = castResult.data.data.user.stats.gp;
         this.$store.state.user.data.stats.gp = newUserGp;
+        this.text(this.$t('sentCardToUser', { profileName: member.profile.name }));
       }
 
       this.selectedSpellToBuy = null;

website/client/components/members/classBadge.vue

@@ -19,6 +19,7 @@
     position: absolute;
     left: calc(50% - (16px));
     bottom: -($badge-size / 2);
+    z-index: 1;
   }
 
   .svg-icon {
@@ -52,4 +53,4 @@ export default {
     };
   },
 };
-</script>
+</script>

website/common/locales/en/generic.json

@@ -173,6 +173,8 @@
   "achievementBewilderText": "Helped defeat the Be-Wilder during the 2016 Spring Fling Event!",
   "checkOutProgress": "Check out my progress in Habitica!",
   "cards": "Cards",
+  "sentCardToUser": "You sent a card to <%= profileName %>",
+  "cardReceivedFrom": "<%= cardType %> from <%= userName %>",
   "cardReceived": "You received a <span class=\"notification-bold-blue\"><%= card %></span>",
   "greetingCard": "Greeting Card",
   "greetingCardExplanation": "You both receive the Cheery Chum achievement!",