diff --git a/.changeset/cuddly-boxes-agree.md b/.changeset/cuddly-boxes-agree.md new file mode 100644 index 0000000000000..83f027ecb5478 --- /dev/null +++ b/.changeset/cuddly-boxes-agree.md @@ -0,0 +1,5 @@ +--- +'@backstage/plugin-techdocs': minor +--- + +Update DocsTable and EntityListDocsTable to accept overrides for Material Table options. diff --git a/.changeset/pretty-ladybugs-taste.md b/.changeset/pretty-ladybugs-taste.md new file mode 100644 index 0000000000000..5c87cde123e66 --- /dev/null +++ b/.changeset/pretty-ladybugs-taste.md @@ -0,0 +1,5 @@ +--- +'@backstage/core-components': patch +--- + +Adds new type, TableOptions, extending Material Table Options. diff --git a/packages/core-components/api-report.md b/packages/core-components/api-report.md index 4cdc42ee79c00..19bdfced2745e 100644 --- a/packages/core-components/api-report.md +++ b/packages/core-components/api-report.md @@ -31,6 +31,7 @@ import MaterialBreadcrumbs from '@material-ui/core/Breadcrumbs'; import { MaterialTableProps } from '@material-table/core'; import { NavLinkProps } from 'react-router-dom'; import { Options } from 'react-markdown'; +import { Options as Options_2 } from '@material-table/core'; import { Overrides } from '@material-ui/core/styles/overrides'; import { ProfileInfo } from '@backstage/core-plugin-api'; import { ProfileInfoApi } from '@backstage/core-plugin-api'; @@ -1392,6 +1393,11 @@ export type TableFiltersClassKey = 'root' | 'value' | 'heder' | 'filters'; // @public (undocumented) export type TableHeaderClassKey = 'header'; +// Warning: (ae-missing-release-tag) "TableOptions" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal) +// +// @public (undocumented) +export interface TableOptions extends Options_2 {} + // Warning: (ae-missing-release-tag) "TableProps" is part of the package's API, but it is missing a release tag (@alpha, @beta, @public, or @internal) // // @public (undocumented) diff --git a/packages/core-components/src/components/Table/Table.tsx b/packages/core-components/src/components/Table/Table.tsx index c799402cbc288..89a1d69b96078 100644 --- a/packages/core-components/src/components/Table/Table.tsx +++ b/packages/core-components/src/components/Table/Table.tsx @@ -240,6 +240,8 @@ export interface TableProps onStateChange?: (state: TableState) => any; } +export interface TableOptions extends Options {} + export function TableToolbar(toolbarProps: { toolbarRef: MutableRefObject; setSearch: (value: string) => void; diff --git a/packages/core-components/src/components/Table/index.ts b/packages/core-components/src/components/Table/index.ts index 7fc245d6d0235..00e1ae9de53e2 100644 --- a/packages/core-components/src/components/Table/index.ts +++ b/packages/core-components/src/components/Table/index.ts @@ -22,6 +22,7 @@ export type { TableColumn, TableFilter, TableProps, + TableOptions, TableState, TableClassKey, FiltersContainerClassKey, diff --git a/plugins/techdocs/api-report.md b/plugins/techdocs/api-report.md index ea7d86e9bc091..ddc90d07bb198 100644 --- a/plugins/techdocs/api-report.md +++ b/plugins/techdocs/api-report.md @@ -20,6 +20,7 @@ import { ReactNode } from 'react'; import { ResultHighlight } from '@backstage/plugin-search-common'; import { RouteRef } from '@backstage/core-plugin-api'; import { TableColumn } from '@backstage/core-components'; +import { TableOptions } from '@backstage/core-components'; import { TableProps } from '@backstage/core-components'; import { TechDocsEntityMetadata as TechDocsEntityMetadata_2 } from '@backstage/plugin-techdocs-react'; import { TechDocsMetadata as TechDocsMetadata_2 } from '@backstage/plugin-techdocs-react'; @@ -100,6 +101,7 @@ export type DocsTableProps = { loading?: boolean | undefined; columns?: TableColumn[]; actions?: TableProps['actions']; + options?: TableOptions; }; // @public @@ -159,6 +161,7 @@ export const EntityListDocsTable: { export type EntityListDocsTableProps = { columns?: TableColumn[]; actions?: TableProps['actions']; + options?: TableOptions; }; // @public diff --git a/plugins/techdocs/src/home/components/Tables/DocsTable.tsx b/plugins/techdocs/src/home/components/Tables/DocsTable.tsx index 883c4961918c0..842c80018f578 100644 --- a/plugins/techdocs/src/home/components/Tables/DocsTable.tsx +++ b/plugins/techdocs/src/home/components/Tables/DocsTable.tsx @@ -29,6 +29,7 @@ import { EmptyState, Table, TableColumn, + TableOptions, TableProps, } from '@backstage/core-components'; import { actionFactories } from './actions'; @@ -47,6 +48,7 @@ export type DocsTableProps = { loading?: boolean | undefined; columns?: TableColumn[]; actions?: TableProps['actions']; + options?: TableOptions; }; /** @@ -55,7 +57,7 @@ export type DocsTableProps = { * @public */ export const DocsTable = (props: DocsTableProps) => { - const { entities, title, loading, columns, actions } = props; + const { entities, title, loading, columns, actions, options } = props; const [, copyToClipboard] = useCopyToClipboard(); const getRouteToReaderPageFor = useRouteRef(rootDocsRouteRef); const config = useApi(configApiRef); @@ -102,6 +104,7 @@ export const DocsTable = (props: DocsTableProps) => { pageSize: 20, search: true, actionsColumnIndex: -1, + ...options, }} data={documents} columns={columns || defaultColumns} diff --git a/plugins/techdocs/src/home/components/Tables/EntityListDocsTable.tsx b/plugins/techdocs/src/home/components/Tables/EntityListDocsTable.tsx index d47ddb13c40ba..0042cc941889d 100644 --- a/plugins/techdocs/src/home/components/Tables/EntityListDocsTable.tsx +++ b/plugins/techdocs/src/home/components/Tables/EntityListDocsTable.tsx @@ -20,6 +20,7 @@ import { capitalize } from 'lodash'; import { CodeSnippet, TableColumn, + TableOptions, TableProps, WarningPanel, } from '@backstage/core-components'; @@ -40,6 +41,7 @@ import { DocsTableRow } from './types'; export type EntityListDocsTableProps = { columns?: TableColumn[]; actions?: TableProps['actions']; + options?: TableOptions; }; /** @@ -48,7 +50,7 @@ export type EntityListDocsTableProps = { * @public */ export const EntityListDocsTable = (props: EntityListDocsTableProps) => { - const { columns, actions } = props; + const { columns, actions, options } = props; const { loading, error, entities, filters } = useEntityList(); const { isStarredEntity, toggleStarredEntity } = useStarredEntities(); const [, copyToClipboard] = useCopyToClipboard(); @@ -81,6 +83,7 @@ export const EntityListDocsTable = (props: EntityListDocsTableProps) => { loading={loading} actions={actions || defaultActions} columns={columns} + options={options} /> ); };