MPDX-7864 - Task phases functionailty

.github/workflows/ci.yml

@@ -8,7 +8,7 @@ on:
 
 env:
   # Use production API for codegen to make sure production is compatible with the code to be merged
-  API_URL: 'https://api.mpdx.org/graphql'
+  API_URL: 'https://api.stage.mpdx.org/graphql'
   SITE_URL: 'http://next-stage.mpdx.org'
 
 jobs:

__tests__/util/TestWrapper.tsx

@@ -1,27 +1,53 @@
 import React, { ReactElement, ReactNode } from 'react';
-import { InMemoryCache } from '@apollo/client';
-import { MockedProvider, MockedResponse } from '@apollo/client/testing';
+import { ApolloLink, InMemoryCache } from '@apollo/client';
+import { onError } from '@apollo/client/link/error';
+import {
+  MockLink,
+  MockedProvider,
+  MockedResponse,
+} from '@apollo/client/testing';
 import { AdapterLuxon } from '@mui/x-date-pickers/AdapterLuxon';
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider';
 import { SnackbarProvider } from 'notistack';
 import TestRouter from './TestRouter';
 
+export type OnErrorFunction = (error: string) => void;
+
 interface Props {
   mocks?: MockedResponse[];
   children: ReactNode;
   cache?: InMemoryCache;
+  onErrorFunction?: OnErrorFunction;
 }
 
 const TestWrapper = ({
   mocks = [],
   children,
   cache = new InMemoryCache({ addTypename: false }),
+  onErrorFunction,
 }: Props): ReactElement => {
+  const mockLink = new MockLink(mocks);
+  const errorLoggingLink = onError(({ networkError }) => {
+    if (networkError) {
+      // eslint-disable-next-line no-console
+      console.warn(`[Network error]: ${networkError}`);
+      if (onErrorFunction) {
+        onErrorFunction(JSON.stringify(networkError.message));
+      }
+    }
+  });
+  const link = ApolloLink.from([errorLoggingLink, mockLink]);
+
   return (
     <TestRouter>
       <LocalizationProvider dateAdapter={AdapterLuxon}>
         <SnackbarProvider>
-          <MockedProvider mocks={mocks} cache={cache} addTypename={false}>
+          <MockedProvider
+            mocks={mocks}
+            cache={cache}
+            addTypename={false}
+            link={link}
+          >
             {children}
           </MockedProvider>
         </SnackbarProvider>

pages/accountLists/[accountListId]/contacts/Contacts.graphql

@@ -13,6 +13,7 @@ query Contacts(
     nodes {
       id
       avatar
+      contactPhase
       ...ContactRow
     }
     totalCount

pages/accountLists/[accountListId]/contacts/flows/setup.page.tsx

@@ -12,7 +12,6 @@
 import {
   ContactFlowOption,
   colorMap,
-  statusMap,
 } from 'src/components/Contacts/ContactFlow/ContactFlow';
 import { ContactFlowSetupColumn } from 'src/components/Contacts/ContactFlow/ContactFlowSetup/Column/ContactFlowSetupColumn';
 import { UnusedStatusesColumn } from 'src/components/Contacts/ContactFlow/ContactFlowSetup/Column/UnusedStatusesColumn';
@@ -24,9 +23,11 @@
   GetUserOptionsQuery,
   useGetUserOptionsQuery,
 } from 'src/components/Contacts/ContactFlow/GetUserOptions.generated';
+import { getDefaultFlowOptions } from 'src/components/Contacts/ContactFlow/contactFlowDefaultOptions';
 import Loading from 'src/components/Loading';
 import { ContactFilterStatusEnum } from 'src/graphql/types.generated';
 import { useAccountListId } from 'src/hooks/useAccountListId';
+import { useContactPartnershipStatuses } from 'src/hooks/useContactPartnershipStatuses';
 import useGetAppSettings from 'src/hooks/useGetAppSettings';
 import theme from 'src/theme';
 
@@ -41,6 +42,7 @@
 const ContactFlowSetupPage: React.FC = () => {
   const { t } = useTranslation();
   const accountListId = useAccountListId();
+  const { statusMap, contactStatuses } = useContactPartnershipStatuses();
   const { enqueueSnackbar } = useSnackbar();
   const [flowOptions, setFlowOptions] = useState<
     {
@@ -50,14 +52,21 @@
       id: string;
     }[]
   >([]);
+  const resetColumnsMessage = t(
+    'Since all columns have been removed, resetting columns to their default values',
+  );
   const { data: userOptions, loading } = useGetUserOptionsQuery();
 
   useEffect(() => {
     const newOptions = JSON.parse(
       userOptions?.userOptions.find((option) => option.key === 'flows')
         ?.value || '[]',
     );
-    setFlowOptions(newOptions);
+    if (!newOptions.length) {
+      setFlowOptions(getDefaultFlowOptions(t, contactStatuses));
+    } else {
+      setFlowOptions(newOptions);
+    }
   }, [userOptions]);
 
   const [updateUserOptions] = useUpdateUserOptionsMutation();
@@ -70,43 +79,46 @@
     (status) => !allUsedStatuses.includes(status),
   );
 
-  const updateOptions = async (options: ContactFlowOption[]): Promise<void> => {
-    const stringified = JSON.stringify(options);
-    await updateUserOptions({
-      variables: {
-        key: 'flows',
-        value: stringified,
-      },
-      update: (cache, { data: updatedUserOption }) => {
-        const query = {
-          query: GetUserOptionsDocument,
-        };
-        const dataFromCache = cache.readQuery<GetUserOptionsQuery>(query);
-
-        if (dataFromCache) {
-          const filteredOld = dataFromCache.userOptions.filter(
-            (option) => option.key !== 'flows',
-          );
-          const userOptions = [
-            ...filteredOld,
-            {
-              __typename: 'Option',
-              id: updatedUserOption?.createOrUpdateUserOption?.option.id,
-              key: 'flows',
-              value: stringified,
-            },
-          ];
-          const data = {
-            userOptions,
+  const updateOptions = useCallback(
+    async (options: ContactFlowOption[]): Promise<void> => {
+      const stringified = JSON.stringify(options);
+      await updateUserOptions({
+        variables: {
+          key: 'flows',
+          value: stringified,
+        },
+        update: (cache, { data: updatedUserOption }) => {
+          const query = {
+            query: GetUserOptionsDocument,
           };
-          cache.writeQuery({ ...query, data });
-        }
-        enqueueSnackbar(t('User options updated!'), {
-          variant: 'success',
-        });
-      },
-    });
-  };
+          const dataFromCache = cache.readQuery<GetUserOptionsQuery>(query);
+
+          if (dataFromCache) {
+            const filteredOld = dataFromCache.userOptions.filter(
+              (option) => option.key !== 'flows',
+            );
+
+            const data = {
+              userOptions: [
+                ...filteredOld,
+                {
+                  __typename: 'Option',
+                  id: updatedUserOption?.createOrUpdateUserOption?.option.id,
+                  key: 'flows',
+                  value: stringified,
+                },
+              ],
+            };
+            cache.writeQuery({ ...query, data });
+          }
+          enqueueSnackbar(t('User options updated!'), {
+            variant: 'success',
+          });
+        },
+      });
+    },
+    [],
+  );
 
   const addColumn = (): Promise<void> => {
     return updateOptions([
@@ -123,6 +135,12 @@
   const deleteColumn = (index: number): void => {
     const temp = [...flowOptions];
     temp.splice(index, 1);
+
+    if (!temp.length) {
+      enqueueSnackbar(resetColumnsMessage, {
+        variant: 'warning',
+      });
+    }
     updateOptions(temp);
   };
 
@@ -196,7 +214,11 @@
         <DndProvider backend={HTML5Backend}>
           {!loading && <ContactFlowSetupDragLayer />}
           <Box>
-            <ContactFlowSetupHeader addColumn={addColumn} />
+            <ContactFlowSetupHeader
+              addColumn={addColumn}
+              updateOptions={updateOptions}
+              resetColumnsMessage={resetColumnsMessage}
+            />
             {flowOptions && (
               <Box
                 display="grid"

pages/accountLists/[accountListId]/tasks/[[...contactId]].page.tsx

@@ -414,6 +414,7 @@ const TasksPage: React.FC = () => {
                             onTaskCheckToggle={toggleSelectionById}
                             isChecked={isRowChecked(task.id)}
                             useTopMargin={index === 0}
+                            contactDetailsOpen={contactDetailsOpen}
                           />
                         </Box>
                       )}

pages/api/Schema/AccountListAnalytics/accountListAnalytics.graphql

@@ -16,6 +16,21 @@ type AccountListAnalytics {
   textMessage: TextMessageAccountListAnalytics!
   startDate: ISO8601DateTime!
   endDate: ISO8601DateTime!
+  contactsByStatus: ContactsByStatus!
+}
+
+type ContactsByStatus {
+  neverContacted: Int!
+  future: Int!
+  cultivate: Int!
+  contactForAppointment: Int!
+  appointmentScheduled: Int!
+  callForDecision: Int!
+  financial: Int!
+  special: Int!
+  prayer: Int!
+  connectionsRemaining: Int!
+  initiations: Int!
 }
 
 type AppointmentsAccountListAnalytics {

pages/api/Schema/AccountListAnalytics/dataHandler.ts

@@ -48,6 +48,19 @@ const getAccountListAnalytics = (data: {
     };
     updated_at: string;
     updated_in_db_at: string;
+    contacts_by_status: {
+      never_contacted: number;
+      future: number;
+      cultivate: number;
+      contact_for_appointment: number;
+      appointment_scheduled: number;
+      call_for_decision: number;
+      financial: number;
+      special: number;
+      prayer: number;
+      connections_remaining: number;
+      initiations: number;
+    };
   };
 }): AccountListAnalytics => {
   const {
@@ -62,6 +75,7 @@ const getAccountListAnalytics = (data: {
       text_message,
       start_date: startDate,
       end_date: endDate,
+      contacts_by_status,
     },
   } = data;
 
@@ -89,6 +103,19 @@ const getAccountListAnalytics = (data: {
       received: phone.received,
       talkToInPerson: phone.talktoinperson,
     },
+    contactsByStatus: {
+      neverContacted: contacts_by_status.never_contacted,
+      future: contacts_by_status.future,
+      cultivate: contacts_by_status.cultivate,
+      contactForAppointment: contacts_by_status.contact_for_appointment,
+      appointmentScheduled: contacts_by_status.appointment_scheduled,
+      callForDecision: contacts_by_status.call_for_decision,
+      financial: contacts_by_status.financial,
+      special: contacts_by_status.special,
+      prayer: contacts_by_status.prayer,
+      connectionsRemaining: contacts_by_status.connections_remaining,
+      initiations: contacts_by_status.initiations,
+    },
     textMessage: text_message,
     startDate,
     endDate,

pages/api/graphql-rest.page.ts

@@ -12,6 +12,8 @@ import {
   ExportLabelTypeEnum,
   ExportSortEnum,
 } from 'src/graphql/types.generated';
+import i18n from 'src/lib/i18n';
+import { getLocalizedContactStatus } from '../../src/utils/functions/getLocalizedContactStatus';
 import schema from './Schema';
 import { getAccountListAnalytics } from './Schema/AccountListAnalytics/dataHandler';
 import { getAccountListCoaches } from './Schema/AccountListCoaches/dataHandler';
@@ -577,37 +579,9 @@ class MpdxRestApi extends RESTDataSource {
 
         // Status
         case 'status':
-          const statusMap = new Map<ContactFilterStatusEnum, string>([
-            [ContactFilterStatusEnum.Active, 'active'],
-            [ContactFilterStatusEnum.Hidden, 'hidden'],
-            [ContactFilterStatusEnum.Null, 'null'],
-            [
-              ContactFilterStatusEnum.AppointmentScheduled,
-              'Appointment Scheduled',
-            ],
-            [ContactFilterStatusEnum.AskInFuture, 'Ask in Future'],
-            [ContactFilterStatusEnum.CallForDecision, 'Call for Decision'],
-            [
-              ContactFilterStatusEnum.ContactForAppointment,
-              'Contact for Appointment',
-            ],
-            [
-              ContactFilterStatusEnum.CultivateRelationship,
-              'Cultivate Relationship',
-            ],
-            [ContactFilterStatusEnum.ExpiredReferral, 'Expired Referral'],
-            [ContactFilterStatusEnum.NeverAsk, 'Never Ask'],
-            [ContactFilterStatusEnum.NeverContacted, 'Never Contacted'],
-            [ContactFilterStatusEnum.NotInterested, 'Not Interested'],
-            [ContactFilterStatusEnum.PartnerFinancial, 'Partner - Financial'],
-            [ContactFilterStatusEnum.PartnerPray, 'Partner - Pray'],
-            [ContactFilterStatusEnum.PartnerSpecial, 'Partner - Special'],
-            [ContactFilterStatusEnum.ResearchAbandoned, 'Research Abandoned'],
-            [ContactFilterStatusEnum.Unresponsive, 'Unresponsive'],
-          ]);
           filters[snakedKey] = (value as ContactFilterStatusEnum[])
             .map((status) => {
-              const translated = statusMap.get(status);
+              const translated = getLocalizedContactStatus(i18n.t, status);
               if (!translated) {
                 throw new Error(
                   `Unrecognized ContactFilterStatusEnum value ${value}`,

src/components/Coaching/CoachingDetail/Activity/Activity.graphql

@@ -39,5 +39,18 @@ query CoachingDetailActivity($accountListId: ID!, $dateRange: String!) {
       received
       sent
     }
+    contactsByStatus {
+      neverContacted
+      future
+      cultivate
+      contactForAppointment
+      appointmentScheduled
+      callForDecision
+      financial
+      special
+      prayer
+      connectionsRemaining
+      initiations
+    }
   }
 }