fixed test and added meal plan client settings load save

cookbook/tests/api/test_api_meal_plan.py

@@ -12,6 +12,7 @@ from cookbook.tests.factories import RecipeFactory
 LIST_URL = 'api:mealplan-list'
 DETAIL_URL = 'api:mealplan-detail'
 
+
 # NOTE: auto adding shopping list from meal plan is tested in test_shopping_recipe as tests are identical
 
 
@@ -22,13 +23,13 @@ def meal_type(space_1, u1_s1):
 
 @pytest.fixture()
 def obj_1(space_1, recipe_1_s1, meal_type, u1_s1):
-    return MealPlan.objects.create(recipe=recipe_1_s1, space=space_1, meal_type=meal_type, date=datetime.now(),
+    return MealPlan.objects.create(recipe=recipe_1_s1, space=space_1, meal_type=meal_type, from_date=datetime.now(), to_date=datetime.now(),
                                    created_by=auth.get_user(u1_s1))
 
 
 @pytest.fixture
 def obj_2(space_1, recipe_1_s1, meal_type, u1_s1):
-    return MealPlan.objects.create(recipe=recipe_1_s1, space=space_1, meal_type=meal_type, date=datetime.now(),
+    return MealPlan.objects.create(recipe=recipe_1_s1, space=space_1, meal_type=meal_type, from_date=datetime.now(), to_date=datetime.now(),
                                    created_by=auth.get_user(u1_s1))
 
 
@@ -109,7 +110,7 @@ def test_add(arg, request, u1_s2, recipe_1_s1, meal_type):
     r = c.post(
         reverse(LIST_URL),
         {'recipe': {'id': recipe_1_s1.id, 'name': recipe_1_s1.name, 'keywords': []}, 'meal_type': {'id': meal_type.id, 'name': meal_type.name},
-         'date': (datetime.now()).strftime("%Y-%m-%d"), 'servings': 1, 'title': 'test', 'shared': []},
+         'from_date': (datetime.now()).strftime("%Y-%m-%d"), 'to_date': (datetime.now()).strftime("%Y-%m-%d"), 'servings': 1, 'title': 'test', 'shared': []},
         content_type='application/json'
     )
     response = json.loads(r.content)
@@ -151,7 +152,7 @@ def test_add_with_shopping(u1_s1, meal_type):
     r = u1_s1.post(
         reverse(LIST_URL),
         {'recipe': {'id': recipe.id, 'name': recipe.name, 'keywords': []}, 'meal_type': {'id': meal_type.id, 'name': meal_type.name},
-         'date': (datetime.now()).strftime("%Y-%m-%d"), 'servings': 1, 'title': 'test', 'shared': [], 'addshopping': True},
+         'from_date': (datetime.now()).strftime("%Y-%m-%d"), 'to_date': (datetime.now()).strftime("%Y-%m-%d"), 'servings': 1, 'title': 'test', 'shared': [], 'addshopping': True},
         content_type='application/json'
     )
 

vue/src/apps/MealPlanView/MealPlanView.vue

