github/mealie
1
0
Fork 0
mirror of https://github.com/hay-kot/mealie.git synced 2025-08-20 21:43:36 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 15

Make activity selector more user friendly

Browse source
This commit is contained in:
Miah 2025-02-27 23:32:06 +00:00
commit 085aee9c19
2 changed files with 44 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

3
frontend/lang/messages/en-US.json
View file

@ -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",

48
frontend/pages/user/profile/edit.vue
View file

@ -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,