I am trying to join the array of objects internal properties with the comma , like as below
const multiSpaceIdentityInformation = spaces?.reduce(
(acc, space) => {
acc.roomName = `${acc.roomName},${space.spaceIdentity.roomName}`;
acc.roomNumber = `${acc.roomNumber},${space.spaceIdentity.roomNumber}`;
acc.storyName = `${acc.storyName},${space.buildingStory?.name}`;
acc.spaceNumber = `${acc.spaceNumber},${space.spaceIdentity.number}`;
acc.spaceName = `${acc.spaceName},${space.spaceIdentity.name}`;
return acc;
},
{
roomName: 'N/A',
roomNumber: 'N/A',
storyName: 'N/A',
spaceNumber:'N/A',
spaceName: 'N/A'
}
);
But somehow, I cannot display the information even I have spaces holding the array of objects. What I am trying to display is if there is no information, I would like to say 'N/A' as the default option.
I am accessing the above information here
const identityData = [
{ label: 'Room Number', value: multiSpaceIdentityInformation.roomNumber },
{ label: 'Room Name', value: multiSpaceIdentityInformation.roomName },
{ label: 'Level', value: multiSpaceIdentityInformation.storyName },
{ label: 'Space Number', value: multiSpaceIdentityInformation.spaceNumber },
{ label: 'Space Name', value: multiSpaceIdentityInformation.spaceName }
];
Could anyone please let me know where it goes wrong with the above code? Many thanks in advance!
Sample input
{
"Spaces": [
{
"spaceGeometry":{
"roomName": ""
"roomNumber": "",
"number": "number1"
"name": "space1"
},
"buildingStory":{
"name": "story1"
}
},
{
"spaceGeometry":{
"roomName": ""
"roomNumber": "",
"number": "number2"
"name": "space2"
},
"buildingStory":{
"name": "story2"
}
},
]
}
and desired output be like
multiSpaceIdentityInformation.roomName = "N/A"
multiSpaceIdentityInformation.roomNumber = "N/A"
multiSpaceIdentityInformation.storyName = "story1, story2"
multiSpaceIdentityInformation.spaceNumber = "number1, number2"
multiSpaceIdentityInformation.spaceName = "space1, space2"
The second parameter of reduce() is the initial value, so "N/A" will be rendered as long as spaces is an array. Here's what I would do:
const appendData = (initialValue, newValue) => {
if(!newValue) return initialValue;
if(!initialValue || initialValue === '') return newValue;
return `${initialValue}, ${newValue}`;
}
const multiSpaceIdentityInformation = spaces?.reduce(
(acc, space) => ({
roomName: appendData(acc.roomName, space.spaceIdentity.roomName),
roomNumber: appendData(acc.roomNumber, space.spaceIdentity.roomNumber),
storyName: appendData(acc.storyName, space.buildingStory?.name),
spaceNumber: appendData(acc.spaceNumber, space.spaceIdentity.number),
spaceName: appendData(acc.spaceName, space.spaceIdentity.name)
}),
{
roomName: '',
roomNumber: '',
storyName: '',
spaceNumber:'',
spaceName: ''
}
);
Object.keys(multiSpaceIdentityInformation).forEach((key) => {
if(multiSpaceIdentityInformation[key] === '')
multiSpaceIdentityInformation[key] = 'N/A';
});