mirror of
https://github.com/hay-kot/mealie.git
synced 2025-08-22 14:33:33 -07:00
feat: save default recipe ordering in local storage
This commit is contained in:
parent
245ca5fe3b
commit
bd5b7762d3
2 changed files with 27 additions and 4 deletions
|
@ -123,7 +123,7 @@
|
||||||
density="comfortable"
|
density="comfortable"
|
||||||
:prepend-icon="v.icon"
|
:prepend-icon="v.icon"
|
||||||
:title="v.name"
|
:title="v.name"
|
||||||
@click="state.orderBy = v.value"
|
@click="setOrderBy(v.value)"
|
||||||
/>
|
/>
|
||||||
</v-list>
|
</v-list>
|
||||||
</v-card>
|
</v-card>
|
||||||
|
@ -219,7 +219,7 @@ import {
|
||||||
useToolStore,
|
useToolStore,
|
||||||
usePublicToolStore,
|
usePublicToolStore,
|
||||||
} from "~/composables/store";
|
} from "~/composables/store";
|
||||||
import { useUserSearchQuerySession } from "~/composables/use-users/preferences";
|
import { useUserSearchQuerySession, useUserSortPreferences } from "~/composables/use-users/preferences";
|
||||||
import RecipeCardSection from "~/components/Domain/Recipe/RecipeCardSection.vue";
|
import RecipeCardSection from "~/components/Domain/Recipe/RecipeCardSection.vue";
|
||||||
import type { IngredientFood, RecipeCategory, RecipeTag, RecipeTool } from "~/lib/api/types/recipe";
|
import type { IngredientFood, RecipeCategory, RecipeTag, RecipeTool } from "~/lib/api/types/recipe";
|
||||||
import type { NoUndefinedField } from "~/lib/api/types/non-generated";
|
import type { NoUndefinedField } from "~/lib/api/types/non-generated";
|
||||||
|
@ -253,6 +253,15 @@ export default defineNuxtComponent({
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const groupSlug = computed(() => route.params.groupSlug as string || $auth.user.value?.groupSlug || "");
|
const groupSlug = computed(() => route.params.groupSlug as string || $auth.user.value?.groupSlug || "");
|
||||||
const searchQuerySession = useUserSearchQuerySession();
|
const searchQuerySession = useUserSearchQuerySession();
|
||||||
|
const sortPreferences = useUserSortPreferences();
|
||||||
|
|
||||||
|
watch(() => state.value.orderBy, (newValue) => {
|
||||||
|
sortPreferences.value.orderBy = newValue;
|
||||||
|
});
|
||||||
|
|
||||||
|
watch(() => state.value.orderDirection, (newValue) => {
|
||||||
|
sortPreferences.value.orderDirection = newValue;
|
||||||
|
});
|
||||||
|
|
||||||
const { recipes, appendRecipes, assignSorted, removeRecipe, replaceRecipes } = useLazyRecipes(isOwnGroup.value ? null : groupSlug.value);
|
const { recipes, appendRecipes, assignSorted, removeRecipe, replaceRecipes } = useLazyRecipes(isOwnGroup.value ? null : groupSlug.value);
|
||||||
const categories = isOwnGroup.value ? useCategoryStore() : usePublicCategoryStore(groupSlug.value);
|
const categories = isOwnGroup.value ? useCategoryStore() : usePublicCategoryStore(groupSlug.value);
|
||||||
|
@ -325,6 +334,12 @@ export default defineNuxtComponent({
|
||||||
|
|
||||||
function toggleOrderDirection() {
|
function toggleOrderDirection() {
|
||||||
state.value.orderDirection = state.value.orderDirection === "asc" ? "desc" : "asc";
|
state.value.orderDirection = state.value.orderDirection === "asc" ? "desc" : "asc";
|
||||||
|
sortPreferences.value.orderDirection = state.value.orderDirection;
|
||||||
|
}
|
||||||
|
|
||||||
|
function setOrderBy(value: string) {
|
||||||
|
state.value.orderBy = value;
|
||||||
|
sortPreferences.value.orderBy = value;
|
||||||
}
|
}
|
||||||
|
|
||||||
function toIDArray(array: { id: string }[]) {
|
function toIDArray(array: { id: string }[]) {
|
||||||
|
@ -623,6 +638,13 @@ export default defineNuxtComponent({
|
||||||
}
|
}
|
||||||
|
|
||||||
await hydrateSearch();
|
await hydrateSearch();
|
||||||
|
if (!route.query.orderBy) {
|
||||||
|
state.value.orderBy = sortPreferences.value.orderBy;
|
||||||
|
}
|
||||||
|
if (!route.query.orderDirection) {
|
||||||
|
state.value.orderDirection = sortPreferences.value.orderDirection as "asc" | "desc";
|
||||||
|
}
|
||||||
|
|
||||||
await search();
|
await search();
|
||||||
state.value.ready = true;
|
state.value.ready = true;
|
||||||
});
|
});
|
||||||
|
@ -665,6 +687,7 @@ export default defineNuxtComponent({
|
||||||
|
|
||||||
sortable,
|
sortable,
|
||||||
toggleOrderDirection,
|
toggleOrderDirection,
|
||||||
|
setOrderBy,
|
||||||
hideKeyboard,
|
hideKeyboard,
|
||||||
input,
|
input,
|
||||||
|
|
||||||
|
|
|
@ -96,8 +96,8 @@ export function useUserSortPreferences(): Ref<UserRecipePreferences> {
|
||||||
const fromStorage = useLocalStorage(
|
const fromStorage = useLocalStorage(
|
||||||
"recipe-section-preferences",
|
"recipe-section-preferences",
|
||||||
{
|
{
|
||||||
orderBy: "name",
|
orderBy: "created_at",
|
||||||
orderDirection: "asc",
|
orderDirection: "desc",
|
||||||
filterNull: false,
|
filterNull: false,
|
||||||
sortIcon: $globals.icons.sortAlphabeticalAscending,
|
sortIcon: $globals.icons.sortAlphabeticalAscending,
|
||||||
useMobileCards: false,
|
useMobileCards: false,
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue