gitscope
← marzneshin / v0.1.2 / app/dashboard/src/stores/services.store.ts
https://dev.kronoz.win/r/marzneshin.git
app/dashboard/src/stores/services.store.ts · TypeScript
Blame Raw
 1import { queryClient } from 'service/react-query';
 2import { StatisticsQueryKey } from 'components/statistics-card';
 3import { Service, ServiceCreate } from 'types/service';
 4import { pageSizeManagers } from 'utils/userPreferenceStorage';
 5import { create } from 'zustand';
 6import { subscribeWithSelector } from 'zustand/middleware';
 7import { fetch } from 'service/http';
 8import { ServicesFilterType } from 'types/filter';
 9import { useDashboard, useUsers } from 'stores';
10import { queryIds } from 'constants/query-ids';
11
12type ServicesStateType = {
13  isCreatingNewService: boolean;
14  editingService: Service | null | undefined;
15  deletingService: Service | null;
16  servicesFilters: ServicesFilterType;
17  onCreateService: (isOpen: boolean) => void;
18  onEditingService: (service: Service | null) => void;
19  onDeletingService: (service: Service | null) => void;
20  refetchServices: () => void;
21  deleteService: (service: Service) => Promise<void>;
22  createService: (service: ServiceCreate) => Promise<void>;
23  editService: (service: ServiceCreate) => Promise<void>;
24  onFilterChange: (filters: Partial<ServicesFilterType>) => void;
25};
26
27export const fetchServices = async (query: ServicesFilterType): Promise<Service[]> => {
28  for (const key in query) {
29    if (!query[key as keyof ServicesFilterType]) delete query[key as keyof ServicesFilterType];
30  }
31
32  useDashboard.setState({ loading: true });
33
34  return fetch('/services')
35    .then((services) => {
36      return services;
37    })
38    .finally(() => {
39      useDashboard.setState({ loading: false });
40    });
41};
42
43export const useServices = create(
44  subscribeWithSelector<ServicesStateType>((set, get) => ({
45    editingService: null,
46    deletingService: null,
47    isCreatingNewService: false,
48    servicesFilters: {
49      name: '',
50      limit: pageSizeManagers.services.getPageSize(),
51      sort: '-created_at',
52    },
53    onFilterChange: (filters) => {
54      set({
55        servicesFilters: {
56          ...get().servicesFilters,
57          ...filters,
58        },
59      });
60      get().refetchServices();
61    },
62    refetchServices: () => {
63      queryClient.invalidateQueries(queryIds.services);
64    },
65    onCreateService: (isCreatingNewService) => set({ isCreatingNewService }),
66    onEditingService: (editingService) => {
67      set({ editingService });
68    },
69    onDeletingService: (deletingService) => {
70      set({ deletingService });
71    },
72    deleteService: async (service: Service) => {
73      set({ editingService: null });
74      return fetch(`/services/${service.id}`, { method: 'DELETE' }).then(() => {
75        set({ deletingService: null });
76        get().refetchServices();
77        useUsers.getState().refetchUsers();
78        queryClient.invalidateQueries(StatisticsQueryKey);
79      });
80    },
81    createService: async (body: ServiceCreate) => {
82      return fetch('/services', { method: 'POST', body }).then(() => {
83        set({ editingService: null });
84        get().refetchServices();
85        queryClient.invalidateQueries(StatisticsQueryKey);
86      });
87    },
88    editService: async (body: ServiceCreate) => {
89      return fetch(`/services/${body.id}`, { method: 'PUT', body }).then(
90        () => {
91          get().onEditingService(null);
92          get().refetchServices();
93        }
94      );
95    },
96  }))
97);