mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2024-11-24 22:46:40 +00:00
Disable table selection for Fabric/read-only (#1855)
* Disable table selection for Fabric/read-only * Update unit tests * Fix format --------- Co-authored-by: Laurent Nguyen <languye@microsoft.com>
This commit is contained in:
parent
495296602a
commit
b76d83d8e1
@ -1779,6 +1779,9 @@ export const DocumentsTabComponent: React.FunctionComponent<IDocumentsTabCompone
|
||||
selectedRows={selectedRows}
|
||||
size={tableContainerSizePx}
|
||||
columnHeaders={columnHeaders}
|
||||
isSelectionDisabled={
|
||||
configContext.platform === Platform.Fabric && userContext.fabricContext?.isReadOnly
|
||||
}
|
||||
/>
|
||||
{tableItems.length > 0 && (
|
||||
<a
|
||||
|
@ -24,6 +24,7 @@ describe("DocumentsTableComponent", () => {
|
||||
idHeader: ID_HEADER,
|
||||
partitionKeyHeaders: [PARTITION_KEY_HEADER],
|
||||
},
|
||||
isSelectionDisabled: false,
|
||||
});
|
||||
|
||||
it("should render documents and partition keys in header", () => {
|
||||
@ -31,4 +32,11 @@ describe("DocumentsTableComponent", () => {
|
||||
const wrapper = mount(<DocumentsTableComponent {...props} />);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it("should not render selection column when isSelectionDisabled is true", () => {
|
||||
const props: IDocumentsTableComponentProps = createMockProps();
|
||||
props.isSelectionDisabled = true;
|
||||
const wrapper = mount(<DocumentsTableComponent {...props} />);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
@ -41,6 +41,7 @@ export interface IDocumentsTableComponentProps {
|
||||
size: { height: number; width: number };
|
||||
columnHeaders: ColumnHeaders;
|
||||
style?: React.CSSProperties;
|
||||
isSelectionDisabled?: boolean;
|
||||
}
|
||||
|
||||
interface TableRowData extends RowStateBase<DocumentsTableComponentItem> {
|
||||
@ -61,6 +62,7 @@ export const DocumentsTableComponent: React.FC<IDocumentsTableComponentProps> =
|
||||
style,
|
||||
size,
|
||||
columnHeaders,
|
||||
isSelectionDisabled,
|
||||
}: IDocumentsTableComponentProps) => {
|
||||
const [activeItemIndex, setActiveItemIndex] = React.useState<number>(undefined);
|
||||
|
||||
@ -127,12 +129,14 @@ export const DocumentsTableComponent: React.FC<IDocumentsTableComponentProps> =
|
||||
const { item, selected, appearance, onClick, onKeyDown } = data[index];
|
||||
return (
|
||||
<TableRow aria-rowindex={index + 2} style={style} key={item.id} aria-selected={selected} appearance={appearance}>
|
||||
<TableSelectionCell
|
||||
checked={selected}
|
||||
checkboxIndicator={{ "aria-label": "Select row" }}
|
||||
onClick={onClick}
|
||||
onKeyDown={onKeyDown}
|
||||
/>
|
||||
{!isSelectionDisabled && (
|
||||
<TableSelectionCell
|
||||
checked={selected}
|
||||
checkboxIndicator={{ "aria-label": "Select row" }}
|
||||
onClick={onClick}
|
||||
onKeyDown={onKeyDown}
|
||||
/>
|
||||
)}
|
||||
{columns.map((column) => (
|
||||
<TableCell
|
||||
key={column.columnId}
|
||||
@ -226,12 +230,14 @@ export const DocumentsTableComponent: React.FC<IDocumentsTableComponentProps> =
|
||||
<Table className="documentsTable" noNativeElements {...tableProps}>
|
||||
<TableHeader className="documentsTableHeader">
|
||||
<TableRow style={{ width: size ? size.width - 15 : "100%" }}>
|
||||
<TableSelectionCell
|
||||
checked={allRowsSelected ? true : someRowsSelected ? "mixed" : false}
|
||||
onClick={toggleAllRows}
|
||||
onKeyDown={toggleAllKeydown}
|
||||
checkboxIndicator={{ "aria-label": "Select all rows " }}
|
||||
/>
|
||||
{!isSelectionDisabled && (
|
||||
<TableSelectionCell
|
||||
checked={allRowsSelected ? true : someRowsSelected ? "mixed" : false}
|
||||
onClick={toggleAllRows}
|
||||
onKeyDown={toggleAllKeydown}
|
||||
checkboxIndicator={{ "aria-label": "Select all rows " }}
|
||||
/>
|
||||
)}
|
||||
{columns.map((column /* index */) => (
|
||||
<Menu openOnContext key={column.columnId}>
|
||||
<MenuTrigger>
|
||||
|
@ -532,6 +532,7 @@ exports[`Documents tab (noSql API) when rendered should render the page 1`] = `
|
||||
"partitionKeyHeaders": Array [],
|
||||
}
|
||||
}
|
||||
isSelectionDisabled={true}
|
||||
items={Array []}
|
||||
onItemClicked={[Function]}
|
||||
onSelectedRowsChange={[Function]}
|
||||
|
@ -1,5 +1,985 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`DocumentsTableComponent should not render selection column when isSelectionDisabled is true 1`] = `
|
||||
<DocumentsTableComponent
|
||||
columnHeaders={
|
||||
Object {
|
||||
"idHeader": "id",
|
||||
"partitionKeyHeaders": Array [
|
||||
"partitionKey",
|
||||
],
|
||||
}
|
||||
}
|
||||
isSelectionDisabled={true}
|
||||
items={
|
||||
Array [
|
||||
Object {
|
||||
"id": "1",
|
||||
"partitionKey": "pk1",
|
||||
},
|
||||
Object {
|
||||
"id": "2",
|
||||
"partitionKey": "pk2",
|
||||
},
|
||||
Object {
|
||||
"id": "3",
|
||||
"partitionKey": "pk3",
|
||||
},
|
||||
]
|
||||
}
|
||||
onItemClicked={[Function]}
|
||||
onSelectedRowsChange={[Function]}
|
||||
selectedRows={Set {}}
|
||||
size={
|
||||
Object {
|
||||
"height": 0,
|
||||
"width": 0,
|
||||
}
|
||||
}
|
||||
>
|
||||
<Table
|
||||
aria-label="Filtered documents table"
|
||||
className="documentsTable"
|
||||
data-tabster="{\\"mover\\":{\\"cyclic\\":false,\\"direction\\":3}}"
|
||||
noNativeElements={true}
|
||||
role="grid"
|
||||
size="extra-small"
|
||||
style={
|
||||
Object {
|
||||
"minWidth": "fit-content",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
aria-label="Filtered documents table"
|
||||
className="fui-Table documentsTable ___1kbqy50_18rlg51 fgkb47j fhovq9v ftgm304"
|
||||
data-tabster="{\\"mover\\":{\\"cyclic\\":false,\\"direction\\":3}}"
|
||||
role="grid"
|
||||
style={
|
||||
Object {
|
||||
"minWidth": "fit-content",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TableHeader
|
||||
className="documentsTableHeader"
|
||||
>
|
||||
<div
|
||||
className="fui-TableHeader documentsTableHeader ___oeyxrt0_1baslyg ftgm304"
|
||||
role="rowgroup"
|
||||
>
|
||||
<TableRow
|
||||
style={
|
||||
Object {
|
||||
"width": -15,
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="fui-TableRow ___lntl370_1bdwmey f19n0e5 f1ewtqcl f1jazu75 f1xeqee6 fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb fy9rknc f22iagw f122n59"
|
||||
role="row"
|
||||
style={
|
||||
Object {
|
||||
"width": -15,
|
||||
}
|
||||
}
|
||||
>
|
||||
<Menu
|
||||
key="id"
|
||||
openOnContext={true}
|
||||
>
|
||||
<ContextSelector.Provider
|
||||
value={
|
||||
Object {
|
||||
"checkedValues": Object {},
|
||||
"hasCheckmarks": false,
|
||||
"hasIcons": false,
|
||||
"inline": false,
|
||||
"isSubmenu": false,
|
||||
"menuPopoverRef": Object {
|
||||
"current": null,
|
||||
},
|
||||
"mountNode": null,
|
||||
"onCheckedValueChange": [Function],
|
||||
"open": false,
|
||||
"openOnContext": true,
|
||||
"openOnHover": false,
|
||||
"persistOnItemClick": false,
|
||||
"setOpen": [Function],
|
||||
"triggerId": "menu17",
|
||||
"triggerRef": Object {
|
||||
"current": <div
|
||||
class="fui-TableHeaderCell documentsTableCell ___19selgd_3kxzd70 figsok6 f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fhix6mv fha7anx f1fmzww4 fs9qmxf f187m4uq f145mzao f1uha7eq f10pi13n f22iagw fqerorx f1neuvcm fkjuxzh f10tiqix"
|
||||
data-tabster="{\\"restorer\\":{\\"type\\":1}}"
|
||||
id="menu17"
|
||||
role="columnheader"
|
||||
style="width: 50px; min-width: 50px; max-width: 50px;"
|
||||
>
|
||||
<div
|
||||
class="fui-TableHeaderCell__button ___hg3sc00_fmp4b50 fq6nmtn f1e4lqlz f1u2r49w f1ym3bx4 f1mo0ibp fjoy568 fytdu2e f1mtd64y f1y7q3j9 f1g0x7ka fhxju0i f1qch9an f1cnd47f f1ern45e f1n71otn f1h8hb77 f1deefiw fgusgyc f10pi13n fly5x3f f22iagw fqerorx f1l02sjl f122n59 f1ufnopg f14sijuj f1nxs5xn f1neuvcm fkjuxzh f1s6fcnf"
|
||||
role="presentation"
|
||||
>
|
||||
id
|
||||
</div>
|
||||
<span
|
||||
class="fui-TableHeaderCell__aside"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
aria-label="Resize column"
|
||||
aria-valuetext="50 pixels"
|
||||
class="fui-TableResizeHandle ___l1ulde0_1gn6xqj f1euv43f f1e31b4d f15twtuk f1yab3r1 fjw5fx7 f1hu3pq6 fn2i5td f19f4twv f1eybr6b fc3en1c fk73vx1 f13u1uyl fezquic f19g0ac f1tkae59 ftqa4ok f15pjodv ftgrb5f f2df6js fshsryb f11ef69 f12lb1dx fu4ulse fw2wsqs f1swzn7y"
|
||||
data-tabster="{\\"focusable\\":{\\"ignoreKeydown\\":{\\"ArrowLeft\\":true,\\"ArrowRight\\":true}}}"
|
||||
role="separator"
|
||||
/>
|
||||
</span>
|
||||
</div>,
|
||||
},
|
||||
}
|
||||
}
|
||||
>
|
||||
<MenuTrigger
|
||||
key=".0"
|
||||
>
|
||||
<TableHeaderCell
|
||||
aside={
|
||||
<TableResizeHandle
|
||||
aria-hidden={true}
|
||||
aria-label="Resize column"
|
||||
aria-valuetext="50 pixels"
|
||||
data-tabster="{\\"focusable\\":{\\"ignoreKeydown\\":{\\"ArrowLeft\\":true,\\"ArrowRight\\":true}}}"
|
||||
onBlur={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onMouseDown={[Function]}
|
||||
onTouchStart={[Function]}
|
||||
role="separator"
|
||||
/>
|
||||
}
|
||||
className="documentsTableCell"
|
||||
data-tabster="{\\"restorer\\":{\\"type\\":1}}"
|
||||
id="menu17"
|
||||
key="id"
|
||||
onContextMenu={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
onMouseMove={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="fui-TableHeaderCell documentsTableCell ___19selgd_3kxzd70 figsok6 f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fhix6mv fha7anx f1fmzww4 fs9qmxf f187m4uq f145mzao f1uha7eq f10pi13n f22iagw fqerorx f1neuvcm fkjuxzh f10tiqix"
|
||||
data-tabster="{\\"restorer\\":{\\"type\\":1}}"
|
||||
id="menu17"
|
||||
onContextMenu={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
onMouseMove={[Function]}
|
||||
role="columnheader"
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="fui-TableHeaderCell__button ___hg3sc00_fmp4b50 fq6nmtn f1e4lqlz f1u2r49w f1ym3bx4 f1mo0ibp fjoy568 fytdu2e f1mtd64y f1y7q3j9 f1g0x7ka fhxju0i f1qch9an f1cnd47f f1ern45e f1n71otn f1h8hb77 f1deefiw fgusgyc f10pi13n fly5x3f f22iagw fqerorx f1l02sjl f122n59 f1ufnopg f14sijuj f1nxs5xn f1neuvcm fkjuxzh f1s6fcnf"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
role="presentation"
|
||||
>
|
||||
id
|
||||
</div>
|
||||
<span
|
||||
className="fui-TableHeaderCell__aside"
|
||||
>
|
||||
<TableResizeHandle
|
||||
aria-hidden={true}
|
||||
aria-label="Resize column"
|
||||
aria-valuetext="50 pixels"
|
||||
data-tabster="{\\"focusable\\":{\\"ignoreKeydown\\":{\\"ArrowLeft\\":true,\\"ArrowRight\\":true}}}"
|
||||
onBlur={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onMouseDown={[Function]}
|
||||
onTouchStart={[Function]}
|
||||
role="separator"
|
||||
>
|
||||
<div
|
||||
aria-hidden={true}
|
||||
aria-label="Resize column"
|
||||
aria-valuetext="50 pixels"
|
||||
className="fui-TableResizeHandle ___l1ulde0_1gn6xqj f1euv43f f1e31b4d f15twtuk f1yab3r1 fjw5fx7 f1hu3pq6 fn2i5td f19f4twv f1eybr6b fc3en1c fk73vx1 f13u1uyl fezquic f19g0ac f1tkae59 ftqa4ok f15pjodv ftgrb5f f2df6js fshsryb f11ef69 f12lb1dx fu4ulse fw2wsqs f1swzn7y"
|
||||
data-tabster="{\\"focusable\\":{\\"ignoreKeydown\\":{\\"ArrowLeft\\":true,\\"ArrowRight\\":true}}}"
|
||||
onBlur={[Function]}
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onMouseDown={[Function]}
|
||||
onTouchStart={[Function]}
|
||||
role="separator"
|
||||
/>
|
||||
</TableResizeHandle>
|
||||
</span>
|
||||
</div>
|
||||
</TableHeaderCell>
|
||||
</MenuTrigger>
|
||||
</ContextSelector.Provider>
|
||||
</Menu>
|
||||
<Menu
|
||||
key="partitionKey"
|
||||
openOnContext={true}
|
||||
>
|
||||
<ContextSelector.Provider
|
||||
value={
|
||||
Object {
|
||||
"checkedValues": Object {},
|
||||
"hasCheckmarks": false,
|
||||
"hasIcons": false,
|
||||
"inline": false,
|
||||
"isSubmenu": false,
|
||||
"menuPopoverRef": Object {
|
||||
"current": null,
|
||||
},
|
||||
"mountNode": null,
|
||||
"onCheckedValueChange": [Function],
|
||||
"open": false,
|
||||
"openOnContext": true,
|
||||
"openOnHover": false,
|
||||
"persistOnItemClick": false,
|
||||
"setOpen": [Function],
|
||||
"triggerId": "menu18",
|
||||
"triggerRef": Object {
|
||||
"current": <div
|
||||
class="fui-TableHeaderCell documentsTableCell ___19selgd_3kxzd70 figsok6 f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fhix6mv fha7anx f1fmzww4 fs9qmxf f187m4uq f145mzao f1uha7eq f10pi13n f22iagw fqerorx f1neuvcm fkjuxzh f10tiqix"
|
||||
data-tabster="{\\"restorer\\":{\\"type\\":1}}"
|
||||
id="menu18"
|
||||
role="columnheader"
|
||||
style="width: 50px; min-width: 50px; max-width: 50px;"
|
||||
>
|
||||
<div
|
||||
class="fui-TableHeaderCell__button ___hg3sc00_fmp4b50 fq6nmtn f1e4lqlz f1u2r49w f1ym3bx4 f1mo0ibp fjoy568 fytdu2e f1mtd64y f1y7q3j9 f1g0x7ka fhxju0i f1qch9an f1cnd47f f1ern45e f1n71otn f1h8hb77 f1deefiw fgusgyc f10pi13n fly5x3f f22iagw fqerorx f1l02sjl f122n59 f1ufnopg f14sijuj f1nxs5xn f1neuvcm fkjuxzh f1s6fcnf"
|
||||
role="presentation"
|
||||
>
|
||||
<span
|
||||
title="partitionKey"
|
||||
>
|
||||
partitionKey
|
||||
</span>
|
||||
</div>
|
||||
</div>,
|
||||
},
|
||||
}
|
||||
}
|
||||
>
|
||||
<MenuTrigger
|
||||
key=".0"
|
||||
>
|
||||
<TableHeaderCell
|
||||
aside={null}
|
||||
className="documentsTableCell"
|
||||
data-tabster="{\\"restorer\\":{\\"type\\":1}}"
|
||||
id="menu18"
|
||||
key="partitionKey"
|
||||
onContextMenu={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
onMouseMove={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="fui-TableHeaderCell documentsTableCell ___19selgd_3kxzd70 figsok6 f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fhix6mv fha7anx f1fmzww4 fs9qmxf f187m4uq f145mzao f1uha7eq f10pi13n f22iagw fqerorx f1neuvcm fkjuxzh f10tiqix"
|
||||
data-tabster="{\\"restorer\\":{\\"type\\":1}}"
|
||||
id="menu18"
|
||||
onContextMenu={[Function]}
|
||||
onMouseEnter={[Function]}
|
||||
onMouseLeave={[Function]}
|
||||
onMouseMove={[Function]}
|
||||
role="columnheader"
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
className="fui-TableHeaderCell__button ___hg3sc00_fmp4b50 fq6nmtn f1e4lqlz f1u2r49w f1ym3bx4 f1mo0ibp fjoy568 fytdu2e f1mtd64y f1y7q3j9 f1g0x7ka fhxju0i f1qch9an f1cnd47f f1ern45e f1n71otn f1h8hb77 f1deefiw fgusgyc f10pi13n fly5x3f f22iagw fqerorx f1l02sjl f122n59 f1ufnopg f14sijuj f1nxs5xn f1neuvcm fkjuxzh f1s6fcnf"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
onKeyUp={[Function]}
|
||||
role="presentation"
|
||||
>
|
||||
<span
|
||||
title="partitionKey"
|
||||
>
|
||||
partitionKey
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</TableHeaderCell>
|
||||
</MenuTrigger>
|
||||
</ContextSelector.Provider>
|
||||
</Menu>
|
||||
</div>
|
||||
</TableRow>
|
||||
</div>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
<div
|
||||
className="fui-TableBody ___oeyxrt0_1baslyg ftgm304"
|
||||
role="rowgroup"
|
||||
>
|
||||
<List
|
||||
direction="ltr"
|
||||
height={-53}
|
||||
itemCount={3}
|
||||
itemData={
|
||||
Array [
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "1",
|
||||
"partitionKey": "pk1",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 0,
|
||||
"selected": false,
|
||||
},
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "2",
|
||||
"partitionKey": "pk2",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 1,
|
||||
"selected": false,
|
||||
},
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "3",
|
||||
"partitionKey": "pk3",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 2,
|
||||
"selected": false,
|
||||
},
|
||||
]
|
||||
}
|
||||
itemSize={30}
|
||||
layout="vertical"
|
||||
overscanCount={2}
|
||||
style={
|
||||
Object {
|
||||
"overflowY": "scroll",
|
||||
}
|
||||
}
|
||||
useIsScrolling={false}
|
||||
width={0}
|
||||
>
|
||||
<div
|
||||
onScroll={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"WebkitOverflowScrolling": "touch",
|
||||
"direction": "ltr",
|
||||
"height": -53,
|
||||
"overflow": "auto",
|
||||
"overflowY": "scroll",
|
||||
"position": "relative",
|
||||
"width": 0,
|
||||
"willChange": "transform",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
style={
|
||||
Object {
|
||||
"height": 90,
|
||||
"pointerEvents": undefined,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<RenderRow
|
||||
data={
|
||||
Array [
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "1",
|
||||
"partitionKey": "pk1",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 0,
|
||||
"selected": false,
|
||||
},
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "2",
|
||||
"partitionKey": "pk2",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 1,
|
||||
"selected": false,
|
||||
},
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "3",
|
||||
"partitionKey": "pk3",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 2,
|
||||
"selected": false,
|
||||
},
|
||||
]
|
||||
}
|
||||
index={0}
|
||||
key="0"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 0,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TableRow
|
||||
appearance="none"
|
||||
aria-rowindex={2}
|
||||
aria-selected={false}
|
||||
key="1"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 0,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
aria-rowindex={2}
|
||||
aria-selected={false}
|
||||
className="fui-TableRow ___1iajlcl_snm7au0 f19n0e5 f1ewtqcl f1jazu75 f1xeqee6 fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f1wfn5kd f1g4hkjv f15ngxrw fjbbrdp f1t94bn6 feu1g3u f1uorfem fw60kww fy9rknc f22iagw f122n59"
|
||||
role="row"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 0,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TableCell
|
||||
className="documentsTableCell"
|
||||
key="id"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={0}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCell documentsTableCell ___o2cmzw0_1ilyrce f10pi13n f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f22iagw f10tiqix f122n59 fqerorx f1neuvcm fkjuxzh f1pha7fy"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
role="cell"
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={0}
|
||||
>
|
||||
<TableCellLayout
|
||||
title="1"
|
||||
truncate={true}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout ___16owy0g_d3kle00 f22iagw f122n59 fsnqrgy fylz90v fqerorx f1neuvcm fkjuxzh f1p9o1ba"
|
||||
title="1"
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout__content ___1vq3ijp_1wyv0tp f22iagw f1vx9l62 f1p9o1ba"
|
||||
>
|
||||
<span
|
||||
className="fui-TableCellLayout__main ___1q6a9l3_1koyf1t f1p9o1ba fz5stix f1cmbuwj"
|
||||
>
|
||||
1
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</TableCellLayout>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell
|
||||
className="documentsTableCell"
|
||||
key="partitionKey"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCell documentsTableCell ___o2cmzw0_1ilyrce f10pi13n f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f22iagw f10tiqix f122n59 fqerorx f1neuvcm fkjuxzh f1pha7fy"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
role="cell"
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
>
|
||||
<TableCellLayout
|
||||
title="pk1"
|
||||
truncate={true}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout ___16owy0g_d3kle00 f22iagw f122n59 fsnqrgy fylz90v fqerorx f1neuvcm fkjuxzh f1p9o1ba"
|
||||
title="pk1"
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout__content ___1vq3ijp_1wyv0tp f22iagw f1vx9l62 f1p9o1ba"
|
||||
>
|
||||
<span
|
||||
className="fui-TableCellLayout__main ___1q6a9l3_1koyf1t f1p9o1ba fz5stix f1cmbuwj"
|
||||
>
|
||||
pk1
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</TableCellLayout>
|
||||
</div>
|
||||
</TableCell>
|
||||
</div>
|
||||
</TableRow>
|
||||
</RenderRow>
|
||||
<RenderRow
|
||||
data={
|
||||
Array [
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "1",
|
||||
"partitionKey": "pk1",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 0,
|
||||
"selected": false,
|
||||
},
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "2",
|
||||
"partitionKey": "pk2",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 1,
|
||||
"selected": false,
|
||||
},
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "3",
|
||||
"partitionKey": "pk3",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 2,
|
||||
"selected": false,
|
||||
},
|
||||
]
|
||||
}
|
||||
index={1}
|
||||
key="1"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 30,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TableRow
|
||||
appearance="none"
|
||||
aria-rowindex={3}
|
||||
aria-selected={false}
|
||||
key="2"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 30,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
aria-rowindex={3}
|
||||
aria-selected={false}
|
||||
className="fui-TableRow ___1iajlcl_snm7au0 f19n0e5 f1ewtqcl f1jazu75 f1xeqee6 fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f1wfn5kd f1g4hkjv f15ngxrw fjbbrdp f1t94bn6 feu1g3u f1uorfem fw60kww fy9rknc f22iagw f122n59"
|
||||
role="row"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 30,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TableCell
|
||||
className="documentsTableCell"
|
||||
key="id"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={0}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCell documentsTableCell ___o2cmzw0_1ilyrce f10pi13n f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f22iagw f10tiqix f122n59 fqerorx f1neuvcm fkjuxzh f1pha7fy"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
role="cell"
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={0}
|
||||
>
|
||||
<TableCellLayout
|
||||
title="2"
|
||||
truncate={true}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout ___16owy0g_d3kle00 f22iagw f122n59 fsnqrgy fylz90v fqerorx f1neuvcm fkjuxzh f1p9o1ba"
|
||||
title="2"
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout__content ___1vq3ijp_1wyv0tp f22iagw f1vx9l62 f1p9o1ba"
|
||||
>
|
||||
<span
|
||||
className="fui-TableCellLayout__main ___1q6a9l3_1koyf1t f1p9o1ba fz5stix f1cmbuwj"
|
||||
>
|
||||
2
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</TableCellLayout>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell
|
||||
className="documentsTableCell"
|
||||
key="partitionKey"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCell documentsTableCell ___o2cmzw0_1ilyrce f10pi13n f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f22iagw f10tiqix f122n59 fqerorx f1neuvcm fkjuxzh f1pha7fy"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
role="cell"
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
>
|
||||
<TableCellLayout
|
||||
title="pk2"
|
||||
truncate={true}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout ___16owy0g_d3kle00 f22iagw f122n59 fsnqrgy fylz90v fqerorx f1neuvcm fkjuxzh f1p9o1ba"
|
||||
title="pk2"
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout__content ___1vq3ijp_1wyv0tp f22iagw f1vx9l62 f1p9o1ba"
|
||||
>
|
||||
<span
|
||||
className="fui-TableCellLayout__main ___1q6a9l3_1koyf1t f1p9o1ba fz5stix f1cmbuwj"
|
||||
>
|
||||
pk2
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</TableCellLayout>
|
||||
</div>
|
||||
</TableCell>
|
||||
</div>
|
||||
</TableRow>
|
||||
</RenderRow>
|
||||
<RenderRow
|
||||
data={
|
||||
Array [
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "1",
|
||||
"partitionKey": "pk1",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 0,
|
||||
"selected": false,
|
||||
},
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "2",
|
||||
"partitionKey": "pk2",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 1,
|
||||
"selected": false,
|
||||
},
|
||||
Object {
|
||||
"appearance": "none",
|
||||
"item": Object {
|
||||
"id": "3",
|
||||
"partitionKey": "pk3",
|
||||
},
|
||||
"onClick": [Function],
|
||||
"onKeyDown": [Function],
|
||||
"rowId": 2,
|
||||
"selected": false,
|
||||
},
|
||||
]
|
||||
}
|
||||
index={2}
|
||||
key="2"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 60,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TableRow
|
||||
appearance="none"
|
||||
aria-rowindex={4}
|
||||
aria-selected={false}
|
||||
key="3"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 60,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<div
|
||||
aria-rowindex={4}
|
||||
aria-selected={false}
|
||||
className="fui-TableRow ___1iajlcl_snm7au0 f19n0e5 f1ewtqcl f1jazu75 f1xeqee6 fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f1wfn5kd f1g4hkjv f15ngxrw fjbbrdp f1t94bn6 feu1g3u f1uorfem fw60kww fy9rknc f22iagw f122n59"
|
||||
role="row"
|
||||
style={
|
||||
Object {
|
||||
"height": 30,
|
||||
"left": 0,
|
||||
"position": "absolute",
|
||||
"right": undefined,
|
||||
"top": 60,
|
||||
"width": "100%",
|
||||
}
|
||||
}
|
||||
>
|
||||
<TableCell
|
||||
className="documentsTableCell"
|
||||
key="id"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={0}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCell documentsTableCell ___o2cmzw0_1ilyrce f10pi13n f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f22iagw f10tiqix f122n59 fqerorx f1neuvcm fkjuxzh f1pha7fy"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
role="cell"
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={0}
|
||||
>
|
||||
<TableCellLayout
|
||||
title="3"
|
||||
truncate={true}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout ___16owy0g_d3kle00 f22iagw f122n59 fsnqrgy fylz90v fqerorx f1neuvcm fkjuxzh f1p9o1ba"
|
||||
title="3"
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout__content ___1vq3ijp_1wyv0tp f22iagw f1vx9l62 f1p9o1ba"
|
||||
>
|
||||
<span
|
||||
className="fui-TableCellLayout__main ___1q6a9l3_1koyf1t f1p9o1ba fz5stix f1cmbuwj"
|
||||
>
|
||||
3
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</TableCellLayout>
|
||||
</div>
|
||||
</TableCell>
|
||||
<TableCell
|
||||
className="documentsTableCell"
|
||||
key="partitionKey"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCell documentsTableCell ___o2cmzw0_1ilyrce f10pi13n f1nbblvp f1vdfbxk f1ov4xf1 f1f5gg8d fz36nt7 f9znhxp fqrak0z f1o2ludy f1kjnpwc fxmnebo f1witrsb f22iagw f10tiqix f122n59 fqerorx f1neuvcm fkjuxzh f1pha7fy"
|
||||
onClick={[Function]}
|
||||
onKeyDown={[Function]}
|
||||
role="cell"
|
||||
style={
|
||||
Object {
|
||||
"maxWidth": 50,
|
||||
"minWidth": 50,
|
||||
"width": 50,
|
||||
}
|
||||
}
|
||||
tabIndex={-1}
|
||||
>
|
||||
<TableCellLayout
|
||||
title="pk3"
|
||||
truncate={true}
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout ___16owy0g_d3kle00 f22iagw f122n59 fsnqrgy fylz90v fqerorx f1neuvcm fkjuxzh f1p9o1ba"
|
||||
title="pk3"
|
||||
>
|
||||
<div
|
||||
className="fui-TableCellLayout__content ___1vq3ijp_1wyv0tp f22iagw f1vx9l62 f1p9o1ba"
|
||||
>
|
||||
<span
|
||||
className="fui-TableCellLayout__main ___1q6a9l3_1koyf1t f1p9o1ba fz5stix f1cmbuwj"
|
||||
>
|
||||
pk3
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</TableCellLayout>
|
||||
</div>
|
||||
</TableCell>
|
||||
</div>
|
||||
</TableRow>
|
||||
</RenderRow>
|
||||
</div>
|
||||
</div>
|
||||
</List>
|
||||
</div>
|
||||
</TableBody>
|
||||
</div>
|
||||
</Table>
|
||||
</DocumentsTableComponent>
|
||||
`;
|
||||
|
||||
exports[`DocumentsTableComponent should render documents and partition keys in header 1`] = `
|
||||
<DocumentsTableComponent
|
||||
columnHeaders={
|
||||
@ -10,6 +990,7 @@ exports[`DocumentsTableComponent should render documents and partition keys in h
|
||||
],
|
||||
}
|
||||
}
|
||||
isSelectionDisabled={false}
|
||||
items={
|
||||
Array [
|
||||
Object {
|
||||
|
Loading…
Reference in New Issue
Block a user