To recreate the Raindrop UI sidebar (which consists of Groups containing Collections), you must perform three separate API calls because the grouping and ordering logic is stored in the user object rather than within the collection items themselves. This allows different users to have different views of shared collections.
Implementation Steps
- Fetch the User Object: Retrieve the user's
groups array. This array defines the titles, visibility, and the specific order of collection IDs within each group. - Fetch Root Collections: Use the collection IDs found in the
groups[].collections array to fetch the top-level collection details (name, count, icon, etc.). - Fetch Child Collections: For any nested structure, fetch child collections separately. Note that while root collection order is determined by the
groups array, the sort order for child collections is persisted within the collection item itself using the sort field.
// Example of the groups structure retrieved from the User Object
{
"groups": [
{
"title": "Home",
"hidden": false,
"sort": 0,
"collections": [
8364483,
8364403,
66
]
},
{
"title": "Work",
"hidden": false,
"sort": 1,
"collections": [
8492393
]
}
]
}