From 1b4b31b016a25b1cccfc37c4c5d99681386cdc35 Mon Sep 17 00:00:00 2001
From: seb <sebgreenbus@gmail.com>
Date: Sun, 18 Oct 2026 03:25:57 +0200
Subject: [PATCH] u

---
 src/routes/infos/ArticleHistoryPage.jsx | 62 +++++++------------
 src/routes/infos/GlobalHistoryPage.jsx  | 58 ++++++------------
 src/routes/infos/LedgerHistoryPage.jsx  | 80 ++++++++-----------------
 3 files changed, 62 insertions(+), 138 deletions(-)

diff --git a/src/routes/infos/ArticleHistoryPage.jsx b/src/routes/infos/ArticleHistoryPage.jsx
index ed943ef..1207909 100644
--- a/src/routes/infos/ArticleHistoryPage.jsx
+++ b/src/routes/infos/ArticleHistoryPage.jsx
@@ -52,7 +52,7 @@ export function createDummyTestArticleHistory() {
 const rowGridSx = {
   display: 'grid',
   gridTemplateColumns:
-    'minmax(60px, max-content) minmax(150px, max-content) minmax(120px, max-content) minmax(160px, 1.2fr) minmax(240px, 2fr) minmax(120px, max-content)',
+    'minmax(150px, max-content) minmax(130px, max-content) minmax(180px, 1.2fr) minmax(260px, 2fr)',
   gridTemplateRows: '0px 1fr',
   rowGap: 0,
   columnGap: 2,
@@ -86,23 +86,17 @@ function renderInvisibleDummyRow(dummy) {
   return (
     <>
       <Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
-        <Typography variant="body2">{d.id}</Typography>
-      </Box>
-      <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{formatDateTime(d.date)}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.sku}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.name}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 5, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.text}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 6, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
-        <Typography variant="body2">{d.user}</Typography>
-      </Box>
     </>
   );
 }
@@ -121,23 +115,17 @@ class ArticleHistoryRow extends PureComponent {
         >
           {renderInvisibleDummyRow(dummy)}
           <Box sx={{ gridColumn: 1, gridRow: 2 }}>
-            <Skeleton variant="text" width="80%" height={20} />
+            <Skeleton variant="text" width="90%" height={20} />
           </Box>
           <Box sx={{ gridColumn: 2, gridRow: 2 }}>
-            <Skeleton variant="text" width="90%" height={20} />
-          </Box>
-          <Box sx={{ gridColumn: 3, gridRow: 2 }}>
             <Skeleton variant="text" width="85%" height={20} />
           </Box>
-          <Box sx={{ gridColumn: 4, gridRow: 2 }}>
+          <Box sx={{ gridColumn: 3, gridRow: 2 }}>
             <Skeleton variant="text" width="70%" height={20} />
           </Box>
-          <Box sx={{ gridColumn: 5, gridRow: 2 }}>
+          <Box sx={{ gridColumn: 4, gridRow: 2 }}>
             <Skeleton variant="text" width="90%" height={20} />
           </Box>
-          <Box sx={{ gridColumn: 6, gridRow: 2 }}>
-            <Skeleton variant="text" width="60%" height={20} />
-          </Box>
         </ListItemButton>
       );
     }
@@ -163,19 +151,15 @@ class ArticleHistoryRow extends PureComponent {
       >
         {renderInvisibleDummyRow(dummy)}
 
+        {/* 1. Datum */}
         <Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}>
-          <Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
-            {item.id}
-          </Typography>
-        </Box>
-
-        <Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
           <Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
             {formatDateTime(item.date || item.createdAt)}
           </Typography>
         </Box>
 
-        <Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
+        {/* 2. SKU */}
+        <Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
           {item.sku ? (
             <Typography
               variant="body2"
@@ -203,25 +187,21 @@ class ArticleHistoryRow extends PureComponent {
           )}
         </Box>
 
-        <Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}>
+        {/* 3. Artikelname */}
+        <Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
           <Typography variant="body2" sx={{ fontWeight: 500, ...ellipsisSx }}>
             {item.name || item.articlename || '–'}
           </Typography>
         </Box>
 
-        <Box sx={{ gridColumn: 5, gridRow: 2, minWidth: 0 }}>
-          <Tooltip title={item.text || item.message || ''} placement="top-start" enterDelay={500}>
+        {/* 4. Änderung / Ereignis */}
+        <Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}>
+          <Tooltip title={item.historytext || item.text || item.message || ''} placement="top-start" enterDelay={500}>
             <Typography variant="body2" sx={ellipsisSx}>
-              {item.text || item.message || '–'}
+              {item.historytext || item.text || item.message || '–'}
             </Typography>
           </Tooltip>
         </Box>
