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';
10
11type ServicesStateType = {
12  services: Service[],
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      useServices.setState({ services });
37      return services;
38    })
39    .finally(() => {
40      useDashboard.setState({ loading: false });
41    });
42};
43
44export const useServices = create(
45  subscribeWithSelector<ServicesStateType>((set, get) => ({
46    editingService: null,
47    deletingService: null,
48    isCreatingNewService: false,
49    services: [],
50    servicesFilters: {
51      name: '',
52      limit: pageSizeManagers.services.getPageSize(),
53      sort: '-created_at',
54    },
55    onFilterChange: (filters) => {
56      set({
57        servicesFilters: {
58          ...get().servicesFilters,
59          ...filters,
60        },
61      });
62      get().refetchServices();
63    },
64    refetchServices: () => {
65      fetchServices(get().servicesFilters);
66    },
67    onCreateService: (isCreatingNewService) => set({ isCreatingNewService }),
68    onEditingService: (editingService) => {
69      set({ editingService });
70    },
71    onDeletingService: (deletingService) => {
72      set({ deletingService });
73    },
74    deleteService: async (service: Service) => {
75      set({ editingService: null });
76      return fetch(`/services/${service.id}`, { method: 'DELETE' }).then(() => {
77        set({ deletingService: null });
78        get().refetchServices();
79        useUsers.getState().refetchUsers();
80        queryClient.invalidateQueries(StatisticsQueryKey);
81      });
82    },
83    createService: async (body: ServiceCreate) => {
84      return fetch('/services', { method: 'POST', body }).then(() => {
85        set({ editingService: null });
86        get().refetchServices();
87        queryClient.invalidateQueries(StatisticsQueryKey);
88      });
89    },
90    editService: async (body: ServiceCreate) => {
91      return fetch(`/services/${body.id}`, { method: 'PUT', body }).then(
92        () => {
93          get().onEditingService(null);
94          get().refetchServices();
95        }
96      );
97    },
98  }))
99);