Catch request errors when loading template previews
[MAILPOET-4534]
This commit is contained in:
@ -36,25 +36,32 @@ type Props = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
export function TemplatePreview({ template }: Props): JSX.Element {
|
export function TemplatePreview({ template }: Props): JSX.Element {
|
||||||
const [isLoaded, setIsLoaded] = useState(false);
|
const [state, setState] = useState<'loading' | 'loaded' | 'error'>('loading');
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const controller = new AbortController();
|
const controller = new AbortController();
|
||||||
const loadTemplate = async () => {
|
const loadTemplate = async () => {
|
||||||
setIsLoaded(false);
|
setState('loading');
|
||||||
|
|
||||||
initializeHooks();
|
initializeHooks();
|
||||||
createStore();
|
createStore();
|
||||||
initializeIntegrations();
|
initializeIntegrations();
|
||||||
|
|
||||||
|
try {
|
||||||
const data = await apiFetch<{ data: { automation: unknown } }>({
|
const data = await apiFetch<{ data: { automation: unknown } }>({
|
||||||
path: `/automation-templates/${template.slug}`,
|
path: `/automation-templates/${template.slug}`,
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
signal: controller.signal,
|
signal: controller.signal,
|
||||||
});
|
});
|
||||||
dispatch(storeName).updateAutomation(data.data.automation);
|
dispatch(storeName).updateAutomation(data.data.automation);
|
||||||
setIsLoaded(true);
|
setState('loaded');
|
||||||
|
} catch (error) {
|
||||||
|
if (!controller.signal.aborted) {
|
||||||
|
setState('error');
|
||||||
|
}
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
void loadTemplate();
|
void loadTemplate();
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
@ -63,7 +70,7 @@ export function TemplatePreview({ template }: Props): JSX.Element {
|
|||||||
};
|
};
|
||||||
}, [template.slug]);
|
}, [template.slug]);
|
||||||
|
|
||||||
return isLoaded ? (
|
return state === 'loaded' ? (
|
||||||
<Automation context="view" showStatistics={false} />
|
<Automation context="view" showStatistics={false} />
|
||||||
) : (
|
) : (
|
||||||
<div className="mailpoet-automation-template-detail-preview-spinner">
|
<div className="mailpoet-automation-template-detail-preview-spinner">
|
||||||
|
Reference in New Issue
Block a user