Merge branch 'master' into bug_bash_1125

Author: priyanshu6238

package.json

@@ -1,6 +1,6 @@
 {
   "name": "glific-frontend",
-  "version": "6.7.8",
+  "version": "6.7.9",
   "private": true,
   "type": "module",
   "license": {
@@ -21,7 +21,7 @@
     "@emoji-mart/react": "^1.1.1",
     "@emotion/react": "^11.14.0",
     "@emotion/styled": "^11.14.1",
-    "@glific/flow-editor": "1.43.0-7",
+    "@glific/flow-editor": "1.43.0-8",
     "@lexical/react": "^0.33.0",
     "@mui/icons-material": "^7.2.0",
     "@mui/material": "^7.2.0",

src/common/HelpData.tsx

@@ -142,5 +142,5 @@ export const certificatesInfo: HelpDataProps = {
 
 export const whatsappFormsInfo: HelpDataProps = {
   heading: 'An overview of all the whatsapp forms created to date',
-  link: 'https://glific.github.io/docs/docs/Product%20Features/Custom%20Certificates',
+  link: 'https://glific.github.io/docs/docs/Product%20Features/WhatsApp%20Forms',
 };

src/common/constants.ts

@@ -185,6 +185,12 @@ export const LOCATION_REQUEST = 'LOCATION_REQUEST_MESSAGE';
 export const TERMS_OF_USE_LINK = 'https://glific.org/glific-terms-and-conditions/';
 export const COMPACT_MESSAGE_LENGTH = 35;
 
+export const BUTTON_OPTIONS: any = [
+  { id: 'CALL_TO_ACTION', label: 'Call to Action' },
+  { id: 'QUICK_REPLY', label: 'Quick Reply' },
+  { id: 'WHATSAPP_FORM', label: 'WhatsApp Form' },
+];
+
 // Gupshup sample media
 export const SAMPLE_MEDIA_FOR_SIMULATOR = [
   {

src/components/floweditor/FlowEditor.helper.tsx

@@ -17,7 +17,7 @@ export const setConfig = (uuid: any, skipValidation: boolean, isReadOnly: boolea
     mutable: !isReadOnly,
     showNodeLabel: false,
     attachmentsEnabled: false,
-    filters: ['whatsapp', 'classifier'],
+    filters: ['whatsapp', 'classifier', 'start_session'],
     skipValidation: skipValidation,
 
     excludeTypes: ['add_contact_urn', 'send_email', 'call_resthook', 'transfer_airtime', 'split_by_scheme'],

src/containers/HSM/HSM.test.tsx

@@ -1,4 +1,4 @@
-import { render, waitFor, within, fireEvent, screen, cleanup } from '@testing-library/react';
+import { render, waitFor, within, fireEvent, screen } from '@testing-library/react';
 import { MockedProvider } from '@apollo/client/testing';
 import userEvent from '@testing-library/user-event';
 import { MemoryRouter, Route, Routes } from 'react-router';
@@ -12,6 +12,7 @@ import {
 import { WHATSAPP_FORM_MOCKS } from 'mocks/WhatsAppForm';
 import { setNotification } from 'common/notification';
 import * as utilsModule from 'common/utils';
+import { setOrganizationServices } from 'services/AuthService';
 
 const mocks = HSM_TEMPLATE_MOCKS;
 
@@ -25,10 +26,6 @@ vi.mock('common/notification', async (importOriginal) => {
   };
 });
 
-beforeEach(() => {
-  cleanup();
-});
-
 vi.mock('lexical-beautiful-mentions', async (importOriginal) => {
   const actual = (await importOriginal()) as typeof import('lexical-beautiful-mentions');
   return {
@@ -195,6 +192,8 @@ describe('Add mode', () => {
   });
 
   test('it should create a hsm template with whatsapp form', async () => {
+    setOrganizationServices('{"__typename":"OrganizationServicesResult","whatsappFormsEnabled":true}');
+
     render(template);
 
     await waitFor(() => {
@@ -267,6 +266,22 @@ describe('Add mode', () => {
     });
   });
 
+  test('should not display WhatsApp Form when whatsappFormsEnabled is false', async () => {
+    setOrganizationServices('{"__typename":"OrganizationServicesResult","whatsappFormsEnabled":false}');
+
+    render(template);
+
+    await waitFor(() => {
+      expect(screen.getByText('Add a new HSM Template')).toBeInTheDocument();
+    });
+    fireEvent.click(screen.getByText('Add buttons'));
+
+    const combobox = screen.getAllByRole('combobox');
+    const buttonTypeCombo = combobox[1] as HTMLInputElement;
+    fireEvent.mouseDown(buttonTypeCombo);
+    expect(screen.queryByText('WhatsApp Form')).not.toBeInTheDocument();
+  });
+
   test('it adds quick reply buttons', async () => {
     render(template);
 

src/containers/HSM/HSM.tsx

@@ -8,7 +8,7 @@ import * as Yup from 'yup';
 
 import TemplateIcon from 'assets/images/icons/Template/UnselectedDark.svg?react';
 
-import { CALL_TO_ACTION, QUICK_REPLY } from 'common/constants';
+import { BUTTON_OPTIONS, CALL_TO_ACTION, QUICK_REPLY } from 'common/constants';
 import { validateMedia } from 'common/utils';
 import { AutoComplete } from 'components/UI/Form/AutoComplete/AutoComplete';
 import { Checkbox } from 'components/UI/Form/Checkbox/Checkbox';
@@ -60,12 +60,6 @@ const buttonTypes: any = {
   WHATSAPP_FORM: { type: 'whatsapp_form', form_id: '', text: '', navigate_screen: '' },
 };
 
-export const buttonOptions: any = [
-  { id: 'CALL_TO_ACTION', label: 'Call to Action' },
-  { id: 'QUICK_REPLY', label: 'Quick Reply' },
-  { id: 'WHATSAPP_FORM', label: 'WhatsApp Form' },
-];
-
 export const HSM = () => {
   const location: any = useLocation();
   const [language, setLanguageId] = useState<any>(null);
@@ -89,7 +83,7 @@ export const HSM = () => {
   const [languageOptions, setLanguageOptions] = useState<any>([]);
   const [validatingURL, setValidatingURL] = useState<boolean>(false);
   const [isUrlValid, setIsUrlValid] = useState<any>();
-  const [templateType, setTemplateType] = useState<any>(buttonOptions[0]);
+  const [templateType, setTemplateType] = useState<any>(BUTTON_OPTIONS[0]);
   const [dynamicUrlParams, setDynamicUrlParams] = useState<any>({
     urlType: 'Static',
     sampleSuffix: '',
@@ -334,7 +328,7 @@ export const HSM = () => {
     if (hasButtons) {
       const { buttons: buttonsVal } = getTemplateAndButtons(templateButtonType, exampleValue, buttons);
       setTemplateButtons(buttonsVal);
-      setTemplateType(buttonOptions.find((btn: any) => btn.id === templateButtonType));
+      setTemplateType(BUTTON_OPTIONS.find((btn: any) => btn.id === templateButtonType));
       setIsAddButtonChecked(hasButtons);
       const parse = convertButtonsToTemplate(buttonsVal, templateButtonType);
       const parsedText = parse.length ? `| ${parse.join(' | ')}` : null;

src/containers/TemplateOptions/TemplateOptions.tsx

@@ -22,12 +22,13 @@ import {
   QUICK_REPLY,
   WHATSAPP_FORM,
   GUPSHUP_WHATSAPP_FORM,
+  BUTTON_OPTIONS,
 } from 'common/constants';
 import styles from './TemplateOptions.module.css';
 import { Fragment, useState } from 'react';
-import { buttonOptions } from 'containers/HSM/HSM';
 import { useQuery } from '@apollo/client';
 import { LIST_WHATSAPP_FORMS } from 'graphql/queries/WhatsAppForm';
+import { getOrganizationServices } from 'services/AuthService';
 
 export interface TemplateOptionsProps {
   isAddButtonChecked: boolean;
@@ -80,6 +81,12 @@ export const TemplateOptions = ({
   const { urlType, sampleSuffix } = dynamicUrlParams;
   const [screens, setScreens] = useState<any>([]);
 
+  const isWhatsAppFormEnabled = getOrganizationServices('whatsappFormsEnabled');
+  let buttonOptions = BUTTON_OPTIONS;
+  if (!isWhatsAppFormEnabled) {
+    buttonOptions = BUTTON_OPTIONS.filter((option: any) => option.id !== WHATSAPP_FORM);
+  }
+
   useQuery(LIST_WHATSAPP_FORMS, {
     variables: {
       filter: { status: 'PUBLISHED' },
@@ -351,7 +358,6 @@ export const TemplateOptions = ({
               value={navigate_screen}
               renderInput={(params) => <TextField {...params} label="Screen Name" />}
               onChange={(event: any, newValue: any) => {
-                console.log(newValue);
                 onInputChange(newValue.id, row, index, 'navigate_screen');
               }}
               disabled={disabled || !form_id}

yarn.lock

@@ -678,10 +678,10 @@
   resolved "https://registry.yarnpkg.com/@floating-ui/utils/-/utils-0.2.10.tgz#a2a1e3812d14525f725d011a73eceb41fef5bc1c"
   integrity sha512-aGTxbpbg8/b5JfU1HXSrbH3wXZuLPJcNEcZQFMxLs3oSzgtVu6nFPkbbGGUvBcUjKV2YyB9Wxxabo+HEH9tcRQ==
 
-"@glific/flow-editor@1.43.0-7":
-  version "1.43.0-7"
-  resolved "https://registry.yarnpkg.com/@glific/flow-editor/-/flow-editor-1.43.0-7.tgz#864725764e89f4ab88e06f8b83a7b9de13c7317b"
-  integrity sha512-pdb9fU4eVHK1IXeZLmUZcZnTb07ViDvdN0kDuAdFC/Nrbx1W4CzFtQ4Vve2cop79ZkYWblUCxzYz0gB39CPZcw==
+"@glific/flow-editor@1.43.0-8":
+  version "1.43.0-8"
+  resolved "https://registry.yarnpkg.com/@glific/flow-editor/-/flow-editor-1.43.0-8.tgz#5e4384210b34651c4569f3124a8ec02294788c04"
+  integrity sha512-0Fq/WkJjRwuMdReHFeyE1RtkbSAuDZt48BR/HcTxvVvrLIbu84wshvwBFqrusm/4SY1fEpeGHVGPOXvj0dPLng==
   dependencies:
     "@nyaruka/temba-components" "0.120.4"
     react "^16.8.6"