@@ -8,9 +8,20 @@ import ConfirmModal from '../../Utilities/ConfirmModal'
88import  TableCheckBox  from  '../../Utilities/TableCheckBox' 
99import  'react-multiple-select-dropdown-lite/dist/index.css' 
1010import  {  getAllTags  }  from  './GetResponseCommonFunc' 
11+ import  {  useRecoilValue  }  from  'recoil' 
12+ import  {  $btcbi  }  from  '../../../GlobalStates' 
13+ 
14+ export  default  function  GetResponseActions ( { 
15+   getResponseConf, 
16+   setGetResponseConf, 
17+   formFields, 
18+   loading, 
19+   setLoading
20+ } )  { 
21+   const  [ actionMdl ,  setActionMdl ]  =  useState ( {  show : false ,  action : ( )  =>  { }  } ) 
22+   const  btcbi  =  useRecoilValue ( $btcbi ) 
23+   const  {  isPro }  =  btcbi 
1124
12- export  default  function  GetResponseActions ( {  getResponseConf,  setGetResponseConf,  formFields,  loading,  setLoading } )  { 
13-   const  [ actionMdl ,  setActionMdl ]  =  useState ( {  show : false ,  action : ( )  =>  {  }  } ) 
1425  const  actionHandler  =  ( e ,  type )  =>  { 
1526    const  newConf  =  {  ...getResponseConf  } 
1627    if  ( type  ===  'tag' )  { 
@@ -22,31 +33,71 @@ export default function GetResponseActions({ getResponseConf, setGetResponseConf
2233        delete  newConf . actions . tags 
2334      } 
2435      setActionMdl ( {  show : 'tag'  } ) 
25-     } 
26-     if  ( type  ===  'update' )  { 
36+     }  else  if  ( type  ===  'update' )  { 
2737      if  ( e . target . checked )  { 
2838        newConf . actions . update  =  true 
2939      }  else  { 
3040        delete  newConf . actions . update 
3141      } 
42+     }  else  if  ( type  ===  'dayOfCycle' )  { 
43+       if  ( e . target . checked )  { 
44+         newConf . actions . dayOfCycle  =  true 
45+       }  else  { 
46+         delete  newConf . actions . dayOfCycle 
47+       } 
48+       setActionMdl ( {  show : 'dayOfCycle'  } ) 
3249    } 
50+ 
3351    setGetResponseConf ( {  ...newConf  } ) 
3452  } 
3553
3654  const  clsActionMdl  =  ( )  =>  { 
3755    setActionMdl ( {  show : false  } ) 
3856  } 
3957
40-   const  setChanges  =  ( val )  =>  { 
58+   const  setChanges  =  ( val ,   name )  =>  { 
4159    const  newConf  =  {  ...getResponseConf  } 
42-     newConf [ 'selectedTags' ]  =  val 
60+     if  ( name  ===  'selectedTags' )  { 
61+       newConf [ 'selectedTags' ]  =  val 
62+     }  else  if  ( name  ===  'dayOfCycle' )  { 
63+       newConf [ 'dayOfCycle' ]  =  val 
64+     } 
4365    setGetResponseConf ( {  ...newConf  } ) 
4466  } 
4567
4668  return  ( 
4769    < div  className = "pos-rel d-flx w-8" > 
48-       < TableCheckBox  checked = { getResponseConf ?. selectedTags . length  ||  false }  onChange = { ( e )  =>  actionHandler ( e ,  'tag' ) }  className = "wdt-200 mt-4 mr-2"  value = "tag"  title = { __ ( 'Add Tags' ,  'bit-integrations' ) }  subTitle = { __ ( 'Add tags contact' ,  'bit-integrations' ) }  /> 
49-       < TableCheckBox  checked = { getResponseConf . actions ?. update  ||  false }  onChange = { ( e )  =>  actionHandler ( e ,  'update' ) }  className = "wdt-200 mt-4 mr-2"  value = "update_contact"  title = { __ ( 'Update Contact' ,  'bit-integrations' ) }  subTitle = { __ ( 'Update Responses with GetResponse exist contact?' ,  'bit-integrations' ) }  /> 
70+       < TableCheckBox 
71+         checked = { getResponseConf ?. selectedTags . length  ||  false } 
72+         onChange = { ( e )  =>  actionHandler ( e ,  'tag' ) } 
73+         className = "wdt-200 mt-4 mr-2" 
74+         value = "tag" 
75+         title = { __ ( 'Add Tags' ,  'bit-integrations' ) } 
76+         subTitle = { __ ( 'Add tags contact' ,  'bit-integrations' ) } 
77+       /> 
78+       < TableCheckBox 
79+         checked = { getResponseConf . actions ?. update  ||  false } 
80+         onChange = { ( e )  =>  actionHandler ( e ,  'update' ) } 
81+         className = "wdt-200 mt-4 mr-2" 
82+         value = "update_contact" 
83+         title = { __ ( 'Update Contact' ,  'bit-integrations' ) } 
84+         subTitle = { __ ( 'Update Responses with GetResponse exist contact?' ,  'bit-integrations' ) } 
85+       /> 
86+       { 
87+         < TableCheckBox 
88+           checked = { getResponseConf ?. dayOfCycle  ||  false } 
89+           onChange = { ( e )  =>  actionHandler ( e ,  'dayOfCycle' ) } 
90+           className = "wdt-200 mt-4 mr-2" 
91+           value = "dayOfCycle" 
92+           title = { __ ( `Autoresponder day ${ ! isPro  ? '(Pro)'  : '' }  ,  'bit-integrations' ) } 
93+           subTitle = { __ ( 
94+             `${ isPro  ? 'The day on which the contact is in the Autoresponder cycle'  : 'The Bit Integration Pro v(2.1.9) plugin needs to be installed and activated to enable the Autoresponder day feature' }  , 
95+             'bit-integrations' 
96+           ) } 
97+           isInfo = { ! isPro } 
98+         /> 
99+       } 
100+ 
50101      < ConfirmModal 
51102        className = "custom-conf-mdl" 
52103        mainMdlCls = "o-v" 
@@ -55,35 +106,62 @@ export default function GetResponseActions({ getResponseConf, setGetResponseConf
55106        show = { actionMdl . show  ===  'tag' } 
56107        close = { clsActionMdl } 
57108        action = { clsActionMdl } 
58-         title = { __ ( 'Tags' ,  'bit-integrations' ) } 
59-       > 
109+         title = { __ ( 'Tags' ,  'bit-integrations' ) } > 
60110        < div  className = "btcd-hr mt-2 mb-2"  /> 
61111        < div  className = "mt-2" > { __ ( 'Select contact Tags' ,  'bit-integrations' ) } </ div > 
62-         { 
63-           loading . tags  ?  ( 
64-             < Loader   style = { { 
112+         { loading . tags  ?  ( 
113+           < Loader 
114+             style = { { 
65115              display : 'flex' , 
66116              justifyContent : 'center' , 
67117              alignItems : 'center' , 
68118              height : 45 , 
69-               transform : 'scale(0.5)' , 
119+               transform : 'scale(0.5)' 
70120            } } 
121+           /> 
122+         )  : ( 
123+           < div  className = "flx flx-between mt-2" > 
124+             < MultiSelect 
125+               options = { getResponseConf ?. tags ?. map ( ( tag )  =>  ( {  label : tag . name ,  value : tag . tagId  } ) ) } 
126+               className = "msl-wrp-options" 
127+               defaultValue = { getResponseConf ?. selectedTags } 
128+               onChange = { ( val )  =>  setChanges ( val ,  'selectedTags' ) } 
71129            /> 
72-           ) 
73-             : ( 
74-               < div  className = "flx flx-between mt-2" > 
75-                 < MultiSelect 
76-                   options = { getResponseConf ?. tags ?. map ( tag  =>  ( {  label : tag . name ,  value : tag . tagId  } ) ) } 
77-                   className = "msl-wrp-options" 
78-                   defaultValue = { getResponseConf ?. selectedTags } 
79-                   onChange = { val  =>  setChanges ( val ) } 
80-                 /> 
81-                 < button  onClick = { ( )  =>  getAllTags ( getResponseConf ,  setGetResponseConf ,  setLoading ) }  className = "icn-btn sh-sm ml-2 mr-2 tooltip"  style = { {  '--tooltip-txt' : `${ __ ( 'Refresh Groups' ,  'bit-integrations' ) }   } }  type = "button" > ↻</ button > 
82-               </ div > 
83-             ) } 
84- 
130+             < button 
131+               onClick = { ( )  =>  getAllTags ( getResponseConf ,  setGetResponseConf ,  setLoading ) } 
132+               className = "icn-btn sh-sm ml-2 mr-2 tooltip" 
133+               style = { {  '--tooltip-txt' : `${ __ ( 'Refresh Groups' ,  'bit-integrations' ) }   } } 
134+               type = "button" > 
135+               ↻
136+             </ button > 
137+           </ div > 
138+         ) } 
85139      </ ConfirmModal > 
86140
141+       { isPro  &&  ( 
142+         < ConfirmModal 
143+           className = "custom-conf-mdl" 
144+           mainMdlCls = "o-v" 
145+           btnClass = "purple" 
146+           btnTxt = { __ ( 'Ok' ,  'bit-integrations' ) } 
147+           show = { actionMdl . show  ===  'dayOfCycle' } 
148+           close = { clsActionMdl } 
149+           action = { clsActionMdl } 
150+           title = { __ ( 'Autoresponder day' ,  'bit-integrations' ) } > 
151+           < div  className = "btcd-hr mt-2 mb-2"  /> 
152+           < div  className = "mt-3" > 
153+             < b > { __ ( 'Autoresponder day' ,  'bit-integrations' ) } </ b > 
154+           </ div > 
155+           < input 
156+             className = "btcd-paper-inp mt-1" 
157+             onChange = { ( e )  =>  setChanges ( e . target . value ,  'dayOfCycle' ) } 
158+             type = "number" 
159+             name = "dayOfCycle" 
160+             value = { getResponseConf . dayOfCycle } 
161+             placeholder = { __ ( 'Autoresponder day...' ,  'bit-integrations' ) } 
162+           /> 
163+         </ ConfirmModal > 
164+       ) } 
87165    </ div > 
88166  ) 
89167} 
0 commit comments