From f43a0d82892850e1acede733b2da4526b0ca5b04 Mon Sep 17 00:00:00 2001
From: Sky Chrastina <mirrorcoloured@gmail.com>
Date: Wed, 12 Oct 2022 14:44:22 -0600
Subject: [PATCH] Add checkmark to completed quests in shop (#14269)

* add 'completed' property to quest items

* show checkmark on completed quests in the shop

* add 'completed' property to quest items

* show checkmark on completed quests in the shop
---
 .../client/src/components/shops/shopItem.vue   | 18 ++++++++++++++++++
 website/common/script/libs/getItemInfo.js      |  1 +
 2 files changed, 19 insertions(+)

diff --git a/website/client/src/components/shops/shopItem.vue b/website/client/src/components/shops/shopItem.vue
index cd673cdc2c..2fdfd6cba4 100644
--- a/website/client/src/components/shops/shopItem.vue
+++ b/website/client/src/components/shops/shopItem.vue
@@ -31,6 +31,11 @@
           class="svg-icon inline lock"
           v-html="icons.lock"
         ></span>
+        <span
+          v-if="item.completed"
+          class="svg-icon inline check"
+          v-html="icons.check"
+        ></span>
         <span
           v-if="item.isSuggested"
           class="suggestedDot"
@@ -200,6 +205,16 @@
     color: $gray-200;
   }
 
+  span.svg-icon.inline.check {
+    height: 12px;
+    width: 10px;
+    position: absolute;
+    left: 8px;
+    top: 8px;
+    margin-top: 0;
+    color: $gray-200;
+  }
+
   span.badge.badge-round.badge-item.badge-clock {
     height: 24px;
     width: 24px;
@@ -246,6 +261,7 @@ import svgGem from '@/assets/svg/gem.svg';
 import svgGold from '@/assets/svg/gold.svg';
 import svgHourglasses from '@/assets/svg/hourglass.svg';
 import svgLock from '@/assets/svg/lock.svg';
+import svgCheck from '@/assets/svg/check.svg';
 import svgClock from '@/assets/svg/clock.svg';
 
 import EquipmentAttributesPopover from '@/components/inventory/equipment/attributesPopover';
@@ -297,6 +313,7 @@ export default {
         gems: svgGem,
         gold: svgGold,
         lock: svgLock,
+        check: svgCheck,
         hourglasses: svgHourglasses,
         clock: svgClock,
       }),
@@ -350,6 +367,7 @@ export default {
         'highlight-border': this.highlightBorder,
         suggested: this.item.isSuggested,
         locked: this.item.locked,
+        completed: this.item.completed,
       };
     },
     countdownString () {
diff --git a/website/common/script/libs/getItemInfo.js b/website/common/script/libs/getItemInfo.js
index 1d63c53ce1..39ad956163 100644
--- a/website/common/script/libs/getItemInfo.js
+++ b/website/common/script/libs/getItemInfo.js
@@ -152,6 +152,7 @@ export default function getItemInfo (user, type, item, officialPinnedItems, lang
           ? content.quests[item.previous].text(language)
           : null,
         unlockCondition: item.unlockCondition,
+        completed: user.achievements.quests[item.key] !== undefined,
         drop: item.drop,
         boss: item.boss,
         collect: item.collect ? _mapValues(item.collect, o => ({