Skip to content

Commit

Permalink
Merge pull request #67 from EMCECS/bugfix-OBSDEF-47922
Browse files Browse the repository at this point in the history
  • Loading branch information
@akate1
akate1 authored May 23, 2024
2 parents 5c727d8 + 408edef commit 2c07fca
Show file tree
Hide file tree
Showing 4 changed files with 90 additions and 39 deletions.
4 changes: 2 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "@dellstorage/dell-design-react-common",
"description": "Override CSS of Clarity-React components to align it with Dell design standards",
"version": "0.2.11",
"version": "0.2.12",
"license": "Apache-2.0",
"private": false,
"outDir": "dist",
Expand All @@ -12,7 +12,7 @@
"node": ">=16.14.1"
},
"dependencies": {
"@dellstorage/clarity-react": "^1.2.14",
"@dellstorage/clarity-react": "^1.2.15",
"@types/node": "^12.14.1",
"bootstrap": "^5.2.0",
"react": "^17.0.2",
Expand Down
33 changes: 33 additions & 0 deletions src/components/dataGrid/DataGrid.stories.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@ import {
hideShowColFooter,
paginationDetails,
filterFunction,
pageFilterFunction,
paginationRows,
sortColumns,
customRows,
Expand All @@ -42,6 +43,7 @@ const datagridFilterRef = React.createRef<DataGrid>();
const datagridFilterSortRef = React.createRef<DataGrid>();
const datagridCustomFilterMultiRef = React.createRef<DataGrid>();
const datagridDetailsDemoRef = React.createRef<DataGrid>();
const datagridFullDemoRef = React.createRef<DataGrid>();

storiesOf("DataGrid", module)
.add("Basic grid with filtering", () => (
Expand Down Expand Up @@ -286,4 +288,35 @@ storiesOf("DataGrid", module)
<div style={{width: "80%"}}>
<DataGrid columns={normalColumns} footer={defaultFooter} style={{height: "70vh"}} />
</div>
))
.add("Grid full demo", () => (
<div style={{width: "80%", paddingTop: "5%"}}>
<DataGrid
ref={datagridFullDemoRef}
itemText={"Users"}
columns={[
{columnName: "IP"},
{
columnName: "Serial",
filter: (
<DataGridFilter
onFilter={pageFilterFunction}
columnName="Serial"
datagridRef={datagridFullDemoRef}
position={FilterPosition.CENTER}
/>
),
sort: {defaultSortOrder: SortOrder.ASC, sortFunction: sortFunction},
},
{columnName: "Model"},
{columnName: "Template"},
{columnName: "Networking"},
{columnName: "Role"},
]}
rows={paginationRows.slice(0, 5)}
pagination={paginationDetails}
selectionType={GridSelectionType.MULTI}
footer={hideShowColFooter}
/>
</div>
));
84 changes: 51 additions & 33 deletions src/components/dataGrid/DataGridStoriesData.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -207,28 +207,7 @@ export const hideShowColFooter = {
export const getPageData = (pageIndex: number, pageSize: number): Promise<DataGridRow[]> => {
return new Promise((resolve, reject) => {
let rows: DataGridRow[] = [];
if (pageSize === 5) {
if (pageIndex === 2) {
rows = paginationRows.slice(5, 10);
}
if (pageIndex === 1) {
rows = paginationRows.slice(0, 5);
}
} else if (pageSize === 10) {
rows = paginationRows;
}
// Purposefully added delay here to see loading spinner
setTimeout(function() {
resolve(rows);
}, 2000);
});
};

//Function to get data for page based on customPageSize and page number
export const getPageDataForCustomPageSize = (pageIndex: number, pageSize: number): Promise<DataGridRow[]> => {
return new Promise((resolve, reject) => {
let rows: DataGridRow[] = [];
let offset = pageSize * (pageIndex - 1);
const offset = pageSize * (pageIndex - 1);
rows = paginationRows.slice(offset, offset + pageSize);

setTimeout(function() {
Expand All @@ -239,16 +218,23 @@ export const getPageDataForCustomPageSize = (pageIndex: number, pageSize: number

const cellData = [
['192.168.0.1', "xyz", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "abc", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "def", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "xyz", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "123", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "123", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "klm", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "fgh", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "uvx", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "kssdlm", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.1', "lmn", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.2', "abc", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.3', "def", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.4', "xyz", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.5', "123", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.6', "123", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.7', "klm", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.8', "fgh", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.9', "uvx", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.10', "klm", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.11', "lmn", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.12', "uvx", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.13', "xyz1", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.14', "xyz2", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.15', "xyz3", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.16', "xyz4", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.17', "xyz5", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
['192.168.0.18', "xyz6", "PI-12345672", "ECS EX400", "DHCP", "Data,Monitor"],
];
// Function to get row data
export function getRowData() {
Expand Down Expand Up @@ -295,13 +281,15 @@ export const paginationDetails: DataGridPaginationProps = {
totalItems: paginationRows.length,
getPageData: getPageData,
pageSize: 5,
currentPage: 1,
pageSizes: ["5", "10"],
};

export const paginationDetailswithCustomPageSize: DataGridPaginationProps = {
totalItems: paginationRows.length,
getPageData: getPageDataForCustomPageSize,
getPageData: getPageData,
pageSize: 10,
currentPage: 1,
pageSizes: ["10", "20", "50", "100", CUSTOM_PAGE_SIZE_OPTION],
};

Expand Down Expand Up @@ -554,3 +542,33 @@ export function getRowDataWithLink(functionToAttach: Function) {
});
return rowValues;
}

export const pageFilterFunction = (
rows: DataGridRow[],
columnValue: string,
columnName: string,
): Promise<DataGridFilterResult> => {
return new Promise((resolve, reject) => {
let result: DataGridFilterResult = {
rows: [],
totalItems: 0,
};
if (columnValue === "" || columnValue === undefined) {
result = {
rows: paginationRows.slice(0, 5),
totalItems: paginationRows.length,
};
} else {
const newRows = filterRows(paginationRows, columnName, Array.isArray(columnValue) ? columnValue : [columnValue]);
result = {
rows: newRows.slice(0, 5),
totalItems: newRows.length,
};
}

// Purposefully added delay here to see loading spinner
setTimeout(function() {
resolve(result);
}, 2000);
});
};
8 changes: 4 additions & 4 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1337,10 +1337,10 @@
resolved "https://registry.yarnpkg.com/@csstools/normalize.css/-/normalize.css-10.1.0.tgz#f0950bba18819512d42f7197e56c518aa491cf18"
integrity sha512-ij4wRiunFfaJxjB0BdrYHIH8FxBJpOwNPhhAcunlmPdXudL1WQV1qoP9un6JsEBAgQH+7UXyyjh0g7jTxXK6tg==

"@dellstorage/clarity-react@^1.2.14":
version "1.2.14"
resolved "https://registry.yarnpkg.com/@dellstorage/clarity-react/-/clarity-react-1.2.14.tgz#04c6ac3e1169fdba053984d11aa26dd8f3408093"
integrity sha512-E/O45+vFFpD3vHpkWX893pKpjSM1DZ892ltNNnP0J3RwGklrRsJJ7MxDh+QTmYhKKpKY6UAyBmJ1Ik3qwIRayw==
"@dellstorage/clarity-react@^1.2.15":
version "1.2.15"
resolved "https://registry.yarnpkg.com/@dellstorage/clarity-react/-/clarity-react-1.2.15.tgz#2a1188f0d8a19c08e69c3138936e425df37f1a25"
integrity sha512-8hFqY3TG1kemGXMXDbeHi3H+V3LbfyYsh9vmbh/XIn/tF4JcJb5LgZP6loEgsIXqHuUu1/CfLa8erD2iGeJcng==
dependencies:
"@clr/icons" "12.0.8"
"@clr/ui" "12.0.8"
Expand Down

0 comments on commit 2c07fca

Please sign in to comment.