fix: External Portal node graph styling (#4004)

theopensystemslab · Nov 25, 2024 · 7094c52 · 7094c52
1 parent a55127f
commit 7094c52
Showing 1 changed file with 20 additions and 17 deletions.
diff --git a/editor.planx.uk/src/pages/FlowEditor/components/Flow/components/Portal.tsx b/editor.planx.uk/src/pages/FlowEditor/components/Flow/components/Portal.tsx
@@ -89,17 +89,17 @@ const ExternalPortal: React.FC<any> = (props) => {
   return (
     <>
       <Hanger hidden={isDragging} before={props.id} parent={parent} />
-      <Box sx={{ width: "max-content" }}>
-        <li className={classNames("card", "portal", { isDragging })}>
+      <li ref={ref}>
+        <Box className={classNames("card", "portal", { isDragging })}>
           <Link href={`/${href}`} prefetch={false} ref={drag}>
             <span>{href}</span>
           </Link>
           <Link href={editHref} prefetch={false} className="portalMenu">
             <MoreVert titleAccess="Edit Portal" />
           </Link>
-        </li>
+        </Box>
         {props.tags?.map((tag: NodeTag) => <Tag tag={tag} key={tag} />)}
-      </Box>
+      </li>
     </>
   );
 };
@@ -141,19 +141,22 @@ const InternalPortal: React.FC<any> = (props) => {
   return (
     <>
       <Hanger hidden={isDragging} before={props.id} parent={parent} />
-      <li className={classNames("card", "portal", { isDragging })}>
-        <Link
-          href={href}
-          prefetch={false}
-          ref={drag}
-          onContextMenu={handleContext}
-        >
-          {Icon && <Icon />}
-          <span>{props.data.text}</span>
-        </Link>
-        <Link href={editHref} prefetch={false} className="portalMenu">
-          <MoreVert titleAccess="Edit Portal" />
-        </Link>
+      <li ref={ref}>
+        <Box className={classNames("card", "portal", { isDragging })}>
+          <Link
+            href={href}
+            prefetch={false}
+            ref={drag}
+            onContextMenu={handleContext}
+          >
+            {Icon && <Icon />}
+            <span>{props.data.text}</span>
+          </Link>
+          <Link href={editHref} prefetch={false} className="portalMenu">
+            <MoreVert titleAccess="Edit Portal" />
+          </Link>
+        </Box>
+        {props.tags?.map((tag: NodeTag) => <Tag tag={tag} key={tag} />)}
       </li>
     </>
   );