Adding a Cartouche for the card component

gui/rpk-gui/src/components/Cartouche.tsx

@@ -0,0 +1,21 @@
+import { useTranslation } from "@refinedev/core";
+
+type CartoucheProps = {
+  record: any
+}
+
+const Cartouche = (props: CartoucheProps) => {
+  const { record } = props;
+  const { translate: t } = useTranslation();
+  return (
+    <>
+      <h2>{record.label}</h2>
+      <ul>
+      { record.created_at	&& <li>{t("resource.created_at")}: {record.created_at} {t("resource.created_at")}: {record.created_by}</li> }
+      { record.updated_at	&& <li>{t("resource.updated_at")}: {record.updated_at} {t("resource.updated_by")}: {record.updated_by}</li> }
+      </ul>
+    </>
+  )
+}
+
+export default Cartouche;

gui/rpk-gui/src/pages/firm/base-page/Edit.tsx

@@ -8,8 +8,7 @@ import { useForm } from "@refinedev/core";
 import { DeleteButton } from "@refinedev/mui";
 import { FirmContext } from "../../../contexts/FirmContext";
 import { CrudForm } from "../../../lib/crud/components/crud-form";
-import Stack from "@mui/material/Stack";
-import { DeleteButton } from "@refinedev/mui";
+import Cartouche from "../../../components/Cartouche";
 
 type EditProps = {
   resource: string,
@@ -41,6 +40,7 @@ const Edit = <T,>(props: EditProps) => {
   const record = query.data.data;
   return (
     <>
+      <Cartouche record={record}/>
       <CrudForm
         resourceBasePath={resourceBasePath}
         schemaName={schemaName}