Update

2022-10-21 18:56:01 +02:00 · 2022-10-21 18:56:01 +02:00 · a293f48d22
--- a/spec/services.yaml
+++ b/spec/services.yaml
@ -200,7 +200,8 @@ services:
    version_conf:
      from:
        strategy: html
-        url: https://ci.gwei.cz/
+        url: https://ci.gwei.cz/web-config.js
+        query: "WOODPECKER_VERSION = \"(.+)\";"
      to:
        strategy: github

--- a/web/package-lock.json
+++ b/web/package-lock.json
@ -12,6 +12,7 @@
 				"@sveltejs/kit": "next",
 				"autoprefixer": "^10.4.12",
 				"postcss": "^8.4.18",
+				"semver": "^7.3.8",
 				"svelte": "^3.44.0",
 				"svelte-preprocess": "^4.10.7",
 				"tailwindcss": "^3.2.0",
@ -1163,6 +1164,18 @@
 				"node": ">=10"
 			}
 		},
+		"node_modules/lru-cache": {
+			"version": "6.0.0",
+			"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+			"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+			"dev": true,
+			"dependencies": {
+				"yallist": "^4.0.0"
+			},
+			"engines": {
+				"node": ">=10"
+			}
+		},
 		"node_modules/magic-string": {
 			"version": "0.26.7",
 			"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.26.7.tgz",
@ -1652,6 +1665,21 @@
 				"rimraf": "^2.5.2"
 			}
 		},
+		"node_modules/semver": {
+			"version": "7.3.8",
+			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
+			"integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
+			"dev": true,
+			"dependencies": {
+				"lru-cache": "^6.0.0"
+			},
+			"bin": {
+				"semver": "bin/semver.js"
+			},
+			"engines": {
+				"node": ">=10"
+			}
+		},
 		"node_modules/set-cookie-parser": {
 			"version": "2.5.1",
 			"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.5.1.tgz",
@ -2002,6 +2030,12 @@
 				"node": ">=0.4"
 			}
 		},
+		"node_modules/yallist": {
+			"version": "4.0.0",
+			"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+			"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+			"dev": true
+		},
 		"node_modules/yaml": {
 			"version": "1.10.2",
 			"resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
@ -2744,6 +2778,15 @@
 			"integrity": "sha512-9JROoBW7pobfsx+Sq2JsASvCo6Pfo6WWoUW79HuB1BCoBXD4PLWJPqDF6fNj67pqBYTbAHkE57M1kS/+L1neOg==",
 			"dev": true
 		},
+		"lru-cache": {
+			"version": "6.0.0",
+			"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz",
+			"integrity": "sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==",
+			"dev": true,
+			"requires": {
+				"yallist": "^4.0.0"
+			}
+		},
 		"magic-string": {
 			"version": "0.26.7",
 			"resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.26.7.tgz",
@ -3053,6 +3096,15 @@
 				"rimraf": "^2.5.2"
 			}
 		},
+		"semver": {
+			"version": "7.3.8",
+			"resolved": "https://registry.npmjs.org/semver/-/semver-7.3.8.tgz",
+			"integrity": "sha512-NB1ctGL5rlHrPJtFDVIVzTyQylMLu9N9VICA6HSFJo8MCGVTMW6gfpicwKmmK/dAjTOrqu5l63JJOpDSrAis3A==",
+			"dev": true,
+			"requires": {
+				"lru-cache": "^6.0.0"
+			}
+		},
 		"set-cookie-parser": {
 			"version": "2.5.1",
 			"resolved": "https://registry.npmjs.org/set-cookie-parser/-/set-cookie-parser-2.5.1.tgz",
@ -3258,6 +3310,12 @@
 			"integrity": "sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==",
 			"dev": true
 		},
+		"yallist": {
+			"version": "4.0.0",
+			"resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+			"integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+			"dev": true
+		},
 		"yaml": {
 			"version": "1.10.2",
 			"resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
--- a/web/package.json
+++ b/web/package.json
@ -12,6 +12,7 @@
 		"@sveltejs/kit": "next",
 		"autoprefixer": "^10.4.12",
 		"postcss": "^8.4.18",
+		"semver": "^7.3.8",
 		"svelte": "^3.44.0",
 		"svelte-preprocess": "^4.10.7",
 		"tailwindcss": "^3.2.0",
--- a/web/src/routes/+page.svelte
+++ b/web/src/routes/+page.svelte
@ -1,6 +1,7 @@
 <script>

  import { onMount } from 'svelte'
+  import semver from 'semver'

  let spec = null

@ -10,12 +11,55 @@
    spec = await resp.json()
  })

