@motiadev/workbench 0.6.4-beta.131-487060 → 0.6.4-beta.131-508662

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -49,6 +49,7 @@ const applyMiddleware = async (app, port) => {
49
49
  __dirname, // workbench root
50
50
  path_1.default.join(process.cwd(), './steps'), // steps directory
51
51
  path_1.default.join(process.cwd(), './tutorial.tsx'), // tutorial file
52
+ path_1.default.join(process.cwd(), './node_modules'), // node_modules directory
52
53
  ],
53
54
  },
54
55
  },
@@ -17,5 +17,5 @@ export const FlowTabMenuItem = () => {
17
17
  selectFlowId(flowId);
18
18
  analytics.track('flow_selected', { flow: flowId });
19
19
  };
20
- return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs("div", { "data-testid": "flows-dropdown-trigger", className: "flex flex-row justify-center items-center gap-2 cursor-pointer", children: [_jsx(Workflow, {}), selectedFlowId ?? 'No flow selected', _jsx(ChevronsUpDown, { className: "size-4" })] }) }), _jsx(DropdownMenuContent, { className: "bg-background text-foreground flows-dropdown", children: flows.map((item) => (_jsx(DropdownMenuItem, { "data-testid": `dropdown-${item}`, className: "cursor-pointer gap-2 flow-link", onClick: () => handleFlowSelect(item), children: item }, `dropdown-${item}`))) })] }));
20
+ return (_jsxs("div", { className: "flex flex-row justify-center items-center gap-2 cursor-pointer", children: [_jsx(Workflow, {}), selectedFlowId ?? 'No flow selected', _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsx("div", { "data-testid": "flows-dropdown-trigger", className: "flex flex-row justify-center items-center gap-2 cursor-pointer", children: _jsx(ChevronsUpDown, { className: "size-4" }) }) }), _jsx(DropdownMenuContent, { className: "bg-background text-foreground flows-dropdown", children: flows.map((item) => (_jsx(DropdownMenuItem, { "data-testid": `dropdown-${item}`, className: "cursor-pointer gap-2 flow-link", onClick: () => handleFlowSelect(item), children: item }, `dropdown-${item}`))) })] })] }));
21
21
  };
