Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-24 23:59:45 +02:00
Code Issues Releases Activity

fix: 2148 infinite scroll on search (#2173)

Browse source 
* refactor recipe card section to use unified query construct

* rework search page so it uses lazy-loading of RecipeCardSection

* remove RecipeQuery again

* prettier reformatting

* remove recipes/all page

* remove max results setting from search

* fix typing issues
This commit is contained in:
Sören 2023-02-26 20:20:26 +01:00 • committed by GitHub
parent afbee3a078
commit 541cdc79aa
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 150 additions and 200 deletions
Download patch file Download diff file Expand all files Collapse all files

3
frontend/composables/partials/use-actions-factory.ts
View file

@ -1,6 +1,7 @@
import { Ref, useAsync } from "@nuxtjs/composition-api";
import { useAsyncKey } from "../use-utils";
import { BaseCRUDAPI } from "~/lib/api/base/base-clients";
import { QueryValue } from "~/lib/api/base/route";
type BoundT = {
id?: string | number;
@ -25,7 +26,7 @@ export function useStoreActions<T extends BoundT>(
allRef: Ref<T[] | null> | null,
loading: Ref<boolean>
): StoreActions<T> {
function getAll(page = 1, perPage = -1, params = {} as any) {
function getAll(page = 1, perPage = -1, params = {} as Record<string, QueryValue>) {
params.orderBy ??= "name";
params.orderDirection ??= "asc";

22
frontend/composables/recipes/use-recipes.ts
View file

@ -1,7 +1,8 @@
import { useAsync, ref } from "@nuxtjs/composition-api";
import { useAsyncKey } from "../use-utils";
import { useUserApi } from "~/composables/api";
import { Recipe } from "~/lib/api/types/recipe";
import {Recipe} from "~/lib/api/types/recipe";
import {RecipeSearchQuery} from "~/lib/api/user/recipes/recipe";
export const allRecipes = ref<Recipe[]>([]);
export const recentRecipes = ref<Recipe[]>([]);
@ -16,19 +17,22 @@ export const useLazyRecipes = function () {
perPage: number,
orderBy: string | null = null,
orderDirection = "desc",
cookbook: string | null = null,
category: string | null = null,
tag: string | null = null,
tool: string | null = null,
query: RecipeSearchQuery | null = null,
queryFilter: string | null = null,
) {
const { data } = await api.recipes.getAll(page, perPage, {
orderBy,
orderDirection,
cookbook,
categories: category,
tags: tag,
tools: tool,
search: query?.search,
cookbook: query?.cookbook,
categories: query?.categories,
requireAllCategories: query?.requireAllCategories,
tags: query?.tags,
requireAllTags: query?.requireAllTags,
tools: query?.tools,
requireAllTools: query?.requireAllTools,
foods: query?.foods,
requireAllFoods: query?.requireAllFoods,
queryFilter,
});
return data ? data.items : [];