-
-        <Box sx={{ gridColumn: 6, gridRow: 2, minWidth: 0 }}>
-          <Typography variant="body2" color="text.secondary" sx={ellipsisSx}>
-            {userName}
-          </Typography>
-        </Box>
       </ListItemButton>
     );
   }
@@ -525,12 +505,10 @@ export default class ArticleHistoryPage extends PureComponent {
                   }}
                 >
                   {renderInvisibleDummyRow(this.headerItem)}
-                  <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>ID</Box>
-                  <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Datum</Box>
-                  <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Artikel-Nr.</Box>
-                  <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Artikelname</Box>
-                  <Box sx={{ gridColumn: 5, gridRow: 2, ...headerCellSx }}>Änderung / Ereignis</Box>
-                  <Box sx={{ gridColumn: 6, gridRow: 2, ...headerCellSx }}>Benutzer</Box>
+                  <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>Datum</Box>
+                  <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Artikel-Nr.</Box>
+                  <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Artikelname</Box>
+                  <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Änderung / Ereignis</Box>
                 </Box>
               }
               onPageChange={this.handlePageChange}
diff --git a/src/routes/infos/GlobalHistoryPage.jsx b/src/routes/infos/GlobalHistoryPage.jsx
index 0ffcd3a..f48890a 100644
--- a/src/routes/infos/GlobalHistoryPage.jsx
+++ b/src/routes/infos/GlobalHistoryPage.jsx
@@ -52,7 +52,7 @@ export function createDummyTestGlobalHistory() {
 const rowGridSx = {
   display: 'grid',
   gridTemplateColumns:
-    'minmax(60px, max-content) minmax(150px, max-content) minmax(110px, max-content) minmax(140px, max-content) minmax(240px, 2fr) minmax(120px, max-content)',
+    'minmax(150px, max-content) minmax(110px, max-content) minmax(140px, max-content) minmax(240px, 1fr)',
   gridTemplateRows: '0px 1fr',
   rowGap: 0,
   columnGap: 2,
@@ -86,23 +86,17 @@ function renderInvisibleDummyRow(dummy) {
   return (
     <>
       <Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
-        <Typography variant="body2">{d.id}</Typography>
-      </Box>
-      <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{formatDateTime(d.date)}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.type}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.reference}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 5, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.text}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 6, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
-        <Typography variant="body2">{d.user}</Typography>
-      </Box>
     </>
   );
 }
@@ -121,23 +115,17 @@ class GlobalHistoryRow extends PureComponent {
         >
           {renderInvisibleDummyRow(dummy)}
           <Box sx={{ gridColumn: 1, gridRow: 2 }}>
-            <Skeleton variant="text" width="80%" height={20} />
+            <Skeleton variant="text" width="90%" height={20} />
           </Box>
           <Box sx={{ gridColumn: 2, gridRow: 2 }}>
-            <Skeleton variant="text" width="90%" height={20} />
-          </Box>
-          <Box sx={{ gridColumn: 3, gridRow: 2 }}>
             <Skeleton variant="rounded" width={70} height={22} />
           </Box>
-          <Box sx={{ gridColumn: 4, gridRow: 2 }}>
+          <Box sx={{ gridColumn: 3, gridRow: 2 }}>
             <Skeleton variant="text" width="80%" height={20} />
           </Box>
-          <Box sx={{ gridColumn: 5, gridRow: 2 }}>
+          <Box sx={{ gridColumn: 4, gridRow: 2 }}>
             <Skeleton variant="text" width="90%" height={20} />
           </Box>
-          <Box sx={{ gridColumn: 6, gridRow: 2 }}>
-            <Skeleton variant="text" width="60%" height={20} />
-          </Box>
         </ListItemButton>
       );
     }
@@ -167,19 +155,15 @@ class GlobalHistoryRow extends PureComponent {
       >
         {renderInvisibleDummyRow(dummy)}
 
+        {/* 1. Datum */}
         <Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}>
-          <Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
-            {item.id}
-          </Typography>
-        </Box>
-
-        <Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
           <Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
             {formatDateTime(item.date || item.createdAt)}
           </Typography>
         </Box>
 
-        <Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
+        {/* 2. Typ */}
+        <Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
           <Chip
             size="small"
             label={typeStr}
@@ -193,7 +177,8 @@ class GlobalHistoryRow extends PureComponent {
           />
         </Box>
 
-        <Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}>
+        {/* 3. Referenz / Key */}
+        <Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
           {isArticle ? (
             <Typography
               variant="body2"
@@ -221,19 +206,14 @@ class GlobalHistoryRow extends PureComponent {
           )}
         </Box>
 
-        <Box sx={{ gridColumn: 5, gridRow: 2, minWidth: 0 }}>
+        {/* 4. Meldung / Beschreibung */}
+        <Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}>
           <Tooltip title={item.text || item.value || ''} placement="top-start" enterDelay={500}>
             <Typography variant="body2" sx={ellipsisSx}>
               {item.text || item.value || '–'}
             </Typography>
           </Tooltip>
         </Box>
