Mirrors/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2026-05-13 13:27:29 -04:00
Code Issues Packages Projects Releases Wiki Activity

fix: Infinite API request loop on empty stores (#7613)

Browse Source
This commit is contained in:
Michael Genson
2026-05-12 12:25:48 -05:00
committed by GitHub
parent 703db2931f
commit af75c5f39d
12 changed files with 82 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
frontend/app/composables/partials/use-actions-factory.test.ts
View File

@@ -13,9 +13,10 @@ describe("useStoreActions", () => {
const mockStore = ref([]);
const mockLoading = ref(false);
const mockInitialized = ref(false);
test("deleteMany calls deleteOne for each ID and refreshes once", async () => {
const actions = useStoreActions("test-store", mockApi, mockStore, mockLoading);
const actions = useStoreActions("test-store", mockApi, mockStore, mockLoading, mockInitialized);
mockApi.deleteOne = vi.fn().mockResolvedValue({ response: { data: {} } });
mockApi.getAll = vi.fn().mockResolvedValue({ data: { items: [] } });
@@ -32,7 +33,7 @@ describe("useStoreActions", () => {
});
test("deleteMany handles empty array", async () => {
const actions = useStoreActions("test-store", mockApi, mockStore, mockLoading);
const actions = useStoreActions("test-store", mockApi, mockStore, mockLoading, mockInitialized);
mockApi.deleteOne = vi.fn();
mockApi.getAll = vi.fn().mockResolvedValue({ data: { items: [] } });
@@ -44,7 +45,7 @@ describe("useStoreActions", () => {
});
test("deleteMany sets loading state", async () => {
const actions = useStoreActions("test-store", mockApi, mockStore, mockLoading);
const actions = useStoreActions("test-store", mockApi, mockStore, mockLoading, mockInitialized);
mockApi.deleteOne = vi.fn().mockResolvedValue({});
mockApi.getAll = vi.fn().mockResolvedValue({ data: { items: [] } });
@@ -55,4 +56,25 @@ describe("useStoreActions", () => {
await promise;
expect(mockLoading.value).toBe(false);
});
test("refresh sets initialized to true even when store returns empty results", async () => {
const localInitialized = ref(false);
const actions = useStoreActions("test-store", mockApi, mockStore, mockLoading, localInitialized);
mockApi.getAll = vi.fn().mockResolvedValue({ data: { items: [] } });
expect(localInitialized.value).toBe(false);
await actions.refresh();
expect(localInitialized.value).toBe(true);
});
test("refresh sets initialized to true when store returns items", async () => {
const localInitialized = ref(false);
const actions = useStoreActions("test-store", mockApi, mockStore, mockLoading, localInitialized);
mockApi.getAll = vi.fn().mockResolvedValue({ data: { items: [{ id: "1", name: "item" }] } });
await actions.refresh();
expect(localInitialized.value).toBe(true);
});
});

4
frontend/app/composables/partials/use-actions-factory.ts
View File

@@ -26,6 +26,7 @@ export function useReadOnlyActions<T extends BoundT>(
api: BaseCRUDAPIReadOnly<T>,
allRef: Ref<T[] | null> | null,
loading: Ref<boolean>,
initialized: Ref<boolean>,
defaultQueryParams: Record<string, QueryValue> = {},
): ReadOnlyStoreActions<T> {
function getAll(page = 1, perPage = -1, params = {} as Record<string, QueryValue>) {
@@ -69,6 +70,7 @@ export function useReadOnlyActions<T extends BoundT>(
allRef.value = data.items;
}
initialized.value = true;
loading.value = false;
}
@@ -89,6 +91,7 @@ export function useStoreActions<T extends BoundT>(
api: BaseCRUDAPI<unknown, T, unknown>,
allRef: Ref<T[] | null> | null,
loading: Ref<boolean>,
initialized: Ref<boolean>,
defaultQueryParams: Record<string, QueryValue> = {},
): StoreActions<T> {
function getAll(page = 1, perPage = -1, params = {} as Record<string, QueryValue>) {
@@ -132,6 +135,7 @@ export function useStoreActions<T extends BoundT>(
allRef.value = data.items;
}
initialized.value = true;
loading.value = false;
}

12
frontend/app/composables/partials/use-store-factory.ts
View File

@@ -16,10 +16,11 @@ export const useReadOnlyStore = function <T extends BoundT>(
storeKey: string,
store: Ref<T[]>,
loading: Ref<boolean>,
initialized: Ref<boolean>,
api: BaseCRUDAPIReadOnly<T>,
params = {} as Record<string, QueryValue>,
) {
const storeActions = useReadOnlyActions(`${storeKey}-store-readonly`, api, store, loading);
const storeActions = useReadOnlyActions(`${storeKey}-store-readonly`, api, store, loading, initialized);
const actions = {
...storeActions,
async refresh() {
@@ -27,11 +28,12 @@ export const useReadOnlyStore = function <T extends BoundT>(
},
flushStore() {
store.value = [];
initialized.value = false;
},
};
// initial hydration
if (!loading.value && !store.value.length) {
if (!loading.value && !initialized.value) {
actions.refresh();
}
@@ -42,10 +44,11 @@ export const useStore = function <T extends BoundT>(
storeKey: string,
store: Ref<T[]>,
loading: Ref<boolean>,
initialized: Ref<boolean>,
api: BaseCRUDAPI<unknown, T, unknown>,
params = {} as Record<string, QueryValue>,
) {
const storeActions = useStoreActions(`${storeKey}-store`, api, store, loading);
const storeActions = useStoreActions(`${storeKey}-store`, api, store, loading, initialized);
const actions = {
...storeActions,
async refresh() {
@@ -53,11 +56,12 @@ export const useStore = function <T extends BoundT>(
},
flushStore() {
store.value = [];
initialized.value = false;
},
};
// initial hydration
if (!loading.value && !store.value.length) {
if (!loading.value && !initialized.value) {
actions.refresh();
}

8
frontend/app/composables/store/use-category-store.ts
View File

@@ -5,12 +5,16 @@ import { usePublicExploreApi, useUserApi } from "~/composables/api";
const store: Ref<RecipeCategory[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
const publicLoading = ref(false);
const publicInitialized = ref(false);
export function resetCategoryStore() {
store.value = [];
loading.value = false;
initialized.value = false;
publicLoading.value = false;
publicInitialized.value = false;
}
export const useCategoryData = function () {
@@ -23,10 +27,10 @@ export const useCategoryData = function () {
export const useCategoryStore = function (i18n?: Composer) {
const api = useUserApi(i18n);
return useStore<RecipeCategory>("category", store, loading, api.categories);
return useStore<RecipeCategory>("category", store, loading, initialized, api.categories);
};
export const usePublicCategoryStore = function (groupSlug: string, i18n?: Composer) {
const api = usePublicExploreApi(groupSlug, i18n).explore;
return useReadOnlyStore<RecipeCategory>("category", store, publicLoading, api.categories);
return useReadOnlyStore<RecipeCategory>("category", store, publicLoading, publicInitialized, api.categories);
};

8
frontend/app/composables/store/use-cookbook-store.ts
View File

@@ -5,17 +5,21 @@ import { usePublicExploreApi, useUserApi } from "~/composables/api";
const cookbooks: Ref<ReadCookBook[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
const publicLoading = ref(false);
const publicInitialized = ref(false);
export function resetCookbookStore() {
cookbooks.value = [];
loading.value = false;
initialized.value = false;
publicLoading.value = false;
publicInitialized.value = false;
}
export const useCookbookStore = function (i18n?: Composer) {
const api = useUserApi(i18n);
const store = useStore<ReadCookBook>("cookbook", cookbooks, loading, api.cookbooks);
const store = useStore<ReadCookBook>("cookbook", cookbooks, loading, initialized, api.cookbooks);
const updateAll = async function (updateData: UpdateCookBook[]) {
loading.value = true;
@@ -31,5 +35,5 @@ export const useCookbookStore = function (i18n?: Composer) {
export const usePublicCookbookStore = function (groupSlug: string, i18n?: Composer) {
const api = usePublicExploreApi(groupSlug, i18n).explore;
return useReadOnlyStore<ReadCookBook>("cookbook", cookbooks, publicLoading, api.cookbooks);
return useReadOnlyStore<ReadCookBook>("cookbook", cookbooks, publicLoading, publicInitialized, api.cookbooks);
};

8
frontend/app/composables/store/use-food-store.ts
View File

@@ -5,12 +5,16 @@ import { usePublicExploreApi, useUserApi } from "~/composables/api";
const store: Ref<IngredientFood[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
const publicLoading = ref(false);
const publicInitialized = ref(false);
export function resetFoodStore() {
store.value = [];
loading.value = false;
initialized.value = false;
publicLoading.value = false;
publicInitialized.value = false;
}
export const useFoodData = function () {
@@ -24,10 +28,10 @@ export const useFoodData = function () {
export const useFoodStore = function (i18n?: Composer) {
const api = useUserApi(i18n);
return useStore<IngredientFood>("food", store, loading, api.foods);
return useStore<IngredientFood>("food", store, loading, initialized, api.foods);
};
export const usePublicFoodStore = function (groupSlug: string, i18n?: Composer) {
const api = usePublicExploreApi(groupSlug, i18n).explore;
return useReadOnlyStore<IngredientFood>("food", store, publicLoading, api.foods);
return useReadOnlyStore<IngredientFood>("food", store, publicLoading, publicInitialized, api.foods);
};

8
frontend/app/composables/store/use-household-store.ts
View File

@@ -5,20 +5,24 @@ import { usePublicExploreApi, useUserApi } from "~/composables/api";
const store: Ref<HouseholdSummary[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
const publicLoading = ref(false);
const publicInitialized = ref(false);
export function resetHouseholdStore() {
store.value = [];
loading.value = false;
initialized.value = false;
publicLoading.value = false;
publicInitialized.value = false;
}
export const useHouseholdStore = function (i18n?: Composer) {
const api = useUserApi(i18n);
return useReadOnlyStore<HouseholdSummary>("household", store, loading, api.households);
return useReadOnlyStore<HouseholdSummary>("household", store, loading, initialized, api.households);
};
export const usePublicHouseholdStore = function (groupSlug: string, i18n?: Composer) {
const api = usePublicExploreApi(groupSlug, i18n).explore;
return useReadOnlyStore<HouseholdSummary>("household-public", store, publicLoading, api.households);
return useReadOnlyStore<HouseholdSummary>("household-public", store, publicLoading, publicInitialized, api.households);
};

4
frontend/app/composables/store/use-label-store.ts
View File

@@ -5,10 +5,12 @@ import { useUserApi } from "~/composables/api";
const store: Ref<MultiPurposeLabelOut[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
export function resetLabelStore() {
store.value = [];
loading.value = false;
initialized.value = false;
}
export const useLabelData = function () {
@@ -22,5 +24,5 @@ export const useLabelData = function () {
export const useLabelStore = function (i18n?: Composer) {
const api = useUserApi(i18n);
return useStore<MultiPurposeLabelOut>("label", store, loading, api.multiPurposeLabels);
return useStore<MultiPurposeLabelOut>("label", store, loading, initialized, api.multiPurposeLabels);
};

8
frontend/app/composables/store/use-tag-store.ts
View File

@@ -5,12 +5,16 @@ import { usePublicExploreApi, useUserApi } from "~/composables/api";
const store: Ref<RecipeTag[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
const publicLoading = ref(false);
const publicInitialized = ref(false);
export function resetTagStore() {
store.value = [];
loading.value = false;
initialized.value = false;
publicLoading.value = false;
publicInitialized.value = false;
}
export const useTagData = function () {
@@ -23,10 +27,10 @@ export const useTagData = function () {
export const useTagStore = function (i18n?: Composer) {
const api = useUserApi(i18n);
return useStore<RecipeTag>("tag", store, loading, api.tags);
return useStore<RecipeTag>("tag", store, loading, initialized, api.tags);
};
export const usePublicTagStore = function (groupSlug: string, i18n?: Composer) {
const api = usePublicExploreApi(groupSlug, i18n).explore;
return useReadOnlyStore<RecipeTag>("tag", store, publicLoading, api.tags);
return useReadOnlyStore<RecipeTag>("tag", store, publicLoading, publicInitialized, api.tags);
};

8
frontend/app/composables/store/use-tool-store.ts
View File

@@ -9,12 +9,16 @@ interface RecipeToolWithOnHand extends RecipeTool {
const store: Ref<RecipeTool[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
const publicLoading = ref(false);
const publicInitialized = ref(false);
export function resetToolStore() {
store.value = [];
loading.value = false;
initialized.value = false;
publicLoading.value = false;
publicInitialized.value = false;
}
export const useToolData = function () {
@@ -29,10 +33,10 @@ export const useToolData = function () {
export const useToolStore = function (i18n?: Composer) {
const api = useUserApi(i18n);
return useStore<RecipeTool>("tool", store, loading, api.tools);
return useStore<RecipeTool>("tool", store, loading, initialized, api.tools);
};
export const usePublicToolStore = function (groupSlug: string, i18n?: Composer) {
const api = usePublicExploreApi(groupSlug, i18n).explore;
return useReadOnlyStore<RecipeTool>("tool", store, publicLoading, api.tools);
return useReadOnlyStore<RecipeTool>("tool", store, publicLoading, publicInitialized, api.tools);
};

4
frontend/app/composables/store/use-unit-store.ts
View File

@@ -5,10 +5,12 @@ import { useUserApi } from "~/composables/api";
const store: Ref<IngredientUnit[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
export function resetUnitStore() {
store.value = [];
loading.value = false;
initialized.value = false;
}
export const useUnitData = function () {
@@ -23,5 +25,5 @@ export const useUnitData = function () {
export const useUnitStore = function (i18n?: Composer) {
const api = useUserApi(i18n);
return useStore<IngredientUnit>("unit", store, loading, api.units);
return useStore<IngredientUnit>("unit", store, loading, initialized, api.units);
};

4
frontend/app/composables/store/use-user-store.ts
View File

@@ -6,10 +6,12 @@ import { BaseCRUDAPIReadOnly } from "~/lib/api/base/base-clients";
const store: Ref<UserSummary[]> = ref([]);
const loading = ref(false);
const initialized = ref(false);
export function resetUserStore() {
store.value = [];
loading.value = false;
initialized.value = false;
}
class GroupUserAPIReadOnly extends BaseCRUDAPIReadOnly<UserSummary> {
@@ -21,5 +23,5 @@ export const useUserStore = function (i18n?: Composer) {
const requests = useRequests(i18n);
const api = new GroupUserAPIReadOnly(requests);
return useReadOnlyStore<UserSummary>("user", store, loading, api, { orderBy: "full_name" });
return useReadOnlyStore<UserSummary>("user", store, loading, initialized, api, { orderBy: "full_name" });
};