mac/behavior3editor
1
0 Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refresh layout on switch file

Browse Source
This commit is contained in:
codetypes committed 2025-03-21 23:54:35 +08:00
1 parent bc8ee05844
commit 600191eae8
8 files changed
+167 -108
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

public/locales/en.json
+7 -4
View File
@@ -1,19 +1,20 @@
{ {
"about": "About Behavior3", "about": "About Behavior3",
"add": "Add",
"actuaSize": "Actual Size", "actuaSize": "Actual Size",
"add": "Add",
"alertNewVersion": "This file is created by a newer version of Behavior3({{version}}), please upgrade to the latest version.", "alertNewVersion": "This file is created by a newer version of Behavior3({{version}}), please upgrade to the latest version.",
"build": "Build",
"batch": "Batch Script", "batch": "Batch Script",
"batchCompleted": "Batch completed", "batchCompleted": "Batch completed",
"batchFailed": "Batch failed, more information can be found in the console.", "batchFailed": "Batch failed, more information can be found in the console.",
"build": "Build",
"buildCompleted": "Build completed", "buildCompleted": "Build completed",
"buildFailed": "Build failed, more information can be found in the console.", "buildFailed": "Build failed, more information can be found in the console.",
"cancel": "Cancel", "cancel": "Cancel",
"copy": "Copy", "compact": "Compact",
"console": "Console", "console": "Console",
"cut": "Cut", "copy": "Copy",
"createProject": "Create Project", "createProject": "Create Project",
"cut": "Cut",
"delete": "Delete", "delete": "Delete",
"deleteNode": "Delete Node", "deleteNode": "Delete Node",
"devTools": "Toggle Developer Tools", "devTools": "Toggle Developer Tools",
@@ -33,6 +34,8 @@
"newFolder": "New Folder...", "newFolder": "New Folder...",
"newWindow": "New Window", "newWindow": "New Window",
"nodeDefinition": "NODES", "nodeDefinition": "NODES",
"nodeLayout": "Node Layout",
"normal": "Normal",
"open": "Open...", "open": "Open...",
"openProject": "Open Project", "openProject": "Open Project",
"paste": "Paste", "paste": "Paste",
public/locales/zh.json
+7 -4
View File
@@ -1,19 +1,20 @@
{ {
"about": "关于 Behavior3", "about": "关于 Behavior3",
"add": "添加",
"actualSize": "实际大小", "actualSize": "实际大小",
"add": "添加",
"alertNewVersion": "此文件由新版本 Behavior3({{version}}) 创建，请升级到最新版本。", "alertNewVersion": "此文件由新版本 Behavior3({{version}}) 创建，请升级到最新版本。",
"build": "构建",
"batch": "批处理脚本", "batch": "批处理脚本",
"batchCompleted": "批处理完成", "batchCompleted": "批处理完成",
"batchFailed": "批处理出现错误，详情请查看控制台！", "batchFailed": "批处理出现错误，详情请查看控制台！",
"build": "构建",
"buildCompleted": "构建完成", "buildCompleted": "构建完成",
"buildFailed": "构建出现错误，详情请查看控制台！", "buildFailed": "构建出现错误，详情请查看控制台！",
"cancel": "取消", "cancel": "取消",
"copy": "复制", "compact": "紧凑",
"console": "控制台", "console": "控制台",
"cut": "剪切", "copy": "复制",
"createProject": "新建项目", "createProject": "新建项目",
"cut": "剪切",
"delete": "删除", "delete": "删除",
"deleteNode": "删除节点", "deleteNode": "删除节点",
"devTools": "切换开发者工具", "devTools": "切换开发者工具",
@@ -33,6 +34,8 @@
"newFolder": "新建目录...", "newFolder": "新建目录...",
"newWindow": "新建窗口", "newWindow": "新建窗口",
"nodeDefinition": "节点定义", "nodeDefinition": "节点定义",
"nodeLayout": "节点布局",
"normal": "正常",
"open": "打开...", "open": "打开...",
"openProject": "打开项目", "openProject": "打开项目",
"paste": "粘贴", "paste": "粘贴",
src/components/editor.tsx
+6 -10
View File
@@ -468,6 +468,9 @@ export const Editor: FC<EditorProps> = ({ onUpdate: updateState, data: editor, .
editor.autoId = b3util.refreshTreeDataId(editor.root, editor.data.firstid); editor.autoId = b3util.refreshTreeDataId(editor.root, editor.data.firstid);
editor.graph.changeData(editor.root); editor.graph.changeData(editor.root);
editor.graph.layout(); editor.graph.layout();
if (editor.selectedId) {
selectNode(editor.selectedId);
}
restoreViewport(); restoreViewport();
}; };
@@ -945,18 +948,10 @@ export const Editor: FC<EditorProps> = ({ onUpdate: updateState, data: editor, .
direction: "LR", direction: "LR",
getHGap: () => 30, getHGap: () => 30,
getWidth: (d: TreeGraphData) => { getWidth: (d: TreeGraphData) => {
if (d.size) { return d.size![0];
return d.size[0];
} else {
return 200;
}
}, },
getHeight: (d: TreeGraphData) => { getHeight: (d: TreeGraphData) => {
if (d.size) { return d.size![1];
return d.size[1];
} else {
return 50;
}
}, },
}, },
}); });
@@ -1279,6 +1274,7 @@ export const Editor: FC<EditorProps> = ({ onUpdate: updateState, data: editor, .
useEffect(() => { useEffect(() => {
if (workspace.editing === editor) { if (workspace.editing === editor) {
checkSubtree(); checkSubtree();
editor.graph && refresh();
} }
}, [workspace.editing]); }, [workspace.editing]);
src/components/menu.tsx
+31 -2
View File
@@ -58,7 +58,12 @@ export const Menu: FC<LayoutProps> = () => {
); );
const enabled = !!workspace.workdir; const enabled = !!workspace.workdir;
const homedir = app.getPath("home"); const homedir = app.getPath("home");
const { settings } = useSetting(useShallow((state) => ({ settings: state.data }))); const { settings, setLayout } = useSetting(
useShallow((state) => ({
settings: state.data,
setLayout: state.setLayout,
}))
);
const menuTemplate: MenuItemConstructorOptions[] = useMemo(() => { const menuTemplate: MenuItemConstructorOptions[] = useMemo(() => {
const recentWorkspaces: MenuItemConstructorOptions[] = settings.recent.map((path, i) => ({ const recentWorkspaces: MenuItemConstructorOptions[] = settings.recent.map((path, i) => ({
@@ -349,6 +354,30 @@ export const Menu: FC<LayoutProps> = () => {
}, },
], ],
}, },
{
id: "menu.view.layout",
label: t("nodeLayout"),
submenu: [
{
id: "menu.view.layout.compact",
label: t("compact"),
type: "radio",
checked: settings.layout === "compact",
click: () => {
setLayout("compact");
},
},
{
id: "menu.view.layout.normal",
label: t("normal"),
type: "radio",
checked: settings.layout === "normal",
click: () => {
setLayout("normal");
},
},
],
},
], ],
}, },
{ {
@@ -365,7 +394,7 @@ export const Menu: FC<LayoutProps> = () => {
], ],
}, },
] as MenuItemConstructorOptions[]; ] as MenuItemConstructorOptions[];
}, [t, workspace.workdir, settings.recent, workspace.editing]); }, [t, workspace.workdir, settings.recent, workspace.editing, settings]);
if (isMacos) { if (isMacos) {
const menu = AppMenu.buildFromTemplate(menuTemplate); const menu = AppMenu.buildFromTemplate(menuTemplate);
src/components/register-node.ts
+100 -87
View File
@@ -4,12 +4,16 @@ import { useWorkspace } from "../contexts/workspace-context";
import { TreeGraphData, getNodeType, isExprType } from "../misc/b3type"; import { TreeGraphData, getNodeType, isExprType } from "../misc/b3type";
import { checkTreeData, nodeDefs, parseExpr, usingGroups, usingVars } from "../misc/b3util"; import { checkTreeData, nodeDefs, parseExpr, usingGroups, usingVars } from "../misc/b3util";
import i18n from "../misc/i18n"; import i18n from "../misc/i18n";
import { isMacos } from "../misc/keys";
let ctx: CanvasRenderingContext2D | null = null; let ctx: CanvasRenderingContext2D | null = null;
let defaultFontSize = ""; let defaultFontSize = "";
const textWidthMap = new Map<string, number>(); const textWidthMap = new Map<string, number>();
const textLines: Record<string, string[]> = {}; const textLines: Record<string, string[]> = {};
let layoutWidth = 220;
let layoutStyle: "compact" | "normal" = "compact";
const calcTextWith = (text: string, fontSize?: string) => { const calcTextWith = (text: string, fontSize?: string) => {
fontSize = fontSize ?? defaultFontSize; fontSize = fontSize ?? defaultFontSize;
let b3Workspace: HTMLDivElement | null; let b3Workspace: HTMLDivElement | null;
@@ -35,7 +39,7 @@ const calcTextWith = (text: string, fontSize?: string) => {
const metrics = ctx.measureText(text); const metrics = ctx.measureText(text);
width = metrics.width; width = metrics.width;
// width = width - (isMacos ? 1.6 : 0.8); // width = width - (isMacos ? 1.6 : 0.8);
// width *= isMacos ? 0.88 : 0.95; width *= isMacos ? 0.88 : 0.95;
textWidthMap.set(key, width); textWidthMap.set(key, width);
} }
} }
@@ -143,7 +147,16 @@ export const calcTreeDataSize = (data: TreeGraphData) => {
updateHeight(data.args); updateHeight(data.args);
updateHeight(data.input); updateHeight(data.input);
updateHeight(data.output); updateHeight(data.output);
return [260, height]; return [layoutWidth, height];
};
export const setLayoutStyle = (style: "compact" | "normal") => {
layoutStyle = style;
if (style === "compact") {
layoutWidth = 220;
} else {
layoutWidth = 260;
}
}; };
const NODE_COLORS = { const NODE_COLORS = {
@@ -216,10 +229,8 @@ G6.registerNode(
classify = "Error"; classify = "Error";
color = NODE_COLORS[classify]; color = NODE_COLORS[classify];
} }
const size = data.size ? data.size : [200, 40]; const [width, height] = data.size;
const w = size[0]; const radius = 4;
const h = size[1];
const r = 4;
let bgColor = "white"; let bgColor = "white";
let textColor = "black"; let textColor = "black";
@@ -234,7 +245,6 @@ G6.registerNode(
const addShape = (type: string, shapeCfg: ShapeCfg, clickEnabled: boolean = false) => { const addShape = (type: string, shapeCfg: ShapeCfg, clickEnabled: boolean = false) => {
shapeCfg.draggable = clickEnabled; shapeCfg.draggable = clickEnabled;
shapeCfg.capture = clickEnabled; shapeCfg.capture = clickEnabled;
// shapeCfg.attrs.fontFamily = "Menlo, Monaco, 'Courier New', monospace";
return group.addShape(type, shapeCfg); return group.addShape(type, shapeCfg);
}; };
@@ -242,11 +252,11 @@ G6.registerNode(
attrs: { attrs: {
x: -15, x: -15,
y: -15, y: -15,
width: w + 30, width: width + 30,
height: h + 30, height: height + 30,
fill: "#fff", fill: "#fff",
fillOpacity: 0, fillOpacity: 0,
radius: r + 4, radius: radius + 4,
}, },
name: "main-box-selected", name: "main-box-selected",
draggable: true, draggable: true,
@@ -258,12 +268,12 @@ G6.registerNode(
attrs: { attrs: {
x: 0, x: 0,
y: 0, y: 0,
width: w, width: width,
height: h, height: height,
stroke: color, stroke: color,
lineWidth: 2, lineWidth: 2,
fill: bgColor, fill: bgColor,
radius: r, radius: radius,
}, },
name: "main-box", name: "main-box",
draggable: true, draggable: true,
@@ -271,17 +281,19 @@ G6.registerNode(
true true
); );
// name line if (layoutStyle === "normal") {
addShape("path", { // name line
attrs: { addShape("path", {
path: [ attrs: {
["M", 46, 23], path: [
["L", w - 40, 23], ["M", 46, 23],
], ["L", width - 40, 23],
stroke: "#666", ],
lineWidth: 1, stroke: "#666",
}, lineWidth: 1,
}); },
});
}
// is subtree // is subtree
if (data.path && data.id !== "1") { if (data.path && data.id !== "1") {
@@ -289,12 +301,12 @@ G6.registerNode(
attrs: { attrs: {
x: -10, x: -10,
y: -10, y: -10,
width: w + 20, width: width + 20,
height: h + 20, height: height + 20,
stroke: "#a5b1be", stroke: "#a5b1be",
lineWidth: 2.5, lineWidth: 2.5,
lineDash: [6, 6], lineDash: [6, 6],
radius: [r, r, r, r], radius: [radius, radius, radius, radius],
}, },
name: "subtree", name: "subtree",
draggable: true, draggable: true,
@@ -306,10 +318,10 @@ G6.registerNode(
attrs: { attrs: {
x: 0, x: 0,
y: 0, y: 0,
width: 40, width: layoutStyle === "compact" ? width : 40,
height: h, height: layoutStyle === "compact" ? 25 : height,
fill: color, fill: color,
radius: [r, 0, 0, r], radius: layoutStyle === "compact" ? [radius, radius, 0, 0] : [radius, 0, 0, radius],
}, },
name: "name-bg", name: "name-bg",
draggable: true, draggable: true,
@@ -320,7 +332,7 @@ G6.registerNode(
attrs: { attrs: {
textBaseline: "top", textBaseline: "top",
x: -3, x: -3,
y: h / 2 - 8, y: height / 2 - 8,
fontSize: 20, fontSize: 20,
lineHeight: 20, lineHeight: 20,
text: data.id, text: data.id,
@@ -339,9 +351,9 @@ G6.registerNode(
addShape("image", { addShape("image", {
attrs: { attrs: {
x: 5, x: 5,
y: h / 2 - 16, y: layoutStyle === "compact" ? 3 : height / 2 - 16,
height: 30, height: layoutStyle === "compact" ? 18 : 30,
width: 30, width: layoutStyle === "compact" ? 18 : 30,
img, img,
}, },
name: "node-icon", name: "node-icon",
@@ -351,10 +363,10 @@ G6.registerNode(
const status = ((data.status ?? 0) & 0b111).toString(2).padStart(3, "0"); const status = ((data.status ?? 0) & 0b111).toString(2).padStart(3, "0");
addShape("image", { addShape("image", {
attrs: { attrs: {
x: w - 18, x: width - 18,
y: 3, y: 3,
height: 20, height: layoutStyle === "compact" ? 18 : 20,
width: 20, width: layoutStyle === "compact" ? 18 : 20,
img: `./icons/status${status}.svg`, img: `./icons/status${status}.svg`,
}, },
name: "status-icon", name: "status-icon",
@@ -364,12 +376,12 @@ G6.registerNode(
addShape("text", { addShape("text", {
attrs: { attrs: {
textBaseline: "top", textBaseline: "top",
x: 46, x: layoutStyle === "compact" ? 26 : 46,
y: 5, y: 5,
fontWeight: 900, fontWeight: "bolder",
text: data.name, text: data.name,
fill: textColor, fill: textColor,
fontSize: 14, fontSize: layoutStyle === "compact" ? 13 : 14,
}, },
name: "name-text", name: "name-text",
}); });
@@ -378,7 +390,7 @@ G6.registerNode(
if (data.debug) { if (data.debug) {
addShape("image", { addShape("image", {
attrs: { attrs: {
x: w - 30, x: width - 30,
y: 4, y: 4,
height: 16, height: 16,
width: 16, width: 16,
@@ -391,7 +403,7 @@ G6.registerNode(
if (data.disabled) { if (data.disabled) {
addShape("image", { addShape("image", {
attrs: { attrs: {
x: w - 30 - (data.debug ? 18 : 0), x: width - 30 - (data.debug ? 18 : 0),
y: 4, y: 4,
height: 16, height: 16,
width: 16, width: 16,
@@ -401,20 +413,21 @@ G6.registerNode(
}); });
} }
const x = 46; const contentWidth = 220;
let y = 32; const contentX = layoutStyle === "compact" ? 6 : 46;
let contentY = 32;
// desc text // desc text
let desc = (data.desc || nodeDef.desc) as string; let desc = (data.desc || nodeDef.desc) as string;
if (desc || desc === "") { if (desc || desc === "") {
desc = i18n.t("regnode.mark") + desc; desc = i18n.t("regnode.mark") + desc;
desc = cutWordTo(desc, w - 40 - 15); desc = cutWordTo(desc, contentWidth - 15);
addShape("text", { addShape("text", {
attrs: { attrs: {
textBaseline: "top", textBaseline: "top",
x, x: contentX,
y, y: contentY,
lineHeight: 20, lineHeight: 20,
fontWeight: 800, fontWeight: "bolder",
text: `${desc}`, text: `${desc}`,
fill: textColor, fill: textColor,
}, },
@@ -428,12 +441,12 @@ G6.registerNode(
if (data.highlightArgs) { if (data.highlightArgs) {
addShape("rect", { addShape("rect", {
attrs: { attrs: {
x: x - 2, x: contentX - 2,
y: y + 17, y: contentY + 17,
width: w - 40 - 6, width: contentWidth - 6,
height: 18, height: 18,
fill: "#0d1117", fill: "#0d1117",
radius: [r, r, r, r], radius: [radius, radius, radius, radius],
}, },
name: "args-text-bg", name: "args-text-bg",
}); });
@@ -441,9 +454,9 @@ G6.registerNode(
addShape("text", { addShape("text", {
attrs: { attrs: {
textBaseline: "top", textBaseline: "top",
x, x: contentX,
y: y + 20, y: contentY + 20,
w, w: width,
lineHeight: 20, lineHeight: 20,
text: str, text: str,
fill: data.highlightArgs ? "white" : textColor, fill: data.highlightArgs ? "white" : textColor,
@@ -451,7 +464,7 @@ G6.registerNode(
}, },
name: "args-text", name: "args-text",
}); });
y += 20 * line; contentY += 20 * line;
} }
const input = data.input ?? []; const input = data.input ?? [];
@@ -463,12 +476,12 @@ G6.registerNode(
if (data.highlightInput) { if (data.highlightInput) {
addShape("rect", { addShape("rect", {
attrs: { attrs: {
x: x - 2, x: contentX - 2,
y: y + 17, y: contentY + 17,
width: w - 40 - 6, width: contentWidth - 6,
height: 18, height: 18,
fill: "#0d1117", fill: "#0d1117",
radius: [r, r, r, r], radius: [radius, radius, radius, radius],
}, },
name: "input-text-bg", name: "input-text-bg",
}); });
@@ -478,8 +491,8 @@ G6.registerNode(
{ {
attrs: { attrs: {
textBaseline: "top", textBaseline: "top",
x, x: contentX,
y: y + 20, y: contentY + 20,
lineHeight: 20, lineHeight: 20,
text: str, text: str,
fill: data.highlightInput ? "white" : textColor, fill: data.highlightInput ? "white" : textColor,
@@ -489,7 +502,7 @@ G6.registerNode(
}, },
true true
); );
y += 20 * line; contentY += 20 * line;
} }
const output = data.output ?? []; const output = data.output ?? [];
@@ -501,12 +514,12 @@ G6.registerNode(
if (data.highlightOutput) { if (data.highlightOutput) {
addShape("rect", { addShape("rect", {
attrs: { attrs: {
x: x - 2, x: contentX - 2,
y: y + 17, y: contentY + 17,
width: w - 40 - 6, width: contentWidth - 6,
height: 18, height: 18,
fill: "#0d1117", fill: "#0d1117",
radius: [r, r, r, r], radius: [radius, radius, radius, radius],
}, },
name: "output-text-bg", name: "output-text-bg",
}); });
@@ -516,8 +529,8 @@ G6.registerNode(
{ {
attrs: { attrs: {
textBaseline: "top", textBaseline: "top",
x, x: contentX,
y: y + 20, y: contentY + 20,
lineHeight: 20, lineHeight: 20,
text: str, text: str,
fill: data.highlightOutput ? "white" : textColor, fill: data.highlightOutput ? "white" : textColor,
@@ -527,24 +540,24 @@ G6.registerNode(
}, },
true true
); );
y += 20 * line; contentY += 20 * line;
} }
if (data.path) { if (data.path) {
let path = (i18n.t("regnode.subtree") + data.path) as string; let path = (i18n.t("regnode.subtree") + data.path) as string;
path = cutWordTo(path, w - 40 - 15); path = cutWordTo(path, contentWidth - 15);
addShape("text", { addShape("text", {
attrs: { attrs: {
textBaseline: "top", textBaseline: "top",
x, x: contentX,
y: y + 20, y: contentY + 20,
lineHeight: 20, lineHeight: 20,
text: `${path}`, text: `${path}`,
fill: textColor, fill: textColor,
}, },
name: "subtree-text", name: "subtree-text",
}); });
y += 20; contentY += 20;
} }
addShape("rect", { addShape("rect", {
@@ -552,14 +565,14 @@ G6.registerNode(
attrs: { attrs: {
x: 0, x: 0,
y: 0, y: 0,
width: w, width: width,
height: h / 2, height: height / 2,
lineWidth: 2, lineWidth: 2,
stroke: "#ff0000", stroke: "#ff0000",
strokeOpacity: 0, strokeOpacity: 0,
fill: "#ff0000", fill: "#ff0000",
fillOpacity: 0, fillOpacity: 0,
radius: [r, r, 0, 0], radius: [radius, radius, 0, 0],
}, },
draggable: true, draggable: true,
}); });
@@ -568,15 +581,15 @@ G6.registerNode(
name: "drag-down", name: "drag-down",
attrs: { attrs: {
x: 0, x: 0,
y: h / 2, y: height / 2,
width: w, width: width,
height: h / 2, height: height / 2,
lineWidth: 2, lineWidth: 2,
stroke: "#ff0000", stroke: "#ff0000",
strokeOpacity: 0, strokeOpacity: 0,
fill: "#ff0000", fill: "#ff0000",
fillOpacity: 0, fillOpacity: 0,
radius: [0, 0, r, r], radius: [0, 0, radius, radius],
}, },
draggable: true, draggable: true,
}); });
@@ -584,16 +597,16 @@ G6.registerNode(
addShape("rect", { addShape("rect", {
name: "drag-right", name: "drag-right",
attrs: { attrs: {
x: w / 2, x: width / 2,
y: 0, y: 0,
width: w / 2, width: width / 2,
height: h, height: height,
lineWidth: 2, lineWidth: 2,
stroke: "#ff0000", stroke: "#ff0000",
strokeOpacity: 0, strokeOpacity: 0,
fill: "#ff0000", fill: "#ff0000",
fillOpacity: 0, fillOpacity: 0,
radius: [0, r, r, 0], radius: [0, radius, radius, 0],
}, },
draggable: true, draggable: true,
}); });
@@ -601,8 +614,8 @@ G6.registerNode(
if (data.children?.length) { if (data.children?.length) {
addShape("marker", { addShape("marker", {
attrs: { attrs: {
x: w, x: width,
y: h / 2, y: height / 2,
r: 6, r: 6,
symbol: G6.Marker.collapse, symbol: G6.Marker.collapse,
stroke: "#666", stroke: "#666",
src/contexts/setting-context.ts
+14
View File
@@ -1,13 +1,16 @@
import { app } from "@electron/remote"; import { app } from "@electron/remote";
import * as fs from "fs"; import * as fs from "fs";
import { create } from "zustand"; import { create } from "zustand";
import { setLayoutStyle } from "../components/register-node";
import { readJson, writeJson } from "../misc/util"; import { readJson, writeJson } from "../misc/util";
import { useWorkspace } from "./workspace-context";
const settingPath = app.getPath("userData") + "/settings.json"; const settingPath = app.getPath("userData") + "/settings.json";
export type SettingModel = { export type SettingModel = {
recent: string[]; recent: string[];
buildDir: string; buildDir: string;
layout?: "compact" | "normal";
}; };
export type SettingStore = { export type SettingStore = {
@@ -18,18 +21,22 @@ export type SettingStore = {
appendRecent: (path: string) => void; appendRecent: (path: string) => void;
removeRecent: (path: string) => void; removeRecent: (path: string) => void;
setBuildDir: (dir: string) => void; setBuildDir: (dir: string) => void;
setLayout: (layout: "compact" | "normal") => void;
}; };
export const useSetting = create<SettingStore>((set, get) => ({ export const useSetting = create<SettingStore>((set, get) => ({
data: { data: {
recent: [], recent: [],
buildDir: "", buildDir: "",
layout: "compact",
}, },
load: () => { load: () => {
try { try {
if (fs.existsSync(settingPath)) { if (fs.existsSync(settingPath)) {
const settings = readJson(settingPath) as SettingModel; const settings = readJson(settingPath) as SettingModel;
settings.layout = settings.layout || "compact";
set({ data: settings }); set({ data: settings });
setLayoutStyle(settings.layout);
} }
} catch (error) { } catch (error) {
console.error(error); console.error(error);
@@ -56,4 +63,11 @@ export const useSetting = create<SettingStore>((set, get) => ({
set({ data: { ...data, buildDir: dir } }); set({ data: { ...data, buildDir: dir } });
save(); save();
}, },
setLayout: (layout: "compact" | "normal") => {
const { data, save } = get();
set({ data: { ...data, layout } });
save();
setLayoutStyle(layout);
useWorkspace.getState().editing?.dispatch("refresh");
},
})); }));
src/misc/b3type.ts
+1 -1
View File
@@ -85,7 +85,7 @@ export interface TreeGraphData extends G6TreeGraphData {
path?: string; path?: string;
lastModified?: number; lastModified?: number;
size?: number[]; size: number[];
highlightInput?: boolean; highlightInput?: boolean;
highlightOutput?: boolean; highlightOutput?: boolean;
highlightArgs?: boolean; highlightArgs?: boolean;
src/misc/b3util.ts
+1
View File
@@ -671,6 +671,7 @@ export const createTreeData = (
disabled: node.disabled, disabled: node.disabled,
def: nodeDefs.get(node.name), def: nodeDefs.get(node.name),
parent: parent, parent: parent,
size: [0, 0],
}; };
treeData.def.args?.forEach((arg) => { treeData.def.args?.forEach((arg) => {