From c40bece80f4681fefae47fde452516769af50d8d Mon Sep 17 00:00:00 2001
From: devinxl <devin@nodereal.io>
Date: Wed, 20 Mar 2024 15:11:49 +0800
Subject: [PATCH] fix(dcellar-web-ui): unavailable sp not placed last, dev
 startup port auto-increment issue

---
 apps/dcellar-web-ui/.eslintrc.js              |  2 +-
 apps/dcellar-web-ui/package.json              |  2 +-
 apps/dcellar-web-ui/scripts/dev.js            | 40 +++++++++++++++++++
 .../bucket/components/SPSelector/index.tsx    |  8 ++--
 4 files changed, 46 insertions(+), 6 deletions(-)
 create mode 100644 apps/dcellar-web-ui/scripts/dev.js

diff --git a/apps/dcellar-web-ui/.eslintrc.js b/apps/dcellar-web-ui/.eslintrc.js
index a800745f..72b3cf05 100644
--- a/apps/dcellar-web-ui/.eslintrc.js
+++ b/apps/dcellar-web-ui/.eslintrc.js
@@ -20,7 +20,7 @@ module.exports = {
     sourceType: 'module',
   },
   plugins: ['react', '@typescript-eslint'],
-  ignorePatterns: ['next.config.js', 'public/wasm/**.js'],
+  ignorePatterns: ['next.config.js', 'public/wasm/**.js', 'scripts/**.js'],
   rules: {
     '@typescript-eslint/no-explicit-any': 'off',
     '@typescript-eslint/no-unused-vars': 'off',
diff --git a/apps/dcellar-web-ui/package.json b/apps/dcellar-web-ui/package.json
index 7c84177c..d255e98a 100644
--- a/apps/dcellar-web-ui/package.json
+++ b/apps/dcellar-web-ui/package.json
@@ -3,7 +3,7 @@
   "version": "0.3.0",
   "private": false,
   "scripts": {
-    "dev": "next dev -p 3101",
+    "dev": "node ./scripts/dev.js -p 3200",
     "build": "next build",
     "start": "next start",
     "lint": "next lint",
diff --git a/apps/dcellar-web-ui/scripts/dev.js b/apps/dcellar-web-ui/scripts/dev.js
new file mode 100644
index 00000000..4517b626
--- /dev/null
+++ b/apps/dcellar-web-ui/scripts/dev.js
@@ -0,0 +1,40 @@
+#!/usr/bin/env node
+
+const { execSync } = require('child_process');
+
+const args = process.argv.slice(2);
+
+let port = 3200; // Default port is 3200
+
+// Parsing command line arguments
+for (let i = 0; i < args.length; i++) {
+  const arg = args[i];
+  if (arg === '-p' || arg === '--port') {
+    const nextArg = args[i + 1];
+    if (nextArg && !isNaN(nextArg)) {
+      port = parseInt(nextArg, 10);
+    } else {
+      console.error('Invalid port number. Please provide a valid port number.');
+      process.exit(1);
+    }
+  }
+}
+
+function getNextAvailablePort(port) {
+  const command = `lsof -ti:${port}`;
+  try {
+    execSync(command);
+    return getNextAvailablePort(port + 1);
+  } catch (error) {
+    return port;
+  }
+}
+
+function startNextServer(port) {
+  const command = `next dev -p ${port}`;
+  console.log(`Starting Next.js server on port ${port}`);
+  execSync(command, { stdio: 'inherit' });
+}
+
+const availablePort = getNextAvailablePort(port);
+startNextServer(availablePort);
diff --git a/apps/dcellar-web-ui/src/modules/bucket/components/SPSelector/index.tsx b/apps/dcellar-web-ui/src/modules/bucket/components/SPSelector/index.tsx
index 316b48ad..993a59bc 100644
--- a/apps/dcellar-web-ui/src/modules/bucket/components/SPSelector/index.tsx
+++ b/apps/dcellar-web-ui/src/modules/bucket/components/SPSelector/index.tsx
@@ -58,17 +58,17 @@ export const SPSelector = memo<SPSelectorProps>(function SPSelector({ onChange }
     return tmpValue.includes(tmpKeyword) || tmpName.includes(tmpKeyword);
   };
 
-  // Sort SPs with unavailable HTTP services or unavailable statuses last, and the rest by ascending latency.
+  // Sort: Based on the recommended system's sp data, ascending order of latency values for sps -> No sp data from the recommended system -> Unavailable sps
   const options: MenuOption[] = useMemo(
     () =>
       sort(allSpList, (sp) => {
         const meta = spMetaRecords[sp.endpoint];
-        if (!meta) {
-          return Number.MAX_SAFE_INTEGER;
-        }
         if (unAvailableSps.includes(sp.operatorAddress) || sp.status !== 0) {
           return Infinity;
         }
+        if (!meta) {
+          return Number.MAX_SAFE_INTEGER;
+        }
 
         return meta.Latency;
       }).map((item) => {