Wait for Subscription set Recursively to Complete

I have an array of objects with children and have a need to set a field (hidden) in each of those objects recursively. The value for each is set in a subscription. I want to wait until each item in the array is recursively updated before the subscription is complete.

The hidden field will be set based on roles and permissions derived from another observable. In the example I added a delay to simulate that.

Here's my first pass at it. I'm certain there is a much cleaner way of going about this.

https://codesandbox.io/s/rxjs-playground-hp3wr

// Array structure. Note children.
const navigation = [
  {
    id: "applications",
    title: "Applications",
    children: [
      {
        id: "dashboard",
        title: "Dashboard"
      },
      {
        id: "clients",
        title: "Clients"
      },
      {
        id: "documents",
        title: "Documents",
        children: [
          {
            id: "dashboard",
            title: "Dashboard"
          },...
        ]
      },
      {
        id: "reports",
        title: "Reports"
      },
      {
        id: "resources",
        title: "Resources"
      }
    ]
  }
];

In the code sandbox example, looking at the console messages, I get the correct result. However, I would like to avoid having to subscribe in setHidden and recursivelySetHidden. I would also like to avoid using Subject if possible.