Jacob Corn e1d3a247c7
feat: random sort option for front page (#2363)
* Add hook for random sorting

* Add random sorting to front page

* Add multiple tests for random sorting.

* Be extra sure that all recipes are returned.

* Too stable random. seed doesn't reach backend.

* add timestamp to useRecipeSearch

* Update randomization tests for timestamp seeding

* ruff cleanup

* pass timestamp separately in getAll

* remove debugging log items

* remove timestamp from address bar

* remove defaults from backend timestamps

* timestamp should be optional

* fix edge case: query without timestamp

* similar edge case: no timestamp in pagination

* ruff :/

* better edge case handling

* stabilize random search test w/more recipes

* better pagination seeding

* update pagination seed test

* remove redundant random/seed check

* Test for api routes to random sorting.

* please the typing gods

* hack to make query parameters throw correct exc

* ruff

* fix validator message typo

* black reformatting

---------

Co-authored-by: Hayden <64056131+hay-kot@users.noreply.github.com>
2023-05-29 16:56:20 -08:00

119 lines
2.9 KiB
TypeScript

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 { RecipeSearchQuery } from "~/lib/api/user/recipes/recipe";
export const allRecipes = ref<Recipe[]>([]);
export const recentRecipes = ref<Recipe[]>([]);
export const useLazyRecipes = function () {
const api = useUserApi();
const recipes = ref<Recipe[]>([]);
async function fetchMore(
page: number,
perPage: number,
orderBy: string | null = null,
orderDirection = "desc",
query: RecipeSearchQuery | null = null,
queryFilter: string | null = null,
) {
const { data } = await api.recipes.getAll(page, perPage, {
orderBy,
orderDirection,
paginationSeed: query?._searchSeed, // propagate searchSeed to stabilize random order pagination
searchSeed: query?._searchSeed, // unused, but pass it along for completeness of data
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 : [];
}
function appendRecipes(val: Array<Recipe>) {
val.forEach((recipe) => {
recipes.value.push(recipe);
});
}
function assignSorted(val: Array<Recipe>) {
recipes.value = val;
}
function removeRecipe(slug: string) {
for (let i = 0; i < recipes?.value?.length; i++) {
if (recipes?.value[i].slug === slug) {
recipes?.value.splice(i, 1);
break;
}
}
}
function replaceRecipes(val: Array<Recipe>) {
recipes.value = val;
}
return {
recipes,
fetchMore,
appendRecipes,
assignSorted,
removeRecipe,
replaceRecipes,
};
};
export const useRecipes = (all = false, fetchRecipes = true, loadFood = false) => {
const api = useUserApi();
// recipes is non-reactive!!
const { recipes, page, perPage } = (() => {
if (all) {
return {
recipes: allRecipes,
page: 1,
perPage: -1,
};
} else {
return {
recipes: recentRecipes,
page: 1,
perPage: 30,
};
}
})();
async function refreshRecipes() {
const { data } = await api.recipes.getAll(page, perPage, { loadFood, orderBy: "created_at" });
if (data) {
recipes.value = data.items;
}
}
function getAllRecipes() {
useAsync(async () => {
await refreshRecipes();
}, useAsyncKey());
}
function assignSorted(val: Array<Recipe>) {
recipes.value = val;
}
if (fetchRecipes) {
getAllRecipes();
}
return { getAllRecipes, assignSorted, refreshRecipes };
};