From d87a5abb6d132f8a4bf55c74eb46b877941009b1 Mon Sep 17 00:00:00 2001
From: Dmitriy Pleshevskiy <dmitriy@ideascup.me>
Date: Wed, 1 Feb 2023 23:34:49 +0300
Subject: [PATCH] refac: define pinia store for each feature...

instead of hooks
---
 src/app/contacts/ContactForm/store.ts   | 10 +++++-----
 src/app/contacts/ContactsTable/store.ts | 10 +++++-----
 src/app/lists/ListsSelect/store.ts      | 13 +++++++------
 3 files changed, 17 insertions(+), 16 deletions(-)

diff --git a/src/app/contacts/ContactForm/store.ts b/src/app/contacts/ContactForm/store.ts
index 260d753..c7fb398 100644
--- a/src/app/contacts/ContactForm/store.ts
+++ b/src/app/contacts/ContactForm/store.ts
@@ -1,13 +1,13 @@
 import { useLoader } from "@/shared/lib/composables/loader";
 import { defineInjectKey, validInject } from "@/shared/lib/di";
-import { reactive } from "vue";
+import { defineStore } from "pinia";
 import { useContactsStore } from "../store";
 import type { ContactFormApiCreateProps, ContactFormApiPort } from "./ports";
 
 export const CONTACT_FORM_API_PROVIDE_KEY =
   defineInjectKey<ContactFormApiPort>("ContactFormApi");
 
-export function useContactFormStore() {
+export const useContactFormStore = defineStore("ContactForm", () => {
   const api = validInject(CONTACT_FORM_API_PROVIDE_KEY);
 
   const contactsStore = useContactsStore();
@@ -18,8 +18,8 @@ export function useContactFormStore() {
     contactsStore.addContact(contact);
   }
 
-  return reactive({
+  return {
     loading: loader.loading,
     create,
-  });
-}
+  };
+});
diff --git a/src/app/contacts/ContactsTable/store.ts b/src/app/contacts/ContactsTable/store.ts
index d690e8b..ce72b05 100644
--- a/src/app/contacts/ContactsTable/store.ts
+++ b/src/app/contacts/ContactsTable/store.ts
@@ -1,6 +1,6 @@
 import { useLoader } from "@/shared/lib/composables/loader";
 import { defineInjectKey, validInject } from "@/shared/lib/di";
-import { storeToRefs } from "pinia";
+import { defineStore, storeToRefs } from "pinia";
 import { reactive } from "vue";
 import { useContactsStore } from "../store";
 import type {
@@ -11,7 +11,7 @@ import type {
 export const CONTACTS_TABLE_API_PROVIDE_KEY =
   defineInjectKey<ContactsTableApiPort>("ContactsTableApi");
 
-export function useContactsTableStore() {
+export const useContactsTableStore = defineStore("ContactsTable", () => {
   const api = validInject(CONTACTS_TABLE_API_PROVIDE_KEY);
 
   const contactsStore = useContactsStore();
@@ -23,9 +23,9 @@ export function useContactsTableStore() {
     contactsStore.setContacts(contacts);
   }
 
-  return reactive({
+  return {
     loading: loader.loading,
     contacts,
     fetchMany,
-  });
-}
+  };
+});
diff --git a/src/app/lists/ListsSelect/store.ts b/src/app/lists/ListsSelect/store.ts
index 8e2f22f..0b066fb 100644
--- a/src/app/lists/ListsSelect/store.ts
+++ b/src/app/lists/ListsSelect/store.ts
@@ -1,13 +1,14 @@
 import { useLoader } from "@/shared/lib/composables/loader";
 import { defineInjectKey, validInject } from "@/shared/lib/di";
-import { computed, reactive } from "vue";
+import { defineStore } from "pinia";
+import { computed } from "vue";
 import { useListsStore } from "../store";
 import type { ListsSelectApiPort } from "./ports";
 
 export const LISTS_SELECT_API_PROVIDE_KEY =
-  defineInjectKey<ListsSelectApiPort>("ListsTableApi");
+  defineInjectKey<ListsSelectApiPort>("ListsSelectApi");
 
-export function useListsSelectStore() {
+export const useListsSelectStore = defineStore("ListsSelect", () => {
   const api = validInject(LISTS_SELECT_API_PROVIDE_KEY);
 
   const listsStore = useListsStore();
@@ -25,9 +26,9 @@ export function useListsSelectStore() {
     listsStore.setLists(lists);
   }
 
-  return reactive({
+  return {
     loading: loader.loading,
     selectItems,
     fetchMany,
-  });
-}
+  };
+});