VS Code extension: icon, Japanese UI, graphlib notice

LICENSE-graphlib

@@ -0,0 +1,19 @@
+Copyright (c) 2012-2014 Chris Pettitt
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.

README.ja.md

@@ -160,7 +160,7 @@ module.exports = ({ config, graph }) => ({
 - [Neoloopy](https://forum.obsidian.md/t/neoloopy-think-in-feedback-loops-a-systems-thinking-tool-in-your-vault/115448) は、手で描いた因果ループ図から強化ループ・均衡ループを見つけます。
 - strace や [monkeyfs](https://pypi.org/project/monkeyfs/) はファイルの入出力を横取りします。loopfinder の Python のフックも、同じモンキーパッチの手法です。
 
-レイアウトは [dagre](https://github.com/dagrejs/dagre)（MIT、`LICENSE-dagre`）。アイコンは [Lucide](https://lucide.dev) の公式 SVG を `scripts/gen-icons.js` で改変せずに取り込んでいます（ISC。`moon` と `info` は Feather 由来で MIT。`LICENSE-lucide`）。
+レイアウトは [dagre](https://github.com/dagrejs/dagre)（MIT、`LICENSE-dagre`）と、それに同梱されている [graphlib](https://github.com/dagrejs/graphlib)（MIT、`LICENSE-graphlib`）。アイコンは [Lucide](https://lucide.dev) の公式 SVG を `scripts/gen-icons.js` で改変せずに取り込んでいます（ISC。`moon` と `info` は Feather 由来で MIT。`LICENSE-lucide`）。
 
 ## 支援について
 

README.md

@@ -192,7 +192,7 @@ module.exports = ({ config, graph }) => ({
 - strace and [monkeyfs](https://pypi.org/project/monkeyfs/) intercept file I/O; loopfinder's Python hook
   uses the same monkey-patching approach.
 
-Layout by [dagre](https://github.com/dagrejs/dagre) (MIT, see `LICENSE-dagre`). Icons from [Lucide](https://lucide.dev), vendored unmodified by `scripts/gen-icons.js` (ISC; `moon` and `info` derive from Feather, MIT; see `LICENSE-lucide`).
+Layout by [dagre](https://github.com/dagrejs/dagre) (MIT, see `LICENSE-dagre`), which bundles [graphlib](https://github.com/dagrejs/graphlib) (MIT, see `LICENSE-graphlib`). Icons from [Lucide](https://lucide.dev), vendored unmodified by `scripts/gen-icons.js` (ISC; `moon` and `info` derive from Feather, MIT; see `LICENSE-lucide`).
 
 ## Support
 

package.json

@@ -14,6 +14,7 @@
     "public/",
     "LICENSE",
     "LICENSE-dagre",
+    "LICENSE-graphlib",
     "LICENSE-lucide",
     "README.md",
     "README.ja.md"

public/app.js

@@ -349,7 +349,8 @@ function fillIcons() {
 async function main() {
   fillIcons();
   graph = host ? await host.load() : await (await fetch('flow.json', { cache: 'no-store' })).json();
-  pickLang(graph.lang);
+  // Inside VS Code the editor's display language comes before the config's; a choice made here wins over both.
+  pickLang(host?.lang?.() || graph.lang);
   const select = document.getElementById('flow');
   fillFlows(select);
   // #flow=<name> opens that flow

public/index.html

@@ -58,6 +58,7 @@ <h2 id="list-title"></h2>
         · <a href="https://ko-fi.com/motimotinotch" target="_blank" rel="noopener">Ko-fi</a>
         <br><span data-i18n="thirdParty"></span>
         <a href="https://github.com/MotimotiNotch/loopfinder/blob/main/LICENSE-dagre" target="_blank" rel="noopener">dagre (MIT)</a>
+        · <a href="https://github.com/MotimotiNotch/loopfinder/blob/main/LICENSE-graphlib" target="_blank" rel="noopener">graphlib (MIT)</a>
         · <a href="https://github.com/MotimotiNotch/loopfinder/blob/main/LICENSE-lucide" target="_blank" rel="noopener">Lucide (ISC)</a>
       </footer>
     </aside>

vscode/.vscodeignore

@@ -1,3 +1,4 @@
 scripts/**
 **/*.vsix
 **/__pycache__/**
+media/icon.svg

vscode/README.ja.md

@@ -0,0 +1,37 @@
+# loopfinder for VS Code
+
+[English](README.md)
+
+**ワークスペースのフィードバックループを見つける。意図せず作っていたものも含めて。**
+
+[loopfinder](https://github.com/MotimotiNotch/loopfinder) の CLI と画面を、エディタの中で使えるようにしたものです。
+Node を入れる必要はありません。エディタに入っている実行環境で動きます（Python は `.py` のスクリプトを記録するときだけ要ります）。
+
+## 使い方
+
+コマンドパレットから:
+
+1. **loopfinder: このワークスペースを準備** — `loopfinder/`（config.json・flows.json・AGENTS.md）を作ります。
+2. 使っている AI エージェント（Claude Code・Codex・Cursor・Copilot など）に頼みます:
+   *"Read loopfinder/AGENTS.md and survey this workspace."*
+   （**loopfinder: AI エージェントへの依頼文をコピー** でクリップボードに入ります。）エージェントが `loopfinder/flows.json` を書きます。
+3. **loopfinder: 図をビルド** — 書き込みを止めた状態でスクリプトを動かして記録し、図を組み立てます。
+4. **loopfinder: 輪を表示** — 画面を開きます。ビルドするたびに自動で描き直します（コマンドパレットからでも、
+   端末で `loopfinder build` を実行しても）。右の一覧のパスを押すと、そのファイルが開きます。
+
+画面の言語は、最初はエディタの表示言語に合わせます。画面の上の言語ボタンで切り替えると、そちらが優先されます。
+
+## 安全について
+
+ビルドは**スクリプトを実際に動かします**。書き込みは記録して捨て、通信とほかのプログラムの起動は
+`loopfinder.allowNetwork` / `loopfinder.allowSubprocess` を有効にしない限り止めます。記録係であって
+サンドボックスではないので、動かしたくないコードは記録しないでください。
+
+[信頼](https://code.visualstudio.com/docs/editor/workspace-trust)していないワークスペースでは、準備とビルドは
+使えません。ビルド済みの図を見ることはできます。
+
+`.loopfinder/`（ビルドの出力）にはファイルのパスが並びます。バージョン管理には入れないでください。
+
+## 支援
+
+[Ko-fi](https://ko-fi.com/motimotinotch) · MIT License · dagre と graphlib（MIT）、Lucide のアイコン（ISC）を同梱

vscode/README.md

@@ -1,5 +1,7 @@
 # loopfinder for VS Code
 
+[日本語](https://github.com/MotimotiNotch/loopfinder/blob/main/vscode/README.ja.md)
+
 **Find the feedback loops in your workspace — including the ones you never meant to build.**
 
 The [loopfinder](https://github.com/MotimotiNotch/loopfinder) CLI and viewer, inside the editor. No Node install
@@ -17,6 +19,8 @@ From the Command Palette:
 4. **loopfinder: Show the loops** — opens the viewer. It redraws by itself after every build, from the
    palette or from `loopfinder build` in a terminal. Click a path in the side pane to open the file.
 
+The viewer starts in the editor's display language. Picking a language with the button at the top of the viewer wins over it.
+
 ## Safety
 
 Building **really runs your scripts**. Writes are recorded and dropped; network and subprocesses are blocked
@@ -30,4 +34,4 @@ build are off; you can still view a graph that is already built.
 
 ## Support
 
-[Ko-fi](https://ko-fi.com/motimotinotch) · MIT License · bundles dagre (MIT) and Lucide icons (ISC)
+[Ko-fi](https://ko-fi.com/motimotinotch) · MIT License · bundles dagre and graphlib (MIT) and Lucide icons (ISC)

vscode/extension.js

@@ -17,6 +17,8 @@ const PUBLIC = path.join(CORE, 'public');
 const { loadConfig } = require(path.join(CORE, 'src', 'config'));
 
 const PROMPT = 'Read loopfinder/AGENTS.md and survey this workspace.';
+// Messages go through vscode.l10n (l10n/bundle.l10n.ja.json); the menus through package.nls.*.json.
+const t = (message, ...args) => vscode.l10n.t(message, ...args);
 const configOf = folder => path.join(folder, 'loopfinder', 'config.json');
 
 let output;
@@ -27,16 +29,16 @@ async function pickFolder(needConfig) {
   const folders = (vscode.workspace.workspaceFolders || []).filter(f => f.uri.scheme === 'file');
   const candidates = needConfig ? folders.filter(f => fs.existsSync(configOf(f.uri.fsPath))) : folders;
   if (!candidates.length) {
-    if (!folders.length) vscode.window.showWarningMessage('loopfinder: open a folder first.');
+    if (!folders.length) vscode.window.showWarningMessage(t('loopfinder: open a folder first.'));
     else {
-      const init = 'Set up';
-      const choice = await vscode.window.showWarningMessage('loopfinder: no loopfinder/config.json in this workspace.', ...(vscode.workspace.isTrusted ? [init] : []));
+      const init = t('Set up');
+      const choice = await vscode.window.showWarningMessage(t('loopfinder: no loopfinder/config.json in this workspace.'), ...(vscode.workspace.isTrusted ? [init] : []));
       if (choice === init) vscode.commands.executeCommand('loopfinder.init');
     }
     return null;
   }
   if (candidates.length === 1) return candidates[0].uri.fsPath;
-  const pick = await vscode.window.showQuickPick(candidates.map(f => ({ label: f.name, description: f.uri.fsPath })), { placeHolder: 'Which folder?' });
+  const pick = await vscode.window.showQuickPick(candidates.map(f => ({ label: f.name, description: f.uri.fsPath })), { placeHolder: t('Which folder?') });
   return pick ? pick.description : null;
 }
 
@@ -57,7 +59,7 @@ function runCli(folder, args, token) {
 // `enablement` only greys out the menus; a command run from code still arrives here.
 function trusted() {
   if (vscode.workspace.isTrusted) return true;
-  vscode.window.showWarningMessage('loopfinder: trust this workspace first. Building runs its scripts.');
+  vscode.window.showWarningMessage(t('loopfinder: trust this workspace first. Building runs its scripts.'));
   return false;
 }
 
@@ -66,16 +68,16 @@ async function cmdInit() {
   const folder = await pickFolder(false);
   if (!folder) return;
   const code = await runCli(folder, ['init']);
-  if (code !== 0) { showFailure('init'); return; }
-  const copy = 'Copy the request';
+  if (code !== 0) { showFailure(t('loopfinder: init failed.')); return; }
+  const copy = t('Copy the request');
   const choice = await vscode.window.showInformationMessage(
-    `loopfinder: set up. Next, ask your AI agent: "${PROMPT}" It writes loopfinder/flows.json; then build.`, copy);
+    t('loopfinder: set up. Next, ask your AI agent: "{0}" It writes loopfinder/flows.json; then build.', PROMPT), copy);
   if (choice === copy) cmdCopyPrompt();
 }
 
 function cmdCopyPrompt() {
   vscode.env.clipboard.writeText(PROMPT);
-  vscode.window.setStatusBarMessage('loopfinder: copied the request for your AI agent', 4000);
+  vscode.window.setStatusBarMessage(t('loopfinder: copied the request for your AI agent'), 4000);
 }
 
 async function cmdBuild() {
@@ -87,16 +89,16 @@ async function cmdBuild() {
   if (settings.get('allowNetwork')) args.push('--allow-network');
   if (settings.get('allowSubprocess')) args.push('--allow-subprocess');
   const code = await vscode.window.withProgress(
-    { location: vscode.ProgressLocation.Notification, title: 'loopfinder: tracing the scripts and building the graph', cancellable: true },
+    { location: vscode.ProgressLocation.Notification, title: t('loopfinder: tracing the scripts and building the graph'), cancellable: true },
     (_, token) => runCli(folder, args, token));
-  if (code !== 0) { showFailure('build'); return; }
+  if (code !== 0) { showFailure(t('loopfinder: build failed.')); return; }
   // An open viewer picks the new graph up through its watcher.
   if (!viewer || viewer.folder !== folder) show(folder);
 }
 
-async function showFailure(what) {
-  const open = 'Show output';
-  if (await vscode.window.showErrorMessage(`loopfinder: ${what} failed.`, open) === open) output.show();
+async function showFailure(message) {
+  const open = t('Show output');
+  if (await vscode.window.showErrorMessage(message, open) === open) output.show();
 }
 
 async function cmdShow() {
@@ -111,8 +113,8 @@ function readGraph(config) {
 async function show(folder) {
   const config = loadConfig(configOf(folder));
   if (!fs.existsSync(config.output)) {
-    const build = 'Build';
-    const choice = await vscode.window.showInformationMessage('loopfinder: no graph yet. Build it first.', ...(vscode.workspace.isTrusted ? [build] : []));
+    const build = t('Build');
+    const choice = await vscode.window.showInformationMessage(t('loopfinder: no graph yet. Build it first.'), ...(vscode.workspace.isTrusted ? [build] : []));
     if (choice === build) cmdBuild();
     return;
   }
@@ -128,7 +130,8 @@ async function show(folder) {
   const send = () => {
     const graph = readGraph(config);
     // A half-written file fails to parse; the watcher fires again when the write finishes.
-    if (graph) panel.webview.postMessage({ type: 'graph', graph });
+    // The editor's display language is the viewer's default language (a choice made in the viewer wins).
+    if (graph) panel.webview.postMessage({ type: 'graph', graph, lang: vscode.env.language });
   };
   panel.webview.onDidReceiveMessage(m => {
     if (m?.type === 'ready') send();
@@ -158,7 +161,7 @@ function openPath(config, p) {
   try { stat = fs.statSync(file); } catch { /* not there */ }
   if (stat?.isFile()) vscode.commands.executeCommand('vscode.open', vscode.Uri.file(file), { preview: true, viewColumn: vscode.ViewColumn.Beside });
   else if (stat?.isDirectory()) vscode.commands.executeCommand('revealInExplorer', vscode.Uri.file(file));
-  else vscode.window.showInformationMessage(`loopfinder: not a single file: ${p}`);
+  else vscode.window.showInformationMessage(t('loopfinder: not a single file: {0}', p));
 }
 
 // The viewer's own index.html, with its files served through the webview and a CSP that allows only them.

vscode/l10n/bundle.l10n.ja.json

@@ -0,0 +1,17 @@
+{
+  "loopfinder: open a folder first.": "loopfinder: 先にフォルダを開いてください。",
+  "Set up": "準備する",
+  "loopfinder: no loopfinder/config.json in this workspace.": "loopfinder: このワークスペースには loopfinder/config.json がありません。",
+  "Which folder?": "どのフォルダで動かしますか？",
+  "loopfinder: trust this workspace first. Building runs its scripts.": "loopfinder: 先にこのワークスペースを信頼してください。ビルドは中のスクリプトを実際に動かします。",
+  "loopfinder: init failed.": "loopfinder: 準備に失敗しました。",
+  "Copy the request": "依頼文をコピー",
+  "loopfinder: set up. Next, ask your AI agent: \"{0}\" It writes loopfinder/flows.json; then build.": "loopfinder: 準備しました。次に AI エージェントに「{0}」と頼んでください。エージェントが loopfinder/flows.json を書いたら、ビルドします。",
+  "loopfinder: copied the request for your AI agent": "loopfinder: AI エージェントへの依頼文をコピーしました",
+  "loopfinder: tracing the scripts and building the graph": "loopfinder: スクリプトを記録して図を組み立てています",
+  "loopfinder: build failed.": "loopfinder: ビルドに失敗しました。",
+  "Show output": "出力を見る",
+  "Build": "ビルド",
+  "loopfinder: no graph yet. Build it first.": "loopfinder: まだ図がありません。先にビルドしてください。",
+  "loopfinder: not a single file: {0}": "loopfinder: 1つのファイルではありません: {0}"
+}

vscode/media/host.js

@@ -1,14 +1,17 @@
 // The bridge between the viewer (public/app.js) and the extension. Loaded before app.js, which looks for
 // window.loopfinderHost: the graph comes by message instead of fetch('flow.json'), a rebuilt graph comes
-// the same way, a path click opens the file in the editor, and "auto" theme follows the editor's theme.
+// the same way, a path click opens the file in the editor, "auto" theme follows the editor's theme, and the
+// editor's display language is the default language.
 (() => {
   const vscode = acquireVsCodeApi();
   let waiting = null;  // load() before the first graph arrived
   let onGraph = null;  // later graphs (after a build)
+  let lang = null;     // the editor's display language, e.g. "ja" or "en-us"
 
   window.addEventListener('message', e => {
     const m = e.data;
     if (!m || m.type !== 'graph') return;
+    if (typeof m.lang === 'string') lang = m.lang.split('-')[0];
     if (waiting) { const resolve = waiting; waiting = null; resolve(m.graph); }
     else if (onGraph) onGraph(m.graph);
   });
@@ -27,6 +30,7 @@
     },
     onGraph(fn) { onGraph = fn; },
     open(path) { vscode.postMessage({ type: 'open', path }); },
+    lang: () => lang,
     theme,
     onTheme(fn) { new MutationObserver(fn).observe(document.body, { attributes: true, attributeFilter: ['class'] }); },
   };