-
-        <Box sx={{ gridColumn: 6, gridRow: 2, minWidth: 0 }}>
-          <Typography variant="body2" color="text.secondary" sx={ellipsisSx}>
-            {userName}
-          </Typography>
-        </Box>
       </ListItemButton>
     );
   }
@@ -537,12 +517,10 @@ export default class GlobalHistoryPage extends PureComponent {
                   }}
                 >
                   {renderInvisibleDummyRow(this.headerItem)}
-                  <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>ID</Box>
-                  <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Datum</Box>
-                  <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Typ</Box>
-                  <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Referenz / Key</Box>
-                  <Box sx={{ gridColumn: 5, gridRow: 2, ...headerCellSx }}>Meldung / Beschreibung</Box>
-                  <Box sx={{ gridColumn: 6, gridRow: 2, ...headerCellSx }}>Benutzer</Box>
+                  <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>Datum</Box>
+                  <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Typ</Box>
+                  <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Referenz / Key</Box>
+                  <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Meldung / Beschreibung</Box>
                 </Box>
               }
               onPageChange={this.handlePageChange}
diff --git a/src/routes/infos/LedgerHistoryPage.jsx b/src/routes/infos/LedgerHistoryPage.jsx
index 7765aae..df944c5 100644
--- a/src/routes/infos/LedgerHistoryPage.jsx
+++ b/src/routes/infos/LedgerHistoryPage.jsx
@@ -53,7 +53,7 @@ export function createDummyTestLedgerHistory() {
 const rowGridSx = {
   display: 'grid',
   gridTemplateColumns:
-    'minmax(60px, max-content) minmax(150px, max-content) minmax(110px, max-content) minmax(130px, max-content) minmax(90px, max-content) minmax(220px, 2fr) minmax(120px, max-content)',
+    'minmax(150px, max-content) minmax(110px, max-content) minmax(130px, max-content) minmax(90px, max-content) minmax(220px, 1fr)',
   gridTemplateRows: '0px 1fr',
   rowGap: 0,
   columnGap: 2,
@@ -87,26 +87,20 @@ function renderInvisibleDummyRow(dummy) {
   return (
     <>
       <Box aria-hidden sx={{ gridColumn: 1, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
-        <Typography variant="body2">{d.id}</Typography>
-      </Box>
-      <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{formatDateTime(d.created_at || d.date)}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 2, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.transaction_type}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 3, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.sku}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 5, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 4, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">+{d.amount}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 6, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
+      <Box aria-hidden sx={{ gridColumn: 5, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
         <Typography variant="body2">{d.transaction_text}</Typography>
       </Box>
-      <Box aria-hidden sx={{ gridColumn: 7, gridRow: 1, whiteSpace: 'nowrap', ...measuringCellSx }}>
-        <Typography variant="body2">{d.user}</Typography>
-      </Box>
     </>
   );
 }
@@ -137,26 +131,20 @@ class LedgerHistoryRow extends PureComponent {
         >
           {renderInvisibleDummyRow(dummy)}
           <Box sx={{ gridColumn: 1, gridRow: 2 }}>
-            <Skeleton variant="text" width="80%" height={20} />
+            <Skeleton variant="text" width="90%" height={20} />
           </Box>
           <Box sx={{ gridColumn: 2, gridRow: 2 }}>
-            <Skeleton variant="text" width="90%" height={20} />
-          </Box>
-          <Box sx={{ gridColumn: 3, gridRow: 2 }}>
             <Skeleton variant="rounded" width={70} height={22} />
           </Box>
-          <Box sx={{ gridColumn: 4, gridRow: 2 }}>
+          <Box sx={{ gridColumn: 3, gridRow: 2 }}>
             <Skeleton variant="text" width="80%" height={20} />
           </Box>
-          <Box sx={{ gridColumn: 5, gridRow: 2 }}>
+          <Box sx={{ gridColumn: 4, gridRow: 2 }}>
             <Skeleton variant="text" width="70%" height={20} />
           </Box>
-          <Box sx={{ gridColumn: 6, gridRow: 2 }}>
+          <Box sx={{ gridColumn: 5, gridRow: 2 }}>
             <Skeleton variant="text" width="90%" height={20} />
           </Box>
-          <Box sx={{ gridColumn: 7, gridRow: 2 }}>
-            <Skeleton variant="text" width="60%" height={20} />
-          </Box>
         </ListItemButton>
       );
     }
@@ -195,27 +183,15 @@ class LedgerHistoryRow extends PureComponent {
       >
         {renderInvisibleDummyRow(dummy)}
 
-        {/* 1. ID */}
+        {/* 1. Datum */}
         <Box sx={{ gridColumn: 1, gridRow: 2, minWidth: 0 }}>
-          <Typography
-            variant="body2"
-            color="text.secondary"
-            title={item.prev_hash ? `Hash-Version: ${item.hash_version ?? 1}\nVorheriger Hash: ${item.prev_hash}` : undefined}
-            sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}
-          >
-            {item.id}
-          </Typography>
-        </Box>
-
-        {/* 2. Datum */}
-        <Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
           <Typography variant="body2" color="text.secondary" sx={{ fontVariantNumeric: 'tabular-nums', ...ellipsisSx }}>
             {formatDateTime(item.created_at || item.date || item.createdAt)}
           </Typography>
         </Box>
 
-        {/* 3. Typ */}
-        <Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
+        {/* 2. Typ */}
+        <Box sx={{ gridColumn: 2, gridRow: 2, minWidth: 0 }}>
           <Chip
             size="small"
             label={typeLabel}
@@ -229,13 +205,14 @@ class LedgerHistoryRow extends PureComponent {
           />
         </Box>
 
-        {/* 4. SKU */}
-        <Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0 }}>
+        {/* 3. SKU */}
+        <Box sx={{ gridColumn: 3, gridRow: 2, minWidth: 0 }}>
           {hasSku ? (
             <Typography
               variant="body2"
               component="a"
               href={`/artikel/${encodeURIComponent(sku)}`}
+              title={item.name ? `${item.name} (${sku})` : sku}
               onClick={(e) => {
                 e.preventDefault();
                 e.stopPropagation();
@@ -258,8 +235,8 @@ class LedgerHistoryRow extends PureComponent {
           )}
         </Box>
 
-        {/* 5. Menge / Betrag */}
-        <Box sx={{ gridColumn: 5, gridRow: 2, minWidth: 0, textAlign: 'right', pr: 1 }}>
+        {/* 4. Menge / Betrag */}
+        <Box sx={{ gridColumn: 4, gridRow: 2, minWidth: 0, textAlign: 'right', pr: 1 }}>
           <Typography
             variant="body2"
             sx={{
@@ -273,19 +250,12 @@ class LedgerHistoryRow extends PureComponent {
           </Typography>
         </Box>
 
-        {/* 6. Buchungstext */}
-        <Box sx={{ gridColumn: 6, gridRow: 2, minWidth: 0 }}>
+        {/* 5. Buchungstext */}
+        <Box sx={{ gridColumn: 5, gridRow: 2, minWidth: 0 }}>
           <Typography variant="body2" title={bookingText} sx={ellipsisSx}>
             {bookingText}
           </Typography>
         </Box>
-
-        {/* 7. Benutzer */}
-        <Box sx={{ gridColumn: 7, gridRow: 2, minWidth: 0 }}>
-          <Typography variant="body2" color="text.secondary" sx={ellipsisSx}>
-            {userName}
-          </Typography>
-        </Box>
       </ListItemButton>
     );
   }
@@ -592,13 +562,11 @@ export default class LedgerHistoryPage extends PureComponent {
                   }}
                 >
                   {renderInvisibleDummyRow(this.headerItem)}
-                  <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>ID</Box>
-                  <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Datum</Box>
-                  <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Typ</Box>
-                  <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx }}>Artikel-Nr.</Box>
-                  <Box sx={{ gridColumn: 5, gridRow: 2, ...headerCellSx, textAlign: 'right', pr: 1 }}>Menge</Box>
-                  <Box sx={{ gridColumn: 6, gridRow: 2, ...headerCellSx }}>Buchungstext</Box>
-                  <Box sx={{ gridColumn: 7, gridRow: 2, ...headerCellSx }}>Benutzer</Box>
+                  <Box sx={{ gridColumn: 1, gridRow: 2, ...headerCellSx }}>Datum</Box>
+                  <Box sx={{ gridColumn: 2, gridRow: 2, ...headerCellSx }}>Typ</Box>
+                  <Box sx={{ gridColumn: 3, gridRow: 2, ...headerCellSx }}>Artikel-Nr.</Box>
+                  <Box sx={{ gridColumn: 4, gridRow: 2, ...headerCellSx, textAlign: 'right', pr: 1 }}>Menge</Box>
+                  <Box sx={{ gridColumn: 5, gridRow: 2, ...headerCellSx }}>Buchungstext</Box>
                 </Box>
               }
               onPageChange={this.handlePageChange}