Search code examples
javascriptjsonreactjsreact-reduxjson-api

How do I filter a list of data by id for my react component to get the name of the object


So I have a list of data coming from my redux-store the I have JSON.stringified so I can read it. I want to filter through the list of permissions which only provides me the id to get the name of each permission, so I can display the Permission Name in my React Component.

Here is one sample Item:

{
    "id": "1",
    "type": "role-templates",
    "links": { "self": "http://localhost/v1/role-templates/1" },
    "attributes": {
      "name": "Org Admin",
      "description": "Administers an Organization"
    },
    "relationships": {
      "role-template-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/role-templates/1/relationships/role-template-permission-list",
          "related":
            "http://localhost/v1/role-templates/1/role-template-permission-list"
        }
      },
      "permissions": {
        "links": {
          "self":
            "http://localhost/v1/role-templates/1/relationships/permissions",
          "related":
            "http://localhost/v1/role-templates/1/permissions"
        },
        "data": [
          { "type": "permissions", "id": "1" },
          { "type": "permissions", "id": "2" },
          { "type": "permissions", "id": "3" },
          { "type": "permissions", "id": "4" },
          { "type": "permissions", "id": "5" },
          { "type": "permissions", "id": "6" },
          { "type": "permissions", "id": "7" },
          { "type": "permissions", "id": "8" },
          { "type": "permissions", "id": "9" },
          { "type": "permissions", "id": "10" },
          { "type": "permissions", "id": "11" },
          { "type": "permissions", "id": "12" },
          { "type": "permissions", "id": "13" },
          { "type": "permissions", "id": "14" },
          { "type": "permissions", "id": "15" },
          { "type": "permissions", "id": "17" },
          { "type": "permissions", "id": "18" },
          { "type": "permissions", "id": "19" },
          { "type": "permissions", "id": "20" },
          { "type": "permissions", "id": "21" },
          { "type": "permissions", "id": "23" },
          { "type": "permissions", "id": "24" }
        ]
      }
    }

This is the data for the permissions endpoint from the backend again I JSON.stringified it for this slack question:

