vscode-extensions/archify-vscode-ext
1
0
Fork 0
Code Issues 4 Pull Requests Actions Packages Projects Releases Wiki Activity

Model page: Registry panel lists registry files, elements inside each

Browse Source 
- one collapsible header per .archify-registry file with its element
  count and an Open button that opens the registry view; files start
  collapsed, the Registry panel open
- view types moved to views/viewTypes.ts so the diagram page can open a
  registry without a circular import
- 0.7.1
This commit is contained in:
root-at-skic
2026-10-19 20:39:24 +03:00
parent 4382730343
commit de1a57e4c6
8 changed files with 57 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/views/diagramView.ts
+10 -6
View File
@@ -14,9 +14,9 @@ import { handleWebviewMessage, WebviewMessage } from '../webview/messages';
import { makeNonce, messagePage, modelPage, prepareDiagramHtml } from '../webview/page';
import { viewer3dOption, viewerRoots } from '../webview/viewer3d';
export const PREVIEW_VIEW_TYPE = 'archify.preview';
/** Default editor for .archify files: the rendered diagram. */
export const DIAGRAM_EDITOR_VIEW_TYPE = 'archify.diagram';
import { DIAGRAM_EDITOR_VIEW_TYPE, PREVIEW_VIEW_TYPE, REGISTRY_VIEW_TYPE } from './viewTypes';
export { DIAGRAM_EDITOR_VIEW_TYPE, PREVIEW_VIEW_TYPE };
interface PreviewState {
uri: string;
@@ -59,7 +59,11 @@ class DiagramPreview implements vscode.Disposable {
return;
}
if (message.type === 'openDiagram') {
void this.openLinked(message.path);
void this.openLinked(message.path, DIAGRAM_EDITOR_VIEW_TYPE);
return;
}
if (message.type === 'openRegistry') {
void this.openLinked(message.file, REGISTRY_VIEW_TYPE);
return;
}
void handleWebviewMessage(message, this.uri, this.panel);
@@ -96,7 +100,7 @@ class DiagramPreview implements vscode.Disposable {
}
/** Opens a diagram of the model, given its path relative to the model root. */
private async openLinked(relativePath: string): Promise<void> {
private async openLinked(relativePath: string, viewType: string): Promise<void> {
if (!this.root) return;
const target = vscode.Uri.joinPath(this.root, ...relativePath.split('/'));
try {
@@ -105,7 +109,7 @@ class DiagramPreview implements vscode.Disposable {
vscode.window.showWarningMessage(`Archify: ${relativePath} does not exist in this model.`);
return;
}
await vscode.commands.executeCommand('vscode.openWith', target, DIAGRAM_EDITOR_VIEW_TYPE, vscode.ViewColumn.Active);
await vscode.commands.executeCommand('vscode.openWith', target, viewType, vscode.ViewColumn.Active);
}
private showModelPage(model: ModelPanel): void {
src/views/registryView.ts
+2 -3
View File
@@ -7,10 +7,9 @@ import { readText } from '../util/files';
import { log } from '../util/log';
import { handleWebviewMessage, WebviewMessage } from '../webview/messages';
import { makeNonce, registryPage } from '../webview/page';
import { DIAGRAM_EDITOR_VIEW_TYPE } from './diagramView';
import { DIAGRAM_EDITOR_VIEW_TYPE, REGISTRY_VIEW_TYPE } from './viewTypes';
/** Default editor for .archify-registry files: the elements as cards, each with where it is used. */
export const REGISTRY_VIEW_TYPE = 'archify.registry';
export { REGISTRY_VIEW_TYPE };
class RegistryDocument implements vscode.CustomDocument {
constructor(readonly uri: vscode.Uri) {}
src/views/viewTypes.ts
+6
View File
@@ -0,0 +1,6 @@
/** Custom editor view types, in one place so views can refer to each other without importing each other. */
export const PREVIEW_VIEW_TYPE = 'archify.preview';
/** Default editor for .archify files: the rendered diagram. */
export const DIAGRAM_EDITOR_VIEW_TYPE = 'archify.diagram';
/** Default editor for .archify-registry files: the elements as cards. */
export const REGISTRY_VIEW_TYPE = 'archify.registry';
src/webview/page.ts
+27 -5
View File
@@ -189,6 +189,7 @@ function bridgeScript(options: PageOptions): string {
// Collapsible panels of the model page; open/closed is kept in the webview state.
function panelStates() { return (vscode.getState() || {}).modelPanels || {}; }
function panel(key, className, title, count, defaultOpen) {
// count: a number or a short text such as "3 files".
var details = el('details', 'archify-model-panel ' + className);
var saved = panelStates()[key];
details.open = saved === undefined ? defaultOpen : saved;
@@ -446,13 +447,30 @@ function bridgeScript(options: PageOptions): string {
});
holder.appendChild(list);
});
// Registry elements as Archify info cards: the same cards a diagram shows below itself.
// Registry: one collapsible header per registry file, its elements as cards inside.
if (model.registry.length) {
var registryPanel = panel('registry', 'archify-model-registry', 'Registry', model.registry.length, false);
var files = [];
var byFile = {};
model.registry.forEach(function (element) {
if (!byFile[element.file]) { byFile[element.file] = []; files.push(element.file); }
byFile[element.file].push(element);
});
files.sort();
var registryPanel = panel('registry', 'archify-model-registry', 'Registry', files.length + (files.length === 1 ? ' file' : ' files'), true);
body.appendChild(registryPanel);
var cards = el('div', 'cards archify-model-cards');
model.registry.forEach(function (element) { cards.appendChild(elementCard(element)); });
registryPanel.appendChild(cards);
files.forEach(function (file) {
var elements = byFile[file].slice().sort(function (a, b) { return a.line - b.line; });
var filePanel = panel('registry:' + file, 'archify-model-folder archify-model-registry-file', file.replace(/\.archify-registry$/, ''), elements.length + (elements.length === 1 ? ' element' : ' elements'), false);
var open = el('button', 'archify-model-used-link archify-model-open-file', 'Open');
open.type = 'button';
open.title = 'Open ' + file;
open.addEventListener('click', function (event) { event.preventDefault(); event.stopPropagation(); post({ type: 'openRegistry', file: file, line: 0 }); });
filePanel.firstChild.appendChild(open);
var cards = el('div', 'cards archify-model-cards');
elements.forEach(function (element) { cards.appendChild(elementCard(element)); });
filePanel.appendChild(cards);
registryPanel.appendChild(filePanel);
});
}
if (anchor && anchor.parentNode) anchor.parentNode.insertBefore(body, anchor.nextSibling); else document.body.appendChild(body);
}
@@ -502,6 +520,10 @@ const MODEL_STYLE = `
.archify-model-folder > .archify-model-summary { padding: 0.55rem 0.75rem; font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--m-muted); font-family: ui-monospace, Menlo, monospace; }
.archify-model-folder > .archify-model-summary:hover { color: var(--m-accent); }
.archify-model-folder > .archify-model-list { margin: 0 0.75rem; }
.archify-model-registry-file > .archify-model-summary { text-transform: none; letter-spacing: 0; font-size: 0.8125rem; }
.archify-model-registry-file > .archify-model-cards { margin: 0.25rem 0.75rem 0; }
.archify-model-open-file { margin-left: 0.5rem; text-transform: none; letter-spacing: 0; font-family: inherit; }
.archify-model-open-file:hover { color: var(--m-accent); }
.archify-model-diagrams > .archify-model-list { margin-top: 0.25rem; }
.archify-model-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0.5rem; }
.archify-model-open { display: flex; flex-direction: column; gap: 0.2rem; width: 100%; padding: 0.7rem 0.85rem; text-align: left; cursor: pointer; font: inherit; color: var(--m-text); background: var(--m-panel); border: 1px solid var(--m-border); border-radius: 0.6rem; transition: border-color 0.15s, transform 0.15s; }