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/composables/store/index.ts

@@ -1,3 +1,6 @@
 export { useFoodStore, useFoodData } from "./use-food-store";
 export { useUnitStore, useUnitData } from "./use-unit-store";
 export { useLabelStore, useLabelData } from "./use-label-store";
+export { useToolStore, useToolData } from "./use-tool-store";
+export { useCategoryStore, useCategoryData } from "./use-category-store";
+export { useTagStore, useTagData } from "./use-tag-store";

frontend/composables/store/use-category-store.ts

@@ -0,0 +1,47 @@
+import { reactive, ref, Ref } from "@nuxtjs/composition-api";
+import { useStoreActions } from "../partials/use-actions-factory";
+import { useUserApi } from "~/composables/api";
+import { RecipeCategory } from "~/types/api-types/admin";
+
+const categoryStore: Ref<RecipeCategory[]> = ref([]);
+
+export function useCategoryData() {
+  const data = reactive({
+    id: "",
+    name: "",
+    slug: undefined,
+  });
+
+  function reset() {
+    data.id = "";
+    data.name = "";
+    data.slug = undefined;
+  }
+
+  return {
+    data,
+    reset,
+  };
+}
+
+export function useCategoryStore() {
+  const api = useUserApi();
+  const loading = ref(false);
+
+  const actions = {
+    ...useStoreActions<RecipeCategory>(api.categories, categoryStore, loading),
+    flushStore() {
+      categoryStore.value = [];
+    },
+  };
+
+  if (!categoryStore.value || categoryStore.value?.length === 0) {
+    actions.getAll();
+  }
+
+  return {
+    items: categoryStore,
+    actions,
+    loading,
+  };
+}

frontend/composables/store/use-tag-store.ts

@@ -0,0 +1,47 @@
+import { reactive, ref, Ref } from "@nuxtjs/composition-api";
+import { useStoreActions } from "../partials/use-actions-factory";
+import { useUserApi } from "~/composables/api";
+import { RecipeTag } from "~/types/api-types/admin";
+
+const items: Ref<RecipeTag[]> = ref([]);
+
+export function useTagData() {
+  const data = reactive({
+    id: "",
+    name: "",
+    slug: undefined,
+  });
+
+  function reset() {
+    data.id = "";
+    data.name = "";
+    data.slug = undefined;
+  }
+
+  return {
+    data,
+    reset,
+  };
+}
+
+export function useTagStore() {
+  const api = useUserApi();
+  const loading = ref(false);
+
+  const actions = {
+    ...useStoreActions<RecipeTag>(api.tags, items, loading),
+    flushStore() {
+      items.value = [];
+    },
+  };
+
+  if (!items.value || items.value?.length === 0) {
+    actions.getAll();
+  }
+
+  return {
+    items,
+    actions,
+    loading,
+  };
+}

frontend/composables/store/use-tool-store.ts

@@ -0,0 +1,49 @@
+import { reactive, ref, Ref } from "@nuxtjs/composition-api";
+import { useStoreActions } from "../partials/use-actions-factory";
+import { useUserApi } from "~/composables/api";
+import { RecipeTool } from "~/types/api-types/recipe";
+
+const toolStore: Ref<RecipeTool[]> = ref([]);
+
+export function useToolData() {
+  const data = reactive({
+    id: "",
+    name: "",
+    slug: undefined,
+    onHand: false,
+  });
+
+  function reset() {
+    data.id = "";
+    data.name = "";
+    data.slug = undefined;
+    data.onHand = false;
+  }
+
+  return {
+    data,
+    reset,
+  };
+}
+
+export function useToolStore() {
+  const api = useUserApi();
+  const loading = ref(false);
+
+  const actions = {
+    ...useStoreActions<RecipeTool>(api.tools, toolStore, loading),
+    flushStore() {
+      toolStore.value = [];
+    },
+  };
+
+  if (!toolStore.value || toolStore.value?.length === 0) {
+    actions.getAll();
+  }
+
+  return {
+    items: toolStore,
+    actions,
+    loading,
+  };
+}