[
  {
    "id": "1",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/1" },
    "attributes": {
      "name": "Administer Source List",
      "description": "Data Source",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/1/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/1/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/1/relationships/roles",
          "related": "http://localhost/v1/permissions/1/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "2" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "8" }
        ]
      }
    }
  },
  {
    "id": "2",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/2" },
    "attributes": {
      "name": "Administer Common Layers",
      "description": "Data Source",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/2/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/2/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/2/relationships/roles",
          "related": "http://localhost/v1/permissions/2/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "2" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "8" }
        ]
      }
    }
  },
  {
    "id": "3",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/3" },
    "attributes": {
      "name": "Do benchmark tagging",
      "description": "Data Source",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/3/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/3/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/3/relationships/roles",
          "related": "http://localhost/v1/permissions/3/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "2" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "8" }
        ]
      }
    }
  },
  {
    "id": "4",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/4" },
    "attributes": {
      "name": "Do trend mapping",
      "description": "Data Source",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/4/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/4/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/4/relationships/roles",
          "related": "http://localhost/v1/permissions/4/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "2" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "8" }
        ]
      }
    }
  },
  {
    "id": "5",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/5" },
    "attributes": {
      "name": "Map custom values (for each data source)",
      "description": "Data Source",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/5/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/5/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/5/relationships/roles",
          "related": "http://localhost/v1/permissions/5/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "2" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "8" }
        ]
      }
    }
  },
  {
    "id": "6",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/6" },
    "attributes": {
      "name": "Administer Data Sets",
      "description": "Data Sets",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/6/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/6/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/6/relationships/roles",
          "related": "http://localhost/v1/permissions/6/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "2" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "8" }
        ]
      }
    }
  },
  {
    "id": "7",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/7" },
    "attributes": {
      "name": "Create Campaigns",
      "description": "Campaigns",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/7/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/7/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/7/relationships/roles",
          "related": "http://localhost/v1/permissions/7/roles"
        },
        "data": [{ "type": "roles", "id": "1" }, { "type": "roles", "id": "7" }]
      }
    }
  },
  {
    "id": "8",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/8" },
    "attributes": {
      "name": "Access/modify campaign setup",
      "description": "Campaigns",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/8/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/8/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/8/relationships/roles",
          "related": "http://localhost/v1/permissions/8/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "3" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "9" }
        ]
      }
    }
  },
  {
    "id": "9",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/9" },
    "attributes": {
      "name": "Launch campaigns",
      "description": "Campaigns",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/9/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/9/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/9/relationships/roles",
          "related": "http://localhost/v1/permissions/9/roles"
        },
        "data": [{ "type": "roles", "id": "1" }, { "type": "roles", "id": "7" }]
      }
    }
  },
  {
    "id": "10",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/10" },
    "attributes": {
      "name": "Create org-wide survey-related notifications",
      "description": "Campaigns",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/10/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/10/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/10/relationships/roles",
          "related": "http://localhost/v1/permissions/10/roles"
        },
        "data": [{ "type": "roles", "id": "1" }, { "type": "roles", "id": "7" }]
      }
    }
  },
  {
    "id": "11",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/11" },
    "attributes": {
      "name": "View Reports",
      "description": "Reports",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/11/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/11/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/11/relationships/roles",
          "related": "http://localhost/v1/permissions/11/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "4" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "10" }
        ]
      }
    }
  },
  {
    "id": "12",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/12" },
    "attributes": {
      "name": "Modify prebuilt reports",
      "description": "Reports",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/12/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/12/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/12/relationships/roles",
          "related": "http://localhost/v1/permissions/12/roles"
        },
        "data": [{ "type": "roles", "id": "1" }, { "type": "roles", "id": "7" }]
      }
    }
  },
  {
    "id": "13",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/13" },
    "attributes": {
      "name": "Create new reports",
      "description": "Reports",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/13/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/13/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/13/relationships/roles",
          "related": "http://localhost/v1/permissions/13/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "4" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "10" }
        ]
      }
    }
  },
  {
    "id": "14",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/14" },
    "attributes": {
      "name": "Share reports with rest of org",
      "description": "Reports",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/14/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/14/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/14/relationships/roles",
          "related": "http://localhost/v1/permissions/14/roles"
        },
        "data": [{ "type": "roles", "id": "1" }, { "type": "roles", "id": "7" }]
      }
    }
  },
  {
    "id": "15",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/15" },
    "attributes": {
      "name": "Share filters with rest of org",
      "description": "Reports",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/15/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/15/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/15/relationships/roles",
          "related": "http://localhost/v1/permissions/15/roles"
        },
        "data": [{ "type": "roles", "id": "1" }, { "type": "roles", "id": "7" }]
      }
    }
  },
  {
    "id": "16",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/16" },
    "attributes": {
      "name": "Create portfolio",
      "description": "APT",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/16/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/16/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/16/relationships/roles",
          "related": "http://localhost/v1/permissions/16/roles"
        },
        "data": []
      }
    }
  },
  {
    "id": "17",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/17" },
    "attributes": {
      "name": "Access all portfolios (at org)",
      "description": "APT",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/17/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/17/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/17/relationships/roles",
          "related": "http://localhost/v1/permissions/17/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "5" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "11" }
        ]
      }
    }
  },
  {
    "id": "18",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/18" },
    "attributes": {
      "name": "Assign action plans",
      "description": "APT",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/18/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/18/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/18/relationships/roles",
          "related": "http://localhost/v1/permissions/18/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "5" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "11" }
        ]
      }
    }
  },
  {
    "id": "19",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/19" },
    "attributes": {
      "name": "Work on action plans",
      "description": "APT",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/19/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/19/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/19/relationships/roles",
          "related": "http://localhost/v1/permissions/19/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "5" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "11" }
        ]
      }
    }
  },
  {
    "id": "20",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/20" },
    "attributes": {
      "name": "Administer role templates for org",
      "description": "Manage Users",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/20/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/20/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/20/relationships/roles",
          "related": "http://localhost/v1/permissions/20/roles"
        },
        "data": [{ "type": "roles", "id": "1" }, { "type": "roles", "id": "7" }]
      }
    }
  },
  {
    "id": "21",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/21" },
    "attributes": {
      "name": "Add/edit/delete non org-admin users at org",
      "description": "Manage Users",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/21/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/21/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/21/relationships/roles",
          "related": "http://localhost/v1/permissions/21/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "6" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "12" }
        ]
      }
    }
  },
  {
    "id": "22",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/22" },
    "attributes": {
      "name": "Add/edit/dete ORg Admin users at org",
      "description": "Manage Users",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/22/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/22/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/22/relationships/roles",
          "related": "http://localhost/v1/permissions/22/roles"
        },
        "data": []
      }
    }
  },
  {
    "id": "23",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/23" },
    "attributes": {
      "name": "Administer access patterns at org",
      "description": "Manage Users",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/23/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/23/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/23/relationships/roles",
          "related": "http://localhost/v1/permissions/23/roles"
        },
        "data": [
          { "type": "roles", "id": "1" },
          { "type": "roles", "id": "6" },
          { "type": "roles", "id": "7" },
          { "type": "roles", "id": "12" }
        ]
      }
    }
  },
  {
    "id": "24",
    "type": "permissions",
    "links": { "self": "http://localhost/v1/permissions/24" },
    "attributes": {
      "name": "Switch user (\"Impersonate\" another user)",
      "description": "Manage Users",
      "is-active": null
    },
    "relationships": {
      "role-permission-list": {
        "links": {
          "self":
            "http://localhost/v1/permissions/24/relationships/role-permission-list",
          "related":
            "http://localhost/v1/permissions/24/role-permission-list"
        }
      },
      "roles": {
        "links": {
          "self":
            "http://localhost/v1/permissions/24/relationships/roles",
          "related": "http://localhost/v1/permissions/24/roles"
        },
        "data": [{ "type": "roles", "id": "1" }, { "type": "roles", "id": "7" }]
      }
    }
  }
]

