I am trying to build a page from json data, column "page_content" will have json and column "override_content" will have one or more parts of json with key. "override_content" will always have the latest update, if column is null no override data. Expected result is compare the data from both the columns "page_content" & "override_content" using internal json "id" and replace content in "page_content" with "override_content" column
Below are the Examples
Data in "page_content" looks like below, components has 3 child each child has unique "id"
{
"components":[
{
"id":"uibuilder:fa10894e44b3460c93912198a99e3629",
"component":{
"name":"Hero",
"properties":{
"imageUrl":"https://images.unsplash.com/photo-1532298229144-0ec0c57515c7?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=2000&q=80",
"caption1":"New Collection",
"caption2":"About this collection",
"buttonText":"Click Me!"
}
},
"componentStyle":{
"large":{
"display":"flex",
"flexDirection":"column",
"position":"relative",
"flexShrink":"0",
"boxSizing":"border-box",
"marginTop":"20px",
"minHeight":"20px",
"minWidth":"20px",
"overflow":"hidden"
}
}
},
{
"id":"uibuilder:8818c12fe5c94b27b7f7033fec7910b6",
"component":{
"name":"Text",
"properties":{
"text":"<p>This iss text</p>"
}
},
"componentStyle":{
"large":{
"display":"flex",
"flexDirection":"column",
"position":"relative",
"flexShrink":"0",
"boxSizing":"border-box",
"marginTop":"20px",
"minHeight":"20px",
"minWidth":"20px",
"overflow":"hidden"
}
}
},
{
"id":"uibuilder:8818c12fe5c94b25c94b23fec033fec7",
"component":{
"name":"Text New",
"properties":{
"text":"<b>Component heading</b>"
}
},
"componentStyle":{
"large":{
"display":"flex",
"flexDirection":"column",
"position":"relative",
"flexShrink":"0",
"boxSizing":"border-box",
"marginTop":"10px",
"minHeight":"10px",
"minWidth":"10px",
"overflow":"hidden"
}
}
}
]
}
"override_content" column has latest data for 1st and 3rd child like below,
{
"components":[
{
"id":"uibuilder:fa10894e44b3460c93912198a99e3629",
"component":{
"name":"Hero",
"properties":{
"imageUrl":"https://images.unsplash.com/photo-1532298229144-0ec0c57515c7?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=2000&q=80",
"caption1":"Faucet Collection",
"caption2":"",
"buttonText":"Click Me!"
}
},
"componentStyle":{
"large":{
"display":"flex",
"flexDirection":"column",
"position":"relative",
"flexShrink":"0",
"boxSizing":"border-box",
"marginTop":"10px",
"minHeight":"10px",
"minWidth":"10px",
"overflow":"hidden"
}
}
},
{
"id":"uibuilder:8818c12fe5c94b25c94b23fec033fec7",
"component":{
"name":"Text New",
"properties":{
"imageUrl":"https://images.unsplash.com/photo-1532298229144-0ec0c57515c7?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=2000&q=80",
"caption1":"New Collection",
"caption2":"About this collection",
"buttonText":"Click Me!"
}
},
"componentStyle":{
"large":{
"display":"flex",
"flexDirection":"column",
"position":"relative",
"flexShrink":"0",
"boxSizing":"border-box",
"marginTop":"50px",
"minHeight":"50px",
"minWidth":"50px",
"overflow":"hidden"
}
}
}
]
}
Expected result: Compare both the column data by child "id". replace the 1st and 3rd child in "page_content" with "override content" Retain the 2nd Child from "page_content" as is
{
"components":[
{
"id":"uibuilder:fa10894e44b3460c93912198a99e3629",
"component":{
"name":"Hero",
"properties":{
"imageUrl":"https://images.unsplash.com/photo-1532298229144-0ec0c57515c7?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=2000&q=80",
"caption1":"Faucet Collection",
"caption2":"",
"buttonText":"Click Me!"
}
},
"componentStyle":{
"large":{
"display":"flex",
"flexDirection":"column",
"position":"relative",
"flexShrink":"0",
"boxSizing":"border-box",
"marginTop":"10px",
"minHeight":"10px",
"minWidth":"10px",
"overflow":"hidden"
}
}
},
{
"id":"uibuilder:8818c12fe5c94b27b7f7033fec7910b6",
"component":{
"name":"Text",
"properties":{
"text":"<p>This iss text</p>"
}
},
"componentStyle":{
"large":{
"display":"flex",
"flexDirection":"column",
"position":"relative",
"flexShrink":"0",
"boxSizing":"border-box",
"marginTop":"20px",
"minHeight":"20px",
"minWidth":"20px",
"overflow":"hidden"
}
}
},
{
"id":"uibuilder:8818c12fe5c94b25c94b23fec033fec7",
"component":{
"name":"Text New",
"properties":{
"imageUrl":"https://images.unsplash.com/photo-1532298229144-0ec0c57515c7?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=2000&q=80",
"caption1":"New Collection",
"caption2":"About this collection",
"buttonText":"Click Me!"
}
},
"componentStyle":{
"large":{
"display":"flex",
"flexDirection":"column",
"position":"relative",
"flexShrink":"0",
"boxSizing":"border-box",
"marginTop":"50px",
"minHeight":"50px",
"minWidth":"50px",
"overflow":"hidden"
}
}
}
]
}
My API in ExpressJs look like below, Pages is the collection I am trying to use mongoose aggregate
router.get('/pages/findit/:_id', (req: Request, res: Response) => {
const id = req.params._id;
if (id && id.length > 0) {
const pid = mongoose.Types.ObjectId(id);
Pages.aggregate([
{
$match: { _id: pid }
}
]).exec((err, data) => {
if (err) { res.status(HttpStatusEnum.badserver).json(err); return; };
let result: IResponse = {
data: data
};
res.status(HttpStatusEnum.success).json(result);
});
}
});
Thank you