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