apps/web: move initial data fetch to client

apps/web/pages/index.jsx

@@ -7,7 +7,6 @@ import Output from '@/Components/Output';
 import { defaultRoles } from '@/config/users';
 import * as CRMTypes from '@/graphql/crm.types';
 import { useInsuranceData, useMainData, useReactions } from '@/process/hooks';
-import { getInitialData } from '@/process/hooks/init';
 import { dehydrate, QueryClient } from '@tanstack/react-query';
 import Head from 'next/head';
 
@@ -64,14 +63,10 @@ export const makeGetServerSideProps = ({ roles }) =>
             props: { statusCode: 403 },
           };
         }
-        const { values, options } = await getInitialData(apolloClient, user);
 
         return {
           props: {
-            calculation: {
+            calculation: {},
-              options,
-              values,
-            },
             initialApolloState: apolloClient.cache.extract(),
             initialQueryState: dehydrate(queryClient),
             statusCode: 200,

apps/web/process/hooks/init/get-initial-data.ts

@@ -1,74 +0,0 @@
-import type { User } from '@/api/user/types';
-import { crmTools } from '@/graphql/crm.tools';
-import * as CRMTypes from '@/graphql/crm.types';
-import { getCurrentISODate } from '@/utils/date';
-import type { ApolloClient } from '@apollo/client';
-
-export async function getInitialData({ query }: ApolloClient<object>, user: User) {
-  const leadsQuery = query({
-    query: CRMTypes.GetLeadsDocument,
-    variables: { domainname: user.domainName },
-  });
-  const opportunitiesQuery = query({
-    query: CRMTypes.GetOpportunitiesDocument,
-    variables: { domainname: user.domainName },
-  });
-  const transactionCurrenciesQuery = query({ query: CRMTypes.GetTransactionCurrenciesDocument });
-  const productsQuery = query({
-    fetchPolicy: 'network-only',
-    query: CRMTypes.GetProductsDocument,
-    variables: { currentDate: getCurrentISODate() },
-  });
-  const systemUserQuery = query({
-    fetchPolicy: 'network-only',
-    query: CRMTypes.GetSystemUserDocument,
-    variables: { domainname: user?.domainName },
-  });
-
-  const [
-    {
-      data: { leads },
-    },
-    {
-      data: { opportunities },
-    },
-    {
-      data: { transactioncurrencies },
-    },
-    {
-      data: { evo_baseproducts },
-    },
-    {
-      data: { systemuser },
-    },
-  ] = await Promise.all([
-    leadsQuery,
-    opportunitiesQuery,
-    transactionCurrenciesQuery,
-    productsQuery,
-    systemUserQuery,
-  ]);
-
-  const transactioncurrency_rub = transactioncurrencies?.find((x) => x?.isocurrencycode === 'RUB');
-
-  if (transactioncurrency_rub?.transactioncurrencyid) {
-    await query({
-      query: CRMTypes.GetTransactionCurrencyDocument,
-      variables: {
-        currencyid: transactioncurrency_rub?.transactioncurrencyid,
-      },
-    });
-  }
-
-  return {
-    options: {
-      selectLead: leads,
-      selectOpportunity: opportunities,
-      selectProduct: crmTools.evo_baseproducts(evo_baseproducts).filterBy.systemuser(systemuser),
-      selectSupplierCurrency: transactioncurrencies,
-    },
-    values: {
-      supplierCurrency: transactioncurrency_rub?.transactioncurrencyid ?? null,
-    },
-  };
-}

apps/web/process/hooks/init/get-main-data.js

@@ -1,19 +1,63 @@
 /* eslint-disable canonical/sort-keys */
+import { getUser } from '@/api/user/query';
+import { STALE_TIME } from '@/constants/request';
+import { crmTools } from '@/graphql/crm.tools';
 import * as CRMTypes from '@/graphql/crm.types';
 import { useStore } from '@/stores/hooks';
 import { getCurrentISODate } from '@/utils/date';
 import { normalizeOptions } from '@/utils/entity';
 import { useApolloClient } from '@apollo/client';
+import { useQuery } from '@tanstack/react-query';
 import { useEffect } from 'react';
 
-const currentDate = getCurrentISODate();
-
 /**
  *
  * @param {import('@apollo/client').ApolloClient} apolloClient
  * @param {*} onCompleted
  */
-function getMainData({ query }, onCompleted) {
+function getMainData({ query }, onCompleted, user) {
+  const currentDate = getCurrentISODate();
+
+  query({
+    query: CRMTypes.GetLeadsDocument,
+    variables: { domainname: user.domainName },
+  }).then(({ data }) => {
+    onCompleted({
+      selectLead: data?.leads,
+    });
+  });
+
+  query({
+    query: CRMTypes.GetOpportunitiesDocument,
+    variables: { domainname: user.domainName },
+  }).then(({ data }) => {
+    onCompleted({
+      selectOpportunity: data?.opportunities,
+    });
+  });
+
+  query({ query: CRMTypes.GetTransactionCurrenciesDocument }).then(({ data }) => {
+    onCompleted({
+      selectSupplierCurrency: data?.transactioncurrencies,
+    });
+  });
+
+  query({
+    fetchPolicy: 'network-only',
+    query: CRMTypes.GetSystemUserDocument,
+    variables: { domainname: user?.domainName },
+  }).then(({ data: { systemuser } }) => {
+    query({
+      fetchPolicy: 'network-only',
+      query: CRMTypes.GetProductsDocument,
+      variables: { currentDate },
+    }).then(({ data: { evo_baseproducts } }) => {
+      onCompleted({
+        selectProduct: crmTools.evo_baseproducts(evo_baseproducts).filterBy.systemuser(systemuser),
+      });
+    });
+  });
+
   // query({
   //   query: CRMTypes.GetLeaseObjectTypesDocument,
   // }).then(({ data }) => {
@@ -126,6 +170,10 @@ export function useMainData() {
   const { $calculation } = useStore();
   const apolloClient = useApolloClient();
 
+  const { data: user } = useQuery(['user'], ({ signal }) => getUser({ signal }), {
+    staleTime: STALE_TIME,
+  });
+
   function handleOnCompleted(options) {
     Object.keys(options).forEach((elementName) => {
       const elementOptions = options[elementName];
@@ -134,6 +182,6 @@ export function useMainData() {
   }
 
   useEffect(() => {
-    getMainData(apolloClient, handleOnCompleted);
+    getMainData(apolloClient, handleOnCompleted, user);
   }, []);
 }

apps/web/process/hooks/init/index.js

@@ -1,4 +1,3 @@
-export * from './get-initial-data';
 export * from './get-insurance-data';
 export * from './get-main-data';
 export * from './get-users';