Skip to content

Conversation

Copy link

Copilot AI commented Nov 11, 2025

Migrates the RestTable component from MobX-RESTful-table to shadcn registry format per registry documentation, maintaining the original React class component architecture.

Changes

UI Components (registry/new-york/ui/)

  • table.tsx - shadcn table primitives (Table, TableHeader, TableBody, TableRow, TableCell, TableHead, TableFooter)
  • checkbox.tsx - Radix UI checkbox component
  • spinner.tsx - Loading spinner with Lucide icons
  • badge.tsx - Badge component with CVA variants

RestTable Block (registry/new-york/blocks/rest-table/)

  • rest-table.tsx - MobX class component with CRUD operations, pagination, row selection
  • components/badge-bar.tsx - Multi-value display
  • components/file-preview.tsx - File/image preview handling
  • components/pager.tsx - Pagination controls
  • components/rest-form-modal.tsx - Modal form for create/edit operations
  • README.md - API documentation and usage examples

Dependencies

  • Added: @radix-ui/react-checkbox, lodash, mobx, mobx-i18n, mobx-react, mobx-react-helper, mobx-restful, web-utility
  • Dev: @types/lodash

Architecture Preserved

Class-based component using MobX decorators (@observer, @observable, @computed) extending ObservedComponent. No hooks introduced.

@observer
export class RestTable<D extends DataObject, F extends Filter<D> = Filter<D>>
  extends ObservedComponent<RestTableProps<D, F>> {
  
  @observable
  accessor checkedKeys: IDType[] = []
  
  @computed
  get columns(): Column<D>[] {
    // ...
  }
}

Usage

npx shadcn@latest add rest-table
<RestTable
  store={userStore}
  translator={translator}
  editable
  deletable
  columns={[
    { key: "name", renderHead: () => "Name" },
    { key: "email", type: "email", renderHead: () => "Email" }
  ]}
/>

Warning

Firewall rules blocked me from connecting to one or more addresses (expand for details)

I tried to connect to the following addresses, but was blocked by firewall rules:

If you need me to access, download, or install something from one of these locations, you can either:

Original prompt

https://github.com/idea2app/MobX-RESTful-table/blob/382670dfa14ee63ce72c39b72012a038220ce25d/source/RestTable.tsx#L41 按文档 https://ui.shadcn.com/docs/registry/getting-started 的方法迁移过来,并遵照以下原则:

  1. 保持原有的 React 类组件的架构,尽最大可能不用 React hooks

✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

Copilot AI changed the title [WIP] Migrate RestTable component to new documentation guidelines Migrate RestTable from MobX-RESTful-table to shadcn registry Nov 11, 2025
Copilot AI requested a review from TechQuery November 11, 2025 10:37
Copilot finished work on behalf of TechQuery November 11, 2025 10:37
Copy link
Member

@TechQuery TechQuery left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

所有官方组件用 pnpx shadcn-helper add 安装,原始代码不要提交上来,全部 Git ignore。

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

所有迁移源仓库的内部组件都注册为本仓库的独立组件,在 registry 中注册后对外使用。

Copy link
Member

@TechQuery TechQuery left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@copilot 把所有没 resolve 的 comment 都重新处理一遍,如有报错,请在评论中明示。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

Status: In progress

Development

Successfully merging this pull request may close these issues.

2 participants