diff --git a/src/frontend/src/components/forms/ApiForm.tsx b/src/frontend/src/components/forms/ApiForm.tsx
index ae4ee5034c..c8f62ac141 100644
--- a/src/frontend/src/components/forms/ApiForm.tsx
+++ b/src/frontend/src/components/forms/ApiForm.tsx
@@ -38,6 +38,10 @@ export interface ApiFormProps {
fetchInitialData?: boolean;
method?: string;
opened: boolean;
+ preFormContent?: JSX.Element;
+ preFormContentFunc?: () => JSX.Element;
+ postFormContent?: JSX.Element;
+ postFormContentFunc?: () => JSX.Element;
onClose?: () => void;
onFormSuccess?: () => void;
onFormError?: () => void;
@@ -201,6 +205,8 @@ export function ApiForm(props: ApiFormProps) {
{error}
)}
+ {props.preFormContent && props.preFormContent}
+ {props.preFormContentFunc ? props.preFormContentFunc() : null}
{canRender && (
@@ -218,6 +224,8 @@ export function ApiForm(props: ApiFormProps) {
)}
+ {props.postFormContent && props.postFormContent}
+ {props.postFormContentFunc ? props.postFormContentFunc() : null}
diff --git a/src/frontend/src/pages/Index/Home.tsx b/src/frontend/src/pages/Index/Home.tsx
index b2a1a2a659..81e6dd7714 100644
--- a/src/frontend/src/pages/Index/Home.tsx
+++ b/src/frontend/src/pages/Index/Home.tsx
@@ -1,5 +1,5 @@
import { Trans } from '@lingui/macro';
-import { Group, Stack } from '@mantine/core';
+import { Alert, Group, Stack } from '@mantine/core';
import { Button } from '@mantine/core';
import {
IconBuilding,
@@ -143,6 +143,10 @@ export default function Home() {
fields={[]}
opened={stockFormOpened}
onClose={() => setStockFormOpened(false)}
+ preFormContent={Are you sure?}
+ postFormContentFunc={() => (
+ Post form content!
+ )}
/>