diff --git a/pkg/interface/src/views/landscape/components/GroupSummary.tsx b/pkg/interface/src/views/landscape/components/GroupSummary.tsx
index 06b3ecc510..d559495172 100644
--- a/pkg/interface/src/views/landscape/components/GroupSummary.tsx
+++ b/pkg/interface/src/views/landscape/components/GroupSummary.tsx
@@ -13,8 +13,8 @@ interface GroupSummaryProps {
 export function GroupSummary(props: GroupSummaryProps) {
   const { channelCount, memberCount, metadata, children } = props;
   return (
-    <Col maxWidth="300px" gapY="4">
-      <Row gapX="2">
+    <Col maxWidth="600px" gapY="4">
+      <Row gapX="2" width="100%">
         <MetadataIcon
           borderRadius="1"
           border="1"
@@ -22,9 +22,14 @@ export function GroupSummary(props: GroupSummaryProps) {
           width="40px"
           height="40px"
           metadata={metadata}
+          flexShrink="0"
         />
-        <Col justifyContent="space-between">
-          <Text fontSize="1">{metadata.title}</Text>
+        <Col justifyContent="space-between" flexGrow="1" overflow="hidden">
+          <Text
+            fontSize="1"
+            textOverflow="ellipsis"
+            whiteSpace="nowrap"
+            overflow="hidden">{metadata.title}</Text>
           <Row gapX="2" justifyContent="space-between">
             <Text fontSize="1" gray>
               {memberCount} participants
@@ -35,7 +40,17 @@ export function GroupSummary(props: GroupSummaryProps) {
           </Row>
         </Col>
       </Row>
-      {metadata.description && <Text fontSize="1">{metadata.description}</Text>}
+      <Row width="100%">
+        {metadata.description && 
+          <Text
+            width="100%"
+            fontSize="1"
+            textOverflow="ellipsis"
+            overflow="hidden">
+            {metadata.description}
+          </Text>
+        }
+      </Row>
       {children}
     </Col>
   );