@@ -380,18 +380,14 @@ export default {
         }
     },
     mounted() {
-        this.$nextTick(function () {
+        this.settings = useMealPlanStore().client_settings
-            if (this.$cookies.isKey(SETTINGS_COOKIE_NAME)) {
-                this.settings = Object.assign({}, this.settings, this.$cookies.get(SETTINGS_COOKIE_NAME))
-            }
-        })
         this.$i18n.locale = window.CUSTOM_LOCALE
         moment.locale(window.CUSTOM_LOCALE)
     },
     watch: {
         settings: {
             handler() {
-                this.$cookies.set(SETTINGS_COOKIE_NAME, this.settings, "360d")
+                useMealPlanStore().updateClientSettings(this.settings)
             },
             deep: true,
         },

vue/src/components/Settings/MealPlanSettingsComponent.vue

@@ -14,24 +14,24 @@
 
         <hr/>
 
-        <b-form v-if="meal_plan_store">
+        <b-form v-if="settings">
             <b-form-group id="UomInput" :label="$t('Period')" :description="$t('Plan_Period_To_Show')"
                           label-for="UomInput">
-                <b-form-select id="UomInput" v-model="meal_plan_store.client_settings.displayPeriodUom"
+                <b-form-select id="UomInput" v-model="settings.displayPeriodUom"
                                :options="calendar_options.displayPeriodUom"></b-form-select>
             </b-form-group>
             <b-form-group id="PeriodInput" :label="$t('Periods')"
                           :description="$t('Plan_Show_How_Many_Periods')" label-for="PeriodInput">
-                <b-form-select id="PeriodInput" v-model="meal_plan_store.client_settings.displayPeriodCount"
+                <b-form-select id="PeriodInput" v-model="settings.displayPeriodCount"
                                :options="calendar_options.displayPeriodCount"></b-form-select>
             </b-form-group>
             <b-form-group id="DaysInput" :label="$t('Starting_Day')" :description="$t('Starting_Day')"
                           label-for="DaysInput">
-                <b-form-select id="DaysInput" v-model="meal_plan_store.client_settings.startingDayOfWeek"
+                <b-form-select id="DaysInput" v-model="settings.startingDayOfWeek"
                                :options="dayNames()"></b-form-select>
             </b-form-group>
             <b-form-group id="WeekNumInput" :label="$t('Week_Numbers')">
-                <b-form-checkbox v-model="meal_plan_store.client_settings.displayWeekNumbers" name="week_num">
+                <b-form-checkbox v-model="settings.displayWeekNumbers" name="week_num">
                     {{ $t("Show_Week_Numbers") }}
                 </b-form-checkbox>
             </b-form-group>
@@ -96,7 +96,7 @@ export default {
         return {
             user_preferences: undefined,
             languages: [],
-            meal_plan_store: undefined,
+            settings: undefined,
             calendar_options: {
                 displayPeriodUom: [
                     {text: this.$t("Week"), value: "week"},
@@ -108,14 +108,24 @@ export default {
             meal_types: [],
             generic_action: null,
             editing_meal_type: null,
+
         }
     },
+    watch: {
+        settings: {
+            handler() {
+                useMealPlanStore().updateClientSettings(this.settings)
+            },
+            deep: true,
+        },
+    },
     mounted() {
         this.user_preferences = this.preferences
         this.languages = window.AVAILABLE_LANGUAGES
         this.loadSettings()
 
-        this.meal_plan_store = useMealPlanStore()
+        this.settings = useMealPlanStore().client_settings
+        
 
         this.loadMealTypes()
     },

vue/src/stores/MealPlanStore.js

@@ -2,6 +2,7 @@ import {defineStore} from 'pinia'
 import {ApiApiFactory} from "@/utils/openapi/api";
 
 const _STORE_ID = 'meal_plan_store'
+const _LOCAL_STORAGE_KEY = 'MEAL_PLAN_CLIENT_SETTINGS'
 import Vue from "vue"
 import {StandardToasts} from "@/utils/utils";
 /*
@@ -12,12 +13,7 @@ export const useMealPlanStore = defineStore(_STORE_ID, {
     state: () => ({
         plans: {},
         currently_updating: null,
-        client_settings: {
+        settings: null,
-            displayPeriodUom: "week",
-            displayPeriodCount: 2,
-            startingDayOfWeek: 1,
-            displayWeekNumbers: true,
-        },
     }),
     getters: {
         plan_list: function () {
@@ -41,6 +37,12 @@ export const useMealPlanStore = defineStore(_STORE_ID, {
                 title: "",
                 title_placeholder: 'Title', // meal plan edit modal should be improved to not need this
             }
+        },
+        client_settings: function () {
+            if (this.settings === null) {
+                this.settings = this.loadClientSettings()
+            }
+            return this.settings
         }
     },
     actions: {
@@ -91,6 +93,23 @@ export const useMealPlanStore = defineStore(_STORE_ID, {
             }).catch(err => {
                 StandardToasts.makeStandardToast(this, StandardToasts.FAIL_DELETE, err)
             })
+        },
+        updateClientSettings(settings) {
+            this.settings = settings
+            localStorage.setItem(_LOCAL_STORAGE_KEY, JSON.stringify(this.settings))
+        },
+        loadClientSettings() {
+            let s = localStorage.getItem(_LOCAL_STORAGE_KEY)
+            if (s === null || s === {}) {
+                return {
+                    displayPeriodUom: "week",
+                    displayPeriodCount: 3,
+                    startingDayOfWeek: 1,
+                    displayWeekNumbers: true,
+                }
+            } else {
+                return JSON.parse(s)
+            }
         }
     },
 })