+  function renderVersion (current, latest) {
+    if (!latest) {
+      return current
+    }
+    if (!current) {
+      return '<span class="text-gray-200">-</span>'
+    }
+
+    let outdated = null
+    let isSemver = null
+    const d = { current, latest }
+
+    if (d.current.match(/^0\./) && d.latest.match(/^0\./) && d.latest.split('.').length === 4) {
+      d.current = d.current.replace(/^0\./, '')
+      d.latest = d.latest.replace(/^0\./, '')
+    }
+
+    if (d.current.match(/\.0$/) && d.current.split('.').length === 4) {
+      d.current = d.current.replace(/\.0$/, '')
+    }
+
+    if (d.current.match(/\.beta\d+/)) {
+      d.current = d.current.replace(/\.beta(\d+)/, '-beta.$1')
+    }
+    if (d.latest.match(/\.beta\d+/)) {
+      d.latest = d.latest.replace(/\.beta(\d+)/, '-beta.$1')
+    }
+    if (d.latest.split('.').length == 2) {
+      d.latest = d.latest + '.0'
+    }
+    if (d.current.split('.').length == 2) {
+      d.current = d.current + '.0'
+    }
+
+    if (semver.valid(d.current) && semver.valid(d.latest)) {
+      outdated = semver.gt(d.latest, d.current)
+      isSemver = true
+    } else {
+      outdated = d.current < d.latest
+    }
+    return `<span class="${outdated ? 'text-orange-400' : 'text-green-600'}">${current} ${isSemver ? '' : '*'}</span>`
+  }
+
  const serverCols = [
    { title: 'Name', key: 'name' },
    { title: 'Hostname', key: (s) => `<a href="https://${s.host}" class="underline hover:no-underline">${s.host}</a>` },
    { title: 'Status', key: (s) => `<a href="https://status.gwei.cz/dashboard/${s.monitor}" target="_blank"><img src="https://status.gwei.cz/api/badge/${s.monitor}/status?style=flat-square" /></a>` },
-    { title: 'Location', key: 'location' },
    { title: 'Provider', key: 'provider' },
+    { title: 'Location', key: 'location' },
  ]

  const cols = [
@ -24,8 +68,8 @@
    { title: 'Endpoint', key: (s) => s.url ? `<a href="${s.url}" class="underline hover:no-underline">${s.url.replace(/^https?:\/\//, '')}</a>` : '' },
    { title: 'Status', key: (s) => `<a href="https://status.gwei.cz/dashboard/${s.monitor}" target="_blank"><img src="https://status.gwei.cz/api/badge/${s.monitor}/status?style=flat-square" /></a>` },
    //{ title: 'Uptime', key: (s) => `<img src="https://status.gwei.cz/api/badge/${s.monitor}/uptime/24?style=flat-square" />` },
-    { title: 'Version', key: (s) => s.versions ? s.versions.local : '-' },
-    { title: 'Latest version', key: (s) => s.versions ? (s.versions.latest || 'n/a') : '-' },
+    { title: 'Version', key: (s) => s.versions ? renderVersion(s.versions.local, s.versions.latest) : '-' },
+    { title: 'Latest version', key: (s) => s.versions ? (`<a href="https://github.com/${s.repo}" target="_blank"><span class="text-gray-400">${s.versions.latest}</span></a>` || 'n/a') : '' },
  ];

 </script>
@ -52,7 +96,7 @@
      </thead>
      <tbody>
        {#each spec.servers as item}
-          <tr>
+          <tr class="hover:bg-gray-100">
            {#each serverCols as col}
              <td class="">{@html typeof col.key === 'string' ? item[col.key] : col.key(item)}</td>
            {/each}
@ -75,7 +119,7 @@
      </thead>
      <tbody>
        {#each spec.services as service}
-          <tr>
+          <tr class="hover:bg-gray-100">
            {#each cols as col}
              <td class="">{@html typeof col.key === 'string' ? service[col.key] : col.key(service)}</td>
            {/each}