title: How to build React checkbox tree
body: <p>I'm trying to work with a checkbox tree component like this: <a href="https://www.npmjs.com/package/react-checkbox-tree" rel="nofollow noreferrer">https://www.npmjs.com/package/react-checkbox-tree</a>, except I'm storing the items that I have selected in Redux.  Moreover, the only items that I'm actually storing are the leaf nodes in the tree.  So for example, I'd have the full options data which would be used to render the tree:</p>
  
  <pre><code>const fam = {
    cuz2: {
      name: 'cuz2',
      children: {
        cuzKid2: {
          name: 'cuzKid2',
          children: {
          }
        }
      }
    },
    grandpa: {
      name: 'grandpa',
      children: {
        dad: {
          name: 'dad',
          children: {
            me: {
             name: 'me',
             children: {}
            },
            sis: {
             name: 'sis',
             children: {}
            }
          }
        },
        aunt: {
          name: 'aunt',
          children: {
            cuz: {
              name: 'cuz',
              children: {
                name: 'cuzkid',
                children: {}
              }
            }
          }
      }
    }
  }
  </code></pre>
  
  <p>and a separate object that stores the items selected.  The following would be the only items that would appear if every checkbox was checked:</p>
  
  <pre><code>const selected = {
   cuz2: true,
   me: true,
   sis: true,
   cuz: true
  }
  </code></pre>
  
  <p>I seem to be struggling with this method for having the UI determine which boxes to have fully, partially, or un-checked based on the <code>selected</code> object.  I was wondering if anyone can recommend another strategy of accomplishing this.</p>