@gadmin2n/schematics 0.0.72 → 0.0.74

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/RunWorkflowModal.tsx

@@ -0,0 +1,101 @@
+import React, { useState } from 'react';
+import { Button, Input, message, Modal, Typography } from 'antd';
+import { PlayCircleOutlined } from '@ant-design/icons';
+import { customRequest } from 'helpers/http';
+
+const { Text } = Typography;
+
+interface RunWorkflowModalProps {
+  workflowId: string;
+  workflowName: string;
+  onSuccess?: (instanceId: string) => void;
+}
+
+export function RunWorkflowModal({
+  workflowId,
+  workflowName,
+  onSuccess,
+}: RunWorkflowModalProps) {
+  const [open, setOpen] = useState(false);
+  const [contextJson, setContextJson] = useState('{}');
+  const [loading, setLoading] = useState(false);
+  const [jsonError, setJsonError] = useState<string | null>(null);
+
+  const handleOpen = () => {
+    setOpen(true);
+    setContextJson('{}');
+    setJsonError(null);
+  };
+
+  const handleContextChange = (value: string) => {
+    setContextJson(value);
+    try {
+      JSON.parse(value);
+      setJsonError(null);
+    } catch (e: any) {
+      setJsonError(e.message);
+    }
+  };
+
+  const handleExecute = async () => {
+    let context: Record<string, any>;
+    try {
+      context = JSON.parse(contextJson);
+    } catch {
+      message.error('Invalid JSON input');
+      return;
+    }
+
+    setLoading(true);
+    try {
+      const res = await customRequest<{ instanceId: string }>(
+        `workflow/${workflowId}/execute`,
+        'POST',
+        { context },
+      );
+      message.success('Workflow execution started');
+      setOpen(false);
+      onSuccess?.(res.instanceId);
+    } catch (e: any) {
+      message.error(e?.message || 'Failed to execute workflow');
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <>
+      <Button type="primary" icon={<PlayCircleOutlined />} onClick={handleOpen}>
+        Run
+      </Button>
+      <Modal
+        title={`Run: ${workflowName}`}
+        open={open}
+        onCancel={() => setOpen(false)}
+        onOk={handleExecute}
+        confirmLoading={loading}
+        okText="Execute"
+        okButtonProps={{ disabled: !!jsonError }}
+      >
+        <Text type="secondary" style={{ display: 'block', marginBottom: 8 }}>
+          Input context (JSON). This data will be available to all nodes.
+        </Text>
+        <Input.TextArea
+          rows={8}
+          value={contextJson}
+          onChange={(e) => handleContextChange(e.target.value)}
+          style={{ fontFamily: 'monospace', fontSize: 13 }}
+          status={jsonError ? 'error' : undefined}
+        />
+        {jsonError && (
+          <Text
+            type="danger"
+            style={{ fontSize: 12, marginTop: 4, display: 'block' }}
+          >
+            {jsonError}
+          </Text>
+        )}
+      </Modal>
+    </>
+  );
+}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/StatusCards.tsx

@@ -0,0 +1,198 @@
+import React from 'react';
+import { Card, Col, Row, Tooltip, Typography } from 'antd';
+import type { WorkflowOverview } from '../types';
+
+const { Text } = Typography;
+
+function formatDuration(seconds: number): string {
+  if (seconds <= 0) return '—';
+  if (seconds < 1) return `${Math.round(seconds * 1000)}ms`;
+  if (seconds < 60) return `${seconds.toFixed(1)}s`;
+  const m = Math.floor(seconds / 60);
+  const s = Math.round(seconds % 60);
+  return `${m}m ${s}s`;
+}
+
+interface Props {
+  overview: WorkflowOverview | null;
+  activeFilter: string | undefined;
+  onFilter: (status: string | undefined) => void;
+}
+
+export function StatusCards({ overview, activeFilter, onFilter }: Props) {
+  if (!overview) return null;
+
+  const handleClick = (key: string) => {
+    onFilter(activeFilter === key ? undefined : key);
+  };
+
+  const cardStyle = (key?: string): React.CSSProperties => ({
+    cursor: key ? 'pointer' : 'default',
+    borderColor: key && activeFilter === key ? '#1677ff' : undefined,
+    height: '100%',
+  });
+
+  return (
+    <Row gutter={12} style={{ marginBottom: 16 }}>
+      {/* Total Runs */}
+      <Col flex="1">
+        <Card size="small" style={cardStyle()}>
+          <Text type="secondary" style={{ fontSize: 14 }}>
+            Total Runs
+          </Text>
+          <div style={{ display: 'flex', alignItems: 'baseline', gap: 6 }}>
+            <span style={{ fontSize: 24, fontWeight: 600, lineHeight: 1.3 }}>
+              {overview.totalRuns.last24h}
+            </span>
+            <Text type="secondary" style={{ fontSize: 12 }}>
+              24H
+            </Text>
+          </div>
+          <Text type="secondary" style={{ fontSize: 12 }}>
+            Total: {overview.totalRuns.total}
+          </Text>
+        </Card>
+      </Col>
+
+      {/* Success Rate */}
+      <Col flex="1">
+        <Card size="small" style={cardStyle()}>
+          <Text type="secondary" style={{ fontSize: 14 }}>
+            Success Rate
+          </Text>
+          <div style={{ display: 'flex', alignItems: 'baseline', gap: 6 }}>
+            <span
+              style={{
+                fontSize: 24,
+                fontWeight: 600,
+                lineHeight: 1.3,
+                color: '#52c41a',
+              }}
+            >
+              {overview.successRate.last24h}%
+            </span>
+            <Text type="secondary" style={{ fontSize: 12 }}>
+              24H
+            </Text>
+          </div>
+          <Text type="secondary" style={{ fontSize: 12 }}>
+            Total: {overview.successRate.total}%
+          </Text>
+        </Card>
+      </Col>
+
+      {/* Failed — clickable */}
+      <Col flex="1">
+        <Card
+          size="small"
+          hoverable
+          onClick={() => handleClick('FAILED')}
+          style={cardStyle('FAILED')}
+        >
+          <Text type="secondary" style={{ fontSize: 14 }}>
+            Failed
+          </Text>
+          <div style={{ display: 'flex', alignItems: 'baseline', gap: 6 }}>
+            <span
+              style={{
+                fontSize: 24,
+                fontWeight: 600,
+                lineHeight: 1.3,
+                color: '#ff4d4f',
+              }}
+            >
+              {overview.failed.last24h}
+            </span>
+            <Text type="secondary" style={{ fontSize: 12 }}>
+              24H
+            </Text>
+          </div>
+          <Text type="secondary" style={{ fontSize: 12 }}>
+            Total: {overview.failed.total}
+          </Text>
+        </Card>
+      </Col>
+
+      {/* Duration P95 */}
+      <Col flex="1">
+        <Tooltip
+          title={
+            <>
+              <div>
+                Avg (24H): {formatDuration(overview.duration.last24h.avg)}
+              </div>
+              <div>
+                Avg (Total): {formatDuration(overview.duration.total.avg)}
+              </div>
+            </>
+          }
+        >
+          <Card size="small" style={cardStyle()}>
+            <Text type="secondary" style={{ fontSize: 14 }}>
+              Duration (P95)
+            </Text>
+            <div style={{ display: 'flex', alignItems: 'baseline', gap: 6 }}>
+              <span style={{ fontSize: 24, fontWeight: 600, lineHeight: 1.3 }}>
+                {formatDuration(overview.duration.last24h.p95)}
+              </span>
+              <Text type="secondary" style={{ fontSize: 12 }}>
+                24H
+              </Text>
+            </div>
+            <Text type="secondary" style={{ fontSize: 12 }}>
+              Total: {formatDuration(overview.duration.total.p95)}
+            </Text>
+          </Card>
+        </Tooltip>
+      </Col>
+
+      {/* Running — clickable */}
+      <Col flex="1">
+        <Card
+          size="small"
+          hoverable
+          onClick={() => handleClick('RUNNING')}
+          style={cardStyle('RUNNING')}
+        >
+          <Text type="secondary" style={{ fontSize: 14 }}>
+            Running
+          </Text>
+          <div
+            style={{
+              fontSize: 24,
+              fontWeight: 600,
+              lineHeight: 1.3,
+              color: '#1677ff',
+            }}
+          >
+            {overview.running}
+          </div>
+        </Card>
+      </Col>
+
+      {/* Pending — clickable */}
+      <Col flex="1">
+        <Card
+          size="small"
+          hoverable
+          onClick={() => handleClick('PENDING')}
+          style={cardStyle('PENDING')}
+        >
+          <Text type="secondary" style={{ fontSize: 14 }}>
+            Pending
+          </Text>
+          <div
+            style={{
+              fontSize: 24,
+              fontWeight: 600,
+              lineHeight: 1.3,
+              color: '#faad14',
+            }}
+          >
+            {overview.pending}
+          </div>
+        </Card>
+      </Col>
+    </Row>
+  );
+}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/components/VersionPanel.tsx

@@ -0,0 +1,81 @@
+import React from 'react';
+import { Button, Card, Space, Tag, Timeline, Tooltip, Typography } from 'antd';
+import { RollbackOutlined } from '@ant-design/icons';
+import type { WorkflowVersion } from '../types';
+
+const { Text } = Typography;
+
+interface Props {
+  versions: WorkflowVersion[];
+  currentVersion: number | null;
+  onSelectVersion: (version: WorkflowVersion) => void;
+  onRollback: (version: WorkflowVersion) => void;
+}
+
+export function VersionPanel({
+  versions,
+  currentVersion,
+  onSelectVersion,
+  onRollback,
+}: Props) {
+  if (versions.length === 0) {
+    return (
+      <Card size="small" title="Versions" style={{ width: 260 }}>
+        <Text type="secondary">No published versions yet.</Text>
+      </Card>
+    );
+  }
+
+  return (
+    <Card
+      size="small"
+      title="Versions"
+      style={{
+        width: 260,
+        overflowY: 'auto',
+        maxHeight: 'calc(100vh - 200px)',
+      }}
+    >
+      <Timeline
+        items={versions.map((v) => ({
+          color: v.version === currentVersion ? 'blue' : 'gray',
+          children: (
+            <div
+              style={{ cursor: 'pointer' }}
+              onClick={() => onSelectVersion(v)}
+            >
+              <Space direction="vertical" size={2} style={{ width: '100%' }}>
+                <Space>
+                  <Tag
+                    color={v.version === currentVersion ? 'blue' : undefined}
+                  >
+                    v{v.version}
+                  </Tag>
+                  {v.version !== currentVersion && (
+                    <Tooltip title="Rollback to this version">
+                      <Button
+                        size="small"
+                        type="text"
+                        icon={<RollbackOutlined />}
+                        onClick={(e) => {
+                          e.stopPropagation();
+                          onRollback(v);
+                        }}
+                      />
+                    </Tooltip>
+                  )}
+                </Space>
+                <Text type="secondary" style={{ fontSize: 12 }}>
+                  {v.changeSummary || v.prompt.slice(0, 50)}
+                </Text>
+                <Text type="secondary" style={{ fontSize: 11 }}>
+                  {new Date(v.createdAt).toLocaleString()}
+                </Text>
+              </Space>
+            </div>
+          ),
+        }))}
+      />
+    </Card>
+  );
+}