From 9eef6f22c9d470121a11571a1932827135557946 Mon Sep 17 00:00:00 2001
From: Mike Cao <mike@mikecao.com>
Date: Mon, 7 Sep 2026 10:37:22 -0700
Subject: [PATCH] Prevent event details from wrapping in table rows

---
 .../(main)/websites/[websiteId]/events/EventsTable.tsx   | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx b/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
index 54b4fc139..cafc8fca3 100644
--- a/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
+++ b/src/app/(main)/websites/[websiteId]/events/EventsTable.tsx
@@ -1,6 +1,5 @@
 import {
   Button,
-  Column,
   DataColumn,
   DataTable,
   type DataTableProps,
@@ -44,15 +43,15 @@ export function EventsTable(props: DataTableProps) {
       <DataColumn id="event" label={t(labels.event)} width="2fr">
         {(row: any) => {
           return (
-            <Column gap="2">
-              <Row>
+            <Row alignItems="center" gap="2" flexWrap="nowrap" style={{ minWidth: 0 }}>
+              <Row style={{ flexShrink: 0 }}>
                 <IconLabel
                   icon={row.eventName ? <Lightning /> : <Eye />}
                   label={t(row.eventName ? labels.triggeredEvent : labels.viewedPage)}
                   labelProps={{ wrap: 'nowrap' }}
                 />
               </Row>
-              <Row alignItems="center" gap>
+              <Row alignItems="center" gap flexWrap="nowrap" style={{ minWidth: 0 }}>
                 <Text
                   weight="bold"
                   style={{ maxWidth: '300px' }}
@@ -63,7 +62,7 @@ export function EventsTable(props: DataTableProps) {
                 </Text>
                 {row.hasData > 0 && <PropertiesButton websiteId={row.websiteId} eventId={row.id} />}
               </Row>
-            </Column>
+            </Row>
           );
         }}
       </DataColumn>