Skip to content

Commit 24d3b44

Browse files
shczhenhalajohn
shczhen
and
halajohn
authored
fix: designer fe issues (#794)
Co-authored-by: Hu Yueh-Wei <wei.hu.tw@gmail.com>
1 parent 298e36f commit 24d3b44

File tree

15 files changed

+761
-165
lines changed

15 files changed

+761
-165
lines changed

‎bun.lock

Lines changed: 420 additions & 0 deletions
Large diffs are not rendered by default.

‎core/src/ten_manager/designer_frontend/bun.lock

Lines changed: 227 additions & 75 deletions
Large diffs are not rendered by default.

‎core/src/ten_manager/designer_frontend/package.json

Lines changed: 42 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -11,86 +11,86 @@
1111
"test:e2e": "playwright test"
1212
},
1313
"dependencies": {
14-
"@autoform/react": "^3.0.0",
15-
"@autoform/zod": "^2.1.0",
14+
"@autoform/react": "^3.1.0",
15+
"@autoform/zod": "^2.2.0",
1616
"@hookform/resolvers": "^4.1.3",
1717
"@monaco-editor/react": "^4.7.0",
18-
"@radix-ui/react-accordion": "^1.2.3",
19-
"@radix-ui/react-checkbox": "^1.1.5",
20-
"@radix-ui/react-context-menu": "^2.2.6",
21-
"@radix-ui/react-dialog": "^1.1.6",
22-
"@radix-ui/react-dropdown-menu": "^2.1.6",
23-
"@radix-ui/react-label": "^2.1.3",
24-
"@radix-ui/react-navigation-menu": "^1.2.5",
25-
"@radix-ui/react-popover": "^1.1.6",
26-
"@radix-ui/react-scroll-area": "^1.2.3",
27-
"@radix-ui/react-select": "^2.1.7",
28-
"@radix-ui/react-separator": "^1.1.2",
29-
"@radix-ui/react-slot": "^1.2.0",
30-
"@radix-ui/react-switch": "^1.1.4",
31-
"@radix-ui/react-tabs": "^1.1.3",
32-
"@radix-ui/react-toggle": "^1.1.3",
33-
"@radix-ui/react-tooltip": "^1.1.8",
34-
"@tanstack/react-table": "^8.21.2",
18+
"@radix-ui/react-accordion": "^1.2.10",
19+
"@radix-ui/react-checkbox": "^1.3.1",
20+
"@radix-ui/react-context-menu": "^2.2.14",
21+
"@radix-ui/react-dialog": "^1.1.13",
22+
"@radix-ui/react-dropdown-menu": "^2.1.14",
23+
"@radix-ui/react-label": "^2.1.6",
24+
"@radix-ui/react-navigation-menu": "^1.2.12",
25+
"@radix-ui/react-popover": "^1.1.13",
26+
"@radix-ui/react-scroll-area": "^1.2.8",
27+
"@radix-ui/react-select": "^2.2.4",
28+
"@radix-ui/react-separator": "^1.1.6",
29+
"@radix-ui/react-slot": "^1.2.2",
30+
"@radix-ui/react-switch": "^1.2.4",
31+
"@radix-ui/react-tabs": "^1.1.11",
32+
"@radix-ui/react-toggle": "^1.1.8",
33+
"@radix-ui/react-tooltip": "^1.2.6",
34+
"@tanstack/react-table": "^8.21.3",
3535
"@types/react-window": "^1.8.8",
3636
"@xterm/addon-attach": "^0.11.0",
3737
"@xterm/addon-fit": "^0.10.0",
3838
"@xterm/addon-unicode11": "^0.8.0",
3939
"@xterm/addon-web-links": "^0.11.0",
4040
"@xterm/xterm": "^5.5.0",
41-
"@xyflow/react": "^12.4.4",
41+
"@xyflow/react": "^12.6.0",
4242
"class-variance-authority": "^0.7.1",
4343
"clsx": "^2.1.1",
4444
"cmdk": "^1.1.1",
4545
"dagre": "^0.8.5",
4646
"date-fns": "^4.1.0",
4747
"i18next": "^24.2.3",
48-
"i18next-browser-languagedetector": "^8.0.4",
48+
"i18next-browser-languagedetector": "^8.1.0",
4949
"i18next-http-backend": "^3.0.2",
5050
"lucide-react": "^0.473.0",
5151
"monaco-editor": "^0.52.2",
52-
"motion": "^12.5.0",
52+
"motion": "^12.10.0",
5353
"next-themes": "^0.4.6",
5454
"pino": "^9.6.0",
5555
"react": "^18.3.1",
5656
"react-day-picker": "8.10.1",
5757
"react-dom": "^18.3.1",
58-
"react-hook-form": "^7.55.0",
59-
"react-i18next": "^15.4.1",
58+
"react-hook-form": "^7.56.2",
59+
"react-i18next": "^15.5.1",
6060
"react-icons": "^5.5.0",
61-
"react-resizable-panels": "^2.1.7",
62-
"react-virtualized-auto-sizer": "^1.0.25",
61+
"react-resizable-panels": "^2.1.9",
62+
"react-virtualized-auto-sizer": "^1.0.26",
6363
"react-window": "^1.8.11",
64-
"recharts": "^2.15.1",
64+
"recharts": "^2.15.3",
6565
"sonner": "^1.7.4",
6666
"swr": "^2.3.3",
6767
"tailwind-merge": "^3.2.0",
6868
"tailwindcss-animate": "^1.0.7",
69-
"zod": "^3.24.2",
70-
"zustand": "^5.0.3"
69+
"zod": "^3.24.4",
70+
"zustand": "^5.0.4"
7171
},
7272
"devDependencies": {
73-
"@eslint/js": "^9.22.0",
74-
"@playwright/test": "^1.51.0",
75-
"@tailwindcss/postcss": "^4.1.4",
73+
"@eslint/js": "^9.26.0",
74+
"@playwright/test": "^1.52.0",
75+
"@tailwindcss/postcss": "^4.1.5",
7676
"@types/dagre": "^0.7.52",
77-
"@types/node": "^22.13.10",
78-
"@types/react": "^18.3.18",
79-
"@types/react-dom": "^18.3.5",
80-
"@vitejs/plugin-react-swc": "^3.8.0",
77+
"@types/node": "^22.15.14",
78+
"@types/react": "^18.3.21",
79+
"@types/react-dom": "^18.3.7",
80+
"@vitejs/plugin-react-swc": "^3.9.0",
8181
"esbuild": "^0.24.2",
82-
"eslint": "^9.22.0",
82+
"eslint": "^9.26.0",
8383
"eslint-plugin-react-hooks": "^5.2.0",
84-
"eslint-plugin-react-refresh": "^0.4.19",
84+
"eslint-plugin-react-refresh": "^0.4.20",
8585
"globals": "^15.15.0",
8686
"pino-pretty": "^13.0.0",
87-
"playwright": "^1.51.0",
87+
"playwright": "^1.52.0",
8888
"postcss": "^8.5.3",
8989
"prettier": "^3.5.3",
9090
"prettier-plugin-tailwindcss": "^0.6.11",
91-
"tailwindcss": "^4.1.4",
91+
"tailwindcss": "^4.1.5",
9292
"typescript": "~5.7.3",
93-
"typescript-eslint": "^8.26.1",
94-
"vite": "^6.2.2"
93+
"typescript-eslint": "^8.32.0",
94+
"vite": "^6.3.5"
9595
}
9696
}

