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/tools/index.vue

@@ -1,44 +1,38 @@
 <template>
   <v-container>
-    <RecipeCategoryTagToolPage v-if="tools" :items="tools" item-type="tools" @delete="removeTool" />
+    <RecipeOrganizerPage
+      v-if="tools"
+      :icon="$globals.icons.potSteam"
+      :items="tools"
+      item-type="tools"
+      @delete="actions.deleteOne"
+    >
+      <template #title> Tools </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, ref } from "@nuxtjs/composition-api";
+import RecipeOrganizerPage from "~/components/Domain/Recipe/RecipeOrganizerPage.vue";
+import { useToolStore } from "~/composables/store";
 
 export default defineComponent({
   components: {
-    RecipeCategoryTagToolPage,
+    RecipeOrganizerPage,
   },
   setup() {
-    const userApi = useUserApi();
-    const tools = useAsync(async () => {
-      const { data } = await userApi.tools.getAll();
-
-      if (data) {
-        return data;
-      }
-    }, useAsyncKey());
-
-    function removeTool(id: string) {
-      if (tools.value) {
-        for (let i = 0; i < tools.value.length; i++) {
-          if (tools.value[i].id === id) {
-            tools.value.splice(i, 1);
-            break;
-          }
-        }
-      }
-    }
+    const toolStore = useToolStore();
+    const dialog = ref(false);
 
     return {
-      tools,
-      removeTool,
+      dialog,
+      tools: toolStore.items,
+      actions: toolStore.actions,
     };
   },
+  head: {
+    title: "Tools",
+  },
 });
 </script>