Merge pull request #11637 from Xaz16/trigger-vue-reactivity-for-user

Trigger vue reactivity for user

website/client/src/store/actions/shops.js

@@ -60,7 +60,10 @@ async function buyArmoire (store, params) {
 
     const isExperience = item.type === 'experience';
     if (item.type === 'gear') {
-      store.state.user.data.items.gear.owned[item.dropKey] = true;
+      store.state.user.data.items.gear.owned = {
+        ...store.state.user.data.items.gear.owned,
+        [item.dropKey]: true,
+      };
     }
 
     if (item.type === 'food') {

website/common/script/fns/randomDrop.js

@@ -79,7 +79,10 @@ export default function randomDrop (user, options, req = {}, analytics) {
         canDrop: true,
       })));
 
-      user.items.food[drop.key] = user.items.food[drop.key] || 0;
+      user.items.food = {
+        ...user.items.food,
+        [drop.key]: user.items.food[drop.key] || 0,
+      };
       user.items.food[drop.key] += 1;
       if (user.markModified) user.markModified('items.food');
 
@@ -91,7 +94,10 @@ export default function randomDrop (user, options, req = {}, analytics) {
     } else if (rarity > 0.3) { // eggs 30% chance
       drop = cloneDropItem(randomVal(content.dropEggs));
 
-      user.items.eggs[drop.key] = user.items.eggs[drop.key] || 0;
+      user.items.eggs = {
+        ...user.items.eggs,
+        [drop.key]: user.items.eggs[drop.key] || 0,
+      };
       user.items.eggs[drop.key] += 1;
       if (user.markModified) user.markModified('items.eggs');
 
@@ -114,8 +120,12 @@ export default function randomDrop (user, options, req = {}, analytics) {
         randomVal(pickBy(content.hatchingPotions, (v, k) => acceptableDrops.indexOf(k) >= 0)),
       );
 
-      user.items.hatchingPotions[drop.key] = user.items.hatchingPotions[drop.key] || 0;
+      user.items.hatchingPotions = {
+        ...user.items.hatchingPotions,
+        [drop.key]: user.items.hatchingPotions[drop.key] || 0,
+      };
       user.items.hatchingPotions[drop.key] += 1;
+
       if (user.markModified) user.markModified('items.hatchingPotions');
 
       drop.type = 'HatchingPotion';

website/common/script/fns/updateStats.js

@@ -71,9 +71,15 @@ export default function updateStats (user, stats, req = {}, analytics) {
     if (user.addNotification) user.addNotification('DROPS_ENABLED');
 
     if (user.items.eggs.Wolf > 0) {
-      user.items.eggs.Wolf += 1;
+      user.items.eggs = {
+        ...user.items.eggs,
+        Wolf: user.items.eggs.Wolf + 1,
+      };
     } else {
-      user.items.eggs.Wolf = 1;
+      user.items.eggs = {
+        ...user.items.eggs,
+        Wolf: 1,
+      };
     }
 
     if (user.markModified) user.markModified('items.eggs');
@@ -89,7 +95,10 @@ export default function updateStats (user, stats, req = {}, analytics) {
       if (user.markModified) user.markModified('flags.levelDrops');
 
       if (!user.items.quests[k]) user.items.quests[k] = 0;
-      user.items.quests[k] += 1;
+      user.items.quests = {
+        ...user.items.quests,
+        [k]: user.items.quests[k] + 1,
+      };
       if (user.markModified) user.markModified('items.quests');
 
       if (analytics) {

website/common/script/ops/buy/buyArmoire.js

@@ -90,7 +90,10 @@ export class BuyArmoireOperation extends AbstractGoldItemOperation { // eslint-d
       throw new NotAuthorized(this.i18n('equipmentAlreadyOwned'));
     }
 
-    user.items.gear.owned[drop.key] = true;
+    user.items.gear.owned = {
+      ...user.items.gear.owned,
+      [drop.key]: true,
+    };
     if (user.markModified) user.markModified('items.gear.owned');
 
     user.flags.armoireOpened = true;
@@ -126,7 +129,10 @@ export class BuyArmoireOperation extends AbstractGoldItemOperation { // eslint-d
       canDrop: true,
     }));
 
-    user.items.food[drop.key] = user.items.food[drop.key] || 0;
+    user.items.food = {
+      ...user.items.food,
+      [drop.key]: user.items.food[drop.key] || 0,
+    };
     user.items.food[drop.key] += 1;
     if (user.markModified) user.markModified('items.food');
 

website/common/script/ops/buy/buyMount.js

@@ -34,7 +34,10 @@ export class BuyHourglassMountOperation extends AbstractHourglassItemOperation {
   }
 
   executeChanges (user) {
-    user.items.mounts[this.key] = true;
+    user.items.mounts = {
+      ...user.items.mounts,
+      [this.key]: true,
+    };
 
     if (user.markModified) user.markModified('items.mounts');
 

website/common/script/ops/buy/buyMysterySet.js

@@ -38,6 +38,11 @@ export default function buyMysterySet (user, req = {}, analytics) {
     }
   });
 
+  // Here we need to trigger vue reactivity through reassign object
+  user.items.gear.owned = {
+    ...user.items.gear.owned,
+  };
+
   if (user.markModified) user.markModified('items.gear.owned');
 
   user.purchased.plan.consecutive.trinkets -= 1;

website/common/script/ops/buy/buyQuestGem.js

@@ -47,7 +47,10 @@ export class BuyQuestWithGemOperation extends AbstractGemItemOperation { // esli
       !user.items.quests[item.key]
       || user.items.quests[item.key] < 0
     ) user.items.quests[item.key] = 0;
-    user.items.quests[item.key] += this.quantity;
+    user.items.quests = {
+      ...user.items.quests,
+      [item.key]: user.items.quests[item.key] + this.quantity,
+    };
     if (user.markModified) user.markModified('items.quests');
 
     this.subtractCurrency(user, item, this.quantity);

website/common/script/ops/buy/buyQuestGold.js

@@ -67,7 +67,10 @@ export class BuyQuestWithGoldOperation extends AbstractGoldItemOperation { // es
       !user.items.quests[item.key]
       || user.items.quests[item.key] < 0
     ) user.items.quests[item.key] = 0;
-    user.items.quests[item.key] += this.quantity;
+    user.items.quests = {
+      ...user.items.quests,
+      [item.key]: user.items.quests[item.key] + this.quantity,
+    };
     if (user.markModified) user.markModified('items.quests');
 
     this.subtractCurrency(user, item, this.quantity);

website/common/script/ops/buy/hourglassPurchase.js

@@ -47,12 +47,18 @@ export default function purchaseHourglass (user, req = {}, analytics, quantity =
     user.purchased.plan.consecutive.trinkets -= 1;
 
     if (type === 'pets') {
-      user.items.pets[key] = 5;
+      user.items.pets = {
+        ...user.items.pets,
+        [key]: 5,
+      };
       if (user.markModified) user.markModified('items.pets');
     }
 
     if (type === 'mounts') {
-      user.items.mounts[key] = true;
+      user.items.mounts = {
+        ...user.items.mounts,
+        [key]: true,
+      };
       if (user.markModified) user.markModified('items.mounts');
     }
   }

website/common/script/ops/buy/purchase.js

@@ -46,7 +46,10 @@ function purchaseItem (user, item, price, type, key) {
   user.balance -= price;
 
   if (type === 'gear') {
-    user.items.gear.owned[key] = true;
+    user.items.gear.owned = {
+      ...user.items.gear.owned,
+      [key]: true,
+    };
     if (user.markModified) user.markModified('items.gear.owned');
   } else if (type === 'bundles') {
     const subType = item.type;

website/common/script/ops/changeClass.js

@@ -53,8 +53,16 @@ export default function changeClass (user, req = {}, analytics) {
 
     addPinnedGearByClass(user);
 
-    user.items.gear.owned[`weapon_${klass}_0`] = true;
-    if (klass === 'rogue') user.items.gear.owned[`shield_${klass}_0`] = true;
+    user.items.gear.owned = {
+      ...user.items.gear.owned,
+      [`weapon_${klass}_0`]: true,
+    };
+    if (klass === 'rogue') {
+      user.items.gear.owned = {
+        ...user.items.gear.owned,
+        [`shield_${klass}_0`]: true,
+      };
+    }
     if (user.markModified) user.markModified('items.gear.owned');
 
     removePinnedItemsByOwnedGear(user);

website/common/script/ops/feed.js

@@ -15,8 +15,11 @@ import { checkOnboardingStatus } from '../libs/onboarding';
 
 function evolve (user, pet, req) {
   user.items.pets[pet.key] = -1;
-  user.items.mounts[pet.key] = true;
 
+  user.items.mounts = {
+    ...user.items.mounts,
+    [pet.key]: true,
+  };
   if (user.markModified) {
     user.markModified('items.pets');
     user.markModified('items.mounts');
@@ -48,9 +51,8 @@ export default function feed (user, req = {}) {
     throw new NotFound(errorMessage('invalidFoodName', req.language));
   }
 
-  const userPets = user.items.pets;
 
-  if (!userPets[pet.key]) {
+  if (!user.items.pets[pet.key]) {
     throw new NotFound(i18n.t('messagePetNotFound', req.language));
   }
 
@@ -77,16 +79,16 @@ export default function feed (user, req = {}) {
     };
 
     if (food.target === pet.potion || pet.type === 'premium') {
-      userPets[pet.key] += 5;
+      user.items.pets[pet.key] += 5;
       message = i18n.t('messageLikesFood', messageParams, req.language);
     } else {
-      userPets[pet.key] += 2;
+      user.items.pets[pet.key] += 2;
       message = i18n.t('messageDontEnjoyFood', messageParams, req.language);
     }
 
     if (user.markModified) user.markModified('items.pets');
 
-    if (userPets[pet.key] >= 50 && !user.items.mounts[pet.key]) {
+    if (user.items.pets[pet.key] >= 50 && !user.items.mounts[pet.key]) {
       message = evolve(user, pet, req);
     }
 
@@ -117,7 +119,7 @@ export default function feed (user, req = {}) {
   });
 
   return [
-    userPets[pet.key],
+    user.items.pets[pet.key],
     message,
   ];
 }

website/common/script/ops/hatch.js

@@ -41,7 +41,10 @@ export default function hatch (user, req = {}) {
     throw new NotAuthorized(i18n.t('messageAlreadyPet', req.language));
   }
 
-  user.items.pets[pet] = 5;
+  user.items.pets = {
+    ...user.items.pets,
+    [pet]: 5,
+  };
   user.items.eggs[egg] -= 1;
   user.items.hatchingPotions[hatchingPotion] -= 1;
   if (user.markModified) {

website/common/script/ops/openMysteryItem.js

@@ -23,7 +23,10 @@ export default function openMysteryItem (user, req = {}, analytics) {
 
   item = cloneDeep(content.gear.flat[item]);
   item.text = content.gear.flat[item.key].text(user.preferences.language);
-  user.items.gear.owned[item.key] = true;
+  user.items.gear.owned = {
+    ...user.items.gear.owned,
+    [item.key]: true,
+  };
 
   if (user.markModified) {
     user.markModified('purchased.plan.mysteryItems');

website/common/script/ops/pinnedGearUtils.js

@@ -95,7 +95,10 @@ export function removePinnedGearAddPossibleNewOnes (user, itemPath, newItemKey)
   // remove the old pinned gear items and add the new gear back
   removePinnedGearByClass(user);
 
-  user.items.gear.owned[newItemKey] = true;
+  user.items.gear.owned = {
+    ...user.items.gear.owned,
+    [newItemKey]: true,
+  };
   if (user.markModified) user.markModified('items.gear.owned');
 
   addPinnedGearByClass(user);

website/common/script/ops/revive.js

@@ -90,6 +90,7 @@ export default function revive (user, req = {}, analytics) {
     removePinnedGearByClass(user);
 
     user.items.gear.owned[lostItem] = false;
+
     if (user.markModified) user.markModified('items.gear.owned');
 
     addPinnedGearByClass(user);