# Migration Guide: Old List Pages → Unified Action Pattern

## Before (Manual Pattern)

```tsx
const getCurrentPermissions = useCurrentPermissions();

let toolBarRender = (action: any) => {
  return getCurrentPermissions({
    export: <MyExport key="export" item={params} download={Apis.X.Y} />,
  });
};

let tableRender = (item: any, action: any) => {
  let permissions = getCurrentPermissions({
    view: <MyButtons.View title="详情" />,
    update: <MyUpdate item={item} />,
  });
  let permissionsSpace = getCurrentPermissions({
    delete: { key: '1', label: <MyButtons.Delete onConfirm={...} /> },
  });
  let Others = (
    <Dropdown menu={{ items: permissionsSpace }} trigger={['click']}>
      <MyButtons.Default title="更多" />
    </Dropdown>
  );
  return [...permissions, ...[Others]];
};

toolBarRender={(action) => [toolBarRender(action)]}
// ...
MyColumns.Option({
  render: (_, item, index, action) => (
    <Space key={index}>
      <>{tableRender(item, action)}</>
    </Space>
  ),
})
```

## After (Unified Pattern)

```tsx
import { MyTableActions, MyToolBarActions } from '@/common';

toolBarRender={(action) => [
  <MyToolBarActions
    key="toolbar"
    actions={{
      export: <MyExport key="export" item={params} download={Apis.X.Y} />,
    }}
  />,
]}

MyColumns.Option({
  render: (_, item, index, action) => (
    <Space key={index}>
      <MyTableActions
        actions={{
          view: <MyButtons.View title="详情" />,
          update: <MyUpdate item={item} />,
          delete: <MyButtons.Delete onConfirm={...} />,
        }}
        maxVisible={2}
      />
    </Space>
  ),
})
```

## Steps

1. Remove `useCurrentPermissions` import if it is no longer needed elsewhere.
2. Remove `toolBarRender` local function; replace `toolBarRender` prop with `MyToolBarActions`.
3. Remove `tableRender` local function and any `permissionsSpace` / `Others` / `Dropdown` boilerplate.
4. Replace `MyColumns.Option` render body with `MyTableActions`.
5. Tune `maxVisible` based on design needs (default `3`).

## Special Case: Link in Column Render

If a column (e.g., "名称") renders a clickable `AssetInfo` link that should also be permission-controlled:

```tsx
const getCurrentPermissions = useCurrentPermissions();
const hasInfo = getCurrentPermissions({ info: true }).length > 0;

{
  title: '名称',
  dataIndex: 'name',
  render: (_, item: any) => {
    if (!hasInfo) return item?.name;
    return <AssetInfo item={{ ...item, type: 'link' }} title={item?.name} />;
  },
}
```

Note: `useCurrentPermissions` may still be imported for this use case.
