walover-line-harness-gui 0.2.0 → 0.3.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "walover-line-harness-gui",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "description": "LINE Harness のセットアップを、ターミナルを開かずにブラウザから行うためのローカルツール",
   "license": "MIT",
   "type": "module",

package/src/server/cli-version.js

@@ -6,8 +6,12 @@
  * そのため**動作確認済みの版を固定して呼ぶ**。
  *
  * ただし固定したまま黙っていると、本家の修正に永久に追いつかない。
- * 起動時に npm の `latest` と比べ、差があれば**警告だけ**出す。
- * 自動では追従しない。追従には契約の再照合（`npm run check:contract`）が要る。
+ * 起動時に npm の `latest` と比べ、差があれば知らせる。自動では追従しない。
+ * 追従には契約の再照合（`npm run check:contract`）が要る。
+ *
+ * **強さを取り違えない。** 新しい版が出ているだけなら参加者はこのまま進めてよく、
+ * 警告として出すと進めてよいのに手が止まる。一方、固定版が npm で見つからないのは
+ * 人が確かめる必要がある。この区別を {@link VersionNotice} の tone で表す。
  *
  * > npm パッケージ（`create-line-harness`）とアプリ本体（`line-oss-crm`）は
  * > バージョンが別で、プロンプトは npm パッケージ側にある。
