Add loading when selecting form template
[MAILPOET-2988]
This commit is contained in:
committed by
Veljko V
parent
e1599ee7b2
commit
acf372b148
@ -3,6 +3,7 @@ import MailPoet from 'mailpoet';
|
|||||||
import { useSelect, useDispatch } from '@wordpress/data';
|
import { useSelect, useDispatch } from '@wordpress/data';
|
||||||
import Categories from 'common/categories/categories';
|
import Categories from 'common/categories/categories';
|
||||||
import Background from 'common/background/background';
|
import Background from 'common/background/background';
|
||||||
|
import Loading from 'common/loading';
|
||||||
import Heading from 'common/typography/heading/heading';
|
import Heading from 'common/typography/heading/heading';
|
||||||
import { TemplateData } from './store/types';
|
import { TemplateData } from './store/types';
|
||||||
import TemplateBox from './components/template_box';
|
import TemplateBox from './components/template_box';
|
||||||
@ -38,6 +39,11 @@ export default () => {
|
|||||||
[]
|
[]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
const loading: boolean = useSelect(
|
||||||
|
(select) => select('mailpoet-form-editor-templates').getLoading(),
|
||||||
|
[]
|
||||||
|
);
|
||||||
|
|
||||||
// const selectTemplateFailed: boolean = useSelect(
|
// const selectTemplateFailed: boolean = useSelect(
|
||||||
// (select) => select('mailpoet-form-editor-templates').getSelectTemplateFailed(),
|
// (select) => select('mailpoet-form-editor-templates').getSelectTemplateFailed(),
|
||||||
// []
|
// []
|
||||||
@ -71,6 +77,7 @@ export default () => {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
{loading && <Loading />}
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -2,6 +2,7 @@ import { select } from '@wordpress/data';
|
|||||||
|
|
||||||
// eslint-disable-next-line import/prefer-default-export
|
// eslint-disable-next-line import/prefer-default-export
|
||||||
export function* selectTemplate(templateId) {
|
export function* selectTemplate(templateId) {
|
||||||
|
yield { type: 'SELECT_TEMPLATE_START' };
|
||||||
const { res, success, error } = yield {
|
const { res, success, error } = yield {
|
||||||
type: 'CALL_API',
|
type: 'CALL_API',
|
||||||
endpoint: 'forms',
|
endpoint: 'forms',
|
||||||
|
@ -1,11 +1,19 @@
|
|||||||
export const selectTemplateFailed = (state) => ({
|
export const selectTemplateFailed = (state) => ({
|
||||||
...state,
|
...state,
|
||||||
selectTemplateFailed: true,
|
selectTemplateFailed: true,
|
||||||
|
loading: false,
|
||||||
|
});
|
||||||
|
|
||||||
|
export const selectTemplateStarted = (state) => ({
|
||||||
|
...state,
|
||||||
|
selectTemplateFailed: false,
|
||||||
|
loading: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
export default (defaultState: object) => (state = defaultState, action) => {
|
export default (defaultState: object) => (state = defaultState, action) => {
|
||||||
switch (action.type) {
|
switch (action.type) {
|
||||||
case 'SELECT_TEMPLATE_ERROR': return selectTemplateFailed(state);
|
case 'SELECT_TEMPLATE_ERROR': return selectTemplateFailed(state);
|
||||||
|
case 'SELECT_TEMPLATE_START': return selectTemplateStarted(state);
|
||||||
default:
|
default:
|
||||||
return state;
|
return state;
|
||||||
}
|
}
|
||||||
|
@ -10,4 +10,7 @@ export default {
|
|||||||
getSelectTemplateFailed(state): boolean {
|
getSelectTemplateFailed(state): boolean {
|
||||||
return state.selectTemplateFailed;
|
return state.selectTemplateFailed;
|
||||||
},
|
},
|
||||||
|
getLoading(state): boolean {
|
||||||
|
return state.loading;
|
||||||
|
},
|
||||||
};
|
};
|
||||||
|
@ -13,6 +13,7 @@ export default () => {
|
|||||||
templates: (window as any).mailpoet_templates,
|
templates: (window as any).mailpoet_templates,
|
||||||
formEditorUrl: (window as any).mailpoet_form_edit_url,
|
formEditorUrl: (window as any).mailpoet_form_edit_url,
|
||||||
selectTemplateFailed: false,
|
selectTemplateFailed: false,
|
||||||
|
loading: false,
|
||||||
};
|
};
|
||||||
|
|
||||||
const config = {
|
const config = {
|
||||||
|
Reference in New Issue
Block a user