WP Ultimate Post Grid / 3.3.0

WP Ultimate Post Grid v3.3.0

wp-ultimate-post-grid / assets / js / admin-modal / grid / section / SectionDataSource.js

SectionDataSource.js in WP Ultimate Post Grid 3.3.0, at assets/js/admin-modal/grid/section/SectionDataSource.js

198 lines 8.7 KB

Raw Download Zip

1	import React, { Fragment } from 'react';
2
3	import Field from 'Modal/field';
4	import { __wpupg } from 'Shared/Translations';
5
6	const SectionDataSource = (props) => {
7	return (
8	<Fragment>
9	<Field
10	value={ props.grid.type }
11	onChange={ ( value ) => {
12	props.onGridChange({
13	type: value,
14	});
15	}}
16	type="dropdown"
17	label={ __wpupg( 'Type of Grid' ) }
18	options={[
19	{
20	value: 'posts',
21	label: __wpupg( 'Grid of Posts, Pages or Custom Post Types' ),
22	},
23	{
24	value: 'terms',
25	label: `${ __wpupg( 'Grid of Category or Taxonomy Terms' ) }${ wpupg_admin.addons.premium ? '' : ` (${__wpupg( 'Premium Only' ) })` }`,
26	}
27	]}
28	/>
29	{
30	'posts' === props.grid.type
31	&&
32	<Fragment>
33	<Field
34	value={ wpupg_admin.addons.premium ? props.grid.post_types : props.grid.post_types[0] }
35	onChange={ ( value ) => {
36	const post_types = wpupg_admin.addons.premium ? value : [value];
37	props.onGridChange({
38	post_types,
39	});
40	}}
41	type="dropdown"
42	options={ Object.values( wpupg_admin_manage_modal.post_types ) }
43	isMulti={ wpupg_admin.addons.premium }
44	label={ __wpupg( 'Post Types' ) }
45	help={ wpupg_admin.addons.premium ? null : __wpupg( 'Multiple post types are available in WP Ultimate Post Grid Premium' ) }
46	/>
47	<Field
48	value={ props.grid.post_status }
49	onChange={ ( value ) => {
50	props.onGridChange({
51	post_status: value,
52	});
53	}}
54	type="dropdown"
55	label={ __wpupg( 'Post Status' ) }
56	options={[
57	{
58	value: 'publish',
59	label: __wpupg( 'Published Posts' ),
60	},
61	{
62	value: 'private',
63	label: __wpupg( 'Private Posts' ),
64	},
65	]}
66	isMulti
67	help={ __wpupg( 'Select the post statusses you want to display in the grid.' ) }
68	/>
69	{
70	props.grid.post_status.includes( 'private' )
71	&&
72	<Field
73	value={ props.grid.post_status_require_permission }
74	onChange={ ( value ) => {
75	props.onGridChange({
76	post_status_require_permission: value,
77	});
78	}}
79	type="checkbox"
80	label={ __wpupg( 'Only if readable' ) }
81	help={ __wpupg( 'Only show private posts when a visitor has read permission for them.' ) }
82	/>
83	}
84	<Field
85	value={ props.grid.order_by }
86	onChange={ ( value ) => {
87	props.onGridChange({
88	order_by: value,
89	});
90	}}
91	type="dropdown"
92	options={[
93	{ value: 'title', label: __wpupg( 'Title' ) },
94	{ value: 'date', label: __wpupg( 'Date' ) },
95	{ value: 'rand', label: __wpupg( 'Random' ) },
96	{ value: 'menu_order', label: __wpupg( 'Menu Order (pages)' ) },
97	{ value: 'custom', label: `${ __wpupg( 'Custom Field' ) }${ wpupg_admin.addons.premium ? '' : ` (${__wpupg( 'Premium Only' ) })` }`, },
98	]}
99	label={ __wpupg( 'Order By' ) }
100	/>
101	{
102	'custom' === props.grid.order_by
103	&&
104	<Fragment>
105	<Field
106	value={ props.grid.order_custom_key }
107	onChange={ ( value ) => {
108	props.onGridChange({
109	order_custom_key: value,
110	});
111	}}
112	type="text"
113	label={ __wpupg( 'Field Key' ) }
114	help={ __wpupg( 'Key of the custom field to order the grid by.' ) }
115	/>
116	<Field
117	value={ props.grid.order_custom_key_numeric }
118	onChange={ ( value ) => {
119	props.onGridChange({
120	order_custom_key_numeric: value,
121	});
122	}}
123	type="checkbox"
124	label={ __wpupg( 'Numeric Field' ) }
125	help={ __wpupg( 'Enable if the custom field contains numbers.' ) }
126	/>
127	</Fragment>
128	}
129	<Field
130	value={ props.grid.order }
131	onChange={ ( value ) => {
132	props.onGridChange({
133	order: value,
134	});
135	}}
136	type="dropdown"
137	options={[
138	{ value: 'asc', label: __wpupg( 'Ascending' ) },
139	{ value: 'desc', label: __wpupg( 'Descending' ) },
140	]}
141	label={ __wpupg( 'Order' ) }
142	/>
143	</Fragment>
144	}
145	{
146	'terms' === props.grid.type
147	&&
148	<Fragment>
149	<Field
150	value={ props.grid.taxonomies }
151	onChange={ ( value ) => {
152	props.onGridChange({
153	taxonomies: value,
154	});
155	}}
156	type="dropdown"
157	options={ Object.values( wpupg_admin_manage_modal.taxonomies ) }
158	isMulti={ true }
159	label={ __wpupg( 'Taxonomies' ) }
160	/>
161	<Field
162	value={ props.grid.terms_order_by }
163	onChange={ ( value ) => {
164	props.onGridChange({
165	terms_order_by: value,
166	});
167	}}
168	type="dropdown"
169	options={[
170	{ value: 'name', label: __wpupg( 'Name' ) },
171	{ value: 'slug', label: __wpupg( 'Slug' ) },
172	{ value: 'term_id', label: __wpupg( 'ID' ) },
173	{ value: 'description', label: __wpupg( 'Description' ) },
174	{ value: 'count', label: __wpupg( 'Post Count' ) },
175	]}
176	label={ __wpupg( 'Order By' ) }
177	/>
178	<Field
179	value={ props.grid.terms_order }
180	onChange={ ( value ) => {
181	props.onGridChange({
182	terms_order: value,
183	});
184	}}
185	type="dropdown"
186	options={[
187	{ value: 'asc', label: __wpupg( 'Ascending' ) },
188	{ value: 'desc', label: __wpupg( 'Descending' ) },
189	]}
190	label={ __wpupg( 'Order' ) }
191	/>
192	</Fragment>
193	}
194	</Fragment>
195	);
196	}
197	export default SectionDataSource;
198