Transform tree from graphql format to json format in javascript

Question

I'm trying to transform my data on client side from this format:

[{
    "id": 1,
    "name": "dad",
    "parent": [],
    "children": [{
            "group": {
                "id": 2,
                "name": "child1",
                "parent": [{
                    "parent": 1
                }]
            }
        },
        {
            "group": {
                "id": 3,
                "name": "child2",
                "parent": [{
                    "parent": 1
                }]
            }
        },
        {
            "group": {
                "id": 8,
                "name": "child3",
                "parent": [{
                    "parent": 1
                }]
            }
        }
    ]
}]

to this format:

[{
    id: 1,
    name: "parent",
    parent: null,
    children: [{
            id: 2,
            name: "child1",
            parent: {
                id: 1
            },
            children: []
        },
        {
            id: 3,
            name: "child2",
            parent: {
                id: 1
            },
            children: []
        }
    ]
}]

key points:

All keys should not be in a string type
The 'parent' should just include the id of the parent
'group' object should be removed - and its contents should just replace him

I can't find a transformation library in npm to use and i need the data to be in that exact format to use in 'react-vertical-tree' component (didn't find any other good looking vertical tree component in react).

"All keys should not be in a string type" The keys of an object are either a string or a Symbol — adiga
– adiga, Commented Nov 21, 2019 at 10:12

Nina Scholz · Accepted Answer · 2019-11-21 10:21:49Z

1

You could map new objects with converted parts.

const convert = o => {
    var children;
    if ('group' in o) o = o.group;
    if ('children' in o) children = o.children.map(convert);
    return Object.assign({}, o, { parent: o.parent.length ? { id: o.parent[0].parent } : null }, children && { children });
};

var data = [{ id: 1, name: "dad", parent: [], children: [{ group: { id: 2, name: "child1", parent: [{ parent: 1 }] } }, { group: { id: 3, name: "child2", parent: [{ parent: 1 }] } }, { group: { id: 8, name: "child3", parent: [{ parent: 1 }] } }] }],
    result = data.map(convert);

console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

answered Nov 21, 2019 at 10:21

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Transform tree from graphql format to json format in javascript

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related