diff --git a/frontend/pages/shopping-lists/_id.vue b/frontend/pages/shopping-lists/_id.vue index e5de50bbe..004dbcbb7 100644 --- a/frontend/pages/shopping-lists/_id.vue +++ b/frontend/pages/shopping-lists/_id.vue @@ -56,7 +56,7 @@
-
+
- - - - + + + +
@@ -470,7 +470,7 @@ export default defineComponent({ }); // ===================================== - // Collapsables + // Collapsable Labels const labelOpenState = ref<{ [key: string]: boolean }>({}); const initializeLabelOpenStates = () => { @@ -480,8 +480,8 @@ export default defineComponent({ let hasChanges = false; for (const item of shoppingList.value.listItems) { - const labelName = item.label?.name; - if (labelName && !existingLabels.has(labelName) && !(labelName in labelOpenState.value)) { + const labelName = item.label?.name || i18n.tc("shopping-list.no-label"); + if (!existingLabels.has(labelName) && !(labelName in labelOpenState.value)) { labelOpenState.value[labelName] = true; hasChanges = true; } @@ -492,9 +492,13 @@ export default defineComponent({ } }; - const labelNames = computed(() => - new Set(shoppingList.value?.listItems?.map(item => item.label?.name).filter(Boolean) ?? []) - ); + const labelNames = computed(() => { + return new Set( + shoppingList.value?.listItems + ?.map(item => item.label?.name || i18n.tc("shopping-list.no-label")) + .filter(Boolean) ?? [] + ); + }); watch(labelNames, initializeLabelOpenStates, { immediate: true });