Skip to content

Commit

Permalink
Merge pull request #3250 from davidradl/git3236
Browse files Browse the repository at this point in the history
#3236 add filtering to search results
  • Loading branch information
davidradl authored Jun 24, 2020
2 parents 69fb3aa + 731073f commit 1e565b2
Show file tree
Hide file tree
Showing 2 changed files with 115 additions and 65 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,10 @@
import React, { useState, useContext } from "react";
import { GlossaryAuthorContext } from "../../contexts/GlossaryAuthorContext";
import {
Button,
Accordion,
AccordionItem,
DataTable,
Select,
SelectItem,
MultiSelect,
TableContainer,
Table,
TableHead,
Expand All @@ -15,52 +15,76 @@ import {
TableSelectRow,
TableCell,
TableHeader,
TableBody
TableBody,
} from "carbon-components-react";

const NodeSearch = props => {
const NodeSearch = (props) => {
console.log("NodeSearch");
const glossaryAuthorContext = useContext(GlossaryAuthorContext);

const [results, setResults] = useState([]);
const [errorMsg, setErrorMsg] = useState();

// // headers for the search results
// const [headerData] = useState([
// {
// header: "Name",
// key: "name"
// },
// {
// header: "Qualified Name",
// key: "qualifiedName"
// },
// {
// header: "Description",
// key: "description"
// }
// ]);
const headerData = calculateHeaderData();

const [errorMsg, setErrorMsg] = useState([]);
const mainProperties = [
{
key: "name",
text: "Name",
},
{
key: "description",
text: "Description",
},
{
key: "qualifiedName",
text: "Qualified Name",
},
];
const [headerData, setHeaderData] = useState(mainProperties);
const additionalProperties = calculateAdditionalProperties();
let selectedAdditionalProperties = [];
function calculateHeaderData() {
let headerData= [];
// must have a currentNodeType to get here.
glossaryAuthorContext.currentNodeType.attributes.map(function(attribute, index ) {
let header = {};
header.key=attribute.key;
header.header = attribute.label;
headerData.push(header);
});
glossaryAuthorContext.currentNodeType.summaryResponseAttributes.map(function(attribute, index ) {
let header = {};
header.key=attribute.key;
header.header = attribute.label;
headerData.push(header);

let allProperties = mainProperties;
if (selectedAdditionalProperties !== undefined && selectedAdditionalProperties && selectedAdditionalProperties.length >0) {
console.log("selectedAdditionalProperties.selectedItems 1");
console.log(selectedAdditionalProperties);
allProperties = mainProperties.concat(selectedAdditionalProperties);

}
console.log("allProperties 1");
console.log(allProperties);
setHeaderData(allProperties);
}
const onAdditionalAttributesChanged = (items) => {
console.log("onAdditionalAttributesChanged");
console.log(items.selectedItems);
selectedAdditionalProperties = [];
const selectedItems = items.selectedItems;
for (let i=0;i < selectedItems.length; i++) {
let item = {};
item.key = selectedItems[i].id;
item.text= selectedItems[i].text;
selectedAdditionalProperties.push(item);
}
// render the table by recalculating the header state based on the new values
calculateHeaderData();
};
function calculateAdditionalProperties() {
let items = [];
glossaryAuthorContext.currentNodeType.attributes.map(function (attribute) {
if (
attribute.key != "name" &&
attribute.key != "qualifiedName" &&
attribute.key != "description"
) {
let item = {};
item.id = attribute.key;
item.text = attribute.label;
items.push(item);
}
});
return headerData;
return items;
}


const isSelectedNode = () => {
let isSelected = false;
if (glossaryAuthorContext.selectedNode) {
Expand All @@ -69,25 +93,27 @@ const NodeSearch = props => {
return isSelected;
};

const handleOnChange = e => {
const handleOnChange = (e) => {
e.preventDefault();
if (e.target.value && e.target.value.length > 0) {
const fetchUrl = glossaryAuthorContext.currentNodeType.url + "?searchCriteria=" + e.target.value;
const fetchUrl =
glossaryAuthorContext.currentNodeType.url +
"?searchCriteria=" +
e.target.value;
fetch(fetchUrl, {
method: "get",
headers: {
Accept: "application/json",
"Content-Type": "application/json"
}
"Content-Type": "application/json",
},
})
.then(res => res.json())
.then(res => {
.then((res) => res.json())
.then((res) => {
const nodesArray = res[glossaryAuthorContext.currentNodeType.plural];
// if there is a node response then we have successfully created a node
if (nodesArray) {
if (nodesArray.length > 0) {

let nodeRows = nodesArray.map(function(node, index ) {
let nodeRows = nodesArray.map(function (node, index) {
let row = {};
row.id = index;
// row.name = node.name;
Expand All @@ -96,14 +122,14 @@ const NodeSearch = props => {
// row.qualifiedName = node.qualifiedName;
for (const property in node) {
console.log("result property is ", property);
if (property == 'glossary') {
const glossary = node[property];
row.glossaryName = glossary.name;
row.glossaryGuid = glossary.guid;
} else if (property == 'systemAttributes' ) {
row.guid = node[property].guid;
} else {
row[property] = node[property];
if (property == "glossary") {
const glossary = node[property];
row.glossaryName = glossary.name;
row.glossaryGuid = glossary.guid;
} else if (property == "systemAttributes") {
row.guid = node[property].guid;
} else {
row[property] = node[property];
}
}
return row;
Expand All @@ -117,14 +143,29 @@ const NodeSearch = props => {
setErrorMsg("Create Failed with code " + res.errno);
}
})
.catch(res => {
.catch((res) => {
setErrorMsg("Create Failed");
});
}
};
return (
<div>
{/* <NodeCreateModal show={showCreate} onHide={handleCloseCreate} nodeType={nodeType}></NodeCreateModal> */}
{glossaryAuthorContext.currentNodeType &&
glossaryAuthorContext.currentNodeType.attributes.length > 3 && (
<Accordion>
<AccordionItem title="Show additional properties">
<div class="bx--form-item">
<div style={{ width: 150 }}>
<MultiSelect
onChange= {onAdditionalAttributesChanged}
items={additionalProperties}
itemToString={(item) => (item ? item.text : "")}
/>
</div>
</div>
</AccordionItem>
</Accordion>
)}
<div data-search role="search" class="bx--search bx--search--l">
<label
id="search-input-label-1"
Expand Down Expand Up @@ -181,25 +222,27 @@ const NodeSearch = props => {
headers,
getHeaderProps,
getSelectionProps,
getRowProps
getRowProps,
}) => (
<TableContainer title={glossaryAuthorContext.currentNodeType.typeName}>
<TableContainer
title={glossaryAuthorContext.currentNodeType.typeName}
>
<Table>
<TableHead>
<TableRow>
<TableSelectAll {...getSelectionProps()} />
{headers.map(header => (
{headers.map((header) => (
<TableHeader {...getHeaderProps({ header })}>
{header.header}
{header.text}
</TableHeader>
))}
</TableRow>
</TableHead>
<TableBody>
{rows.map(row => (
{rows.map((row) => (
<TableRow {...getRowProps({ row })}>
<TableSelectRow {...getSelectionProps({ row })} />
{row.cells.map(cell => (
{row.cells.map((cell) => (
<TableCell key={cell.id}>{cell.value}</TableCell>
))}
</TableRow>
Expand Down
Original file line number Diff line number Diff line change
@@ -1,8 +1,15 @@
/* SPDX-License-Identifier: Apache-2.0 */
/* Copyright Contributors to the ODPi Egeria project. */
var records = [
{ id: 1, username: 'faith', password: 'admin', displayName: 'Faith Broker', emails: [ { value: 'faith@coco.com' } ] }
, { id: 2, username: 'callie', password: 'admin', displayName: 'Callie Quartile', emails: [ { value: 'callie@coco.com' } ] }
{ id: 1, username: 'faith', password: 'admin', displayName: 'Faith Broker', emails: [ { value: 'faith@coco.com' } ] }
, { id: 2, username: 'faithbroker', password: 'admin', displayName: 'Faith Broker', emails: [ { value: 'faith@coco.com' } ] }
, { id: 3, username: 'callie', password: 'admin', displayName: 'Callie Quartile', emails: [ { value: 'callie@coco.com' } ] }
, { id: 4, username: 'calliequartile', password: 'admin', displayName: 'Callie Quartile', emails: [ { value: 'callie@coco.com' } ] }
, { id: 5, username: 'gary', password: 'admin', displayName: 'Faith Broker', emails: [ { value: 'gary@coco.com' } ] }
, { id: 6, username: 'garygeeke', password: 'admin', displayName: 'Gary Geeke', emails: [ { value: 'gary@coco.com' } ] }
, { id: 7, username: 'erin', password: 'admin', displayName: 'Erin Overview', emails: [ { value: 'erin@coco.com' } ] }
, { id: 8, username: 'erinoverview', password: 'admin', displayName: 'Erin Overview', emails: [ { value: 'erin@coco.com' } ] }

];

exports.findById = function(id, cb) {
Expand Down

0 comments on commit 1e565b2

Please sign in to comment.