@@ -1,12 +1,11 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
- import { Button } from '@motiadev/ui';
2
+ import { Button, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@motiadev/ui';
3
3
  import { Rocket } from 'lucide-react';
4
4
  import { useState } from 'react';
5
5
  import { analytics } from '@/lib/analytics';
6
6
  export const DeployButton = () => {
7
7
  const [isOpen, setIsOpen] = useState(false);
8
- const onOpen = () => {
9
- setIsOpen(true);
8
+ const onDeployButtonClick = () => {
10
9
  analytics.track('deploy_button_clicked');
11
10
  };
12
11
  const onDeployClick = () => {
@@ -17,5 +16,13 @@ export const DeployButton = () => {
17
16
  setIsOpen(false);
18
17
  analytics.track('deploy_button_closed');
19
18
  };
20
- return (_jsxs(_Fragment, { children: [isOpen && (_jsxs("div", { children: [_jsx("div", { className: "fixed inset-0 z-[9999] bg-black/20 backdrop-blur-sm", onClick: () => setIsOpen(false) }), _jsxs("div", { className: "driver-popover w-[600px]! fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-[10000] animate-in fade-in-0 zoom-in-95", children: [_jsx("img", { src: "https://oxhhfuuoqzsaqthfairn.supabase.co/storage/v1/object/public/public-images/preview.png", alt: "Motia Cloud", className: "driver-popover-image object-cover", style: { height: 393, width: '100%' } }), _jsx("div", { className: "driver-popover-title", children: _jsx("h2", { className: "popover-title", children: "Motia Cloud is Live!" }) }), _jsx("div", { className: "driver-popover-description", children: "Deploy to production in minutes, not hours. One click gets your Motia project live with enterprise-grade reliability. Seamlessly scale, rollback instantly, and monitor everything in real-time. Your code deserves infrastructure that just works." }), _jsx("a", { href: "https://www.motia.dev/docs/concepts/deployment/motia-cloud/features", target: "_blank", className: "text-foreground text-xs font-semibold px-4 hover:underline", children: "Learn more about Motia Cloud" }), _jsx("div", { className: "driver-popover-footer flex items-center justify-end", children: _jsxs("div", { className: "driver-popover-navigation-btns flex gap-6", children: [_jsx("button", { className: "tutorial-opt-out-button text-sm! font-semibold! text-muted-foreground!", onClick: onClose, children: "Close" }), _jsx("a", { href: "https://motia.cloud?utm_source=workbench&utm_medium=referral", target: "_blank", onClick: onDeployClick, children: _jsx("button", { className: "driver-popover-next-btn", children: "Deploy!" }) })] }) })] })] })), _jsxs(Button, { variant: "ghost", onClick: onOpen, className: "font-semibold text-sm dark:bg-white dark:text-black dark:hover:bg-white/90 bg-black/90 hover:bg-black/80 text-white", children: [_jsx(Rocket, {}), "Deploy"] })] }));
19
+ const onMotiaCloudClick = () => {
20
+ setIsOpen(true);
21
+ analytics.track('deploy_button_motia_cloud_clicked');
22
+ };
23
+ const onSelfHostedClick = () => {
24
+ analytics.track('deploy_button_self_hosted_clicked');
25
+ window.open('https://www.motia.dev/docs/concepts/deployment/self-hosted', '_blank');
26
+ };
27
+ return (_jsxs(_Fragment, { children: [isOpen && (_jsxs("div", { children: [_jsx("div", { className: "fixed inset-0 z-[9999] bg-black/20 backdrop-blur-sm", onClick: () => setIsOpen(false) }), _jsxs("div", { className: "driver-popover w-[600px]! fixed top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 z-[10000] animate-in fade-in-0 zoom-in-95", children: [_jsx("img", { src: "https://oxhhfuuoqzsaqthfairn.supabase.co/storage/v1/object/public/public-images/preview.png", alt: "Motia Cloud", className: "driver-popover-image object-cover", style: { height: 393, width: '100%' } }), _jsx("div", { className: "driver-popover-title", children: _jsx("h2", { className: "popover-title", children: "Motia Cloud is Live!" }) }), _jsx("div", { className: "driver-popover-description", children: "Deploy to production in minutes, not hours. One click gets your Motia project live with enterprise-grade reliability. Seamlessly scale, rollback instantly, and monitor everything in real-time. Your code deserves infrastructure that just works." }), _jsx("a", { href: "https://www.motia.dev/docs/concepts/deployment/motia-cloud/features", target: "_blank", className: "text-foreground text-xs font-semibold px-4 hover:underline", children: "Learn more about Motia Cloud" }), _jsx("div", { className: "driver-popover-footer flex items-center justify-end", children: _jsxs("div", { className: "driver-popover-navigation-btns flex gap-6", children: [_jsx("button", { className: "tutorial-opt-out-button text-sm! font-semibold! text-muted-foreground!", onClick: onClose, children: "Close" }), _jsx("a", { href: "https://motia.cloud?utm_source=workbench&utm_medium=referral", target: "_blank", onClick: onDeployClick, children: _jsx("button", { className: "driver-popover-next-btn", children: "Deploy!" }) })] }) })] })] })), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", className: "font-semibold text-sm dark:bg-white dark:text-black dark:hover:bg-white/90 bg-black/90 hover:bg-black/80 text-white", onClick: onDeployButtonClick, children: [_jsx(Rocket, {}), "Deploy"] }) }), _jsxs(DropdownMenuContent, { className: "bg-background text-foreground w-56", children: [_jsx(DropdownMenuItem, { className: "cursor-pointer h-10 font-semibold", onClick: onMotiaCloudClick, children: "Motia Cloud" }), _jsx(DropdownMenuItem, { className: "cursor-pointer h-10 font-semibold", onClick: onSelfHostedClick, children: "Self-Hosted (Docker)" })] })] })] }));
21
28
  };
@@ -3,10 +3,19 @@ import { TraceTimeline } from '@/components/observability/trace-timeline';
3
3
  import { useStreamGroup } from '@motiadev/stream-client-react';
4
4
  import { TracesGroups } from '@/components/observability/traces-groups';
5
5
  import { useGlobalStore } from '../../stores/use-global-store';
6
+ import { useEffect } from 'react';
6
7
  export const TracesPage = () => {
7
8
  const selectedGroupId = useGlobalStore((state) => state.selectedTraceGroupId);
8
9
  const selectTraceGroupId = useGlobalStore((state) => state.selectTraceGroupId);
9
10
  const { data } = useStreamGroup({ streamName: 'motia-trace-group', groupId: 'default' });
10
11
  const handleGroupSelect = (group) => selectTraceGroupId(group.id);
12
+ useEffect(() => {
13
+ if (data && data.length > 0) {
14
+ const group = data[data.length - 1];
15
+ if (group && group.status === 'running' && group.id !== selectedGroupId) {
16
+ selectTraceGroupId(group.id);
17
+ }
18
+ }
19
+ }, [data]);
11
20
  return (_jsxs("div", { className: "flex flex-1 overflow-hidden h-full", children: [_jsx("div", { className: "max-w-1/3 border-r border-border overflow-auto h-full", "data-testid": "traces-container", children: _jsx(TracesGroups, { groups: data, selectedGroupId: selectedGroupId, onGroupSelect: handleGroupSelect }) }), _jsxs("div", { className: "flex-2 overflow-auto", "data-testid": "trace-details", children: [selectedGroupId && _jsx(TraceTimeline, { groupId: selectedGroupId }), !selectedGroupId && (_jsx("div", { className: "flex items-center justify-center h-full text-muted-foreground", children: "Select a trace or trace group to view the timeline" }))] })] }));
12
21
  };