@@ -18,7 +18,7 @@ import {
18
18
import { AUDIENCE_DONATIONS_WIZARD_SLUG } from '../../constants' ;
19
19
20
20
export const CoverFeesSettings = ( ) => {
21
- const { additional_settings : settings = { } } = Wizard . useWizardData ( AUDIENCE_DONATIONS_WIZARD_SLUG ) ;
21
+ const { additional_settings : settings = { } } = Wizard . useWizardData ( AUDIENCE_DONATIONS_WIZARD_SLUG ) ;
22
22
const { updateWizardSettings } = useDispatch ( Wizard . STORE_NAMESPACE ) ;
23
23
const changeHandler = ( key , value ) =>
24
24
updateWizardSettings ( {
@@ -36,60 +36,64 @@ export const CoverFeesSettings = () => {
36
36
} ) ;
37
37
38
38
return (
39
- < ActionCard
40
- isMedium
41
- title = { __ ( 'Collect transaction fees' , 'newspack-plugin' ) }
42
- description = { __ ( 'Allow donors to optionally cover transaction fees imposed by payment processors.' , 'newspack-plugin' ) }
43
- notificationLevel = "info"
44
- toggleChecked = { settings . allow_covering_fees }
45
- toggleOnChange = { ( ) => {
46
- changeHandler ( 'allow_covering_fees' , ! settings . allow_covering_fees ) ;
47
- onSave ( ) ;
48
- } }
49
- hasGreyHeader = { settings . allow_covering_fees }
50
- hasWhiteHeader = { ! settings . allow_covering_fees }
51
- actionContent = { settings . allow_covering_fees && (
52
- < Button isPrimary onClick = { onSave } >
53
- { __ ( 'Save Settings' , 'newspack-plugin' ) }
54
- </ Button >
55
- ) }
56
- >
57
- { settings . allow_covering_fees && (
58
- < Grid noMargin rowGap = { 16 } >
59
- < TextControl
60
- type = "number"
61
- step = "0.1"
62
- value = { settings . fee_multiplier }
63
- label = { __ ( 'Fee multiplier' , 'newspack-plugin' ) }
64
- onChange = { value => changeHandler ( 'fee_multiplier' , value ) }
65
- />
66
- < TextControl
67
- type = "number"
68
- step = "0.1"
69
- value = { settings . fee_static }
70
- label = { __ ( 'Fee static portion' , 'newspack-plugin' ) }
71
- onChange = { value => changeHandler ( 'fee_static' , value ) }
72
- />
73
- < TextControl
74
- value = { settings . allow_covering_fees_label }
75
- label = { __ ( 'Custom message' , 'newspack-plugin' ) }
76
- placeholder = { __ (
77
- 'A message to explain the transaction fee option (optional).' ,
78
- 'newspack-plugin'
79
- ) }
80
- onChange = { value => changeHandler ( 'allow_covering_fees_label' , value ) }
81
- />
82
- < CheckboxControl
83
- label = { __ ( 'Cover fees by default' , 'newspack-plugin' ) }
84
- checked = { settings . allow_covering_fees_default }
85
- onChange = { ( ) => changeHandler ( 'allow_covering_fees_default' , ! settings . allow_covering_fees_default ) }
86
- help = { __ (
87
- 'If enabled, the option to cover the transaction fee will be checked by default.' ,
88
- 'newspack-plugin'
89
- ) }
90
- />
91
- </ Grid >
92
- ) }
93
- </ ActionCard >
39
+ < >
40
+ < ActionCard
41
+ isMedium
42
+ title = { __ ( 'Collect transaction fees' , 'newspack-plugin' ) }
43
+ description = { __ ( 'Allow donors to optionally cover transaction fees imposed by payment processors.' , 'newspack-plugin' ) }
44
+ notificationLevel = "info"
45
+ toggleChecked = { settings . allow_covering_fees }
46
+ toggleOnChange = { ( ) => {
47
+ changeHandler ( 'allow_covering_fees' , ! settings . allow_covering_fees ) ;
48
+ onSave ( ) ;
49
+ } }
50
+ hasGreyHeader = { settings . allow_covering_fees }
51
+ hasWhiteHeader = { ! settings . allow_covering_fees }
52
+ >
53
+ { settings . allow_covering_fees && (
54
+ < Grid noMargin rowGap = { 16 } >
55
+ < TextControl
56
+ type = "number"
57
+ step = "0.1"
58
+ value = { settings . fee_multiplier }
59
+ label = { __ ( 'Fee multiplier' , 'newspack-plugin' ) }
60
+ onChange = { value => changeHandler ( 'fee_multiplier' , value ) }
61
+ />
62
+ < TextControl
63
+ type = "number"
64
+ step = "0.1"
65
+ value = { settings . fee_static }
66
+ label = { __ ( 'Fee static portion' , 'newspack-plugin' ) }
67
+ onChange = { value => changeHandler ( 'fee_static' , value ) }
68
+ />
69
+ < TextControl
70
+ value = { settings . allow_covering_fees_label }
71
+ label = { __ ( 'Custom message' , 'newspack-plugin' ) }
72
+ placeholder = { __ (
73
+ 'A message to explain the transaction fee option (optional).' ,
74
+ 'newspack-plugin'
75
+ ) }
76
+ onChange = { value => changeHandler ( 'allow_covering_fees_label' , value ) }
77
+ />
78
+ < CheckboxControl
79
+ label = { __ ( 'Cover fees by default' , 'newspack-plugin' ) }
80
+ checked = { settings . allow_covering_fees_default }
81
+ onChange = { ( ) => changeHandler ( 'allow_covering_fees_default' , ! settings . allow_covering_fees_default ) }
82
+ help = { __ (
83
+ 'If enabled, the option to cover the transaction fee will be checked by default.' ,
84
+ 'newspack-plugin'
85
+ ) }
86
+ />
87
+ </ Grid >
88
+ ) }
89
+ </ ActionCard >
90
+ { settings . allow_covering_fees && (
91
+ < div className = "newspack-buttons-card" >
92
+ < Button isPrimary onClick = { onSave } >
93
+ { __ ( 'Save Settings' , 'newspack-plugin' ) }
94
+ </ Button >
95
+ </ div >
96
+ ) }
97
+ </ >
94
98
) ;
95
99
}
0 commit comments