Skip to content

Commit

Permalink
Merge pull request #5 from culturecreates/enhancement/issue-13
Browse files Browse the repository at this point in the history
Enhancement/issue 13
  • Loading branch information
AbhishekPAnil authored Jul 9, 2024
2 parents 64414a9 + 9678e65 commit cdcb931
Show file tree
Hide file tree
Showing 5 changed files with 181 additions and 48 deletions.
7 changes: 4 additions & 3 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

61 changes: 53 additions & 8 deletions src/Candidate.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,37 @@ export default class Candidate extends React.Component {
}

renderDescription() {
let description = this.props.candidate.description;
if (description !== undefined) {
return (<div><div className="candidateField">Description</div><div className="candidateValue">{description}</div></div>);
}
}
const description = this.props.candidate?.description;

if (description) {
return (
<div>
<div className="candidateField">Description</div>
<div className='candidate-description-wrapper'>
{description?.values?.length > 0 &&
Array.isArray(description?.values)
? description.values.map((value, index) => (
<span key={index} className="candidate-main-title">
<span className="candidate-main-title-str">
{value.str}
</span>
<span className="candidate-main-title-lang">
{value.lang}
</span>
</span>
))
: typeof description === "string" && (
<span className="candidate-main-title-str">
{description}
</span>
)}
</div>
</div>
);
}

return null;
}

