fix icon position, plus sign, etc.

frontend/app/block/blockframe.tsx

@@ -511,9 +511,9 @@ const ChangeConnectionBlockModal = React.memo(
                 // for instance, when reconnecting
                 const newConnectionSuggestion: SuggestionConnectionItem = {
                     status: "connected",
-                    icon: "arrow-right-arrow-left",
+                    icon: "plus",
                     iconColor: "var(--conn-icon-color)",
-                    label: `(+) ${connSelected}`,
+                    label: `${connSelected} (New Connection)`,
                     value: "",
                     onSelect: (_: string) => {
                         changeConnection(connSelected);

frontend/app/modals/typeaheadmodal.less

@@ -91,13 +91,19 @@
                 border-radius: 4px;
             }
 
-            .name {
+            .typeahead-item-name {
                 .ellipsis();
                 display: flex;
                 gap: 8px;
                 font-size: 11px;
                 font-weight: 400;
                 line-height: 14px;
+
+                i {
+                    display: inline-block;
+                    position: relative;
+                    top: 2px;
+                }
             }
         }
     }

frontend/app/modals/typeaheadmodal.tsx

@@ -33,7 +33,7 @@ const Suggestions = forwardRef<HTMLDivElement, SuggestionsProps>(({ suggestions,
             }}
             className="suggestion-item"
         >
-            <div className="name">
+            <div className="typeahead-item-name">
                 {item.icon && renderIcon(item.icon, "iconColor" in item && item.iconColor ? item.iconColor : "inherit")}
                 {item.label}
             </div>