feat(preview): add server/port dropdown to address bar

vibn-frontend/app/[workspace]/project/[projectId]/(home)/preview/page.tsx

@@ -71,7 +71,8 @@ export default function PreviewTab() {
     )
     .sort((a, b) => a.port - b.port); // sort ports ascending
 
-  const [selectedPort, setSelectedPort] = useState<number>(3000);
+  const selectedPort = usePreviewToolbarStore((s) => s.selectedPort);
+  const setSelectedPort = usePreviewToolbarStore((s) => s.setSelectedPort);
 
   // Auto-select logic if selectedPort is not in validPreviews
   useEffect(() => {
@@ -83,7 +84,7 @@ export default function PreviewTab() {
         validPreviews.find((p) => p.port === 3000) ?? validPreviews[0];
       if (fallback) setSelectedPort(fallback.port);
     }
-  }, [validPreviews, selectedPort]);
+  }, [validPreviews, selectedPort, setSelectedPort]);
 
   // Derive the currently selected preview
   const activePreview = validPreviews.find((p) => p.port === selectedPort);
@@ -232,27 +233,6 @@ export default function PreviewTab() {
 
   return (
     <div style={canvas}>
-      {validPreviews.length > 1 && (
-        <div style={portPickerWrap}>
-          {validPreviews.map((p) => (
-            <button
-              key={p.id}
-              onClick={() => setSelectedPort(p.port)}
-              style={
-                selectedPort === p.port ? portButtonActive : portButtonInactive
-              }
-            >
-              <div
-                style={p.state === "running" ? dotRunning : dotStarting}
-                className={p.state === "starting" ? "animate-pulse" : ""}
-              />
-              {p.name && p.name !== `port-${p.port}`
-                ? p.name
-                : `Port ${p.port}`}
-            </button>
-          ))}
-        </div>
-      )}
       <div
         style={{
           flex: 1,