PluginProbe
Visualizer – Tables & Charts Manager with Built-in AI Generator / 3.3.0
Visualizer – Tables & Charts Manager with Built-in AI Generator v3.3.0
4.0.7 4.0.6 4.0.5 4.0.4 4.0.3 3.0.5 3.0.6 3.0.7 3.0.8 3.0.9 3.1.0 3.1.1 3.1.2 3.1.3 3.10.0 3.10.1 3.10.10 3.10.11 3.10.12 3.10.13 3.10.14 3.10.15 3.10.2 3.10.3 3.10.4 All 148 releases
visualizer / classes / Visualizer / Gutenberg / src / Components / ChartPermissions.js

ChartPermissions.js in Visualizer – Tables & Charts Manager with Built-in AI Generator 3.3.0, at classes/Visualizer/Gutenberg/src/Components/ChartPermissions.js

192 lines 4.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * WordPress dependencies
3 */
4 const { __ } = wp.i18n;
5
6 const { apiFetch } = wp;
7
8 const {
9 Component,
10 Fragment
11 } = wp.element;
12
13 const {
14 Button,
15 PanelBody,
16 SelectControl
17 } = wp.components;
18
19 class ChartPermissions extends Component {
20 constructor() {
21 super( ...arguments );
22
23 this.getPermissionData = this.getPermissionData.bind( this );
24
25 this.state = {
26 users: [],
27 roles: []
28 };
29 }
30
31 async componentDidMount() {
32 if ( 'business' === visualizerLocalize.isPro ) {
33 const permissions = this.props.chart['visualizer-permissions'];
34
35 if ( permissions.permissions !== undefined ) {
36 if ( permissions.permissions.read !== undefined && permissions.permissions.edit !== undefined ) {
37 if ( 'users' === permissions.permissions.read || 'users' === permissions.permissions.edit ) {
38 let data = await apiFetch({ path: '/visualizer/v1/get-permission-data?type=users' });
39 this.setState({ users: data });
40 }
41
42 if ( 'roles' === permissions.permissions.read || 'roles' === permissions.permissions.edit ) {
43 let data = await apiFetch({ path: '/visualizer/v1/get-permission-data?type=roles' });
44 this.setState({ roles: data });
45 }
46 }
47 }
48 }
49 }
50
51 async getPermissionData( type ) {
52 if ( 'business' === visualizerLocalize.isPro ) {
53 if ( 'users' === type && 0 === ( this.state.users ).length ) {
54 let data = await apiFetch({ path: `/visualizer/v1/get-permission-data?type=${type}` });
55 this.setState({ users: data });
56 }
57
58 if ( 'roles' === type && 0 === ( this.state.roles ).length ) {
59 let data = await apiFetch({ path: `/visualizer/v1/get-permission-data?type=${type}` });
60 this.setState({ roles: data });
61 }
62 }
63 }
64
65 render() {
66
67 let permissions;
68
69 if ( 'business' === visualizerLocalize.isPro ) {
70 permissions = this.props.chart['visualizer-permissions'];
71 }
72
73 return (
74 <Fragment>
75
76 { ( 'business' === visualizerLocalize.isPro ) ?
77 <PanelBody
78 title={ __( 'Who can see this chart?' ) }
79 initialOpen={ false }
80 >
81
82 <SelectControl
83 label={ __( 'Select who can view the chart on the front-end.' ) }
84 value={ permissions.permissions.read }
85 options={ [
86 { value: 'all', label: 'All Users' },
87 { value: 'users', label: 'Select Users' },
88 { value: 'roles', label: 'Select Roles' }
89 ] }
90 onChange={ e => {
91 permissions.permissions.read = e;
92 this.props.edit( permissions );
93 if ( 'users' === e || 'roles' === e ) {
94 this.getPermissionData( e );
95 }
96 } }
97 />
98
99 { ( 'users' === permissions.permissions.read || 'roles' === permissions.permissions.read ) &&
100 <SelectControl
101 multiple
102 value={ permissions.permissions['read-specific'] }
103 options={ 'users' === permissions.permissions.read && this.state.users || 'roles' === permissions.permissions.read && this.state.roles }
104 onChange={ e => {
105 permissions.permissions['read-specific'] = e;
106 this.props.edit( permissions );
107 } }
108 />
109 }
110
111 </PanelBody> :
112 <PanelBody
113 title={ __( 'Who can see this chart?' ) }
114 icon="lock"
115 initialOpen={ false }
116 >
117
118 <p>{ __( 'Enable this feature in BUSINESS version!' ) }</p>
119
120 <Button
121 isPrimary
122 href={ visualizerLocalize.proTeaser }
123 target="_blank"
124 >
125 { __( 'Buy Now' ) }
126 </Button>
127
128 </PanelBody>
129 }
130
131 { ( 'business' === visualizerLocalize.isPro ) ?
132 <PanelBody
133 title={ __( 'Who can edit this chart?' ) }
134 initialOpen={ false }
135 >
136
137 <SelectControl
138 label={ __( 'Select who can edit the chart on the front-end.' ) }
139 value={ permissions.permissions.edit }
140 options={ [
141 { value: 'all', label: 'All Users' },
142 { value: 'users', label: 'Select Users' },
143 { value: 'roles', label: 'Select Roles' }
144 ] }
145 onChange={ e => {
146 permissions.permissions.edit = e;
147 this.props.edit( permissions );
148 if ( 'users' === e || 'roles' === e ) {
149 this.getPermissionData( e );
150 }
151 } }
152 />
153
154 { ( 'users' === permissions.permissions.edit || 'roles' === permissions.permissions.edit ) &&
155 <SelectControl
156 multiple
157 value={ permissions.permissions['edit-specific'] }
158 options={ 'users' === permissions.permissions.edit && this.state.users || 'roles' === permissions.permissions.edit && this.state.roles }
159 onChange={ e => {
160 permissions.permissions['edit-specific'] = e;
161 this.props.edit( permissions );
162 } }
163 />
164 }
165
166 </PanelBody> :
167 <PanelBody
168 title={ __( 'Who can edit this chart?' ) }
169 icon="lock"
170 initialOpen={ false }
171 >
172
173 <p>{ __( 'Enable this feature in BUSINESS version!' ) }</p>
174
175 <Button
176 isPrimary
177 href={ visualizerLocalize.proTeaser }
178 target="_blank"
179 >
180 { __( 'Buy Now' ) }
181 </Button>
182
183 </PanelBody>
184 }
185
186 </Fragment>
187 );
188 }
189 }
190
191 export default ChartPermissions;
192