← All changes | assets/src/apps/js/frontend/modal/index.js +54 -54 4.3.8 → 4.4.9 View file →

		@@ -1,54 +1,54 @@
1		-/**
2		- * Create Modal popup.
3		- * Edit: Use React Hook.
4		- *
5		- * @author Nhamdv - ThimPress.
6		- */
7		-
8		-import store from './store';
9		-import { __ } from '@wordpress/i18n';
10		-import { useSelect, dispatch } from '@wordpress/data';
11		-
12		-const Modal = ( { children } ) => {
13		- const { show, hide, confirm } = dispatch( 'learnpress/modal' );
14		-
15		- const isShow = useSelect( ( select ) => {
16		- const isOpen = select( 'learnpress/modal' ).isOpen();
17		- return isOpen;
18		- } );
19		-
20		- const message = useSelect( ( select ) => {
21		- const getMessage = select( 'learnpress/modal' ).getMessage();
22		- return getMessage;
23		- } );
24		-
25		- const dataConfirm = ( c ) => ( event ) => {
26		- confirm( c );
27		- };
28		-
29		- const styles = {
30		- display: isShow ? 'block' : 'none',
31		- };
32		-
33		- return (
34		- <>
35		- <div>
36		- <div id="lp-modal-overlay" style={ styles }></div>
37		- <div id="lp-modal-window" style={ styles }>
38		- <div id="lp-modal-content" dangerouslySetInnerHTML={ { __html: message } }></div>
39		- <div id="lp-modal-buttons">
40		- <button className="lp-button modal-button-ok" onClick={ dataConfirm( 'yes' ) }>
41		- <span>{ __( 'OK', 'learnpress' ) }</span>
42		- </button>
43		- <button className="lp-button modal-button-cancel" onClick={ dataConfirm( 'no' ) }>
44		- <span>{ __( 'Cancel', 'learnpress' ) }</span>
45		- </button>
46		- </div>
47		- </div>
48		- </div>
49		- { children }
50		- </>
51		- );
52		-};
53		-
54		-export default Modal;
	1	+/**
	2	+ * Create Modal popup.
	3	+ * Edit: Use React Hook.
	4	+ *
	5	+ * @author Nhamdv - ThimPress.
	6	+ */
	7	+
	8	+import store from './store';
	9	+import { __ } from '@wordpress/i18n';
	10	+import { useSelect, dispatch } from '@wordpress/data';
	11	+
	12	+const Modal = ( { children } ) => {
	13	+ const { show, hide, confirm } = dispatch( 'learnpress/modal' );
	14	+
	15	+ const isShow = useSelect( ( select ) => {
	16	+ const isOpen = select( 'learnpress/modal' ).isOpen();
	17	+ return isOpen;
	18	+ } );
	19	+
	20	+ const message = useSelect( ( select ) => {
	21	+ const getMessage = select( 'learnpress/modal' ).getMessage();
	22	+ return getMessage;
	23	+ } );
	24	+
	25	+ const dataConfirm = ( c ) => ( event ) => {
	26	+ confirm( c );
	27	+ };
	28	+
	29	+ const styles = {
	30	+ display: isShow ? 'block' : 'none',
	31	+ };
	32	+
	33	+ return (
	34	+ <>
	35	+ <div>
	36	+ <div id="lp-modal-overlay" style={ styles }></div>
	37	+ <div id="lp-modal-window" style={ styles }>
	38	+ <div id="lp-modal-content" dangerouslySetInnerHTML={ { __html: message } }></div>
	39	+ <div id="lp-modal-buttons">
	40	+ <button className="lp-button modal-button-ok" onClick={ dataConfirm( 'yes' ) }>
	41	+ <span>{ __( 'OK', 'learnpress' ) }</span>
	42	+ </button>
	43	+ <button className="lp-button modal-button-cancel" onClick={ dataConfirm( 'no' ) }>
	44	+ <span>{ __( 'Cancel', 'learnpress' ) }</span>
	45	+ </button>
	46	+ </div>
	47	+ </div>
	48	+ </div>
	49	+ { children }
	50	+ </>
	51	+ );
	52	+};
	53	+
	54	+export default Modal;