So as you can see each permission has a name, description. So I want to retrieve the name of each permission, by using the id filter.


Solution

  • You can use map on all the elements in the permissions data and find the element in the data in the result of the second request that contains the name and description.

    const result = roleTemplate.relationships.permissions.data.map(permission => {
      const permissionData = data.find(element => element.id === permission.id);
      return {
        id: permission.id,
        name: permissionData.attributes.name,
        description: permissionData.attributes.description
      };
    });
    

    const roleTemplate = {
      id: "1",
      type: "role-templates",
      links: { self: "http://localhost/v1/role-templates/1" },
      attributes: {
        name: "Org Admin",
        description: "Administers an Organization"
      },
      relationships: {
        "role-template-permission-list": {
          links: {
            self:
              "http://localhost/v1/role-templates/1/relationships/role-template-permission-list",
            related:
              "http://localhost/v1/role-templates/1/role-template-permission-list"
          }
        },
        permissions: {
          links: {
            self: "http://localhost/v1/role-templates/1/relationships/permissions",
            related: "http://localhost/v1/role-templates/1/permissions"
          },
          data: [
            { type: "permissions", id: "1" },
            { type: "permissions", id: "2" },
            { type: "permissions", id: "3" },
            { type: "permissions", id: "4" },
            { type: "permissions", id: "5" },
            { type: "permissions", id: "6" },
            { type: "permissions", id: "7" },
            { type: "permissions", id: "8" },
            { type: "permissions", id: "9" },
            { type: "permissions", id: "10" },
            { type: "permissions", id: "11" },
            { type: "permissions", id: "12" },
            { type: "permissions", id: "13" },
            { type: "permissions", id: "14" },
            { type: "permissions", id: "15" },
            { type: "permissions", id: "17" },
            { type: "permissions", id: "18" },
            { type: "permissions", id: "19" },
            { type: "permissions", id: "20" },
            { type: "permissions", id: "21" },
            { type: "permissions", id: "23" },
            { type: "permissions", id: "24" }
          ]
        }
      }
    };
    
    const data = [
      {
        id: "1",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/1" },
        attributes: {
          name: "Administer Source List",
          description: "Data Source",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/1/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/1/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/1/relationships/roles",
              related: "http://localhost/v1/permissions/1/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "2" },
              { type: "roles", id: "7" },
              { type: "roles", id: "8" }
            ]
          }
        }
      },
      {
        id: "2",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/2" },
        attributes: {
          name: "Administer Common Layers",
          description: "Data Source",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/2/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/2/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/2/relationships/roles",
              related: "http://localhost/v1/permissions/2/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "2" },
              { type: "roles", id: "7" },
              { type: "roles", id: "8" }
            ]
          }
        }
      },
      {
        id: "3",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/3" },
        attributes: {
          name: "Do benchmark tagging",
          description: "Data Source",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/3/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/3/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/3/relationships/roles",
              related: "http://localhost/v1/permissions/3/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "2" },
              { type: "roles", id: "7" },
              { type: "roles", id: "8" }
            ]
          }
        }
      },
      {
        id: "4",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/4" },
        attributes: {
          name: "Do trend mapping",
          description: "Data Source",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/4/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/4/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/4/relationships/roles",
              related: "http://localhost/v1/permissions/4/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "2" },
              { type: "roles", id: "7" },
              { type: "roles", id: "8" }
            ]
          }
        }
      },
      {
        id: "5",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/5" },
        attributes: {
          name: "Map custom values (for each data source)",
          description: "Data Source",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/5/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/5/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/5/relationships/roles",
              related: "http://localhost/v1/permissions/5/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "2" },
              { type: "roles", id: "7" },
              { type: "roles", id: "8" }
            ]
          }
        }
      },
      {
        id: "6",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/6" },
        attributes: {
          name: "Administer Data Sets",
          description: "Data Sets",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/6/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/6/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/6/relationships/roles",
              related: "http://localhost/v1/permissions/6/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "2" },
              { type: "roles", id: "7" },
              { type: "roles", id: "8" }
            ]
          }
        }
      },
      {
        id: "7",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/7" },
        attributes: {
          name: "Create Campaigns",
          description: "Campaigns",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/7/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/7/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/7/relationships/roles",
              related: "http://localhost/v1/permissions/7/roles"
            },
            data: [{ type: "roles", id: "1" }, { type: "roles", id: "7" }]
          }
        }
      },
      {
        id: "8",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/8" },
        attributes: {
          name: "Access/modify campaign setup",
          description: "Campaigns",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/8/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/8/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/8/relationships/roles",
              related: "http://localhost/v1/permissions/8/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "3" },
              { type: "roles", id: "7" },
              { type: "roles", id: "9" }
            ]
          }
        }
      },
      {
        id: "9",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/9" },
        attributes: {
          name: "Launch campaigns",
          description: "Campaigns",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/9/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/9/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/9/relationships/roles",
              related: "http://localhost/v1/permissions/9/roles"
            },
            data: [{ type: "roles", id: "1" }, { type: "roles", id: "7" }]
          }
        }
      },
      {
        id: "10",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/10" },
        attributes: {
          name: "Create org-wide survey-related notifications",
          description: "Campaigns",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/10/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/10/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/10/relationships/roles",
              related: "http://localhost/v1/permissions/10/roles"
            },
            data: [{ type: "roles", id: "1" }, { type: "roles", id: "7" }]
          }
        }
      },
      {
        id: "11",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/11" },
        attributes: {
          name: "View Reports",
          description: "Reports",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/11/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/11/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/11/relationships/roles",
              related: "http://localhost/v1/permissions/11/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "4" },
              { type: "roles", id: "7" },
              { type: "roles", id: "10" }
            ]
          }
        }
      },
      {
        id: "12",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/12" },
        attributes: {
          name: "Modify prebuilt reports",
          description: "Reports",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/12/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/12/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/12/relationships/roles",
              related: "http://localhost/v1/permissions/12/roles"
            },
            data: [{ type: "roles", id: "1" }, { type: "roles", id: "7" }]
          }
        }
      },
      {
        id: "13",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/13" },
        attributes: {
          name: "Create new reports",
          description: "Reports",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/13/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/13/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/13/relationships/roles",
              related: "http://localhost/v1/permissions/13/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "4" },
              { type: "roles", id: "7" },
              { type: "roles", id: "10" }
            ]
          }
        }
      },
      {
        id: "14",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/14" },
        attributes: {
          name: "Share reports with rest of org",
          description: "Reports",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/14/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/14/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/14/relationships/roles",
              related: "http://localhost/v1/permissions/14/roles"
            },
            data: [{ type: "roles", id: "1" }, { type: "roles", id: "7" }]
          }
        }
      },
      {
        id: "15",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/15" },
        attributes: {
          name: "Share filters with rest of org",
          description: "Reports",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/15/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/15/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/15/relationships/roles",
              related: "http://localhost/v1/permissions/15/roles"
            },
            data: [{ type: "roles", id: "1" }, { type: "roles", id: "7" }]
          }
        }
      },
      {
        id: "16",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/16" },
        attributes: {
          name: "Create portfolio",
          description: "APT",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/16/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/16/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/16/relationships/roles",
              related: "http://localhost/v1/permissions/16/roles"
            },
            data: []
          }
        }
      },
      {
        id: "17",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/17" },
        attributes: {
          name: "Access all portfolios (at org)",
          description: "APT",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/17/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/17/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/17/relationships/roles",
              related: "http://localhost/v1/permissions/17/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "5" },
              { type: "roles", id: "7" },
              { type: "roles", id: "11" }
            ]
          }
        }
      },
      {
        id: "18",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/18" },
        attributes: {
          name: "Assign action plans",
          description: "APT",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/18/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/18/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/18/relationships/roles",
              related: "http://localhost/v1/permissions/18/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "5" },
              { type: "roles", id: "7" },
              { type: "roles", id: "11" }
            ]
          }
        }
      },
      {
        id: "19",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/19" },
        attributes: {
          name: "Work on action plans",
          description: "APT",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/19/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/19/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/19/relationships/roles",
              related: "http://localhost/v1/permissions/19/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "5" },
              { type: "roles", id: "7" },
              { type: "roles", id: "11" }
            ]
          }
        }
      },
      {
        id: "20",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/20" },
        attributes: {
          name: "Administer role templates for org",
          description: "Manage Users",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/20/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/20/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/20/relationships/roles",
              related: "http://localhost/v1/permissions/20/roles"
            },
            data: [{ type: "roles", id: "1" }, { type: "roles", id: "7" }]
          }
        }
      },
      {
        id: "21",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/21" },
        attributes: {
          name: "Add/edit/delete non org-admin users at org",
          description: "Manage Users",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/21/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/21/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/21/relationships/roles",
              related: "http://localhost/v1/permissions/21/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "6" },
              { type: "roles", id: "7" },
              { type: "roles", id: "12" }
            ]
          }
        }
      },
      {
        id: "22",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/22" },
        attributes: {
          name: "Add/edit/dete ORg Admin users at org",
          description: "Manage Users",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/22/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/22/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/22/relationships/roles",
              related: "http://localhost/v1/permissions/22/roles"
            },
            data: []
          }
        }
      },
      {
        id: "23",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/23" },
        attributes: {
          name: "Administer access patterns at org",
          description: "Manage Users",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/23/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/23/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/23/relationships/roles",
              related: "http://localhost/v1/permissions/23/roles"
            },
            data: [
              { type: "roles", id: "1" },
              { type: "roles", id: "6" },
              { type: "roles", id: "7" },
              { type: "roles", id: "12" }
            ]
          }
        }
      },
      {
        id: "24",
        type: "permissions",
        links: { self: "http://localhost/v1/permissions/24" },
        attributes: {
          name: 'Switch user ("Impersonate" another user)',
          description: "Manage Users",
          "is-active": null
        },
        relationships: {
          "role-permission-list": {
            links: {
              self:
                "http://localhost/v1/permissions/24/relationships/role-permission-list",
              related: "http://localhost/v1/permissions/24/role-permission-list"
            }
          },
          roles: {
            links: {
              self: "http://localhost/v1/permissions/24/relationships/roles",
              related: "http://localhost/v1/permissions/24/roles"
            },
            data: [{ type: "roles", id: "1" }, { type: "roles", id: "7" }]
          }
        }
      }
    ];
    
    const result = roleTemplate.relationships.permissions.data.map(permission => {
      const permissionData = data.find(element => element.id === permission.id);
      return {
        id: permission.id,
        name: permissionData.attributes.name,
        description: permissionData.attributes.description
      };
    });
    
    console.log(result);