From 085aee9c19d3f8c08d94c893b8d6fbfefa2651c4 Mon Sep 17 00:00:00 2001
From: Miah <miah120@proton.me>
Date: Thu, 27 Feb 2025 23:32:06 +0000
Subject: [PATCH] Make activity selector more user friendly

---
 frontend/lang/messages/en-US.json    |  3 +-
 frontend/pages/user/profile/edit.vue | 48 ++++++++++++++++++++++++----
 2 files changed, 44 insertions(+), 7 deletions(-)

diff --git a/frontend/lang/messages/en-US.json b/frontend/lang/messages/en-US.json
index 15623ce09..27cab23bb 100644
--- a/frontend/lang/messages/en-US.json
+++ b/frontend/lang/messages/en-US.json
@@ -1047,7 +1047,8 @@
     "dont-want-to-see-this-anymore-be-sure-to-change-your-email": "Don't want to see this anymore? Be sure to change your email in your user settings!",
     "forgot-password": "Forgot Password",
     "forgot-password-text": "Please enter your email address and we will send you a link to reset your password.",
-    "changes-reflected-immediately": "Changes to this user will be reflected immediately."
+    "changes-reflected-immediately": "Changes to this user will be reflected immediately.",
+    "default-activity": "Default Activity"
   },
   "language-dialog": {
     "translated": "translated",
diff --git a/frontend/pages/user/profile/edit.vue b/frontend/pages/user/profile/edit.vue
index 09124ff4f..37364e7a9 100644
--- a/frontend/pages/user/profile/edit.vue
+++ b/frontend/pages/user/profile/edit.vue
@@ -45,6 +45,8 @@
                     <v-text-field v-model="userCopy.defaultActivity" :label="'Default Activity'" validate-on-blur
                       required>
                     </v-text-field>
+                    <v-combobox v-model="selectedDefaultActivity" :label="$t('user.default-activity')"
+                      :items="activityOptions" validate-on-blur />
                   </v-form>
                 </v-card-text>
                 <v-card-actions>
@@ -107,12 +109,19 @@
 </template>
 
 <script lang="ts">
+import { ref, reactive, defineComponent, computed, useContext, watch, toRefs } from "@nuxtjs/composition-api";
+import { TranslateResult } from "vue-i18n";
 import { useUserApi } from "~/composables/api";
 import UserAvatar from "~/components/Domain/User/UserAvatar.vue";
 import UserPasswordStrength from "~/components/Domain/User/UserPasswordStrength.vue";
 import { validators } from "~/composables/use-validators";
 import type { VForm } from "~/types/auto-forms";
 
+type TRoute = string;
+type TActivityLabel = TranslateResult;
+
+const DEFAULT_ACTIVITY = "/g/home"
+
 export default defineNuxtComponent({
   components: {
     UserAvatar,
@@ -120,18 +129,43 @@ export default defineNuxtComponent({
   },
   middleware: "sidebase-auth",
   setup() {
-    const i18n = useI18n();
-    const $auth = useMealieAuth();
-    const user = computed(() => $auth.user.value);
+    const { $auth, i18n } = useContext();
+    const user = computed(() => $auth.user as unknown as UserOut);
+    const groupSlug = computed(() => user.value.groupSlug)
 
-    useSeoMeta({
-      title: i18n.t("settings.profile"),
-    });
+    const selectableActivities = new Map<TActivityLabel, TRoute>([
+      [i18n.t("general.recipes"), groupSlug ? `/g/${groupSlug.value}` : DEFAULT_ACTIVITY],
+      [i18n.t("recipe-finder.recipe-finder"), `/g/${groupSlug.value}/recipes/finder`],
+      [i18n.t("meal-plan.meal-planner"), "/household/mealplan/planner/view"],
+      [i18n.t("shopping-list.shopping-lists"), "/shopping-lists"],
+      [i18n.t("recipe.timeline"), `/g/${groupSlug.value}/recipes/timeline`],
+      [i18n.t("cookbook.cookbooks"), `/g/${groupSlug.value}/cookbooks`],
+    ])
+
+    function getActivityRoute(label?: TActivityLabel): TRoute {
+      return selectableActivities.get(label ?? "") ?? DEFAULT_ACTIVITY
+    }
+
+    function getActivityLabel(route?: TRoute): TActivityLabel {
+      return selectableActivities
+        .keys()
+        .find(label => selectableActivities.get(label as string) === (route ?? DEFAULT_ACTIVITY)) as string
+      // Safe assertion: DEFAULT_ACTIVITY will always exist in the map
+    }
+    const selectedDefaultActivity = ref(getActivityLabel(user.value.defaultActivity))
+    const activityOptions = [...selectableActivities.keys()]
 
     watch(user, () => {
       userCopy.value = { ...user.value };
     });
 
+    watch(selectedDefaultActivity, () => {
+      userCopy.value = {
+        ...userCopy.value,
+        defaultActivity: getActivityRoute(selectedDefaultActivity.value)
+      }
+    })
+
     const userCopy = ref({ ...user.value });
 
     const api = useUserApi();
@@ -179,6 +213,8 @@ export default defineNuxtComponent({
       updateUser,
       updatePassword,
       userCopy,
+      selectedDefaultActivity,
+      activityOptions,
       password,
       domUpdatePassword,
       passwordsMatch,