feat: More clear of compatible table

Magickbase · Jul 25, 2024 · 270aec5 · 270aec5
1 parent 5d011a7
commit 270aec5
Show file tree

Hide file tree

Showing 3 changed files with 35 additions and 11 deletions.
diff --git a/packages/neuron/src/pages/download/CompatibleTable/index.module.scss b/packages/neuron/src/pages/download/CompatibleTable/index.module.scss
@@ -28,8 +28,21 @@
 
     .cell {
       padding: 0 54px;
+    }
+
+    .versions {
+      display: flex;
+      flex-direction: row;
+
+      .name {
+        display: flex;
+        align-items: center;
+        padding: 0 14px;
+        border-top: 1px solid #333;
+        border-right: 1px solid #333;
+      }
 
-      &:not(:first-child) {
+      .cell {
         border-top: 1px solid #333;
       }
     }
@@ -38,6 +51,7 @@
   .nodeVerions {
     flex: 1;
     min-width: 0;
+    border-left: 1px solid #333;
   }
 }
 
@@ -51,10 +65,6 @@
   }
 }
 
-.nodeCompatibleTableWrapper {
-  border-left: 1px solid #333;
-}
-
 .nodeCompatibleTable {
   display: flex;
 

diff --git a/packages/neuron/src/pages/download/CompatibleTable/index.tsx b/packages/neuron/src/pages/download/CompatibleTable/index.tsx
@@ -40,12 +40,17 @@ const CompatibleTable$Desktop: FC<
     <div {...elProps} className={clsx(styles.compatibleTable, elProps.className)}>
       <div className={styles.neuronVersions}>
         <div className={styles.cell} />
-        <div className={styles.cell}>Neuron</div>
-        {neuronVersions.map(ver => (
-          <div key={ver} className={styles.cell}>
-            {ver}
+        <div className={styles.cell} />
+        <div className={styles.versions}>
+          <div className={styles.name}>Neuron</div>
+          <div>
+            {neuronVersions.map(ver => (
+              <div key={ver} className={styles.cell}>
+                {ver}
+              </div>
+            ))}
           </div>
-        ))}
+        </div>
       </div>
 
       {!hideFullNodeColumn && (

diff --git a/packages/neuron/src/utils/github.ts b/packages/neuron/src/utils/github.ts
@@ -296,12 +296,21 @@ export async function getRepoFileWithTextFormat(path: string): Promise<string |
   return Buffer.from(info.content, 'base64').toString('utf-8')
 }
 
+const compareVersion = (a: string, b: string) => {
+  const [aMajor, aMinor, aPatch] = a.split('.')
+  const [bMajor, bMinor, bPatch] = b.split('.')
+  if (aMajor !== bMajor) return +(bMajor ?? 0) - +(aMajor ?? 0)
+  if (aMinor !== bMinor) return +(bMinor ?? 0) - +(aMinor ?? 0)
+  if (aPatch !== bPatch) return +(bPatch ?? 0) - +(aPatch ?? 0)
+  return 0
+}
+
 export async function getNeuronCompatibleData(): Promise<CompatibleData | null> {
   const compatibleFile = await getRepoFileWithTextFormat('compatible.json')
   if (compatibleFile == null) return null
 
   const data = JSON.parse(compatibleFile) as Omit<CompatibleData, 'neuronVersions'>
-  const neuronVersions = Object.keys(data.compatible)
+  const neuronVersions = Object.keys(data.compatible).sort(compareVersion)
 
   return { ...data, neuronVersions }
 }