From ee6abf9200b7c2e278fca5edfc26ea5157252afb Mon Sep 17 00:00:00 2001
From: Andrew Kingston <andrew@kingston.dev>
Date: Mon, 9 Jan 2023 11:26:01 +0000
Subject: [PATCH] Properly handle text overflow in plugins table

---
 .../_components/PluginNameRenderer.svelte        | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/packages/builder/src/pages/builder/portal/plugins/_components/PluginNameRenderer.svelte b/packages/builder/src/pages/builder/portal/plugins/_components/PluginNameRenderer.svelte
index 8d9d71f636..c6642f3b4b 100644
--- a/packages/builder/src/pages/builder/portal/plugins/_components/PluginNameRenderer.svelte
+++ b/packages/builder/src/pages/builder/portal/plugins/_components/PluginNameRenderer.svelte
@@ -8,19 +8,29 @@
   $: friendlyName = row?.schema?.schema?.friendlyName
 </script>
 
-<div title={value}>
+<div class="container" title={value}>
   {#if icon}
     <Icon name={icon} />
   {/if}
-  {friendlyName || value}
+  <div class="name">
+    {friendlyName || value}
+  </div>
 </div>
 
 <style>
-  div {
+  .container {
+    flex: 1 1 auto;
     display: flex;
     flex-direction: row;
     justify-content: flex-start;
     align-items: center;
     gap: var(--spacing-m);
   }
+  .name {
+    flex: 1 1 auto;
+    width: 0;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+  }
 </style>