refactor: unify recipe-organizer components (#1340)

* use generic context menu

* implement organizer stores

* add basic organizer types

* refactor selectors to apply for all organizers

* remove legacy organizer composables

frontend/pages/recipes/categories/index.vue

@@ -1,44 +1,36 @@
 <template>
   <v-container>
-    <RecipeCategoryTagToolPage v-if="categories" :items="categories" item-type="categories" @delete="removeCat" />
+    <RecipeOrganizerPage
+      v-if="items"
+      :items="items"
+      :icon="$globals.icons.tags"
+      item-type="categories"
+      @delete="actions.deleteOne"
+    >
+      <template #title> {{ $tc("category.categories") }} </template>
+    </RecipeOrganizerPage>
   </v-container>
 </template>
 
 <script lang="ts">
-import { defineComponent, useAsync } from "@nuxtjs/composition-api";
-import RecipeCategoryTagToolPage from "~/components/Domain/Recipe/RecipeCategoryTagToolPage.vue";
-import { useUserApi } from "~/composables/api";
-import { useAsyncKey } from "~/composables/use-utils";
+import { defineComponent } from "@nuxtjs/composition-api";
+import RecipeOrganizerPage from "~/components/Domain/Recipe/RecipeOrganizerPage.vue";
+import { useCategoryStore } from "~/composables/store";
 
 export default defineComponent({
   components: {
-    RecipeCategoryTagToolPage,
+    RecipeOrganizerPage,
   },
   setup() {
-    const userApi = useUserApi();
-    const categories = useAsync(async () => {
-      const { data } = await userApi.categories.getAll();
-
-      if (data) {
-        return data;
-      }
-    }, useAsyncKey());
-
-    function removeCat(id: string) {
-      if (categories.value) {
-        for (let i = 0; i < categories.value.length; i++) {
-          if (categories.value[i].id === id) {
-            categories.value.splice(i, 1);
-            break;
-          }
-        }
-      }
-    }
+    const { items, actions } = useCategoryStore();
 
     return {
-      categories,
-      removeCat,
+      items,
+      actions,
     };
   },
+  head: {
+    title: "Tags",
+  },
 });
 </script>