‎core/src/ten_manager/designer_frontend/src/components/Widget/AppsWidget.tsx

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -228,6 +228,10 @@ export const AppsManagerWidget = (props: { className?: string }) => {
228228
}
229229
} finally {
230230
mutate();
231+
updateCurrentWorkspace({
232+
graph: null,
233+
});
234+
setNodesAndEdges([], []);
231235
setIsReloading(false);
232236
}
233237
};
@@ -254,8 +258,8 @@ export const AppsManagerWidget = (props: { className?: string }) => {
254258
disableSearch: true,
255259
title: t("popup.logViewer.appInstall"),
256260
},
257-
postActions: () => {
258-
postReloadApps(baseDir);
261+
postActions: async () => {
262+
await reloadApps(baseDir);
259263
},
260264
},
261265
popup: {

‎core/src/ten_manager/designer_frontend/src/components/Widget/BackstageWidgets.tsx

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -4,25 +4,27 @@
44
// Licensed under the Apache License, Version 2.0, with certain conditions.
55
// Refer to the "LICENSE" file in the root directory for more information.
66
//
7+
import * as React from "react";
8+
79
import { LogViewerBackstageWidget } from "@/components/Widget/LogViewerWidget";
810
import { useWidgetStore } from "@/store/widget";
911
import { EWidgetCategory } from "@/types/widgets";
1012

1113
export function BackstageWidgets() {
1214
const { backstageWidgets } = useWidgetStore();
1315

16+
const [logViewerWidgets] = React.useMemo(() => {
17+
const logViewerWidgets = backstageWidgets.filter(
18+
(widget) => widget.category === EWidgetCategory.LogViewer
19+
);
20+
return [logViewerWidgets];
21+
}, [backstageWidgets]);
22+
1423
return (
1524
<>
16-
{backstageWidgets.map((widget) => {
17-
switch (widget.category) {
18-
case EWidgetCategory.LogViewer:
19-
return (
20-
<LogViewerBackstageWidget key={widget.widget_id} {...widget} />
21-
);
22-
default:
23-
return null;
24-
}
25-
})}
25+
{logViewerWidgets.map((widget) => (
26+
<LogViewerBackstageWidget key={widget.widget_id} {...widget} />
27+
))}
2628
</>
2729
);
2830
}

‎core/src/ten_manager/designer_frontend/src/components/Widget/ExtensionWidget/ExtensionList.tsx

Lines changed: 9 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,7 @@ export const ExtensionBaseItem = React.forwardRef<
187187
className={cn(
188188
"px-1 py-2",
189189
"flex gap-2 w-full items-center max-w-full font-roboto h-fit",
190-
"hover:bg-gray-100 dark:hover:bg-gray-800",
190+
"hover:bg-ten-fill-4 rounded-sm",
191191
{
192192
"cursor-pointer": !!rest?.onClick && !readOnly,
193193
},
@@ -205,48 +205,32 @@ export const ExtensionBaseItem = React.forwardRef<
205205
<h3
206206
className={cn(
207207
"font-semibold w-full overflow-hidden text-ellipsis",
208-
"text-gray-900 dark:text-gray-100"
208+
"text-foreground"
209209
)}
210210
>
211211
{item.name}
212212
{_type === EPackageSource.Local && (
213-
<span
214-
className={cn(
215-
"text-gray-500 dark:text-gray-400",
216-
"text-xs font-normal"
217-
)}
218-
>
213+
<span className={cn("text-ten-icontext-2", "text-xs font-normal")}>
219214
{t("extensionStore.localAddonTip")}
220215
</span>
221216
)}
222217
</h3>
223-
<p className={cn("text-xs text-gray-500 dark:text-gray-400")}>
218+
<p className={cn("text-xs text-ten-icontext-2 font-thin")}>
224219
{item.type}
225220
</p>
226221
</div>
227-
<div className="mt-auto flex flex-col items-end">
222+
<div className="my-auto flex flex-col items-end">
228223
{isInstalled ? (
229224
<>
230-
<Button
231-
variant="ghost"
232-
size="icon"
233-
disabled
234-
className={cn(
235-
"size-4 [&_svg]:size-3 cursor-pointer",
236-
"hover:bg-gray-200 dark:hover:bg-gray-700"
237-
)}
238-
>
239-
<CheckIcon className="" />
240-
</Button>
225+
<CheckIcon className="size-4" />
241226
</>
242227
) : (
243228
<Button
244-
variant="secondary"
245-
size="sm"
229+
variant="outline"
230+
size="xs"
246231
className={cn(
247232
"text-xs px-2 py-0.5 font-normal h-fit cursor-pointer",
248-
"shadow-none rounded-none",
249-
"hover:bg-gray-200 dark:hover:bg-gray-700"
233+
"shadow-none"
250234
)}
251235
disabled={readOnly || !currentWorkspace?.app?.base_dir}
252236
onClick={handleInstall(

‎core/src/ten_manager/designer_frontend/src/components/Widget/LogViewerWidget.tsx

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,13 +23,19 @@ export function LogViewerBackstageWidget(props: ILogViewerWidget) {
2323
} = props;
2424

2525
const wsRef = React.useRef<WebSocket | null>(null);
26+
const hasConnectedRef = React.useRef(false);
2627

2728
React.useEffect(() => {
2829
if (!wsUrl || !scriptType || !script) {
2930
return;
3031
}
3132

33+
if (hasConnectedRef.current) {
34+
return;
35+
}
36+
3237
wsRef.current = new WebSocket(wsUrl);
38+
hasConnectedRef.current = true;
3339

3440
wsRef.current.onopen = () => {
3541
console.log("[LogViewerWidget] WebSocket connected!");
@@ -81,6 +87,7 @@ export function LogViewerBackstageWidget(props: ILogViewerWidget) {
8187

8288
return () => {
8389
// Close the connection when the component is unmounted.
90+
hasConnectedRef.current = false;
8491
wsRef.current?.close();
8592
};
8693
// eslint-disable-next-line react-hooks/exhaustive-deps

‎core/src/ten_manager/designer_frontend/src/components/Widget/utils.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ export const convertExtensionPropertySchema2ZodSchema = (
3030
switch (type) {
3131
case "int64":
3232
case "int32":
33+
case "uint32":
3334
zodType = z.coerce
3435
.number()
3536
.superRefine(

‎core/src/ten_manager/designer_frontend/src/components/ui/Button.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@ const buttonVariants = cva(
3030
},
3131
size: {
3232
default: "h-[var(--size-base)] px-4 py-2",
33-
xs: "h-[var(--size-xs)] rounded-md px-2 text-xs [_svg]:size-3",
33+
xs: "h-[var(--size-xs)] rounded-sm px-2 text-xs [_svg]:size-3",
3434
sm: "h-[var(--size-sm)] rounded-md px-3 text-xs",
3535
lg: "h-[var(--size-lg)] rounded-md px-8",
3636
xl: "h-[var(--size-xl)] rounded-md px-8",

‎core/src/ten_manager/designer_frontend/src/components/ui/Input.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ const Input = React.forwardRef<HTMLInputElement, React.ComponentProps<"input">>(
1515
<input
1616
type={type}
1717
className={cn(
18-
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
18+
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-base transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
1919
className
2020
)}
2121
ref={ref}

‎core/src/ten_manager/designer_frontend/src/components/ui/Select.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ function SelectTrigger({
3838
<SelectPrimitive.Trigger
3939
data-slot="select-trigger"
4040
className={cn(
41-
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex h-9 w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
41+
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive flex h-9 w-fit items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-2 text-sm whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
4242
className
4343
)}
4444
{...props}

‎core/src/ten_manager/designer_frontend/src/types/widgets.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -187,7 +187,7 @@ export interface ILogViewerWidgetData<T extends ELogViewerScriptType> {
187187
scriptType: T;
188188
script: z.infer<(typeof LogViewerScriptSchemaMap)[T]>;
189189
options?: ILogViewerWidgetOptions;
190-
postActions?: () => void;
190+
postActions?: () => void | Promise<void>;
191191
}
192192

193193
export interface ILogViewerWidget

‎core/src/ten_runtime/binding/nodejs/bun.lock

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"lockfileVersion": 1,
3+
"workspaces": {
4+
"": {
5+
"name": "ten-runtime-nodejs",
6+
"devDependencies": {
7+
"@types/node": "^18.14.5",
8+
"source-map-support": "^0.5.21",
9+
"typescript": "^5.7.2",
10+
},
11+
},
12+
},
13+
"packages": {
14+
"@types/node": ["@types/node@18.19.97", "", { "dependencies": { "undici-types": "~5.26.4" } }, "sha512-4r3Y9EuCJjWduiam85Fo4GBQtneaEuoaBSdiKo+o6qwQUh0JFVBe7cRUK6I6yVzA0S1gBJJfoQx4VtBH4e5ikg=="],
15+
16+
"buffer-from": ["buffer-from@1.1.2", "", {}, "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ=="],
17+
18+
"source-map": ["source-map@0.6.1", "", {}, "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="],
19+
20+
"source-map-support": ["source-map-support@0.5.21", "", { "dependencies": { "buffer-from": "^1.0.0", "source-map": "^0.6.0" } }, "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w=="],
21+
22+
"typescript": ["typescript@5.8.3", "", { "bin": { "tsc": "bin/tsc", "tsserver": "bin/tsserver" } }, "sha512-p1diW6TqL9L07nNxvRMM7hMMw4c5XOo/1ibL4aAIGmSAt9slTE1Xgw5KWuof2uTOvCg9BY7ZRi+GaF+7sfgPeQ=="],
23+
24+
"undici-types": ["undici-types@5.26.5", "", {}, "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA=="],
25+
}
26+
}

‎core/src/ten_runtime/binding/nodejs/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,9 @@
66
"build": "tsc --listEmittedFiles"
77
},
88
"devDependencies": {
9-
"@types/node": "^18.14.5",
9+
"@types/node": "^18.19.97",
1010
"source-map-support": "^0.5.21",
11-
"typescript": "^5.7.2"
11+
"typescript": "^5.8.3"
1212
},
1313
"main": "build/index.js",
1414
"types": "build/index.d.ts"

‎package.json

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
{
22
"devDependencies": {
3-
"@types/node": "^22.13.5",
4-
"eslint": "^9.21.0",
5-
"eslint-config-prettier": "^10.1.1",
6-
"eslint-plugin-prettier": "^5.2.6",
3+
"@types/node": "^22.15.14",
4+
"eslint": "^9.26.0",
5+
"eslint-config-prettier": "^10.1.3",
6+
"eslint-plugin-prettier": "^5.4.0",
77
"prettier": "^3.5.3",
8-
"typescript-eslint": "^8.29.0"
8+
"typescript-eslint": "^8.32.0"
99
}
1010
}

0 commit comments

Comments
 (0)