Handling checkboxes with nested array of objects

I have a component that renders multiple checkboxes. Each checkbox is handled dynamically with their checked property to be assigned while rendering. I need to print/render the values of the checkboxes selected. This is how a sample state looks like:

{
        Filters: [
          {
            name: "Vegetables",
            options: [
              {
                value: "tmto",
                name: "Tomato"
              },
              {
                value: "ptato",
                name: "Potato"
              }
            ]
          },
          {
            name: "Fruits",
            options: [
              {
                value: "ornge",
                name: "Orange"
              },
              {
                value: "grps",
                name: "Grapes"
              }
            ]
          }
        ],
      selected: []
    }

I am mapping a category name first and then again mapping the checkboxes with respective values and names, something like:

Vegetables
checkbox 1
checkbox 2

Fruits
checkbox 3
checkbox 4

I have a working snippet for the same https://codesandbox.io/s/react-functional-component-forked-wb1ew but not sure why it is unable to set the state which matches the checkbox selected. I am a bit confused about how to handle this nested checkboxes state.

Any help to resolve this is highly appreciated.