modelscript/extensions/vscode/src/libraryTreeProvider.ts at main · modelscript/modelscript · GitHub

History

284 lines (252 loc) · 9.45 KB

Raw

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

222

223

224

225

226

227

228

229

230

231

232

233

234

235

236

237

238

239

240

241

242

243

244

245

246

247

248

249

250

251

252

253

254

255

256

257

258

259

260

261

262

263

264

265

266

267

268

269

270

271

272

273

274

275

276

277

278

279

280

281

282

283

284

// SPDX-License-Identifier: AGPL-3.0-or-later

// Library tree provider for the sidebar panel.

// Communicates with the LSP server to get tree data and icons.

// - Double-click on a leaf item (model, block, connector) triggers "Add to Diagram"

// - Right-click context menu also offers "Add to Diagram"

// - Icons: SVG data URIs from the LSP when available, codicon fallback otherwise

// - Icons are loaded LAZILY after tree items are displayed, to keep expansion instant

import * as vscode from "vscode";

import { LanguageClient } from "vscode-languageclient/browser";

interface TreeNodeInfo {

id: string;

name: string;

compositeName: string;

classKind: string;

hasChildren: boolean;

iconSvg?: string;

language?: string;

}

// Map classKind to codicon (fallback when no SVG icon is available)

function classKindToIcon(kind: string): vscode.ThemeIcon {

switch (kind) {

// Modelica

case "model":

return new vscode.ThemeIcon("symbol-class");

case "block":

return new vscode.ThemeIcon("symbol-event");

case "connector":

return new vscode.ThemeIcon("symbol-interface");

case "record":

return new vscode.ThemeIcon("symbol-struct");

case "type":

return new vscode.ThemeIcon("symbol-type-parameter");

case "function":

return new vscode.ThemeIcon("symbol-function");

case "package":

return new vscode.ThemeIcon("package");

case "operator":

return new vscode.ThemeIcon("symbol-operator");

case "class":

return new vscode.ThemeIcon("symbol-class");

// SysML2 definitions

case "part def":

return new vscode.ThemeIcon("symbol-class");

case "attribute def":

return new vscode.ThemeIcon("symbol-property");

case "port def":

return new vscode.ThemeIcon("symbol-interface");

case "item def":

return new vscode.ThemeIcon("symbol-misc");

case "occurrence def":

return new vscode.ThemeIcon("symbol-event");

case "connection def":

return new vscode.ThemeIcon("git-compare");

case "interface def":

return new vscode.ThemeIcon("symbol-interface");

case "allocation def":

return new vscode.ThemeIcon("arrow-both");

case "flow def":

return new vscode.ThemeIcon("arrow-right");

case "action def":

return new vscode.ThemeIcon("run-all");

case "state def":

return new vscode.ThemeIcon("circle-large-outline");

case "calc def":

return new vscode.ThemeIcon("symbol-function");

case "constraint def":

return new vscode.ThemeIcon("warning");

case "requirement def":

return new vscode.ThemeIcon("shield");

case "concern def":

return new vscode.ThemeIcon("bell");

case "use case def":

return new vscode.ThemeIcon("account");

case "case def":

return new vscode.ThemeIcon("folder");

case "analysis case def":

return new vscode.ThemeIcon("graph");

case "verification def":

return new vscode.ThemeIcon("verified");

case "view def":

return new vscode.ThemeIcon("preview");

case "viewpoint def":

return new vscode.ThemeIcon("target");

case "rendering def":

return new vscode.ThemeIcon("paintcan");

case "metadata def":

return new vscode.ThemeIcon("tag");

case "enumeration":

return new vscode.ThemeIcon("symbol-enum");

default:

return new vscode.ThemeIcon("symbol-misc");

}

// Convert raw SVG string to a data URI that VS Code can use as an icon

function svgToIconUri(svg: string): vscode.Uri {

const bytes = new TextEncoder().encode(svg);

let binary = "";

for (const byte of bytes) {

binary += String.fromCharCode(byte);

}

const base64 = btoa(binary);

return vscode.Uri.parse(`data:image/svg+xml;base64,${base64}`);

}

export class LibraryTreeItem extends vscode.TreeItem {

constructor(

public readonly info: TreeNodeInfo,

public readonly collapsibleState: vscode.TreeItemCollapsibleState,

) {

super(info.name, collapsibleState);

this.tooltip = info.compositeName;

this.description = info.classKind;

this.contextValue = info.classKind;

// Use SVG icon from LSP if available, otherwise fall back to codicons

if (info.iconSvg) {

const iconUri = svgToIconUri(info.iconSvg);

this.iconPath = iconUri;

} else {

this.iconPath = classKindToIcon(info.classKind);

}

// For leaf items that can be added to a diagram, double-click triggers addToDiagram.

const modelicaAddable = info.classKind === "model" || info.classKind === "block" || info.classKind === "connector";

const sysml2Addable = info.language === "sysml2" && info.classKind.endsWith(" def");

const isAddable = modelicaAddable || sysml2Addable;

if (isAddable && !info.hasChildren) {

this.command = {

command: "modelscript.addToDiagram",

title: "Add to Diagram",

arguments: [info.compositeName, info.classKind, info.iconSvg],

};

}

export class LibraryTreeProvider

implements vscode.TreeDataProvider<LibraryTreeItem>, vscode.TreeDragAndDropController<LibraryTreeItem>

{

public readonly dragMimeTypes = [

"application/vnd.code.tree.modelscript.libraryTree",

"application/json",

"text/plain",

];

public readonly dropMimeTypes = [];

private _onDidChangeTreeData = new vscode.EventEmitter<LibraryTreeItem | undefined | null>();

readonly onDidChangeTreeData = this._onDidChangeTreeData.event;

private documentUri: string | undefined;

/** Cache of already-fetched SVG icons, keyed by compositeName. */

public iconCache = new Map<string, string>();

/** Set of compositeNames currently being fetched (to avoid duplicate requests). */

private iconFetchPending = new Set<string>();

constructor(private readonly client: LanguageClient) {}

refresh(uri?: string): void {

if (uri) this.documentUri = uri;

this._onDidChangeTreeData.fire(undefined);

}

setDocumentUri(uri: string): void {

if (this.documentUri !== uri) {

this.documentUri = uri;

this._onDidChangeTreeData.fire(undefined);

}

getTreeItem(element: LibraryTreeItem): vscode.TreeItem {

return element;

}

public onDragStart?: (data: { className: string; classKind: string; iconSvg?: string }) => void;

public async handleDrag(

source: readonly LibraryTreeItem[],

dataTransfer: vscode.DataTransfer,

// eslint-disable-next-line @typescript-eslint/no-unused-vars

_token: vscode.CancellationToken,

): Promise<void> {

const item = source[0];

if (!item) return;

const modelicaAddable =

item.info.classKind === "model" || item.info.classKind === "block" || item.info.classKind === "connector";

const sysml2Addable = item.info.language === "sysml2" && item.info.classKind.endsWith(" def");

const isAddable = modelicaAddable || sysml2Addable;

if (!isAddable) return;

const dragData = {

className: item.info.compositeName,

classKind: item.info.classKind,

iconSvg: item.info.iconSvg ?? this.iconCache.get(item.info.compositeName),

};

const payload = JSON.stringify(dragData);

dataTransfer.set("application/json", new vscode.DataTransferItem(payload));

dataTransfer.set("text/plain", new vscode.DataTransferItem(payload));

dataTransfer.set("application/vnd.code.tree.modelscript.libraryTree", new vscode.DataTransferItem(item));

// Notify diagram webviews to enter placement mode

this.onDragStart?.(dragData);

}

async getChildren(element?: LibraryTreeItem): Promise<LibraryTreeItem[]> {

try {

const nodes: TreeNodeInfo[] = await this.client.sendRequest("modelscript/getLibraryTree", {

uri: this.documentUri ?? "modelica:/",

parentId: element?.info.id,

});

// Apply cached icons to nodes that have them

for (const node of nodes) {

if (this.iconCache.has(node.compositeName)) {

const cached = this.iconCache.get(node.compositeName);

if (cached) node.iconSvg = cached;

}

const items = nodes.map(

(node) =>

new LibraryTreeItem(

node,

node.hasChildren ? vscode.TreeItemCollapsibleState.Collapsed : vscode.TreeItemCollapsibleState.None,

);

// Lazily fetch icons for nodes that don't have them yet.

const nodesNeedingIcons = nodes.filter(

(n) => !this.iconCache.has(n.compositeName) && !this.iconFetchPending.has(n.compositeName),

);

if (nodesNeedingIcons.length > 0) {

this.fetchIconsInBackground(nodesNeedingIcons);

}

return items;

} catch (e) {

console.error("[library-tree] Error fetching children:", e);

return [];

}

/**

* Fetch SVG icons for a batch of nodes in the background.

* When icons arrive, cache them and refresh the tree to display them.

private async fetchIconsInBackground(nodes: TreeNodeInfo[]): Promise<void> {

const toFetch = nodes.map((n) => n.compositeName);

for (const name of toFetch) this.iconFetchPending.add(name);

let anyFetched = false;

for (const className of toFetch) {

try {

const svg = await this.client

.sendRequest<string | null>("modelscript/getClassIcon", {

className,

uri: this.documentUri,

})

.catch(() => null);

this.iconCache.set(className, svg || "");

if (svg) {

anyFetched = true;

}

} finally {

this.iconFetchPending.delete(className);

}

// Refresh the tree to show the newly fetched icons

if (anyFetched) {

this._onDidChangeTreeData.fire(undefined);

}

modelscript/extensions/vscode/src/libraryTreeProvider.ts at main · modelscript/modelscript · GitHub

Uh oh!

Uh oh!

modelscript/extensions/vscode/src/libraryTreeProvider.ts at main · modelscript/modelscript · GitHub

Uh oh!

Uh oh!

Expand file tree

Breadcrumbs

libraryTreeProvider.ts

Latest commit

History

Breadcrumbs

libraryTreeProvider.ts

File metadata and controls