feat(achievements): implement unlocking, saving and notification

app/components/Settings/BottomScreen/Menus/User/Color.vue

@@ -5,6 +5,7 @@ const app = useAppStore();
 const store = useSettingsStore();
 const { assets } = useAssets();
 const confirmationModal = useConfirmationModal();
+const achievements = useAchievementsStore();
 
 const GRID_SIZE = 4;
 const GRID_START_X = 32;
@@ -15,6 +16,7 @@ const ANIMATION_SPEED = 475;
 
 const originalSelectedCol = app.color.col;
 const originalSelectedRow = app.color.row;
+const originalColor = app.color.hex;
 
 let selectedCol = app.color.col;
 let selectedRow = app.color.row;
@@ -108,6 +110,18 @@ const handleCancel = () => {
 
 const handleConfirm = () => {
   app.save();
+
+  if (app.color.hex !== originalColor) {
+    achievements.unlock("settings_color_change");
+  }
+
+  if (!achievements.advancement.colors.includes(app.color.hex)) {
+    achievements.advancement.colors.push(app.color.hex);
+    if (achievements.advancement.colors.length === APP_COLORS.flat().length) {
+      achievements.unlock("settings_color_try_all");
+    }
+  }
+
   confirmationModal.open({
     text: $t("settings.user.color.confirmation"),
     onClosed: () => store.closeSubMenu(),

app/components/Settings/BottomScreen/Menus/User/PersonalMessage.vue

@@ -3,6 +3,7 @@ import * as THREE from "three";
 import { useIntervalFn, useLocalStorage } from "@vueuse/core";
 
 const store = useSettingsStore();
+const achievements = useAchievementsStore();
 const confirmationModal = useConfirmationModal();
 
 const { onRender } = useScreen();
@@ -56,7 +57,11 @@ const handleConfirm = () => {
       break;
     }
 
-    case "waiting":
+    case "waiting": {
+      achievements.unlock("snake_play");
+      spawn();
+      break;
+    }
     case "dead": {
       spawn();
       break;
@@ -101,6 +106,10 @@ const eat = () => {
   highScore.value = Math.max(highScore.value, score);
   food.copy(randomFoodPos());
   score += 1;
+
+  if (score === 40) {
+    achievements.unlock("snake_score_40");
+  }
 };
 
 const die = () => {