feature/new-feature-cleanup (#389)

* add json editor to theme editor

* add toolbars tools to recipe sections

* fix recipe yield

* add updated_date to recipe schema

* update time cards

* fix mobile buttons

* fix asset URL

* fix PG errors CRUD

* remove -d from docker-pro

* fix theme tests

* remvoe old typing

* abstract count function

Co-authored-by: hay-kot <hay-kot@pm.me>

frontend/src/components/Recipe/RecipeViewer/RecipeChips.vue

@@ -11,7 +11,7 @@
       :to="`/recipes/${urlParam}/${getSlug(category)}`"
       :key="category"
     >
-      {{ category }}
+      {{ truncateText(category) }}
     </v-chip>
   </div>
 </template>
@@ -19,6 +19,9 @@
 <script>
 export default {
   props: {
+    truncate: {
+      default: false,
+    },
     items: {
       default: [],
     },
@@ -34,6 +37,7 @@ export default {
     small: {
       default: false,
     },
+    maxWidth: {},
   },
   computed: {
     allCategories() {
@@ -58,6 +62,14 @@ export default {
         if (matches.length > 0) return matches[0].slug;
       }
     },
+    truncateText(text, length = 20, clamp) {
+      if (!this.truncate) return text;
+      clamp = clamp || "...";
+      var node = document.createElement("div");
+      node.innerHTML = text;
+      var content = node.textContent;
+      return content.length > length ? content.slice(0, length) + clamp : content;
+    },
   },
 };
 </script>

frontend/src/components/Recipe/RecipeViewer/index.vue

@@ -8,7 +8,7 @@
       <v-row dense disabled>
         <v-col>
           <v-btn
-            v-if="recipe.yields"
+            v-if="recipe.recipeYield"
             dense
             small
             :hover="false"
@@ -18,7 +18,7 @@
             color="secondary darken-1"
             class="rounded-sm static"
           >
-            {{ recipe.yields }}
+            {{ recipe.recipeYield }}
           </v-btn>
         </v-col>
         <Rating :value="recipe.rating" :name="recipe.name" :slug="recipe.slug" />
@@ -88,7 +88,7 @@
 <script>
 import Nutrition from "@/components/Recipe/Parts/Nutrition";
 import VueMarkdown from "@adapttive/vue-markdown";
-import utils from "@/utils";
+import { utils } from "@/utils";
 import RecipeChips from "./RecipeChips";
 import Rating from "@/components/Recipe/Parts/Rating";
 import Notes from "@/components/Recipe/Parts/Notes";