test recent shopping list

vue/package-lock.json

@@ -13193,9 +13193,9 @@
             "integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c="
         },
         "typescript": {
-            "version": "4.4.4",
-            "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz",
-            "integrity": "sha512-DqGhF5IKoBl8WNf8C1gu8q0xZSInh9j1kJJMqT3a94w1JzVaBU4EXOSMrz9yDqMT0xt3selp83fuFMQ0uzv6qA==",
+            "version": "4.5.2",
+            "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.5.2.tgz",
+            "integrity": "sha512-5BlMof9H1yGt0P8/WF+wPNw6GfctgGjXp5hkblpyT+8rkASSmkUKMXrxR0Xg8ThVCi/JnHQiKXeBaEwCeQwMFw==",
             "dev": true
         },
         "uc.micro": {

vue/package.json

@@ -49,8 +49,8 @@
         "@vue/eslint-config-typescript": "^9.1.0",
         "babel-eslint": "^10.1.0",
         "eslint": "^7.28.0",
-        "eslint-plugin-vue": "^8.2.0",
-        "typescript": "~4.4.4",
+        "eslint-plugin-vue": "^8.0.3",
+        "typescript": "~4.5.2",
         "vue-cli-plugin-i18n": "^2.1.1",
         "webpack-bundle-tracker": "1.4.0",
         "workbox-expiration": "^6.3.0",

vue/src/apps/ShoppingListView/ShoppingListView.vue

@@ -436,7 +436,7 @@
                         delayThis(contextData)
                     "
                 >
-                    <b-form-group label-cols="10" content-cols="2" class="text-nowrap m-0 mr-2">
+                    <b-form-group label-cols="9" content-cols="3" class="text-nowrap m-0 mr-2">
                         <template #label>
                             <a class="dropdown-item p-2" href="#"><i class="far fa-hourglass"></i> {{ $t("DelayFor", { hours: delay }) }}</a>
                         </template>
@@ -550,7 +550,7 @@ export default {
 
             // filter out list items that are delayed
             if (!this.show_delay && shopping_list) {
-                shopping_list = shopping_list.filter((x) => !x.delay_until || !Date.parse(x?.delay_until) > new Date(Date.now()))
+                shopping_list = shopping_list.filter((x) => !x.delay_until || !Date.parse(x?.delay_until) < new Date(Date.now()))
             }
 
             // if a supermarket is selected and filtered to only supermarket categories filter out everything else
@@ -671,6 +671,9 @@ export default {
                 }
             }, this.settings.shopping_auto_sync * 1000)
         },
+        "settings.default_delay": function (newVal, oldVal) {
+            this.delay = Number(newVal)
+        },
     },
     mounted() {
         this.getShoppingList()
@@ -678,7 +681,8 @@ export default {
         this.getShoppingCategories()
 
         this.settings = getUserPreference()
-        this.delay = this.settings.default_delay || 4
+        this.delay = Number(this.settings.default_delay || 4)
+        console.log(this.delay)
         this.supermarket_categories_only = this.settings.filter_to_supermarket
         if (this.settings.shopping_auto_sync) {
             window.addEventListener("online", this.updateOnlineStatus)

vue/src/components/ShoppingLineItem.vue

@@ -55,7 +55,8 @@
                         <div class="col-md-4 text-muted text-right">{{ formatOneCreatedBy(e) }}</div>
                     </div>
                     <div class="row ml-2 small">
-                        <div class="col-md-4 offset-md-8 text-muted text-right">{{ formatOneCompletedAt(e) }}</div>
+                        <div class="col-md-4 offset-md-8 text-muted text-right" v-if="formatOneCompletedAt(e)">{{ formatOneCompletedAt(e) }}</div>
+                        <div class="col-md-4 offset-md-8 text-muted text-right" v-if="formatOneDelayUntil(e)">{{ formatOneDelayUntil(e) }}</div>
                     </div>
                     <div class="row ml-2 light">
                         <div class="col-sm-1 text-nowrap">
@@ -210,7 +211,7 @@ export default {
         },
         formatOneCompletedAt: function (item) {
             if (!item.completed_at) {
-                return ""
+                return false
             }
             return [this.$t("Completed"), "@", this.formatDate(item.completed_at)].join(" ")
         },
@@ -220,6 +221,12 @@ export default {
         formatOneChecked: function (item) {
             return item.checked
         },
+        formatOneDelayUntil: function (item) {
+            if (!item.delay_until && item.checked) {
+                return false
+            }
+            return [this.$t("DelayUntil"), "-", this.formatDate(item.delay_until)].join(" ")
+        },
         formatOneMealPlan: function (item) {
             return item?.recipe_mealplan?.name
         },
@@ -233,7 +240,7 @@ export default {
             return [item?.recipe_mealplan?.mealplan_note, item?.ingredient_note].filter(String)
         },
         formatOneCreatedBy: function (item) {
-            return [item?.created_by.username, "@", this.formatDate(item.created_at)].join(" ")
+            return [this.$t("Added_by"), item?.created_by.username, "@", this.formatDate(item.created_at)].join(" ")
         },
         openRecipeCard: function (e, item) {
             this.genericAPI(this.Models.RECIPE, this.Actions.FETCH, { id: item.recipe_mealplan.recipe }).then((result) => {

vue/src/locales/en.json

@@ -275,5 +275,6 @@
     "csv_prefix_help": "Prefix to add when copying list to the clipboard.",
     "csv_prefix_label": "List Prefix",
     "copy_markdown_table": "Copy as Markdown Table",
-    "in_shopping": "In Shopping List"
+    "in_shopping": "In Shopping List",
+    "DelayUntil": "Delay Until"
 }