Merge pull request #2215 from scpwiki/info-and-fixes

Platform info page and other fixes

deepwell/src/services/page/structs.rs

@@ -135,6 +135,8 @@ pub struct GetDeletedPageOutput {
 
     #[serde(with = "time::serde::rfc3339")]
     pub page_created_at: OffsetDateTime,
+
+    #[serde(with = "time::serde::rfc3339::option")]
     pub page_updated_at: Option<OffsetDateTime>,
 
     #[serde(with = "time::serde::rfc3339")]

framerail/package.json

@@ -1,6 +1,9 @@
 {
   "name": "framerail",
-  "version": "2024.9.14",
+  "version": "2024.12.15",
+  "description": "Framerail - Wikijump frontend service",
+  "repository": "https://github.com/scpwiki/wikijump/tree/develop/framerail",
+  "license": "AGPL-3.0-or-later",
   "type": "module",
   "private": true,
   "scripts": {

framerail/src/lib/server/deepwell/index.ts

@@ -18,8 +18,12 @@ async function processRawRequest(request: JSONRPCRequest): Promise<void> {
   client.receive(data)
 }
 
-export async function ping(): void {
-  await client.request("ping")
+export async function ping(): Promise<void> {
+  await client.request("ping", {})
+}
+
+export async function info(): Promise<Record<string, any>> {
+  return client.request("info", {})
 }
 
 console.info(`Using DEEPWELL service at ${DEEPWELL_URL}`)

framerail/src/lib/server/load/info.ts

@@ -0,0 +1,41 @@
+import defaults from "$lib/defaults"
+import { parseAcceptLangHeader } from "$lib/locales"
+import { info } from "$lib/server/deepwell"
+import { translate } from "$lib/server/deepwell/translate"
+import type { TranslateKeys } from "$lib/types"
+import "$lib/vite-env.d.ts"
+import process from "process"
+
+export async function loadInfo(request, cookies) {
+  const url = new URL(request.url)
+  const domain = url.hostname
+  const sessionToken = cookies.get("wikijump_token")
+  let locales = parseAcceptLangHeader(request)
+
+  if (!locales.includes(defaults.fallbackLocale)) locales.push(defaults.fallbackLocale)
+
+  const response = await info()
+
+  let translateKeys: TranslateKeys = {
+    ...defaults.translateKeys
+  }
+
+  const viewData = {
+    backend: response,
+    frontend: {
+      name: serverInfo.frontendName,
+      description: serverInfo.frontendDescription,
+      repository: serverInfo.frontendRepository,
+      version: serverInfo.frontendVersion,
+      license: serverInfo.frontendLicense,
+      node: process.versions.node,
+      pnpm: serverInfo.pnpmVersion
+    }
+  }
+
+  const translated = await translate(locales, translateKeys)
+
+  viewData.internationalization = translated
+
+  return viewData
+}

framerail/src/lib/vite-env.d.ts

@@ -0,0 +1,8 @@
+declare const serverInfo: {
+  pnpmVersion: string | null
+  frontendName: string | null
+  frontendVersion: string | null
+  frontendDescription: string | null
+  frontendRepository: string | null
+  frontendLicense: string | null
+}

framerail/src/routes/about/+page.server.ts

@@ -0,0 +1,5 @@
+import { loadInfo } from "$lib/server/load/info"
+
+export async function load({ request, cookies }) {
+  return loadInfo(request, cookies)
+}

framerail/src/routes/about/+page.svelte

@@ -1 +1,89 @@
-<h1>UNTRANSLATED:TODO: info page</h1>
+<script lang="ts">
+  import { page } from "$app/stores"
+</script>
+
+<h1>UNTRANSLATED: Info page</h1>
+
+<textarea class="debug">{JSON.stringify($page, null, 2)}</textarea>
+
+<table class="platform-info">
+  <tbody>
+    <tr class="info-header">
+      <th colspan="2">UT:Backend</th>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package name</th>
+      <td class="info-attribute-value">{$page.data.backend.package.name}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package description</th>
+      <td class="info-attribute-value">{$page.data.backend.package.description}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package license</th>
+      <td class="info-attribute-value">{$page.data.backend.package.license}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package repository</th>
+      <td class="info-attribute-value">
+        <a href={$page.data.backend.package.repository}>
+          {$page.data.backend.package.repository}
+        </a>
+      </td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package version</th>
+      <td class="info-attribute-value">{$page.data.backend.package.version}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Rustc version</th>
+      <td class="info-attribute-value">{$page.data.backend.compile_info.rustc_version}</td
+      >
+    </tr>
+  </tbody>
+  <tbody>
+    <tr class="info-header">
+      <th colspan="2">UT:Frontend</th>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package name</th>
+      <td class="info-attribute-value">{$page.data.frontend.name}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package description</th>
+      <td class="info-attribute-value">{$page.data.frontend.description}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package license</th>
+      <td class="info-attribute-value">{$page.data.frontend.license}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package repository</th>
+      <td class="info-attribute-value">
+        <a href={$page.data.frontend.repository}>
+          {$page.data.frontend.repository}
+        </a>
+      </td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Package version</th>
+      <td class="info-attribute-value">{$page.data.frontend.version}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Node version</th>
+      <td class="info-attribute-value">{$page.data.frontend.node}</td>
+    </tr>
+    <tr class="info-attribute-row">
+      <th class="info-attribute-name">UT:Pnpm version</th>
+      <td class="info-attribute-value">{$page.data.frontend.pnpm}</td>
+    </tr>
+  </tbody>
+</table>
+
+<style lang="scss">
+  table.platform-info {
+    .info-attribute-name {
+      text-align: left;
+    }
+  }
+</style>

framerail/svelte.config.js

@@ -1,17 +1,37 @@
 import adapter from "@sveltejs/adapter-node"
-import preprocess from "svelte-preprocess"
+import { statSync } from "fs"
+import { dirname, resolve } from "path"
+import { sveltePreprocess } from "svelte-preprocess"
+import { fileURLToPath } from "url"
+
+// The former only works on node 20.11+
+const __dirname = import.meta.dirname ?? dirname(fileURLToPath(import.meta.url))
+
+function resolveAssets() {
+  try {
+    let globalAssets = statSync(resolve(__dirname, "../assets"))
+    if (globalAssets.isDirectory()) return resolve(__dirname, "../assets")
+    else return resolve(__dirname, "src/assets")
+  } catch (error) {
+    return resolve(__dirname, "src/assets")
+  }
+}
 
 /** @type {import("@sveltejs/kit").Config} */
 const config = {
   // Consult https://github.com/sveltejs/svelte-preprocess
   // for more information about preprocessors
-  preprocess: preprocess(),
+  preprocess: sveltePreprocess(),
 
   kit: {
     adapter: adapter(),
     csrf: {
       // Allow flexible hosts on local, since we don't have real DNS
       checkOrigin: process.env.FRAMERAIL_ENV !== "local"
+    },
+    alias: {
+      "$static": resolve(__dirname, "static"),
+      "$assets": resolveAssets()
     }
   },
 

framerail/tsconfig.json

@@ -1,14 +1,6 @@
 {
   "extends": "./.svelte-kit/tsconfig.json",
   "compilerOptions": {
-    "paths": {
-      "$lib": ["./src/lib"],
-      "$lib/*": ["./src/lib/*"],
-      "$static": ["./static"],
-      "$static/*": ["./static/*"],
-      "$assets": ["../assets", "./src/assets"],
-      "$assets/*": ["../assets/*", "./src/assets/*"]
-    },
     "allowJs": true,
     "checkJs": true,
     "esModuleInterop": true,

framerail/vite.config.ts

@@ -1,17 +1,12 @@
 import { sveltekit } from "@sveltejs/kit/vite"
-import { statSync } from "fs"
-import { resolve } from "path"
+import { execSync } from "child_process"
 import type { UserConfig } from "vite"
+import pkg from "./package.json"
 
-function resolveAssets() {
-  try {
-    let globalAssets = statSync(resolve(__dirname, "../assets"))
-    if (globalAssets.isDirectory()) return resolve(__dirname, "../assets")
-    else return resolve(__dirname, "src/assets")
-  } catch (error) {
-    return resolve(__dirname, "src/assets")
-  }
-}
+let pnpmVersion = null
+try {
+  pnpmVersion = execSync("pnpm -v").toString("utf-8").trim()
+} catch (_) {}
 
 const config: UserConfig = {
   server: {
@@ -20,10 +15,15 @@ const config: UserConfig = {
     strictPort: true
   },
   plugins: [sveltekit()],
-  resolve: {
-    alias: {
-      "$static": resolve(__dirname, "static"),
-      "$assets": resolveAssets()
+  define: {
+    // also update $lib/vite-env.d.ts if these defines are changed
+    serverInfo: {
+      pnpmVersion,
+      frontendName: pkg.name ?? null,
+      frontendVersion: pkg.version ?? null,
+      frontendDescription: pkg.description ?? null,
+      frontendRepository: pkg.repository ?? null,
+      frontendLicense: pkg.license ?? null
     }
   }
 }