diff --git a/cookbook/views/api.py b/cookbook/views/api.py
index eee52f0b5..bc944730d 100644
--- a/cookbook/views/api.py
+++ b/cookbook/views/api.py
@@ -1125,7 +1125,7 @@ class FoodViewSet(LoggingMixin, TreeMixin, DeleteRelationMixing):
                             "type": "text",
                             "text": "Given the following food and the following different types of properties please update the food so that the properties attribute contains a list with all property types in the following format [{property_amount: <the property value>, property_type: {id: <the ID of the property type>, name: <the name of the property type>}}]."
                                     "The property values should be in the unit given in the property type and for the amount specified in the properties_food_amount attribute of the food, which is given in the properties_food_unit."
-                                    "property_amount is a decimal number. Please try to keep a percision of two decimal places if given in your source data."
+                                    "property_amount is a decimal number. Please try to keep a precision of two decimal places if given in your source data."
                                     "Do not make up any data. If there is no data available for the given property type that is ok, just return null as a property_amount for that property type. Do not change anything else!"
                                     "Most property types are likely going to be nutritional values. Please do not make up any values, only return values you can find in the sources available to you."
                                     "Only return values if you are sure they are meant for the food given. Under no circumstance are you allowed to change any other value of the given food or change the structure in any way or form."
diff --git a/vue3/src/components/inputs/PropertiesEditor.vue b/vue3/src/components/inputs/PropertiesEditor.vue
index 464aaa932..4e12d1097 100644
--- a/vue3/src/components/inputs/PropertiesEditor.vue
+++ b/vue3/src/components/inputs/PropertiesEditor.vue
@@ -1,11 +1,11 @@
 <template>
     <v-btn-group density="compact">
-        <v-btn color="create" @click="food.properties.push({} as Property)" prepend-icon="$create">{{ $t('Add') }}</v-btn>
+        <v-btn color="create" @click="editingObj.properties.push({} as Property)" prepend-icon="$create">{{ $t('Add') }}</v-btn>
         <v-btn color="secondary" @click="addAllProperties" prepend-icon="fa-solid fa-list">{{ $t('AddAll') }}</v-btn>
-        <ai-action-button color="info" @selected="propertiesFromAi" :loading="aiLoading" prepend-icon="$ai">{{ $t('AI') }}</ai-action-button>
+        <ai-action-button color="info" @selected="propertiesFromAi" :loading="aiLoading" prepend-icon="$ai" v-if="isFood">{{ $t('AI') }}</ai-action-button>
     </v-btn-group>
 
-    <v-row class="d-none d-md-flex mt-2" v-for="p in food.properties" dense>
+    <v-row class="d-none d-md-flex mt-2" v-for="p in editingObj.properties" dense>
         <v-col cols="0" md="6">
             <v-number-input :step="10" v-model="p.propertyAmount" control-variant="stacked" :precision="2">
                 <template #append-inner v-if="p.propertyType">
@@ -25,7 +25,7 @@
         </v-col>
     </v-row>
     <v-list class="d-md-none">
-        <v-list-item v-for="p in food.properties" border>
+        <v-list-item v-for="p in editingObj.properties" border>
             <span v-if="p.propertyType">{{ p.propertyAmount }} {{ p.propertyType.unit }} {{ p.propertyType.name }} / {{ props.amountFor }}
             </span>
             <span v-else><i><{{ $t('New') }}></i></span>
@@ -41,10 +41,10 @@
 
 <script setup lang="ts">
 
-import {ApiApi, Food, Property} from "@/openapi";
+import {ApiApi, Food, Property, Recipe} from "@/openapi";
 import ModelEditDialog from "@/components/dialogs/ModelEditDialog.vue";
 import ModelSelect from "@/components/inputs/ModelSelect.vue";
-import {PropType, ref} from "vue";
+import {computed, onMounted, ref} from "vue";
 import AiActionButton from "@/components/buttons/AiActionButton.vue";
 import {ErrorMessageType, useMessageStore} from "@/stores/MessageStore.ts";
 
@@ -52,7 +52,11 @@ const props = defineProps({
     amountFor: {type: String, required: true},
 })
 
-const food = defineModel<Food>({required: true})
+const isFood = computed(() => {
+    return !('steps' in editingObj.value)
+})
+
+const editingObj = defineModel<Food|Recipe>({required: true})
 
 const aiLoading = ref(false)
 
@@ -61,8 +65,8 @@ const aiLoading = ref(false)
  * @param property property to delete
  */
 function deleteProperty(property: Property) {
-    if (food.value.properties) {
-        food.value.properties = food.value.properties.filter(p => p !== property)
+    if (editingObj.value.properties) {
+        editingObj.value.properties = editingObj.value.properties.filter(p => p !== property)
         // TODO delete from DB, needs endpoint for property relation to either recipe or food
     }
 }
@@ -74,14 +78,14 @@ function deleteProperty(property: Property) {
 function addAllProperties() {
     const api = new ApiApi()
 
-    if (food.value.properties) {
-        food.value.properties = []
+    if (editingObj.value.properties) {
+        editingObj.value.properties = []
     }
 
     api.apiPropertyTypeList().then(r => {
         r.results.forEach(pt => {
-            if (food.value.properties.findIndex(x => x.propertyType.name == pt.name) == -1) {
-                food.value.properties.push({propertyAmount: 0, propertyType: pt} as Property)
+            if (editingObj.value.properties.findIndex(x => x.propertyType.name == pt.name) == -1) {
+                editingObj.value.properties.push({propertyAmount: 0, propertyType: pt} as Property)
             }
         })
     })
@@ -90,8 +94,8 @@ function addAllProperties() {
 function propertiesFromAi(providerId: number) {
     const api = new ApiApi()
     aiLoading.value = true
-    api.apiFoodAipropertiesCreate({id: food.value.id!, food: food.value, provider: providerId}).then(r => {
-        food.value = r
+    api.apiFoodAipropertiesCreate({id: editingObj.value.id!, food: editingObj.value, provider: providerId}).then(r => {
+        editingObj.value = r
     }).catch(err => {
         useMessageStore().addError(ErrorMessageType.FETCH_ERROR, err)
     }).finally(() => {
diff --git a/vue3/src/components/model_editors/RecipeEditor.vue b/vue3/src/components/model_editors/RecipeEditor.vue
index d6339a00a..9ef3ebf05 100644
--- a/vue3/src/components/model_editors/RecipeEditor.vue
+++ b/vue3/src/components/model_editors/RecipeEditor.vue
@@ -106,7 +106,10 @@
                 <v-tabs-window-item value="properties">
                     <v-form :disabled="loading || fileApiLoading">
                         <closable-help-alert :text="$t('PropertiesFoodHelp')"></closable-help-alert>
-                        <properties-editor v-model="editingObj.properties" :amount-for="$t('Serving')"></properties-editor>
+                        <properties-editor v-model="editingObj" :amount-for="$t('Serving')"></properties-editor>
+
+                        <!-- TODO remove once append to body for model select is working properly -->
+                        <v-spacer style="margin-top: 100px;"></v-spacer>
                     </v-form>
                 </v-tabs-window-item>
                 <v-tabs-window-item value="settings">