fix: store i18n key for Recipe Created event, translate at serve time

The recipe-created timeline event was always stored as the translated
English string "Recipe Created", regardless of the request locale.

Now the i18n key "recipe.recipe-created" is stored in the database.
The GET endpoints for timeline events translate system event subjects
using the locale from the request's Accept-Language header, so the
correct translation is returned for any supported locale. Old events
that already contain English strings are returned as-is (backward-
compatible).

Closes #4497

frontend/app/components/Domain/Recipe/RecipeDialogAddToShoppingList.vue

@@ -321,7 +321,7 @@ async function consolidateRecipesIntoSections(recipes: RecipeWithScale[]) {
         const householdsWithFood = subIng.food?.householdsWithIngredientFood || [];
         ownIngs.push({
           checked: !householdsWithFood.includes(currentHouseholdSlug.value),
-          ingredient: { ...subIng, quantity: (ing.quantity || 1) * (subIng.quantity || 1) },
+          ingredient: subIng,
         });
       }
     }

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

@@ -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);
+  });
 });

frontend/app/composables/partials/use-actions-factory.ts

@@ -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;
   }
 

frontend/app/composables/partials/use-store-factory.ts

@@ -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();
   }
 

frontend/app/composables/store/use-category-store.ts

@@ -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);
 };

frontend/app/composables/store/use-cookbook-store.ts

@@ -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);
 };

frontend/app/composables/store/use-food-store.ts

@@ -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);
 };

frontend/app/composables/store/use-household-store.ts

@@ -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);
 };

frontend/app/composables/store/use-label-store.ts

@@ -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);
 };

frontend/app/composables/store/use-tag-store.ts

@@ -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);
 };

frontend/app/composables/store/use-tool-store.ts

@@ -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);
 };

frontend/app/composables/store/use-unit-store.ts

@@ -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);
 };

frontend/app/composables/store/use-user-store.ts

@@ -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" });
 };

mealie/routes/recipe/timeline_events.py

@@ -15,6 +15,7 @@ from mealie.schema.recipe.recipe_timeline_events import (
     RecipeTimelineEventPagination,
     RecipeTimelineEventUpdate,
     TimelineEventImage,
+    TimelineEventType,
 )
 from mealie.schema.recipe.request_helpers import UpdateImageResponse
 from mealie.schema.response.pagination import PaginationQuery
@@ -50,6 +51,10 @@ class RecipeTimelineEventsController(BaseCrudController):
             override=RecipeTimelineEventOut,
         )
 
+        for event in response.items:
+            if event.event_type == TimelineEventType.system.value:
+                event.subject = self.t(event.subject)
+
         response.set_pagination_guides(router.url_path_for("get_all"), q.model_dump())
         return response
 
@@ -83,7 +88,10 @@ class RecipeTimelineEventsController(BaseCrudController):
 
     @router.get("/{item_id}", response_model=RecipeTimelineEventOut)
     def get_one(self, item_id: UUID4):
-        return self.mixins.get_one(item_id)
+        event = self.mixins.get_one(item_id)
+        if event.event_type == TimelineEventType.system.value:
+            event.subject = self.t(event.subject)
+        return event
 
     @router.put("/{item_id}", response_model=RecipeTimelineEventOut)
     def update_one(self, item_id: UUID4, data: RecipeTimelineEventUpdate):

mealie/services/recipe/recipe_service.py

@@ -224,7 +224,7 @@ class RecipeService(RecipeServiceBase):
         timeline_event_data = RecipeTimelineEventCreate(
             user_id=new_recipe.user_id,
             recipe_id=new_recipe.id,
-            subject=self.t("recipe.recipe-created"),
+            subject="recipe.recipe-created",
             event_type=TimelineEventType.system,
             timestamp=new_recipe.created_at or datetime.now(UTC),
         )

tests/integration_tests/user_recipe_tests/test_recipe_timeline_events.py

@@ -8,6 +8,7 @@ from mealie.schema.recipe.recipe_timeline_events import (
     RecipeTimelineEventOut,
     RecipeTimelineEventPagination,
     TimelineEventImage,
+    TimelineEventType,
 )
 from mealie.schema.recipe.request_helpers import UpdateImageResponse
 from tests.utils import api_routes
@@ -341,6 +342,42 @@ def test_create_recipe_with_timeline_event(
         assert events_pagination.items
 
 
+def test_recipe_created_system_event_is_translated(
+    api_client: TestClient,
+    unique_user: TestUser,
+    recipes: list[Recipe],
+):
+    recipe = recipes[0]
+    params = {"queryFilter": f"recipe_id={recipe.id}"}
+
+    # fetch events in French — the system "recipe created" event should be translated
+    fr_headers = {**unique_user.token, "Accept-Language": "fr-FR"}
+    events_response = api_client.get(api_routes.recipes_timeline_events, params=params, headers=fr_headers)
+    assert events_response.status_code == 200
+    events_pagination = RecipeTimelineEventPagination.model_validate(events_response.json())
+
+    system_events = [e for e in events_pagination.items if e.event_type == TimelineEventType.system.value]
+    assert system_events, "expected at least one system event for a newly created recipe"
+
+    for event in system_events:
+        assert event.subject == "Recette créée", f"expected French translation, got: {event.subject!r}"
+
+        # also verify the individual GET endpoint translates correctly
+        single_response = api_client.get(api_routes.recipes_timeline_events_item_id(event.id), headers=fr_headers)
+        assert single_response.status_code == 200
+        single_event = RecipeTimelineEventOut.model_validate(single_response.json())
+        assert single_event.subject == "Recette créée"
+
+    # fetch the same events in English — subject should be the English string
+    en_headers = {**unique_user.token, "Accept-Language": "en-US"}
+    events_response = api_client.get(api_routes.recipes_timeline_events, params=params, headers=en_headers)
+    events_pagination = RecipeTimelineEventPagination.model_validate(events_response.json())
+
+    system_events = [e for e in events_pagination.items if e.event_type == TimelineEventType.system.value]
+    for event in system_events:
+        assert event.subject == "Recipe Created", f"expected English string, got: {event.subject!r}"
+
+
 @pytest.mark.parametrize("use_other_household_user", [True, False])
 def test_invalid_recipe_id(
     api_client: TestClient, unique_user: TestUser, h2_user: TestUser, use_other_household_user: bool