Merge pull request #144 from glific/enhancement/skip-validation

skipping validation for flow results

Author: akanshaaa19

package.json

@@ -2,7 +2,7 @@
   "name": "@glific/flow-editor",
   "license": "AGPL-3.0",
   "repository": "git://github.com/glific/floweditor.git",
-  "version": "1.26.3-21",
+  "version": "1.26.3-22",
   "description": "'Standalone flow editing tool designed for use within the Glific suite of messaging tools'",
   "browser": "umd/flow-editor.min.js",
   "unpkg": "umd/flow-editor.min.js",

public/index.html

@@ -300,6 +300,7 @@
       showNodeLabel: true,
       mutable: true,
       filters: ['whatsapp', 'classifier', 'ticketer', 'optins', 'groups'],
+      skipValidation: false,
 
       excludeTypes: [
         'add_contact_urn',

src/components/flow/actions/sendmsg/SendMsgForm.module.scss

@@ -1,9 +1,5 @@
 @import 'variables.module.scss';
 
-.checkbox {
-  margin-top: 20px;
-}
-
 .quick_reply_summary {
   margin-top: -20px;
   position: relative;

src/components/flow/actions/sendmsg/SendMsgForm.tsx

@@ -21,6 +21,7 @@ import { Template, TemplateTranslation } from 'flowTypes';
 import mutate from 'immutability-helper';
 import * as React from 'react';
 import { Asset } from 'store/flowContext';
+
 import {
   FormState,
   mergeForm,
@@ -62,6 +63,7 @@ export interface SendMsgFormState extends FormState {
   templateTranslation?: TemplateTranslation;
   labels?: any;
   expression?: any;
+  skipValidation?: boolean;
 }
 
 // this is an additonal item in templates that need to have a same format as other list items
@@ -80,9 +82,9 @@ const additionalOption = {
 export default class SendMsgForm extends React.Component<ActionFormProps, SendMsgFormState> {
   private timeout: any;
 
-  constructor(props: ActionFormProps) {
+  constructor(props: ActionFormProps, context: any) {
     super(props);
-    this.state = stateToForm(this.props.nodeSettings, this.props.assetStore);
+    this.state = stateToForm(this.props.nodeSettings, context.config);
     bindCallbacks(this, {
       include: [/^handle/, /^on/]
     });
@@ -113,13 +115,17 @@ export default class SendMsgForm extends React.Component<ActionFormProps, SendMs
   ): boolean {
     const updates: Partial<SendMsgFormState> = {};
     if (keys.hasOwnProperty('text')) {
-      updates.message = validate(i18n.t('forms.message', 'Message'), keys.text, [
-        validateIf(ValidField(this.props.assetStore), submitting),
+      let validatorFuncs = [
         shouldRequireIf(
           submitting && !this.state.template.value && this.state.attachments.length === 0
         ),
         CharactersLessThan(4096, '4096 characters')
-      ]);
+      ];
+
+      if (!this.state.skipValidation) {
+        validatorFuncs.push(validateIf(ValidField(this.props.assetStore), submitting));
+      }
+      updates.message = validate(i18n.t('forms.message', 'Message'), keys.text, validatorFuncs);
     }
 
     if (keys.hasOwnProperty('template')) {

src/components/flow/actions/sendmsg/__snapshots__/SendMsgForm.test.ts.snap

@@ -264,6 +264,7 @@ Object {
     "value": "",
   },
   "sendAll": true,
+  "skipValidation": false,
   "template": Object {
     "value": null,
   },

src/components/flow/actions/sendmsg/helpers.ts

@@ -2,8 +2,7 @@
 import { getActionUUID } from 'components/flow/actions/helpers';
 import { SendMsgFormState } from 'components/flow/actions/sendmsg/SendMsgForm';
 import { Types } from 'config/interfaces';
-import { Label, MsgTemplating, SendMsg } from 'flowTypes';
-import { AssetStore } from 'store/flowContext';
+import { FlowEditorConfig, Label, MsgTemplating, SendMsg } from 'flowTypes';
 import { FormEntry, NodeEditorSettings, StringEntry } from 'store/nodeEditor';
 import { SelectOption } from 'components/form/select/SelectElement';
 import { createUUID } from 'utils';
@@ -18,10 +17,11 @@ export const TOPIC_OPTIONS: SelectOption[] = [
 
 export const initializeForm = (
   settings: NodeEditorSettings,
-  assetStore: AssetStore
+  config: FlowEditorConfig
 ): SendMsgFormState => {
   let template: FormEntry = { value: null };
   let templateVariables: StringEntry[] = [];
+  let skipValidation = false;
 
   if (settings.originalAction && settings.originalAction.type === Types.send_msg) {
     const action = settings.originalAction as SendMsg;
@@ -68,6 +68,10 @@ export const initializeForm = (
         })
       : [];
 
+    if (config.skipValidation) {
+      skipValidation = config.skipValidation;
+    }
+
     return {
       expression: expressionValue,
       topic: { value: TOPIC_OPTIONS.find(option => option.value === action.topic) },
@@ -83,7 +87,8 @@ export const initializeForm = (
       quickReplies: { value: action.quick_replies || [] },
       quickReplyEntry: { value: '' },
       sendAll: action.all_urns,
-      valid: true
+      valid: true,
+      skipValidation
     };
   }
 
@@ -136,7 +141,6 @@ export const stateToAction = (settings: NodeEditorSettings, state: SendMsgFormSt
       templating.expression = state.expression.value;
     }
   }
-
   const result: SendMsg = {
     attachments,
     text: state.message.value,

src/flowTypes.ts

@@ -83,6 +83,7 @@ export interface FlowEditorConfig {
   excludeTypes?: string[];
 
   excludeOperators?: string[];
+  skipValidation?: boolean;
 }
 
 export interface LocalizationMap {
@@ -397,6 +398,7 @@ export interface SendMsg extends Action {
   topic?: string;
   templating?: MsgTemplating;
   labels?: Label[];
+  skipValidation?: boolean;
 }
 
 export interface SendInteractiveMsg extends Action {