Add favorite trophy

ajuvonen · Dec 13, 2024 · 6f37775 · 6f37775
1 parent 2249886
commit 6f37775
Show file tree

Hide file tree

Showing 12 changed files with 333 additions and 120 deletions.
diff --git a/src/components/AchievementBadge.vue b/src/components/AchievementBadge.vue
@@ -64,20 +64,6 @@ const achievementProps: AchievementProps = {
       emoji: '🦅',
     },
   },
-  hotStreak: {
-    [AchievementLevel.Bronze]: {
-      textProps: [5],
-      emoji: '🌶️',
-    },
-    [AchievementLevel.Silver]: {
-      textProps: [10],
-      emoji: '🔥',
-    },
-    [AchievementLevel.Gold]: {
-      textProps: [20],
-      emoji: '🌋',
-    },
-  },
   experimenterBean: {
     [AchievementLevel.Gold]: {
       textProps: [15],
@@ -114,6 +100,34 @@ const achievementProps: AchievementProps = {
       emoji: CATEGORY_EMOJI.Vegetable,
     },
   },
+  favorite: {
+    [AchievementLevel.Bronze]: {
+      textProps: [20],
+      emoji: '😺',
+    },
+    [AchievementLevel.Silver]: {
+      textProps: [50],
+      emoji: '😽',
+    },
+    [AchievementLevel.Gold]: {
+      textProps: [100],
+      emoji: '😻',
+    },
+  },
+  hotStreak: {
+    [AchievementLevel.Bronze]: {
+      textProps: [5],
+      emoji: '🌶️',
+    },
+    [AchievementLevel.Silver]: {
+      textProps: [10],
+      emoji: '🔥',
+    },
+    [AchievementLevel.Gold]: {
+      textProps: [20],
+      emoji: '🌋',
+    },
+  },
   thirtyVeggies: {
     [AchievementLevel.Gold]: {
       textProps: [30],

diff --git a/src/components/AchievementList.vue b/src/components/AchievementList.vue
@@ -99,6 +99,25 @@ const {achievements} = storeToRefs(useAppStateStore());
         />
       </div>
     </ContentElement>
+    <ContentElement :title="$t('achievements.favorite.title')">
+      <div class="achievement-list__badge-container">
+        <AchievementBadge
+          :active="achievements.favorite >= AchievementLevel.Bronze"
+          :level="AchievementLevel.Bronze"
+          achievement="favorite"
+        />
+        <AchievementBadge
+          :active="achievements.favorite >= AchievementLevel.Silver"
+          :level="AchievementLevel.Silver"
+          achievement="favorite"
+        />
+        <AchievementBadge
+          :active="achievements.favorite >= AchievementLevel.Gold"
+          :level="AchievementLevel.Gold"
+          achievement="favorite"
+        />
+      </div>
+    </ContentElement>
     <ContentElement :title="$t('achievements.experimenterFruit.title')">
       <div class="achievement-list__badge-container">
         <AchievementBadge

diff --git a/src/components/__tests__/AchievementList.spec.ts b/src/components/__tests__/AchievementList.spec.ts
@@ -16,7 +16,7 @@ describe('AchievementList', () => {
   it('renders', () => {
     const wrapper = mount(AchievementList);
     expect(wrapper.html()).toMatchSnapshot();
-    expect(wrapper.findAll('.badge[aria-disabled="true"]').length).toBe(19);
+    expect(wrapper.findAll('.badge[aria-disabled="true"]').length).toBe(22);
   });
 
   it('renders with badges enabled', () => {
@@ -36,6 +36,6 @@ describe('AchievementList', () => {
 
     const wrapper = mount(AchievementList);
     expect(wrapper.html()).toMatchSnapshot();
-    expect(wrapper.findAll('.badge[aria-disabled="true"]').length).toBe(10);
+    expect(wrapper.findAll('.badge[aria-disabled="true"]').length).toBe(13);
   });
 });
diff --git a/src/components/__tests__/__snapshots__/AchievementList.spec.ts.snap b/src/components/__tests__/__snapshots__/AchievementList.spec.ts.snap
@@ -106,6 +106,29 @@ exports[`AchievementList > renders 1`] = `
       </div>
     </div>
   </div>
+  <div data-v-1c120264="" class="flex-container flex-col">
+    <h2 class="label-like">Playing Favorites</h2>
+    <div data-v-1c120264="" class="achievement-list__badge-container">
+      <div data-v-06381b3c="" data-v-1c120264="" aria-disabled="true" title="20 repeat uses of same veggie" aria-label="20 repeat uses of same veggie" data-test-id="badge-favorite-1" class="badge" role="img">
+        <div data-v-06381b3c="" class="badge__background badge__background--Bronze" aria-hidden="true">
+          <div data-v-06381b3c="" class="badge__emoji">😺</div>
+        </div>
+        <div data-v-06381b3c="" aria-hidden="true" class="badge__text">20 times</div>
+      </div>
+      <div data-v-06381b3c="" data-v-1c120264="" aria-disabled="true" title="50 repeat uses of same veggie" aria-label="50 repeat uses of same veggie" data-test-id="badge-favorite-2" class="badge" role="img">
+        <div data-v-06381b3c="" class="badge__background badge__background--Silver" aria-hidden="true">
+          <div data-v-06381b3c="" class="badge__emoji">😽</div>
+        </div>
+        <div data-v-06381b3c="" aria-hidden="true" class="badge__text">50 times</div>
+      </div>
+      <div data-v-06381b3c="" data-v-1c120264="" aria-disabled="true" title="100 repeat uses of same veggie" aria-label="100 repeat uses of same veggie" data-test-id="badge-favorite-3" class="badge" role="img">
+        <div data-v-06381b3c="" class="badge__background badge__background--Gold" aria-hidden="true">
+          <div data-v-06381b3c="" class="badge__emoji">😻</div>
+        </div>
+        <div data-v-06381b3c="" aria-hidden="true" class="badge__text">100 times</div>
+      </div>
+    </div>
+  </div>
   <div data-v-1c120264="" class="flex-container flex-col">
     <h2 class="label-like">The Experimenter</h2>
     <div data-v-1c120264="" class="achievement-list__badge-container">
@@ -261,6 +284,29 @@ exports[`AchievementList > renders with badges enabled 1`] = `
       </div>
     </div>
   </div>
+  <div data-v-1c120264="" class="flex-container flex-col">
+    <h2 class="label-like">Playing Favorites</h2>
+    <div data-v-1c120264="" class="achievement-list__badge-container">
+      <div data-v-06381b3c="" data-v-1c120264="" aria-disabled="true" title="20 repeat uses of same veggie" aria-label="20 repeat uses of same veggie" data-test-id="badge-favorite-1" class="badge" role="img">
+        <div data-v-06381b3c="" class="badge__background badge__background--Bronze" aria-hidden="true">
+          <div data-v-06381b3c="" class="badge__emoji">😺</div>
+        </div>
+        <div data-v-06381b3c="" aria-hidden="true" class="badge__text">20 times</div>
+      </div>
+      <div data-v-06381b3c="" data-v-1c120264="" aria-disabled="true" title="50 repeat uses of same veggie" aria-label="50 repeat uses of same veggie" data-test-id="badge-favorite-2" class="badge" role="img">
+        <div data-v-06381b3c="" class="badge__background badge__background--Silver" aria-hidden="true">
+          <div data-v-06381b3c="" class="badge__emoji">😽</div>
+        </div>
+        <div data-v-06381b3c="" aria-hidden="true" class="badge__text">50 times</div>
+      </div>
+      <div data-v-06381b3c="" data-v-1c120264="" aria-disabled="true" title="100 repeat uses of same veggie" aria-label="100 repeat uses of same veggie" data-test-id="badge-favorite-3" class="badge" role="img">
+        <div data-v-06381b3c="" class="badge__background badge__background--Gold" aria-hidden="true">
+          <div data-v-06381b3c="" class="badge__emoji">😻</div>
+        </div>
+        <div data-v-06381b3c="" aria-hidden="true" class="badge__text">100 times</div>
+      </div>
+    </div>
+  </div>
   <div data-v-1c120264="" class="flex-container flex-col">
     <h2 class="label-like">The Experimenter</h2>
     <div data-v-1c120264="" class="achievement-list__badge-container">

diff --git a/src/components/__tests__/achievements.spec.ts b/src/components/__tests__/achievements.spec.ts
@@ -20,13 +20,14 @@ const defaultAchievements: Achievements = {
   challengeAccepted: AchievementLevel.NoAchievement,
   committed: AchievementLevel.NoAchievement,
   completionist: AchievementLevel.NoAchievement,
-  hotStreak: AchievementLevel.NoAchievement,
   experimenterBean: AchievementLevel.NoAchievement,
   experimenterFruit: AchievementLevel.NoAchievement,
   experimenterGrain: AchievementLevel.NoAchievement,
   experimenterLeafy: AchievementLevel.NoAchievement,
   experimenterRoot: AchievementLevel.NoAchievement,
   experimenterVegetable: AchievementLevel.NoAchievement,
+  favorite: AchievementLevel.NoAchievement,
+  hotStreak: AchievementLevel.NoAchievement,
   thirtyVeggies: AchievementLevel.NoAchievement,
 };
 
@@ -38,144 +39,156 @@ describe('achievements', () => {
 
   it('advances completionist', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, [...Array(39)], 0, 0, 0);
+    advanceAchievements(0, [...Array(39)], 0, 0, 0, 0);
     expect(achievements.value.completionist).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, [...Array(40)], 0, 0, 0);
+    advanceAchievements(0, [...Array(40)], 0, 0, 0, 0);
     expect(achievements.value.completionist).toBe(AchievementLevel.Bronze);
-    advanceAchievements(0, [...Array(80)], 0, 0, 0);
+    advanceAchievements(0, [...Array(80)], 0, 0, 0, 0);
     expect(achievements.value.completionist).toBe(AchievementLevel.Silver);
-    advanceAchievements(0, [...Array(150)], 0, 0, 0);
+    advanceAchievements(0, [...Array(150)], 0, 0, 0, 0);
     expect(achievements.value.completionist).toBe(AchievementLevel.Gold);
   });
 
   it('goes straight to silver', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, [...Array(80)], 0, 0, 0);
+    advanceAchievements(0, [...Array(80)], 0, 0, 0, 0);
     expect(achievements.value.completionist).toBe(AchievementLevel.Silver);
   });
 
   it('completionist goes straight to gold', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, [...Array(150)], 0, 0, 0);
+    advanceAchievements(0, [...Array(150)], 0, 0, 0, 0);
     expect(achievements.value.completionist).toBe(AchievementLevel.Gold);
   });
 
   it('advances experimenterFruit', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, take(FRUITS, 14), 0, 0, 0);
