chore: lint-and-fix-vue-demi-imports (#1762)

* lint for 'vue-demi' imports

* fix invalid imports

frontend/.eslintrc.js

@@ -52,7 +52,10 @@ module.exports = {
         "ts-ignore": "allow-with-description",
       },
     ],
-    "no-restricted-imports": ["error", { paths: ["@vue/reactivity", "@vue/runtime-dom", "@vue/composition-api"] }],
+    "no-restricted-imports": [
+      "error",
+      { paths: ["@vue/reactivity", "@vue/runtime-dom", "@vue/composition-api", "vue-demi"] },
+    ],
 
     // TODO Gradually activate all rules
     "@typescript-eslint/no-unsafe-assignment": "off",

frontend/components/Domain/Recipe/RecipeOcrEditorPage/RecipeOcrEditorPageParts/RecipeOcrEditorPageCanvas.vue

@@ -39,8 +39,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, useContext, ref, toRefs, watch } from "@nuxtjs/composition-api";
-import { onMounted } from "vue-demi";
+import { defineComponent, reactive, useContext, ref, toRefs, watch, onMounted } from "@nuxtjs/composition-api";
 import { NoUndefinedField } from "~/lib/api/types/non-generated";
 import { OcrTsvResponse as NullableOcrTsvResponse } from "~/lib/api/types/ocr";
 import { CanvasModes, SelectedTextSplitModes, ImagePosition, Mouse, CanvasRect, ToolbarIcons } from "~/types/ocr-types";

frontend/components/Domain/Recipe/RecipeOrganizerSelector.vue

@@ -39,8 +39,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, useContext } from "@nuxtjs/composition-api";
-import { computed, onMounted } from "vue-demi";
+import { defineComponent, ref, useContext, computed, onMounted } from "@nuxtjs/composition-api";
 import RecipeOrganizerDialog from "./RecipeOrganizerDialog.vue";
 import { RecipeCategory, RecipeTag } from "~/lib/api/types/user";
 import { RecipeTool } from "~/lib/api/types/admin";

frontend/components/Domain/Recipe/RecipePage/RecipePage.vue

@@ -75,9 +75,17 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, useContext, useRouter, computed, ref, useMeta } from "@nuxtjs/composition-api";
+import {
+  defineComponent,
+  useContext,
+  useRouter,
+  computed,
+  ref,
+  useMeta,
+  onMounted,
+  onUnmounted,
+} from "@nuxtjs/composition-api";
 import { invoke, until, useWakeLock } from "@vueuse/core";
-import { onMounted, onUnmounted } from "vue-demi";
 import RecipePageEditorToolbar from "./RecipePageParts/RecipePageEditorToolbar.vue";
 import RecipePageFooter from "./RecipePageParts/RecipePageFooter.vue";
 import RecipePageHeader from "./RecipePageParts/RecipePageHeader.vue";

frontend/pages/admin/backups.vue

@@ -114,8 +114,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, ref, toRefs, useContext } from "@nuxtjs/composition-api";
-import { onMounted } from "vue-demi";
+import { defineComponent, reactive, ref, toRefs, useContext, onMounted } from "@nuxtjs/composition-api";
 import { useAdminApi } from "~/composables/api";
 import { AllBackups } from "~/lib/api/types/admin";
 

frontend/pages/admin/maintenance/logs.vue

@@ -32,8 +32,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from "@nuxtjs/composition-api";
-import { computed, onMounted, reactive } from "vue-demi";
+import { defineComponent, ref, computed, onMounted, reactive } from "@nuxtjs/composition-api";
 import { useAdminApi } from "~/composables/api";
 
 export default defineComponent({

frontend/pages/group/data/foods.vue

@@ -154,8 +154,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, onMounted, ref } from "@nuxtjs/composition-api";
-import { computed } from "vue-demi";
+import { defineComponent, onMounted, ref, computed } from "@nuxtjs/composition-api";
 import type { LocaleObject } from "@nuxtjs/i18n";
 import { validators } from "~/composables/use-validators";
 import { useUserApi } from "~/composables/api";

frontend/pages/recipe/create/url.vue

@@ -63,9 +63,17 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, toRefs, ref, useRouter, computed, useRoute } from "@nuxtjs/composition-api";
+import {
+  defineComponent,
+  reactive,
+  toRefs,
+  ref,
+  useRouter,
+  computed,
+  useRoute,
+  onMounted,
+} from "@nuxtjs/composition-api";
 import { AxiosResponse } from "axios";
-import { onMounted } from "vue-demi";
 import { useUserApi } from "~/composables/api";
 import { validators } from "~/composables/use-validators";
 import { VForm } from "~/types/vuetify";