From ba46c1044995ea5f53a36d60d4102848763d56d2 Mon Sep 17 00:00:00 2001
From: ewandor <ewandor@dorfsvald.net>
Date: Fri, 2 May 2025 11:45:45 +0200
Subject: [PATCH] Improving Cartouche

---
 gui/rpk-gui/public/locales/EN/common.json |  4 ++++
 gui/rpk-gui/public/locales/FR/common.json |  4 ++++
 gui/rpk-gui/src/components/Cartouche.tsx  | 21 +++++++++++----------
 3 files changed, 19 insertions(+), 10 deletions(-)

diff --git a/gui/rpk-gui/public/locales/EN/common.json b/gui/rpk-gui/public/locales/EN/common.json
index 95ff4d1..aea7065 100644
--- a/gui/rpk-gui/public/locales/EN/common.json
+++ b/gui/rpk-gui/public/locales/EN/common.json
@@ -171,6 +171,10 @@
     }
   },
   "schemas": {
+    "created_by": "Created by",
+    "created_at": "Created at",
+    "updated_by": "Updated by",
+    "updated_at": "Updated at",
     "individual": {
       "type": "Individual",
       "lastname": "Lastname",
diff --git a/gui/rpk-gui/public/locales/FR/common.json b/gui/rpk-gui/public/locales/FR/common.json
index a2e65ff..aa02ab2 100644
--- a/gui/rpk-gui/public/locales/FR/common.json
+++ b/gui/rpk-gui/public/locales/FR/common.json
@@ -171,6 +171,10 @@
     }
   },
   "schemas": {
+    "created_by": "Créé par",
+    "created_at": "Créé le",
+    "updated_by": "Modifié par",
+    "updated_at": "Modifié le",
     "individual": {
       "type": "Particulier",
       "middlename": "Autres prénoms",
diff --git a/gui/rpk-gui/src/components/Cartouche.tsx b/gui/rpk-gui/src/components/Cartouche.tsx
index b766954..00dc61f 100644
--- a/gui/rpk-gui/src/components/Cartouche.tsx
+++ b/gui/rpk-gui/src/components/Cartouche.tsx
@@ -1,6 +1,7 @@
 import { useTranslation } from "@refinedev/core";
 import { useContext } from "react";
 import { FirmContext } from "../contexts/FirmContext";
+import Grid2 from '@mui/material/Grid2';
 
 type CartoucheProps = {
   record: any
@@ -11,16 +12,16 @@ const Cartouche = (props: CartoucheProps) => {
   const { translate: t } = useTranslation();
   return (
     <>
-      <ul>
-        <li>
-          {t("resource.created_at")}: {record.created_at} {t("resource.created_by")}:
-          <AuthorField partnerId={record.created_by} />
-        </li>
-        <li>
-          {t("resource.updated_at")}: {record.updated_at} {t("resource.updated_by")}:
-          <AuthorField partnerId={record.updated_by} />
-        </li>
-      </ul>
+      <Grid2 container spacing={0}>
+        <Grid2 size={2}>{t("schemas.created_by")}:</Grid2>
+        <Grid2 size={4}><AuthorField partnerId={record.created_by} /></Grid2>
+        <Grid2 size={2}>{t("schemas.created_at")}:</Grid2>
+        <Grid2 size={4}>{new Date(record.created_at).toLocaleString()}</Grid2>
+        <Grid2 size={2}>{t("schemas.updated_by")}:</Grid2>
+        <Grid2 size={4}><AuthorField partnerId={record.updated_by} /></Grid2>
+        <Grid2 size={2}>{t("schemas.updated_at")}:</Grid2>
+        <Grid2 size={4}>{new Date(record.updated_at).toLocaleString()}</Grid2>
+      </Grid2>
     </>
   )
 }