+    advanceAchievements(0, take(FRUITS, 14), 0, 0, 0, 0);
     expect(achievements.value.experimenterFruit).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, take(FRUITS, 15), 0, 0, 0);
+    advanceAchievements(0, take(FRUITS, 15), 0, 0, 0, 0);
     expect(achievements.value.experimenterFruit).toBe(AchievementLevel.Gold);
   });
 
   it('experimenter goes straight to gold', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, take(FRUITS, 15), 0, 0, 0);
+    advanceAchievements(0, take(FRUITS, 15), 0, 0, 0, 0);
     expect(achievements.value.experimenterFruit).toBe(AchievementLevel.Gold);
   });
 
   it('advances experimenterVegetable', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, take(VEGETABLES, 14), 0, 0, 0);
+    advanceAchievements(0, take(VEGETABLES, 14), 0, 0, 0, 0);
     expect(achievements.value.experimenterVegetable).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, take(VEGETABLES, 15), 0, 0, 0);
+    advanceAchievements(0, take(VEGETABLES, 15), 0, 0, 0, 0);
     expect(achievements.value.experimenterVegetable).toBe(AchievementLevel.Gold);
   });
 
   it('advances experimenterLeafy', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, take(LEAFIES, 14), 0, 0, 0);
+    advanceAchievements(0, take(LEAFIES, 14), 0, 0, 0, 0);
     expect(achievements.value.experimenterLeafy).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, take(LEAFIES, 15), 0, 0, 0);
