diff --git a/website/client/components/inventory/items/index.vue b/website/client/components/inventory/items/index.vue
index 73354f32ef..6ffae15b42 100644
--- a/website/client/components/inventory/items/index.vue
+++ b/website/client/components/inventory/items/index.vue
@@ -469,8 +469,6 @@ export default {
           let openedItem = result.data.data;
           let text = this.content.gear.flat[openedItem.key].text();
           this.drop(this.$t('messageDropMysteryItem', {dropText: text}), openedItem);
-          item.quantity--;
-          this.$forceUpdate();
         } else {
           this.$root.$emit('selectMembersModal::showItem', item);
         }
diff --git a/website/client/store/actions/user.js b/website/client/store/actions/user.js
index d15bd3e805..fe6094fcc9 100644
--- a/website/client/store/actions/user.js
+++ b/website/client/store/actions/user.js
@@ -5,6 +5,7 @@ import axios from 'axios';
 import { togglePinnedItem as togglePinnedItemOp } from 'common/script/ops/pinnedGearUtils';
 import changeClassOp from 'common/script/ops/changeClass';
 import disableClassesOp from 'common/script/ops/disableClasses';
+import openMysteryItemOp from 'common/script/ops/openMysteryItem';
 
 export function fetch (store, options = {}) { // eslint-disable-line no-shadow
   return loadAsyncResource({
@@ -127,7 +128,9 @@ export function castSpell (store, params) {
   return axios.post(spellUrl, data);
 }
 
-export function openMysteryItem () {
+export async function openMysteryItem (store) {
+  let user = store.state.user.data;
+  openMysteryItemOp(user);
   return axios.post('/api/v4/user/open-mystery-item');
 }