@gadmin2n/schematics 0.0.140 → 0.0.142

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/approval-channels/index.tsx

@@ -17,6 +17,12 @@ import {
   message,
 } from 'antd';
 import { customRequest } from 'helpers/http';
+import { PageHeader } from 'components';
+import {
+  NESTED_CARD_PROPS,
+  PAGE_WRAPPER_STYLE,
+  SEARCH_CARD_PROPS,
+} from 'constants/layout';
 import { useCallback, useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { ApprovalChannelModal } from './ApprovalChannelModal';
@@ -48,50 +54,41 @@ export default function ApprovalChannelsPage() {
   useEffect(() => void load(), [load]);
 
   return (
-    <div style={{ padding: 24 }}>
-      <Card>
-        <div
-          style={{
-            display: 'flex',
-            justifyContent: 'space-between',
-            alignItems: 'flex-start',
-            gap: 16,
-            marginBottom: 20,
-          }}
-        >
-          <div>
-            <Typography.Title level={3} style={{ margin: 0 }}>
-              {t('approvalChannel.title')}
-            </Typography.Title>
-            <Typography.Text type="secondary">
-              {t('approvalChannel.subtitle')}
-            </Typography.Text>
-          </div>
-          <Button
-            type="primary"
-            icon={<PlusOutlined />}
-            onClick={() => setEditing(null)}
-          >
-            {t('approvalChannel.newChannel')}
-          </Button>
-        </div>
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title={t('approvalChannel.title')}
+        subtitle={t('approvalChannel.subtitle')}
+        extra={
+          <Space>
+            <Button icon={<ReloadOutlined />} onClick={load} />
+            <Button
+              type="primary"
+              icon={<PlusOutlined />}
+              onClick={() => setEditing(null)}
+            >
+              {t('approvalChannel.newChannel')}
+            </Button>
+          </Space>
+        }
+      />
 
-        <Space style={{ marginBottom: 18 }}>
-          <Input.Search
-            allowClear
-            placeholder={t('approvalChannel.search')}
-            onSearch={setQuery}
-            style={{ width: 300 }}
-          />
-          <Button icon={<ReloadOutlined />} onClick={load}>
-            {t('common.refresh')}
-          </Button>
-        </Space>
+      {/* Search Card */}
+      <Card {...SEARCH_CARD_PROPS}>
+        <Input.Search
+          allowClear
+          placeholder={t('approvalChannel.search')}
+          onSearch={setQuery}
+          style={{ width: 300 }}
+        />
+      </Card>
 
+      {/* Content Card */}
+      <Card>
         {loading ? (
-          <div style={{ textAlign: 'center', padding: 60 }}>
-            <Spin />
-          </div>
+          <Spin
+            size="large"
+            style={{ display: 'block', margin: '48px auto' }}
+          />
         ) : channels.length === 0 ? (
           <Empty description={t('approvalChannel.empty')} />
         ) : (
@@ -103,7 +100,12 @@ export default function ApprovalChannelsPage() {
             }}
           >
             {channels.map((channel) => (
-              <Card key={channel.code} size="small" hoverable>
+              <Card
+                key={channel.code}
+                size="small"
+                hoverable
+                {...NESTED_CARD_PROPS}
+              >
                 <div
                   style={{
                     display: 'flex',
@@ -189,9 +191,9 @@ function WorkflowStep({
       style={{
         minWidth: 0,
         padding: '10px 12px',
-        border: '1px solid #d9d9d9',
+        border: '1px solid var(--ant-color-border-secondary)',
         borderRadius: 8,
-        background: '#fafafa',
+        background: 'var(--ant-color-fill-quaternary)',
       }}
     >
       <Space size={6}>

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

@@ -117,7 +117,7 @@ describe.each([
   ['FlowRenderer', FlowRenderer],
   ['EnhancedFlowRenderer', EnhancedFlowRenderer],
 ] as const)('%s new-node defaults', (_name, Renderer) => {
-  it('gives a new Return Result node an approval result from the previous step', () => {
+  it('gives a new Return Result node ordinary data from the previous step', () => {
     const onDslChange = vi.fn();
     render(
       <Renderer dsl={{ nodes: [], edges: [] }} onDslChange={onDslChange} />,
@@ -131,8 +131,10 @@ describe.each([
           expect.objectContaining({
             type: 'return_result',
             config: expect.objectContaining({
-              resultType: 'APPROVAL_SUBJECTS',
+              resultType: 'JSON',
               sourceMode: 'INPUT',
+              httpStatusCode: 200,
+              httpHeaders: {},
             }),
           }),
         ],
@@ -187,6 +189,8 @@ describe.each([
               path: expect.stringMatching(/^external-/),
               secret: expect.stringMatching(/^[a-f0-9]{64}$/),
               verificationMode: 'HMAC',
+              responseMode: 'IMMEDIATE',
+              responseTimeoutSeconds: 60,
             }),
           }),
         ],

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

@@ -18,6 +18,12 @@ import {
   ReloadOutlined,
 } from '@ant-design/icons';
 import { customRequest } from 'helpers/http';
+import { PageHeader } from 'components';
+import {
+  NESTED_CARD_PROPS,
+  PAGE_WRAPPER_STYLE,
+  SEARCH_CARD_PROPS,
+} from 'constants/layout';
 import { ConnectionModal } from './ConnectionModal';
 import type { IntegrationConnection } from './connection.types';
 import { useTranslation } from 'react-i18next';
@@ -50,47 +56,41 @@ export default function ConnectionsPage() {
   useEffect(() => void load(), [load]);
 
   return (
-    <div style={{ padding: 24 }}>
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title={t('connection.title')}
+        subtitle={t('connection.subtitle')}
+        extra={
+          <Space>
+            <Button icon={<ReloadOutlined />} onClick={load} />
+            <Button
+              type="primary"
+              icon={<PlusOutlined />}
+              onClick={() => setEditing(null)}
+            >
+              {t('connection.new')}
+            </Button>
+          </Space>
+        }
+      />
+
+      {/* Search Card */}
+      <Card {...SEARCH_CARD_PROPS}>
+        <Input.Search
+          allowClear
+          placeholder={t('connection.search')}
+          onSearch={setQuery}
+          style={{ width: 300 }}
+        />
+      </Card>
+
+      {/* Content Card */}
       <Card>
-        <div
-          style={{
-            display: 'flex',
-            justifyContent: 'space-between',
-            gap: 16,
-            marginBottom: 20,
-          }}
-        >
-          <div>
-            <Typography.Title level={3} style={{ margin: 0 }}>
-              {t('connection.title')}
-            </Typography.Title>
-            <Typography.Text type="secondary">
-              {t('connection.subtitle')}
-            </Typography.Text>
-          </div>
-          <Button
-            type="primary"
-            icon={<PlusOutlined />}
-            onClick={() => setEditing(null)}
-          >
-            {t('connection.new')}
-          </Button>
-        </div>
-        <Space style={{ marginBottom: 18 }}>
-          <Input.Search
-            allowClear
-            placeholder={t('connection.search')}
-            onSearch={setQuery}
-            style={{ width: 300 }}
-          />
-          <Button icon={<ReloadOutlined />} onClick={load}>
-            {t('common.refresh')}
-          </Button>
-        </Space>
         {loading ? (
-          <div style={{ textAlign: 'center', padding: 60 }}>
-            <Spin />
-          </div>
+          <Spin
+            size="large"
+            style={{ display: 'block', margin: '48px auto' }}
+          />
         ) : connections.length === 0 ? (
           <Empty description={t('connection.empty')} />
         ) : (
@@ -102,7 +102,12 @@ export default function ConnectionsPage() {
             }}
           >
             {connections.map((connection) => (
-              <Card key={connection.code} size="small" hoverable>
+              <Card
+                key={connection.code}
+                size="small"
+                hoverable
+                {...NESTED_CARD_PROPS}
+              >
                 <div
                   style={{
                     display: 'flex',
@@ -112,7 +117,11 @@ export default function ConnectionsPage() {
                 >
                   <Space align="start">
                     <ApiOutlined
-                      style={{ color: '#1677ff', fontSize: 20, marginTop: 3 }}
+                      style={{
+                        color: 'var(--ant-color-primary)',
+                        fontSize: 20,
+                        marginTop: 3,
+                      }}
                     />
                     <div>
                       <Typography.Text strong>

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

@@ -11,7 +11,6 @@ import {
   Table,
   Tag,
   Tooltip,
-  Typography,
   message,
 } from 'antd';
 import {
@@ -33,8 +32,9 @@ import { ExportModal } from './components/ExportModal';
 import { ImportModal } from './components/ImportModal';
 import type { Workflow, WorkflowOverview } from './types';
 import { useTranslation } from 'react-i18next';
+import { PageHeader } from 'components';
+import { PAGE_WRAPPER_STYLE, SEARCH_CARD_PROPS } from 'constants/layout';
 
-const { Title } = Typography;
 const PAGE_SIZE = 20;
 
 function RunDot({
@@ -402,23 +402,10 @@ export default function WorkflowListPage() {
   ];
 
   return (
-    <div
-      style={{
-        background: 'var(--ant-color-bg-layout)',
-        minHeight: 'calc(100vh - 64px)',
-      }}
-    >
-      <Card style={{ marginBottom: 16 }}>
-        <div
-          style={{
-            display: 'flex',
-            justifyContent: 'space-between',
-            alignItems: 'center',
-          }}
-        >
-          <Title level={4} style={{ margin: 0 }}>
-            {t('list.title')}
-          </Title>
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title={t('list.title')}
+        extra={
           <Space>
             <Tooltip title="查看 WorkflowEventOutbox 表原始数据">
               <Button
@@ -445,8 +432,8 @@ export default function WorkflowListPage() {
             </Button>
             <Button icon={<ReloadOutlined />} onClick={fetchData} />
           </Space>
-        </div>
-      </Card>
+        }
+      />
 
       <StatusCards
         overview={overview}
@@ -454,7 +441,7 @@ export default function WorkflowListPage() {
         onFilter={setFilterInstanceStatus}
       />
 
-      <Card style={{ marginBottom: 16 }}>
+      <Card {...SEARCH_CARD_PROPS}>
         <Space wrap>
           <Select
             placeholder="Status"

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

@@ -12,6 +12,7 @@ import {
 import { ArrowLeftOutlined } from '@ant-design/icons';
 import { useNavigate, useParams, useSearchParams } from 'react-router-dom';
 import { customRequest } from 'helpers/http';
+import { HEADER_CARD_PROPS, PAGE_WRAPPER_STYLE } from 'constants/layout';
 
 const { Title } = Typography;
 const PAGE_SIZE = 20;
@@ -183,13 +184,8 @@ export default function WorkflowInstancesPage() {
   ];
 
   return (
-    <div
-      style={{
-        background: 'var(--ant-color-bg-layout)',
-        minHeight: 'calc(100vh - 64px)',
-      }}
-    >
-      <Card style={{ marginBottom: 16 }}>
+    <div style={PAGE_WRAPPER_STYLE}>
+      <Card {...HEADER_CARD_PROPS}>
         <div
           style={{
             display: 'flex',
@@ -224,7 +220,7 @@ export default function WorkflowInstancesPage() {
         </div>
       </Card>
 
-      <Card>
+      <Card className="card-table">
         <Table
           rowKey="id"
           loading={loading}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/node-instances/index.tsx

@@ -10,7 +10,6 @@ import {
   Table,
   Tag,
   Tooltip,
-  Typography,
   message,
 } from 'antd';
 import {
@@ -22,9 +21,10 @@ import {
 } from '@ant-design/icons';
 import { useSearchParams, useNavigate } from 'react-router-dom';
 import { customRequest } from 'helpers/http';
+import { PageHeader } from 'components';
+import { PAGE_WRAPPER_STYLE, SEARCH_CARD_PROPS } from 'constants/layout';
 import type { WorkflowNodeType } from '../types';
 
-const { Title } = Typography;
 const PAGE_SIZE = 20;
 
 interface NodeInstance {
@@ -226,23 +226,10 @@ export default function NodeInstanceListPage() {
   ];
 
   return (
-    <div
-      style={{
-        background: 'var(--ant-color-bg-layout)',
-        minHeight: 'calc(100vh - 64px)',
-      }}
-    >
-      <Card style={{ marginBottom: 16 }}>
-        <div
-          style={{
-            display: 'flex',
-            justifyContent: 'space-between',
-            alignItems: 'center',
-          }}
-        >
-          <Title level={4} style={{ margin: 0 }}>
-            Node instance mgnts
-          </Title>
+    <div style={PAGE_WRAPPER_STYLE}>
+      <PageHeader
+        title="Node instance mgnts"
+        extra={
           <Space>
             <Button
               type="primary"
@@ -253,10 +240,10 @@ export default function NodeInstanceListPage() {
             </Button>
             <Button icon={<ReloadOutlined />} onClick={fetchData} />
           </Space>
-        </div>
-      </Card>
+        }
+      />
 
-      <Card style={{ marginBottom: 16 }}>
+      <Card {...SEARCH_CARD_PROPS}>
         <Space wrap>
           <Select
             placeholder="Node Type"

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/node-instances/widgets/ExternalRequestConfigEditor.test.tsx

@@ -90,4 +90,46 @@ describe('ExternalRequestConfigEditor', () => {
       screen.getByText(/Anyone who knows this endpoint/),
     ).toBeInTheDocument();
   });
+
+  it('lets the caller wait for the final Workflow return value', async () => {
+    const onChange = vi.fn();
+
+    function Harness() {
+      const [value, setValue] = useState<
+        NonNullable<Parameters<typeof ExternalRequestConfigEditor>[0]['value']>
+      >({
+        path: 'create-ticket',
+        method: 'POST',
+        verificationMode: 'NONE',
+        responseMode: 'IMMEDIATE',
+      });
+      return (
+        <ExternalRequestConfigEditor
+          value={value}
+          onChange={(next) => {
+            onChange(next);
+            setValue(next);
+          }}
+          schema={schema}
+        />
+      );
+    }
+
+    render(<Harness />);
+    await screen.findByDisplayValue(
+      'http://10.20.30.40:14003/api/workflow/webhook/myoa-callback',
+    );
+    fireEvent.click(
+      screen.getByRole('radio', { name: /Wait for Workflow result/ }),
+    );
+
+    expect(onChange).toHaveBeenLastCalledWith({
+      path: 'create-ticket',
+      method: 'POST',
+      verificationMode: 'NONE',
+      responseMode: 'WAIT_FOR_RESULT',
+      responseTimeoutSeconds: 60,
+    });
+    expect(screen.getByRole('spinbutton')).toHaveValue('60');
+  });
 });

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/node-instances/widgets/ExternalRequestConfigEditor.tsx

@@ -4,6 +4,7 @@ import {
   Button,
   Card,
   Input,
+  InputNumber,
   Radio,
   Space,
   Tag,
@@ -20,6 +21,8 @@ type ExternalRequestConfig = {
   method?: string;
   secret?: string;
   verificationMode?: 'HMAC' | 'NONE';
+  responseMode?: 'IMMEDIATE' | 'WAIT_FOR_RESULT';
+  responseTimeoutSeconds?: number;
 };
 
 export function ExternalRequestConfigEditor({
@@ -30,6 +33,8 @@ export function ExternalRequestConfigEditor({
   const { t } = useTranslation('workflow');
   const config = value ?? {};
   const verificationMode = config.verificationMode === 'NONE' ? 'NONE' : 'HMAC';
+  const responseMode =
+    config.responseMode === 'WAIT_FOR_RESULT' ? 'WAIT_FOR_RESULT' : 'IMMEDIATE';
   const [endpoint, setEndpoint] = useState('');
   const [endpointLoadFailed, setEndpointLoadFailed] = useState(false);
 
@@ -101,6 +106,78 @@ export function ExternalRequestConfigEditor({
         </Space>
       </Card>
 
+      <Card size="small" title={t('externalRequest.response')}>
+        <Radio.Group
+          value={responseMode}
+          disabled={disabled}
+          onChange={(event) => {
+            const nextMode = event.target.value as
+              | 'IMMEDIATE'
+              | 'WAIT_FOR_RESULT';
+            onChange({
+              ...config,
+              method: 'POST',
+              responseMode: nextMode,
+              ...(nextMode === 'WAIT_FOR_RESULT' && {
+                responseTimeoutSeconds:
+                  config.responseTimeoutSeconds &&
+                  config.responseTimeoutSeconds >= 1 &&
+                  config.responseTimeoutSeconds <= 300
+                    ? config.responseTimeoutSeconds
+                    : 60,
+              }),
+            });
+          }}
+        >
+          <Space direction="vertical" size={12}>
+            <Radio value="IMMEDIATE">
+              <Space direction="vertical" size={0}>
+                <Typography.Text>
+                  {t('externalRequest.respondImmediately')}
+                </Typography.Text>
+                <Typography.Text type="secondary">
+                  {t('externalRequest.respondImmediatelyHint')}
+                </Typography.Text>
+              </Space>
+            </Radio>
+            <Radio value="WAIT_FOR_RESULT">
+              <Space direction="vertical" size={0}>
+                <Typography.Text>
+                  {t('externalRequest.waitForResult')}
+                </Typography.Text>
+                <Typography.Text type="secondary">
+                  {t('externalRequest.waitForResultHint')}
+                </Typography.Text>
+              </Space>
+            </Radio>
+          </Space>
+        </Radio.Group>
+        {responseMode === 'WAIT_FOR_RESULT' && (
+          <div style={{ marginTop: 16 }}>
+            <Typography.Text>
+              {t('externalRequest.responseTimeout')}
+            </Typography.Text>
+            <InputNumber
+              min={1}
+              max={300}
+              precision={0}
+              value={config.responseTimeoutSeconds ?? 60}
+              disabled={disabled}
+              addonAfter={t('externalRequest.seconds')}
+              onChange={(next) =>
+                onChange({
+                  ...config,
+                  method: 'POST',
+                  responseMode: 'WAIT_FOR_RESULT',
+                  responseTimeoutSeconds: next ?? 60,
+                })
+              }
+              style={{ display: 'block', marginTop: 6, width: '100%' }}
+            />
+          </div>
+        )}
+      </Card>
+
       <Card size="small" title={t('externalRequest.verification')}>
         <Radio.Group
           value={verificationMode}

package/dist/lib/application/files/gadmin2-game-angle-demo/web/src/routes/workflow/node-instances/widgets/ReturnResultConfigEditor.test.tsx

@@ -11,10 +11,11 @@ describe('ReturnResultConfigEditor', () => {
   });
 
   it('uses the connected previous node by default without asking for a path', () => {
+    const onChange = vi.fn();
     render(
       <ReturnResultConfigEditor
         value={undefined}
-        onChange={vi.fn()}
+        onChange={onChange}
         schema={schema}
       />,
     );
@@ -23,6 +24,12 @@ describe('ReturnResultConfigEditor', () => {
       screen.getByText('Return the previous node result'),
     ).toBeInTheDocument();
     expect(screen.queryByLabelText('Workflow data field')).toBeNull();
+    expect(onChange).toHaveBeenCalledWith({
+      resultType: 'JSON',
+      sourceMode: 'INPUT',
+      httpStatusCode: 200,
+      httpHeaders: {},
+    });
   });
 
   it('can return a field from the original Workflow data', () => {
@@ -50,4 +57,25 @@ describe('ReturnResultConfigEditor', () => {
       sourceMode: 'INPUT',
     });
   });
+
+  it('configures ordinary data with an HTTP status for external callers', () => {
+    const onChange = vi.fn();
+    render(
+      <ReturnResultConfigEditor
+        value={{
+          resultType: 'JSON',
+          sourceMode: 'INPUT',
+          httpStatusCode: 201,
+          httpHeaders: {},
+        }}
+        onChange={onChange}
+        schema={schema}
+      />,
+    );
+
+    expect(screen.getByRole('radio', { name: 'Ordinary data' })).toBeChecked();
+    expect(
+      screen.getByRole('spinbutton', { name: 'HTTP status code' }),
+    ).toHaveValue('201');
+  });
 });