+    advanceAchievements(0, take(LEAFIES, 15), 0, 0, 0, 0);
     expect(achievements.value.experimenterLeafy).toBe(AchievementLevel.Gold);
   });
 
   it('advances experimenterBean', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, take(BEANS, 14), 0, 0, 0);
+    advanceAchievements(0, take(BEANS, 14), 0, 0, 0, 0);
     expect(achievements.value.experimenterBean).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, take(BEANS, 15), 0, 0, 0);
+    advanceAchievements(0, take(BEANS, 15), 0, 0, 0, 0);
     expect(achievements.value.experimenterBean).toBe(AchievementLevel.Gold);
   });
 
   it('advances experimenterRoot', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, take(ROOTS, 14), 0, 0, 0);
+    advanceAchievements(0, take(ROOTS, 14), 0, 0, 0, 0);
     expect(achievements.value.experimenterRoot).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, take(ROOTS, 15), 0, 0, 0);
+    advanceAchievements(0, take(ROOTS, 15), 0, 0, 0, 0);
     expect(achievements.value.experimenterRoot).toBe(AchievementLevel.Gold);
   });
 
   it('advances experimenterGrain', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, take(GRAINS, 14), 0, 0, 0);
+    advanceAchievements(0, take(GRAINS, 14), 0, 0, 0, 0);
     expect(achievements.value.experimenterGrain).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, take(GRAINS, 15), 0, 0, 0);
