(demo) add delete confirmation modal

We want to showcase pre built modals in the demo.
This commit is contained in:
Nathan Vasse
2024-02-16 15:03:04 +01:00
committed by NathanVss
parent f81005f66c
commit 10c9abf1d2
2 changed files with 10 additions and 2 deletions

View File

@@ -6,13 +6,14 @@ import {
usePagination, usePagination,
useToastProvider, useToastProvider,
VariantType, VariantType,
useModals,
} from "@openfun/cunningham-react"; } from "@openfun/cunningham-react";
import { PageProps } from "./App"; import { PageProps } from "./App";
import { database } from "./Character"; import { database } from "./Character";
export const Home = ({ modal }: { modal: PageProps }) => { export const Home = ({ modal }: { modal: PageProps }) => {
const { toast } = useToastProvider(); const { toast } = useToastProvider();
const modals = useModals();
const [rowSelection, setRowSelection] = useState({}); const [rowSelection, setRowSelection] = useState({});
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
const pagination = usePagination({ defaultPage: 1 }); const pagination = usePagination({ defaultPage: 1 });
@@ -127,7 +128,11 @@ export const Home = ({ modal }: { modal: PageProps }) => {
<Button <Button
color="tertiary-text" color="tertiary-text"
size="small" size="small"
onClick={() => { onClick={async () => {
const decision = await modals.deleteConfirmationModal();
if (!decision) {
return;
}
const index = database.findIndex( const index = database.findIndex(
(character) => character.id === params.row.id, (character) => character.id === params.row.id,
); );

View File

@@ -18,6 +18,9 @@ export * from "./components/Forms/Switch";
export * from "./components/Forms/TextArea"; export * from "./components/Forms/TextArea";
export * from "./components/Loader"; export * from "./components/Loader";
export * from "./components/Modal"; export * from "./components/Modal";
export * from "./components/Modal/ConfirmationModal";
export * from "./components/Modal/DeleteConfirmationModal";
export * from "./components/Modal/MessageModal";
export * from "./components/Modal/ModalProvider"; export * from "./components/Modal/ModalProvider";
export * from "./components/Pagination"; export * from "./components/Pagination";
export * from "./components/Popover"; export * from "./components/Popover";