@@ -64,7 +68,23 @@ export async function resolveVersion(spec = "latest", options = {}) {
  * @property {string} pinned                     固定している版
  * @property {string|null} latest                npm の最新版。取れなければ null
  * @property {"pinned-is-latest"|"newer-available"|"pinned-is-newer"|"unknown"} status
- * @property {string|null} warning               画面に出す文言
+ * @property {VersionNotice|null} notice         画面に出すもの
+ * @property {string|null} warning               ターミナルに出す平文（notice から作る）
+ */
+
+/**
+ * 画面に出すときの中身。
+ *
+ * **読者は非開発者の勉強会参加者。** 版が古いこと自体は参加者の関心事ではなく、
+ * 知りたいのは「自分はこのまま進めてよいのか」だけ。
+ * headline はその答えを先に書き、版番号のような事情は detail に送る。
+ *
+ * tone は強さ。`info` は畳んで出してよいもの、`warn` は人の判断が要るもの。
+ *
+ * @typedef {object} VersionNotice
+ * @property {"info"|"warn"} tone
+ * @property {string} headline   参加者が最初に読む一文
+ * @property {string} detail     事情の説明。畳んだ中に置く
  */
 
 /**
@@ -84,6 +104,7 @@ export async function checkCliVersion(options = {}) {
       pinned,
       latest: null,
       status: "unknown",
+      notice: null,
       warning: null,
     };
   }
@@ -91,31 +112,45 @@ export async function checkCliVersion(options = {}) {
   const order = compareVersions(pinned, latest);
 
   if (order === 0) {
-    return { pinned, latest, status: "pinned-is-latest", warning: null };
+    return { pinned, latest, status: "pinned-is-latest", notice: null, warning: null };
   }
 
   if (order < 0) {
-    return {
+    // 新しい版が出ているだけ。**参加者はこのまま進めてよい。**
+    // ここを警告として強く出すと、進めてよいのに手が止まる
+    return withWarning({
       pinned,
       latest,
       status: "newer-available",
-      warning: [
-        `本家 CLI の新しい版 v${latest} が出ています（このツールが確認済みなのは v${pinned}）。`,
-        "動作未確認のため、追従には検証が必要です。このままでも v" + pinned + " でセットアップできます。",
-      ].join("\n"),
-    };
+      notice: {
+        tone: "info",
+        headline: `このまま進めて構いません。動作確認済みの v${pinned} でセットアップします。`,
+        detail:
+          `本家 CLI の新しい版 v${latest} が出ています（このツールが確認済みなのは v${pinned}）。` +
+          "追従にはプロンプト契約の再照合と検証が要るため、自動では追いかけません。",
+      },
+    });
   }
 
-  // 固定版のほうが新しい。npm 側が取り下げられた場合などに起きる
-  return {
+  // 固定版のほうが新しい。npm 側が取り下げられた場合などに起きる。
+  // これは**人が確かめる必要がある**ので、弱めない
+  return withWarning({
     pinned,
     latest,
     status: "pinned-is-newer",
-    warning: [
-      `固定している v${pinned} が npm の最新 v${latest} より新しくなっています。`,
-      "npm 側で取り下げられた可能性があります。動作未確認のため、確認が必要です。",
-    ].join("\n"),
-  };
+    notice: {
+      tone: "warn",
+      headline: "固定している版が npm で見つかりません。開発者に連絡してください。",
+      detail:
+        `固定している v${pinned} が npm の最新 v${latest} より新しくなっています。` +
+        "npm 側で取り下げられた可能性があります。動作未確認のため、確認が必要です。",
+    },
+  });
+}
+
+/** ターミナル用の平文。画面と同じ内容を1つの文字列にする */
+function withWarning(status) {
+  return { ...status, warning: `${status.notice.headline}\n${status.notice.detail}` };
 }
 
 /** @type {Promise<VersionStatus>|null} */

package/src/server/prompt-contract.js

@@ -23,7 +23,7 @@
  */
 
 /** 契約が対象とする本家 CLI のバージョン。ズレの検知は #5 で行う */
-export const CONTRACT_CLI_VERSION = "0.2.11";
+export const CONTRACT_CLI_VERSION = "0.2.12";
 
 /**
  * @typedef {object} PromptSpec
@@ -133,7 +133,9 @@ export const PROMPTS = [
     id: "lineChannelSecret",
     message: "チャネルシークレット（英数字）",
     kind: "text",
-    placeholder: "同じページに表示されている Channel Secret",
+    // 0.2.12 で本家が p.text → p.password にした。値行は伏字（▪）になり、
+    // placeholder は無くなった。宣言したままだと第二の照合が外れて止まる。
+    // message が一意なので、外しても取り違えは起きない
     secret: true,
     answer: "form",
     field: "lineChannelSecret",
@@ -148,7 +150,7 @@ export const PROMPTS = [
     id: "lineChannelAccessToken",
     message: "チャネルアクセストークン（長期）",
     kind: "text",
-    placeholder: "上の手順で発行したトークン",
+    // 同上。0.2.12 で p.password になった
     secret: true,
     answer: "form",
     field: "lineChannelAccessToken",

package/src/web/index.html

@@ -63,6 +63,16 @@
   .banner.bad { border-color: var(--err-line); background: var(--err-bg); color: var(--err); }
   .banner strong { display: block; }
 
+  /*
+   * 版のズレのように「知らせるが、進めてよい」もの。
+   * 警告（.banner）と同じ強さで出すと、進めてよいのに手が止まる
+   */
+  .note { font-size: .85rem; color: var(--muted); margin: 0 0 1rem; }
+  .note > summary { cursor: pointer; list-style-position: inside; }
+  .note > summary::marker { color: var(--muted); }
+  .note .note-detail { margin: .4rem 0 0 1.1rem; padding-left: .7rem;
+                       border-left: 2px solid var(--line); white-space: pre-line; }
+
   .status { display: flex; align-items: center; gap: .5rem; font-size: .85rem; color: var(--muted);
             margin-bottom: 1.5rem; }
   .dot { width: .55rem; height: .55rem; border-radius: 50%; background: var(--muted); flex: none; }
@@ -285,10 +295,21 @@
     );
   }
 
-  // 本家 CLI の版のズレ（固定版で動かすので、差があっても止めずに知らせるだけ）
+  // 本家 CLI の版のズレ。
+  //
+  // 固定版で動かすので、新しい版が出ているだけなら**参加者はこのまま進めてよい**。
+  // そこを警告として強く出すと、進めてよいのに手が止まる（実機で起きた）。
+  // 強さはサーバーが tone で決める。ここはそれに従って出し分けるだけ
   try {
     const version = await (await fetch("/api/version")).json();
-    if (version.warning) banner("本家 CLI のバージョン", version.warning);
+    if (version.notice?.tone === "warn") {
+      banner(version.notice.headline, version.notice.detail, true);
+    } else if (version.notice) {
+      const box = el("details", { className: "note" });
+      box.append(el("summary", { textContent: version.notice.headline }));
+      box.append(el("p", { className: "note-detail", textContent: version.notice.detail }));
+      $("banners").append(box);
+    }
   } catch {
     /* 版が確認できなくても入力は進められる */
   }