+    advanceAchievements(0, take(GRAINS, 15), 0, 0, 0, 0);
     expect(achievements.value.experimenterGrain).toBe(AchievementLevel.Gold);
   });
 
   it('advances hot streak', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, [], 4, 0, 0);
+    advanceAchievements(0, [], 4, 0, 0, 0);
     expect(achievements.value.hotStreak).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, [], 5, 0, 0);
+    advanceAchievements(0, [], 5, 0, 0, 0);
     expect(achievements.value.hotStreak).toEqual(AchievementLevel.Bronze);
-    advanceAchievements(0, [], 10, 0, 0);
+    advanceAchievements(0, [], 10, 0, 0, 0);
     expect(achievements.value.hotStreak).toEqual(AchievementLevel.Silver);
-    advanceAchievements(0, [], 20, 0, 0);
+    advanceAchievements(0, [], 20, 0, 0, 0);
     expect(achievements.value.hotStreak).toEqual(AchievementLevel.Gold);
   });
 
   it('advances committed', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, [], 0, 11, 0);
+    advanceAchievements(0, [], 0, 11, 0, 0);
     expect(achievements.value.committed).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, [], 0, 12, 0);
+    advanceAchievements(0, [], 0, 12, 0, 0);
     expect(achievements.value.committed).toEqual(AchievementLevel.Bronze);
-    advanceAchievements(0, [], 0, 26, 0);
+    advanceAchievements(0, [], 0, 26, 0, 0);
     expect(achievements.value.committed).toEqual(AchievementLevel.Silver);
