diff --git a/frontend/components/Domain/Recipe/RecipeDataTable.vue b/frontend/components/Domain/Recipe/RecipeDataTable.vue
index ac4c28715..1752d03cb 100644
--- a/frontend/components/Domain/Recipe/RecipeDataTable.vue
+++ b/frontend/components/Domain/Recipe/RecipeDataTable.vue
@@ -3,7 +3,7 @@
     v-model="selected"
     item-key="id"
     show-select
-    :sort-by="[{ key: 'dateAdded', order: 'desc' }]"
+    :sort-by="sortBy"
     :headers="headers"
     :items="recipes"
     :items-per-page="15"
@@ -117,7 +117,7 @@ export default defineNuxtComponent({
       },
     },
   },
-  emits: ["click"],
+  emits: ["click", "update:modelValue"],
   setup(props, context) {
     const i18n = useI18n();
     const $auth = useMealieAuth();
@@ -128,6 +128,9 @@ export default defineNuxtComponent({
       set: value => context.emit(INPUT_EVENT, value),
     });
 
+    // Initialize sort state with default sorting by dateAdded descending
+    const sortBy = ref([{ key: "dateAdded", order: "desc" }]);
+
     const headers = computed(() => {
       const hdrs: Array<{ title: string; value: string; align?: string; sortable?: boolean }> = [];
 
@@ -206,6 +209,7 @@ export default defineNuxtComponent({
 
     return {
       selected,
+      sortBy,
       groupSlug,
       headers,
       formatDate,