Improved UI

web/src/InterfaceList.tsx

@@ -13,9 +13,10 @@ interface Props {
   onSelect?: (id: string) => void;
   onEdit?: (iface?: Interface) => void;
   onEditId?: (id: string) => void;
+  width?: number;
 }
 
-export default function InterfaceList({ onLoad, onSelect, onEdit, onEditId }: Props) {
+export default function InterfaceList({ onLoad, onSelect, onEdit, onEditId, width }: Props) {
   const [collapsed, setCollapsed] = useState(false);
   const [interfaces, setInterfaces] = useState<ServerInterface[]>([]);
   const [loading, setLoading] = useState(true);
@@ -66,7 +67,7 @@ export default function InterfaceList({ onLoad, onSelect, onEdit, onEditId }: Pr
   }
 
   return (
-    <aside class={`panel${collapsed ? ' collapsed' : ''}`}>
+    <aside class={`panel${collapsed ? ' collapsed' : ''}`} style={!collapsed && width ? `width:${width}px;min-width:${width}px;` : undefined}>
       <div class="panel-header">
         {!collapsed && <span class="panel-title">Interfaces</span>}
         <button