-    advanceAchievements(0, [], 0, 52, 0);
+    advanceAchievements(0, [], 0, 52, 0, 0);
     expect(achievements.value.committed).toEqual(AchievementLevel.Gold);
   });
 
   it('advances challengeAccepted', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(0, [], 0, 0, 4);
+    advanceAchievements(0, [], 0, 0, 4, 0);
     expect(achievements.value.challengeAccepted).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(0, [], 0, 0, 5);
+    advanceAchievements(0, [], 0, 0, 5, 0);
     expect(achievements.value.challengeAccepted).toEqual(AchievementLevel.Bronze);
-    advanceAchievements(0, [], 0, 0, 10);
+    advanceAchievements(0, [], 0, 0, 10, 0);
     expect(achievements.value.challengeAccepted).toEqual(AchievementLevel.Silver);
-    advanceAchievements(0, [], 0, 0, 20);
+    advanceAchievements(0, [], 0, 0, 20, 0);
     expect(achievements.value.challengeAccepted).toEqual(AchievementLevel.Gold);
   });
 
   it('advances thirtyVeggies', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(29, [], 0, 0, 0);
+    advanceAchievements(29, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toEqual(AchievementLevel.NoAchievement);
-    advanceAchievements(30, [], 0, 0, 0);
+    advanceAchievements(30, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toBe(AchievementLevel.Gold);
-    advanceAchievements(40, [], 0, 0, 0);
+    advanceAchievements(40, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toBe(AchievementLevel.Platinum);
   });
 
   it('resets thirtyVeggies', async () => {
     const {advanceAchievements, achievements} = await withSetup(useAchievements);
-    advanceAchievements(30, [], 0, 0, 0);
+    advanceAchievements(30, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toEqual(AchievementLevel.Gold);
-    advanceAchievements(0, [], 0, 0, 0);
+    advanceAchievements(0, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toBe(AchievementLevel.NoAchievement);
-    advanceAchievements(40, [], 0, 0, 0);
+    advanceAchievements(40, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toEqual(AchievementLevel.Platinum);
-    advanceAchievements(0, [], 0, 0, 0);
+    advanceAchievements(0, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toBe(AchievementLevel.NoAchievement);
-    advanceAchievements(40, [], 0, 0, 0);
+    advanceAchievements(40, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toEqual(AchievementLevel.Platinum);
-    advanceAchievements(39, [], 0, 0, 0);
+    advanceAchievements(39, [], 0, 0, 0, 0);
     expect(achievements.value.thirtyVeggies).toBe(AchievementLevel.Gold);
   });
 
+  it('advances favorite', async () => {
+    const {advanceAchievements, achievements} = await withSetup(useAchievements);
+    advanceAchievements(0, [], 0, 0, 0, 19);
+    expect(achievements.value.favorite).toEqual(AchievementLevel.NoAchievement);
+    advanceAchievements(0, [], 0, 0, 0, 20);
+    expect(achievements.value.favorite).toEqual(AchievementLevel.Bronze);
+    advanceAchievements(0, [], 0, 0, 0, 50);
+    expect(achievements.value.favorite).toEqual(AchievementLevel.Silver);
+    advanceAchievements(0, [], 0, 0, 0, 100);
+    expect(achievements.value.favorite).toEqual(AchievementLevel.Gold);
+  });
+
   it('resets achievements', async () => {
     const expectedAchievements: Achievements = {
       challengeAccepted: AchievementLevel.Gold,
@@ -187,11 +200,12 @@ describe('achievements', () => {
       experimenterGrain: AchievementLevel.Gold,
       experimenterLeafy: AchievementLevel.Gold,
       experimenterVegetable: AchievementLevel.Gold,
+      favorite: AchievementLevel.Gold,
       hotStreak: AchievementLevel.Gold,
       thirtyVeggies: AchievementLevel.Platinum,
     };
     const {advanceAchievements, achievements, resetAchievements} = await withSetup(useAchievements);
-    advanceAchievements(40, ALL_VEGGIES, 30, 52, 20);
+    advanceAchievements(40, ALL_VEGGIES, 30, 52, 20, 100);
     expect(achievements.value).toEqual(expectedAchievements);
     resetAchievements();
     expect(achievements.value).toEqual(defaultAchievements);