import { PermissionTable } from "@/features/menus/components/PermissionTable.jsx";
import { SearchBox } from "@/shared/ui/SearchBox.jsx";
import { SideDrawer } from "@/shared/ui/SideDrawer.jsx";

export function PermissionLibraryDrawer({
  abilities,
  onClose,
  onEdit,
  onQueryChange,
  onRemove,
  open,
  permissions,
  query
}) {
  return (
    <SideDrawer
      className="permission-library-drawer"
      contentClassName="permission-library-drawer__body"
      open={open}
      title="权限库"
      onClose={onClose}
    >
      <SearchBox placeholder="搜索权限、权限码" value={query} onChange={onQueryChange} />
      <PermissionTable
        abilities={abilities}
        permissions={permissions}
        query={query}
        onEdit={onEdit}
        onQueryChange={onQueryChange}
        onRemove={onRemove}
      />
    </SideDrawer>
  );
}
