Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Persist Error Snackbars #4392

Merged
merged 4 commits into from
Nov 19, 2024
Merged

Persist Error Snackbars #4392

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
f571715
fix: persist snackbars in case of an error
adrians5j Nov 15, 2024
7ddceef
Merge branch 'refs/heads/dev' into adrian/error-snackbars
adrians5j Nov 15, 2024
0d9d990
ci:run workflows
adrians5j Nov 15, 2024
402f4cc
Merge branch 'dev' into adrian/error-snackbars
adrians5j Nov 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 0 additions & 23 deletions packages/app-admin/src/hooks/useSnackbar.ts
View file
Open in desktop

This file was deleted.

45 changes: 45 additions & 0 deletions packages/app-admin/src/hooks/useSnackbar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,45 @@
import React from "react";
import { useUi } from "@webiny/app/hooks/useUi";
import { SnackbarAction } from "@webiny/ui/Snackbar";

interface UseSnackbarResponse {
showSnackbar: (message: React.ReactNode, options?: Record<string, React.ReactNode>) => void;
showErrorSnackbar: (
message: React.ReactNode,
options?: Record<string, React.ReactNode>
) => void;
hideSnackbar: () => void;
}

export const useSnackbar = (): UseSnackbarResponse => {
const ui = useUi();

return {
showSnackbar: (message, options = {}) => {
ui.setState(ui => {
return { ...ui, snackbar: { message, options } };
});
},
showErrorSnackbar: (message, options = {}) => {
ui.setState(ui => {
return {
...ui,
snackbar: {
message,
options: {
timeout: -1,
dismissesOnAction: true,
action: <SnackbarAction label={"OK"} />,
...options
}
}
};
});
},
hideSnackbar: () => {
ui.setState(ui => {
return { ...ui, snackbar: null };
});
}
};
};
4 changes: 2 additions & 2 deletions packages/app-headless-cms/src/admin/components/Decorators/ShowConfirmationOnDelete.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,13 +43,13 @@ export const ShowConfirmationOnDelete = useContentEntry.createDecorator(baseHook
return () => {
const hook = baseHook();
const dialogs = useDialogs();
const { showSnackbar } = useSnackbar();
const { showSnackbar, showErrorSnackbar } = useSnackbar();

const onAccept = async (entry: CmsContentEntry) => {
const response = await hook.deleteEntry({ id: entry.entryId });

if (typeof response !== "boolean") {
showSnackbar(
showErrorSnackbar(
`Could not move ${entry.meta.title} to trash! (${response.error.message})`
);

Expand Down
4 changes: 2 additions & 2 deletions ...ges/app-headless-cms/src/admin/components/Decorators/ShowConfirmationOnDeleteRevision.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -44,15 +44,15 @@ export const ShowConfirmationOnDeleteRevision = useContentEntry.createDecorator(
return () => {
const hook = baseHook();
const dialogs = useDialogs();
const { showSnackbar } = useSnackbar();
const { showSnackbar, showErrorSnackbar } = useSnackbar();

const onAccept = async (params: DeleteEntryRevisionParams) => {
const revisionToDelete = hook.revisions.find(rev => rev.id === params.id)!;

const response = await hook.deleteEntryRevision(revisionToDelete);
if (typeof response === "object" && response.error) {
const { error } = response;
showSnackbar(error.message);
showErrorSnackbar(error.message);
return response;
}

Expand Down
6 changes: 4 additions & 2 deletions packages/app-headless-cms/src/admin/components/Decorators/ShowConfirmationOnPublish.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ const EntryMessage = ({ id, entryType, getEntry }: EntryMessageProps) => {

export const ShowConfirmationOnPublish = useContentEntry.createDecorator(baseHook => {
return () => {
const { showSnackbar } = useSnackbar();
const { showSnackbar, showErrorSnackbar } = useSnackbar();
const dialogs = useDialogs();
const hook = baseHook();
const { contentModel } = hook;
Expand All @@ -57,7 +57,9 @@ export const ShowConfirmationOnPublish = useContentEntry.createDecorator(baseHoo
const response = await hook.publishEntryRevision({ id: entry.id });

if (response.error) {
showSnackbar(`Could not publish ${entry.meta.title}! (${response.error.message})`);
showErrorSnackbar(
`Could not publish ${entry.meta.title}! (${response.error.message})`
);

return response;
}
Expand Down
4 changes: 2 additions & 2 deletions packages/app-headless-cms/src/admin/components/Decorators/ShowConfirmationOnUnpublish.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,7 +47,7 @@ const EntryMessage = ({ id, entryType, getEntry }: EntryMessageProps) => {

export const ShowConfirmationOnUnpublish = useContentEntry.createDecorator(baseHook => {
return () => {
const { showSnackbar } = useSnackbar();
const { showSnackbar, showErrorSnackbar } = useSnackbar();
const dialogs = useDialogs();
const hook = baseHook();
const { contentModel } = hook;
Expand All @@ -57,7 +57,7 @@ export const ShowConfirmationOnUnpublish = useContentEntry.createDecorator(baseH
const response = await hook.unpublishEntryRevision({ id: entry.id });

if (response.error) {
showSnackbar(
showErrorSnackbar(
`Could not unpublish ${entry.meta.title}! (${response.error.message})`
);

Expand Down
8 changes: 4 additions & 4 deletions packages/app-headless-cms/src/admin/components/FieldEditor/Field.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ export interface FieldProps {

const Field = (props: FieldProps) => {
const { field, onEdit, parent } = props;
const { showSnackbar } = useSnackbar();
const { showSnackbar, showErrorSnackbar } = useSnackbar();
const { setData: setModel, data: model } = useModelEditor();
const { getFieldPlugin, getFieldRendererPlugin } = useModelFieldEditor();

Expand Down Expand Up @@ -208,7 +208,7 @@ const Field = (props: FieldProps) => {
});

if (response && response.error) {
return showSnackbar(response.error.message);
return showErrorSnackbar(response.error.message);
}

showSnackbar(t`Title field set successfully.`);
Expand All @@ -220,7 +220,7 @@ const Field = (props: FieldProps) => {
});

if (response && response.error) {
return showSnackbar(response.error.message);
return showErrorSnackbar(response.error.message);
}

showSnackbar(t`Description field set successfully.`);
Expand All @@ -232,7 +232,7 @@ const Field = (props: FieldProps) => {
});

if (response && response.error) {
return showSnackbar(response.error.message);
return showErrorSnackbar(response.error.message);
}

showSnackbar(t`Image field set successfully.`);
Expand Down
4 changes: 2 additions & 2 deletions packages/app-headless-cms/src/admin/plugins/editor/defaultBar/SaveContentModelButton.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,15 +9,15 @@ const t = i18n.namespace("app-headless-cms/admin/editor/top-bar/save-button");
const SaveContentModelButton = () => {
const { saveContentModel } = useModelEditor();
const [loading, setLoading] = useState<boolean>(false);
const { showSnackbar } = useSnackbar();
const { showSnackbar, showErrorSnackbar } = useSnackbar();

const onClick = useCallback(async () => {
setLoading(true);
const response = await saveContentModel();
setLoading(false);

if (response.error) {
showSnackbar(response.error.message);
showErrorSnackbar(response.error.message);
return;
}

Expand Down
4 changes: 2 additions & 2 deletions ...pp-headless-cms/src/admin/views/contentEntries/ContentEntry/RevisionsList/useRevision.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,7 @@ export interface UseRevisionProps {
export const useRevision = ({ revision }: UseRevisionProps) => {
const contentEntry = useContentEntry();
const { history } = useRouter();
const { showSnackbar } = useSnackbar();
const { showSnackbar, showErrorSnackbar } = useSnackbar();
const { contentModel } = contentEntry;
const { modelId } = contentModel;

Expand Down Expand Up @@ -107,7 +107,7 @@ export const useRevision = ({ revision }: UseRevisionProps) => {
});

if (response.error) {
showSnackbar(response.error.message);
showErrorSnackbar(response.error.message);
return response;
}

Expand Down
Loading