renderTypes() {
let types = this.props.candidate.type;
Expand All @@ -45,10 +71,29 @@ export default class Candidate extends React.Component {
}

render() {
let candidate = this.props.candidate;
return (<ListGroupItem key={candidate.id} header={candidate.name} active={candidate.match}>
let candidate = this.props.candidate;
const nameValues = candidate?.name?.values;
const hasValues = nameValues?.length > 0;
const mainTitle = hasValues ? nameValues[0]?.str : candidate?.name;
const lang = hasValues ? nameValues[0]?.lang : "";
return (<ListGroupItem
key={candidate.id}
header={
<span className="candidate-main-title">
<span className="candidate-main-title-str-bold">{mainTitle}</span>
{hasValues && (
<span className="candidate-main-title-lang-bold">{lang}</span>
)}
</span>
}
active={candidate.match}
>

<div className="candidateMultilingualNames">{candidate?.name?.values?.slice(1)?.map(value=>{
return <span className='candidate-main-title'><span className='candidate-main-title-str'>{value?.str}</span><span className='candidate-main-title-lang'>{value?.lang}</span></span>
})}</div>
<div>
<Badge style={{float: 'right'}}>{this.props.candidate.score}</Badge>
<div>
<div><div className="candidateField">ID</div><div className="candidateValue">
<a href={this.url}>{candidate.id}</a></div></div>
{this.renderDescription()}
Expand Down
83 changes: 57 additions & 26 deletions src/TestBench.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,11 +19,11 @@ import PreviewRenderer from './PreviewRenderer.js';
import DataExtensionTab from './DataExtensionTab.js';
import JSONTree from 'react-json-tree';
import { getSchema } from './JsonValidator.js';
import { jsonTheme } from './utils.js';
import { jsonTheme, specVersions } from './utils.js';

export default class TestBench extends React.Component {
constructor() {
super();
constructor(props) {
super(props);

this.state = {
reconQuery: '',
Expand All @@ -36,6 +36,12 @@ export default class TestBench extends React.Component {
};
}

componentDidUpdate(prevProps, prevState) {
if (prevProps?.service?.endpoint !== this.props.service.endpoint) {
this.formulateReconQuery(this.props.service.manifest.versions)
}
}

onReconQueryChange = (e) => {
this.setState({
reconQuery: e.currentTarget.value
Expand Down Expand Up @@ -113,11 +119,11 @@ export default class TestBench extends React.Component {
}
this.setState({reconResults: 'fetching'});
let fetcher = this.props.service.postFetcher();
fetcher({url:this.props.service.endpoint,queries:JSON.stringify({q0: this.formulateReconQuery()})})
fetcher({url:this.props.service.endpoint,queries:JSON.stringify(this.formulateReconQuery(this.props.service.manifest.versions)),manifestVersion:this.props.service.manifest.versions})
.then(result => result.json())
.then(result =>
this.setState({
reconResults: result.q0.result,
reconResults: result?.results?.[0]?.candidates ?? result?.q0?.result ?? [],
reconResponseValidationErrors: this.validateServiceResponse('reconciliation-result-batch', result)
}))
.catch(e => {
Expand Down Expand Up @@ -189,33 +195,58 @@ export default class TestBench extends React.Component {
}
}

formulateReconQuery() {
let query = {
query: this.state.reconQuery,
};
if (this.state.reconType === 'custom-type' && this.state.reconCustomType !== undefined) {
query.type = this.state.reconCustomType.id;
} else if (this.state.reconType !== 'no-type') {
query.type = this.state.reconType;
}
if (this.state.reconProperties.length > 0) {
query.properties = this.state.reconProperties
.filter(m => m !== undefined && m.property && m.value)
.map(m => {return {pid: m.property.id, v: m.value}})
}
if (!isNaN(parseInt(this.state.reconLimit))) {
query.limit = parseInt(this.state.reconLimit);
}
return query;
}
formulateReconQuery(manifestVersion) {
const isCustomType = this.state.reconType === "custom-type" && this.state.reconCustomType !== undefined;
const isNotNoType = this.state.reconType !== "no-type";
const hasReconProperties = this.state.reconProperties.length > 0;
const reconLimit = parseInt(this.state.reconLimit);
const isLimitValid = !isNaN(reconLimit);

const buildConditions = () => {
let conditions = [{ matchType: "name", v: this.state.reconQuery }];
if (hasReconProperties) {
const properties = this.state.reconProperties
.filter(m => m && m.property && m.value)
.map(m => ({ matchType: "property", pid: m.property.id, v: m.value }));
conditions = conditions.concat(properties);
}
return conditions;
};

const buildQuery = () => {
const query = { query: this.state.reconQuery };
if (isCustomType) query.type = this.state.reconCustomType.id;
else if (isNotNoType) query.type = this.state.reconType;
if (hasReconProperties) {
query.properties = this.state.reconProperties
.filter(m => m && m.property && m.value)
.map(m => ({ pid: m.property.id, v: m.value }));
}
if (isLimitValid) query.limit = reconLimit;
return query;
};

if (manifestVersion?.includes(specVersions["0.3"])) {
return {
queries: [{
...(isCustomType ? { type: this.state.reconCustomType.id } : isNotNoType ? { type: this.state.reconType } : {}),
...(isLimitValid && { limit: this.state.reconLimit }),
conditions: buildConditions()
}]
};
} else {
return { q0: buildQuery() };
}
}

formulateQueryUrl() {
let baseUrl = this.props.service.endpoint;
if (!baseUrl) {
return '#';
}

let params = {
queries: JSON.stringify({q0: this.formulateReconQuery()})
queries: JSON.stringify( this.formulateReconQuery(this.props.service.manifest.versions))
};
let url = new URL(baseUrl);
Object.keys(params).forEach(key => url.searchParams.append(key, params[key]));
Expand Down Expand Up @@ -311,7 +342,7 @@ export default class TestBench extends React.Component {
<Col sm={3}>
<JSONTree
theme={jsonTheme}
data={this.formulateReconQuery()}
data={this.formulateReconQuery(this.props.service.manifest.versions)}
getItemString={(type, data, itemType, itemString) => ''}
shouldExpandNode={(keyName, data, level) => true}
hideRoot={true} />
Expand Down
22 changes: 22 additions & 0 deletions src/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -86,3 +86,25 @@ div .radio label {
.candidateValue {
margin-left: 1.5em;
}

.candidateMultilingualNames{
display: grid;
margin-left: 1.5em;
}

.candidate-main-title{
display: flex;
gap:8px
}

.candidate-main-title-lang-bold,.candidate-main-title-str-bold{
font-weight: bold;
}

.candidate-main-title-lang-bold,.candidate-main-title-lang{
color:#ababab
}

.candidate-description-wrapper{
margin-left: 1.5em;
}
56 changes: 45 additions & 11 deletions src/utils.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,12 @@

import fetchJsonp from 'fetch-jsonp';

export const specVersions={
"0.1":"0.1",
"0.2":"0.2",
"0.3":"0.3",
"draft":"draft",
}
const addParams = (baseUrl, params) => {
let url = new URL(baseUrl);
if (params) {
Expand Down Expand Up @@ -30,17 +36,45 @@ export const postJsonpParams = ({url,queries}) => {
}


export const postParams = ({url,queries}) => {
return fetch(url, {
method:"POST",
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
},
body: new URLSearchParams({
queries
})
});
}
export const postParams = ({
url,
queries,
manifestVersion = [specVersions["0.2"]],
}) => {
let currentManifestVersion = specVersions["0.2"];
if(manifestVersion?.includes(specVersions["0.3"])) currentManifestVersion = specVersions["0.3"];
switch (currentManifestVersion) {

case "0.2":
return fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
body: new URLSearchParams({
queries,
}),
});
case "0.3":
return fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body:queries,
});
default:
return fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
body: new URLSearchParams({
queries,
}),
});
}
};

export const jsonTheme = {
scheme: 'monokai',
Expand Down

0 comments on commit cdcb931

Please sign in to comment.