@gadmin2n/schematics 0.0.69 → 0.0.71

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/agentPanel/pagePathUtils.ts

@@ -0,0 +1,66 @@
+/**
+ * Shared utilities for resolving page file paths used in agent prompt generation.
+ */
+
+/** camelCase → PascalCase (first char uppercased) */
+function toPascalCase(str: string): string {
+  return str.charAt(0).toUpperCase() + str.slice(1);
+}
+
+/**
+ * Resolve the actual routes/ directory name.
+ *
+ * sourceFilePath (e.g. "src/routes/iTActivityDay/list.tsx") is the ground truth
+ * because the generator writes the real directory name there.
+ * Falls back to resourceName (kebab-case from URL) only when unavailable.
+ *
+ * Example: "src/routes/iTActivityDay/list.tsx" → "iTActivityDay"
+ */
+export function resolveSourceDir(
+  sourceFilePath: string | null | undefined,
+  resourceName: string,
+): string {
+  if (sourceFilePath) {
+    return sourceFilePath.replace(/^src\/routes\//, '').split('/')[0];
+  }
+  return resourceName;
+}
+
+export interface PagePaths {
+  /** e.g. "iTActivityDay" */
+  sourceDir: string;
+  /** e.g. "ITActivityDay" */
+  modelName: string;
+  /** e.g. "web/src/routes/iTActivityDay/list.tsx" */
+  pageFilePath: string;
+  /** e.g. "config/ui/ITActivityDay.ts" */
+  uiConfigPath: string;
+  /** e.g. "server/src/modules/iTActivityDay/iTActivityDay.controller.ts" */
+  backendApiPath: string;
+  /** "config/prisma/" */
+  prismaDir: string;
+}
+
+/**
+ * Compute all standard page-related file paths from page context.
+ */
+export function resolvePagePaths(
+  sourceFilePath: string | null | undefined,
+  resourceName: string,
+  pageFileName: string,
+): PagePaths {
+  const sourceDir = resolveSourceDir(sourceFilePath, resourceName);
+  const modelName = toPascalCase(sourceDir);
+  const pageFilePath = sourceFilePath
+    ? `web/${sourceFilePath}`
+    : `web/src/routes/${sourceDir}/${pageFileName}`;
+
+  return {
+    sourceDir,
+    modelName,
+    pageFilePath,
+    uiConfigPath: `config/ui/${modelName}.ts`,
+    backendApiPath: `server/src/modules/${sourceDir}/${sourceDir}.controller.ts`,
+    prismaDir: 'config/prisma/',
+  };
+}

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/agentPanel/promptGenerator.ts

@@ -0,0 +1,135 @@
+import { PageInfo } from './AgentContext';
+import { InspectedElementInfo } from './inspectorActions';
+import { toPascalCase } from 'config/routeRegistry';
+import { resolvePagePaths } from './pagePathUtils';
+
+export interface PromptOptions {
+  skill: string | null;
+  pageInfo: PageInfo;
+  userPrompt: string;
+  inspectedElement?: InspectedElementInfo | null;
+}
+
+/**
+ * Generate a structured prompt for Claude Code
+ */
+export function generatePrompt(options: PromptOptions): string {
+  const { skill, pageInfo, userPrompt, inspectedElement } = options;
+
+  // ── Canvas 组件 prompt（独立分支，不走 CRUD 逻辑）
+  if (inspectedElement?.type === 'canvas-component') {
+    const componentType = inspectedElement.meta?.componentType ?? '';
+    const code = inspectedElement.meta?.code ?? '';
+    const parts: string[] = [];
+
+    if (userPrompt.trim()) {
+      parts.push(`请帮我实现这个功能：${userPrompt.trim()}`);
+      parts.push('');
+    }
+
+    if (skill) {
+      parts.push(
+        `严格按照: ${skill} skill 描述的方法来完成代码的修改。如有不确定的地方，请先询问我，不要自己假设。`,
+      );
+      parts.push('');
+    }
+
+    const canvasItemId = inspectedElement.meta?.canvasItemId ?? '';
+    parts.push('### 更多辅助信息：');
+    parts.push(`- 组件类型: ${componentType}`);
+    parts.push(`- Canvas Item ID: ${canvasItemId}`);
+    parts.push('- 当前完整代码:');
+    parts.push('```tsx');
+    parts.push(code);
+    parts.push('```');
+    parts.push(
+      '- 修改后按照 skill 的步骤通过 POST /canvas-patch 推送新代码，不要修改任何 .tsx 文件',
+    );
+    parts.push('');
+
+    return parts.join('\n');
+  }
+
+  // ── 原有 CRUD prompt 逻辑
+  const parts: string[] = [];
+  // 1. User's request
+  if (userPrompt.trim()) {
+    parts.push(`请帮我实现这个功能：${userPrompt.trim()}`);
+    parts.push('');
+  }
+  parts.push('');
+
+  // 2. Skill specification (if available)
+  if (skill) {
+    parts.push(
+      `严格按照: ${skill} skill 描述的方法来完成代码的修改。如有不确定的地方，请先询问我，不要自己假设。`,
+    );
+    parts.push('');
+  }
+
+  // 3. Inspected element context (from ElementInspector)
+  if (inspectedElement) {
+    const isAppHeader = inspectedElement.type === 'app-header';
+    const isAppTitle = inspectedElement.type === 'app-title';
+    const isGlobalUI = isAppHeader || isAppTitle;
+
+    const paths = resolvePagePaths(
+      pageInfo.sourceFilePath,
+      pageInfo.resourceName,
+      getFileName(pageInfo.pageType),
+    );
+
+    // Module name: prefer what the inspected element reports, fall back to sourceDir
+    const moduleName = inspectedElement.resource || paths.sourceDir;
+
+    parts.push('### 更多的辅助信息：');
+    parts.push(`- 页面URL路径: ${pageInfo.path}`);
+    if (!isGlobalUI && moduleName)
+      parts.push(`- 所属的业务模块（模型）: ${toPascalCase(moduleName)}`);
+    if (!isGlobalUI) parts.push(`- 页面类型: ${pageInfo.pageType}`);
+    if (inspectedElement.field)
+      parts.push(`- 字段名|列名: ${inspectedElement.field}`);
+    if (isAppTitle) {
+      parts.push(`- 标题文件路径: web/src/components/layout/title.tsx`);
+      parts.push(`- Logo文件路径: web/src/components/layout/logo.tsx`);
+    } else if (isAppHeader) {
+      parts.push(`- header组件文件路径: web/src/components/layout/header.tsx`);
+    } else {
+      parts.push(`- 页面文件路径: ${paths.pageFilePath}`);
+      parts.push(`- 页面ui配置文件路径: ${paths.uiConfigPath}`);
+      parts.push(`- 页面后端api文件路径: ${paths.backendApiPath}`);
+      parts.push(`- 页面对应的数据模型文件目录: ${paths.prismaDir}`);
+    }
+    parts.push('');
+  }
+
+  return parts.join('\n');
+}
+
+/**
+ * Get the file name based on page type
+ */
+function getFileName(pageType: string): string {
+  switch (pageType) {
+    case 'list':
+      return 'list.tsx';
+    case 'create':
+      return 'create.tsx';
+    case 'edit':
+      return 'edit.tsx';
+    case 'show':
+      return 'show.tsx';
+    default:
+      return '';
+  }
+}
+
+/**
+ * Generate a preview of the prompt (shorter version)
+ */
+export function generatePromptPreview(options: PromptOptions): string {
+  const { skill, userPrompt } = options;
+  const preview = userPrompt.trim().slice(0, 50);
+  const skillPart = skill ? ` [${skill}]` : '';
+  return `${skillPart}${preview ? `: ${preview}...` : ''}`;
+}

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/agentPanel/propPatcher.ts

@@ -0,0 +1,84 @@
+/**
+ * propPatcher.ts
+ *
+ * JSX code 字符串中的 prop 替换工具函数。
+ * 用于快捷操作（quickInput / quickSelect / quickToggle）直接修改组件 code，
+ * 不经过 agent，通过 POST /canvas-patch 推送给前端画布。
+ */
+
+/**
+ * 替换 JSX code 字符串中某个字符串类型 prop 的值。
+ * 处理以下格式：
+ *   propName="value"
+ *   propName={'value'}
+ * 如果 prop 不存在，在 /> 前追加。
+ */
+export function patchStringProp(code: string, propName: string, newValue: string): string {
+  // 替换双引号格式: propName="old"
+  const dqRegex = new RegExp(`(${propName}=)"([^"]*)"`, 'g');
+  if (dqRegex.test(code)) {
+    return code.replace(new RegExp(`(${propName}=)"([^"]*)"`, 'g'), `$1"${newValue}"`);
+  }
+  // 替换单引号花括号格式: propName={'old'}
+  const sqRegex = new RegExp(`(${propName}=)\\{'([^']*)'\\}`, 'g');
+  if (sqRegex.test(code)) {
+    return code.replace(new RegExp(`(${propName}=)\\{'([^']*)'\\}`, 'g'), `$1"${newValue}"`);
+  }
+  // prop 不存在：在 /> 前追加
+  if (code.includes('/>')) {
+    return code.replace(/(\s*\/>)/, ` ${propName}="${newValue}"$1`);
+  }
+  // prop 不存在，无自闭合标签：在第一个 > 前追加
+  return code.replace(/>/, ` ${propName}="${newValue}">`);
+}
+
+/**
+ * 替换 JSX code 字符串中某个枚举类型 prop 的值（字符串格式）。
+ * 与 patchStringProp 相同逻辑，单独命名便于语义区分。
+ */
+export function patchEnumProp(code: string, propName: string, newValue: string): string {
+  return patchStringProp(code, propName, newValue);
+}
+
+/**
+ * 读取 JSX code 字符串中某个 boolean prop 的当前值。
+ * 处理格式：
+ *   legendShow={true}  → true
+ *   legendShow={false} → false
+ *   legendShow         → true（裸属性）
+ *   不存在             → defaultValue
+ */
+export function readBooleanProp(code: string, propName: string, defaultValue: boolean): boolean {
+  const falseRegex = new RegExp(`${propName}=\\{false\\}`);
+  if (falseRegex.test(code)) return false;
+  const trueRegex = new RegExp(`${propName}=\\{true\\}|\\b${propName}\\b`);
+  if (trueRegex.test(code)) return true;
+  return defaultValue;
+}
+
+/**
+ * 替换 JSX code 字符串中某个 boolean prop 的值。
+ * 处理格式：
+ *   legendShow={true}  → legendShow={false}
+ *   legendShow={false} → legendShow={true}
+ *   legendShow（裸）   → legendShow={false}
+ *   不存在             → 追加 legendShow={true/false}
+ */
+export function patchBooleanProp(code: string, propName: string, newValue: boolean): string {
+  const valueStr = `{${newValue}}`;
+  // 替换 {true} 或 {false}
+  const boolRegex = new RegExp(`(${propName})=\\{(true|false)\\}`, 'g');
+  if (boolRegex.test(code)) {
+    return code.replace(new RegExp(`(${propName})=\\{(true|false)\\}`, 'g'), `$1=${valueStr}`);
+  }
+  // 替换裸属性（propName 无值）
+  const bareRegex = new RegExp(`\\b(${propName})\\b(?!=)`, 'g');
+  if (bareRegex.test(code)) {
+    return code.replace(new RegExp(`\\b(${propName})\\b(?!=)`, 'g'), `$1=${valueStr}`);
+  }
+  // prop 不存在：追加
+  if (code.includes('/>')) {
+    return code.replace(/(\s*\/>)/, ` ${propName}=${valueStr}$1`);
+  }
+  return code.replace(/>/, ` ${propName}=${valueStr}>`);
+}

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/auditLog/components/eventList/index.tsx

@@ -0,0 +1,58 @@
+import React from 'react';
+import { UseQueryResult } from '@tanstack/react-query';
+import { List as AntdList, Button, Badge, Typography } from 'antd';
+import { ILog, ILogData } from '@refinedev/core';
+import dayjs from 'dayjs';
+
+const { Text } = Typography;
+
+interface EventListProps {
+  logQueryResult?: UseQueryResult<ILogData>;
+  showModal: () => void;
+  setSelectedLog: React.Dispatch<React.SetStateAction<ILog | undefined>>;
+  selectedLog: ILog | undefined;
+}
+
+export const EventList: React.FC<EventListProps> = ({
+  logQueryResult,
+  showModal,
+  setSelectedLog,
+  selectedLog,
+}) => {
+  return (
+    <AntdList
+      dataSource={logQueryResult?.data}
+      renderItem={(log: any) => {
+        const { creator, action, timestamp } = log;
+
+        return (
+          <AntdList.Item
+            style={{
+              alignItems: 'flex-start',
+              padding: '8px 0px 8px 8px',
+            }}
+          >
+            <Button
+              type="text"
+              style={{
+                display: 'flex',
+                flexDirection: 'column',
+                height: '100%',
+              }}
+              onClick={() => {
+                showModal();
+                setSelectedLog(log);
+              }}
+            >
+              <Badge
+                color={selectedLog?.id === log.id ? 'blue' : 'gray'}
+                text={`${action} by ${creator}`}
+              />
+              <Text>Date: {dayjs(timestamp).format('MM/DD/YYYY, hh:mm')}</Text>
+            </Button>
+          </AntdList.Item>
+        );
+      }}
+    />
+  );
+};

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/auditLog/components/index.ts

@@ -0,0 +1,4 @@
+export * from './logButton';
+export * from './logList';
+export * from './modalDiffViewer';
+export * from './eventList';

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/auditLog/components/logButton/index.tsx

@@ -0,0 +1,96 @@
+import React, { useState } from 'react';
+import { useModal } from '@refinedev/antd';
+import { Button, ButtonProps, ModalProps, message } from 'antd';
+import * as Icons from '@ant-design/icons';
+import {
+  useRouterContext,
+  useTranslate,
+  ResourceRouterParams,
+  BaseKey,
+  useLogList,
+  ILog,
+  ILogData,
+  useResource,
+} from '@refinedev/core';
+import { ReactDiffViewerProps } from 'react-diff-viewer';
+import { ModalDiffViewer } from '../modalDiffViewer';
+
+export type LogButtonProps = ButtonProps & {
+  recordItemId?: BaseKey;
+  resourceName?: string;
+  hideText?: boolean;
+  reactDiffViewerProps?: ReactDiffViewerProps;
+  modalProps?: ModalProps;
+};
+
+export const LogButton: React.FC<LogButtonProps> = ({
+  resourceName: propResourceName,
+  recordItemId,
+  hideText = false,
+  onClick,
+  reactDiffViewerProps,
+  modalProps: propModalProps,
+  children,
+  ...rest
+}) => {
+  const [selectedLog, setSelectedLog] = useState<ILog>();
+
+  const translate = useTranslate();
+  const { modalProps, show } = useModal();
+  const [messageApi, contextHolder] = message.useMessage();
+
+  const { useParams } = useRouterContext();
+  const { id: idFromRoute } = useParams<ResourceRouterParams>();
+
+  const resourceWithRoute = useResource();
+
+  const resourceName =
+    propResourceName ?? resourceWithRoute?.resource?.name ?? '';
+  const id = recordItemId ?? idFromRoute;
+
+  const logQueryResult = useLogList<ILogData>({
+    resource: resourceName,
+    meta: { id },
+    queryOptions: {
+      enabled: modalProps.open,
+      onSuccess: (result) => {
+        if (result?.length) {
+          setSelectedLog(result[0]);
+        } else {
+          messageApi.open({
+            type: 'warning',
+            content: 'There is no history.',
+          });
+        }
+      },
+    },
+  });
+
+  return (
+    <>
+      <Button
+        onClick={(e): void =>
+          onClick
+            ? onClick(e as React.MouseEvent<HTMLButtonElement, MouseEvent>)
+            : show()
+        }
+        icon={<Icons.HistoryOutlined />}
+        {...rest}
+      >
+        {!hideText && (children ?? translate('buttons.logs', 'History'))}
+      </Button>
+      {selectedLog ? (
+        <ModalDiffViewer
+          modalProps={{ ...modalProps, ...propModalProps }}
+          showModal={show}
+          selectedLog={selectedLog}
+          setSelectedLog={setSelectedLog}
+          logQueryResult={logQueryResult}
+          reactDiffViewerProps={reactDiffViewerProps}
+        />
+      ) : (
+        <>{contextHolder}</>
+      )}
+    </>
+  );
+};

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/auditLog/components/logList/index.tsx

@@ -0,0 +1,72 @@
+import React, { useState } from 'react';
+import { useModal } from '@refinedev/antd';
+import { Card, ModalProps } from 'antd';
+import {
+  BaseKey,
+  ILog,
+  ILogData,
+  pickNotDeprecated,
+  ResourceRouterParams,
+  useLogList,
+  useResourceWithRoute,
+  useRouterContext,
+} from '@refinedev/core';
+import { ReactDiffViewerProps } from 'react-diff-viewer';
+
+import { ModalDiffViewer } from '../modalDiffViewer';
+import { EventList } from '../eventList';
+
+export interface LogListProps {
+  recordItemId?: BaseKey;
+  reactDiffViewerProps?: ReactDiffViewerProps;
+  modalProps?: ModalProps;
+  resource?: string;
+}
+
+export const LogList: React.FC<LogListProps> = ({
+  recordItemId,
+  reactDiffViewerProps,
+  modalProps: propModalProps,
+  resource: propResourceName,
+}) => {
+  const [selectedLog, setSelectedLog] = useState<ILog>();
+
+  const { modalProps, show } = useModal();
+
+  const { useParams } = useRouterContext();
+  const { resource: routeResourceName, id: idFromRoute } =
+    useParams<ResourceRouterParams>();
+
+  const resourceWithRoute = useResourceWithRoute();
+  const resource = resourceWithRoute(routeResourceName);
+
+  const resourceName = propResourceName ?? resource.name;
+  const id = recordItemId ?? idFromRoute;
+
+  const logQueryResult = useLogList<ILogData>({
+    resource: resourceName,
+    meta: { id },
+    metaData: pickNotDeprecated(resource.meta, resource.options),
+  });
+
+  return (
+    <>
+      <Card loading={logQueryResult?.isLoading} bodyStyle={{ padding: 0 }}>
+        <EventList
+          logQueryResult={logQueryResult}
+          setSelectedLog={setSelectedLog}
+          showModal={show}
+          selectedLog={selectedLog}
+        />
+      </Card>
+      <ModalDiffViewer
+        modalProps={{ ...modalProps, ...propModalProps }}
+        showModal={show}
+        selectedLog={selectedLog}
+        setSelectedLog={setSelectedLog}
+        logQueryResult={logQueryResult}
+        reactDiffViewerProps={reactDiffViewerProps}
+      />
+    </>
+  );
+};

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/auditLog/components/modalDiffViewer/index.tsx

@@ -0,0 +1,104 @@
+import React, { useEffect, useRef, useState } from 'react';
+import * as Icons from '@ant-design/icons';
+import {
+  Modal,
+  Dropdown,
+  Menu,
+  Button,
+  Divider,
+  Row,
+  Col,
+  ModalProps,
+  Space,
+} from 'antd';
+
+import { ILogData, ILog } from '@refinedev/core';
+import ReactDiffViewer, {
+  DiffMethod,
+  ReactDiffViewerProps,
+} from 'react-diff-viewer';
+import { UseQueryResult } from '@tanstack/react-query';
+import stableStringify from 'json-stable-stringify';
+import { EventList } from '../eventList';
+
+export interface ModalDiffViewerProps {
+  logQueryResult?: UseQueryResult<ILogData>;
+  reactDiffViewerProps?: ReactDiffViewerProps;
+  modalProps?: ModalProps;
+  selectedLog?: ILog;
+  setSelectedLog: React.Dispatch<React.SetStateAction<ILog | undefined>>;
+  showModal: () => void;
+}
+
+export const ModalDiffViewer: React.FC<ModalDiffViewerProps> = ({
+  logQueryResult,
+  modalProps,
+  reactDiffViewerProps,
+  selectedLog,
+  setSelectedLog,
+  showModal,
+}) => {
+  const [diffView, setDiffView] = useState('split');
+  const diffViewerRef = useRef<ReactDiffViewer>(null);
+
+  useEffect(() => {
+    diffViewerRef.current?.resetCodeBlocks();
+  }, [
+    reactDiffViewerProps?.newValue,
+    reactDiffViewerProps?.oldValue,
+    modalProps?.open,
+  ]);
+
+  return (
+    <Modal footer={null} width={'80%'} {...modalProps}>
+      <Space>
+        <Dropdown
+          overlay={
+            <Menu selectedKeys={[diffView]}>
+              <Menu.Item key="split" onClick={(info) => setDiffView(info.key)}>
+                Split
+              </Menu.Item>
+              <Menu.Item
+                key="unified"
+                onClick={(info) => setDiffView(info.key)}
+              >
+                Unified
+              </Menu.Item>
+            </Menu>
+          }
+          placement="bottom"
+          trigger={['click']}
+        >
+          <Button icon={<Icons.SettingOutlined />}>Diff view</Button>
+        </Dropdown>
+      </Space>
+      <Divider />
+      <Row gutter={[16, 16]}>
+        <Col span={20}>
+          <ReactDiffViewer
+            ref={diffViewerRef}
+            leftTitle="Before"
+            rightTitle="After"
+            compareMethod={DiffMethod.WORDS}
+            splitView={diffView === 'split'}
+            oldValue={stableStringify(JSON.parse(selectedLog?.previousData), {
+              space: ' ',
+            })}
+            newValue={stableStringify(JSON.parse(selectedLog?.data), {
+              space: ' ',
+            })}
+            {...reactDiffViewerProps}
+          />
+        </Col>
+        <Col span={4}>
+          <EventList
+            logQueryResult={logQueryResult}
+            setSelectedLog={setSelectedLog}
+            showModal={showModal}
+            selectedLog={selectedLog}
+          />
+        </Col>
+      </Row>
+    </Modal>
+  );
+};

package/src/lib/application/files/gadmin2-game-angle-demo/web/src/components/auditLog/index.tsx

@@ -0,0 +1,2 @@
+export { LogList, LogButton } from './components';
+export type { LogListProps } from './components';