title: Is there a way to destructure with spreader?
body: <p>Here were the props I originally tried to pass through to a component:</p>
  <pre><code>const allprops = {
      mainprops:{mainprops}, // object
      pageid:{pageId}, // variable
      setpageid:{setPageId}, // state function
      makerefresh:{makeRefresh} // state function
  }
  </code></pre>
  <p><code>&lt;Navbar allprops={allprops} /&gt;</code></p>
  <p>I quickly realized I created a monster -- some nested object:</p>
  <pre><code>{mainprops: {…}, pageid: {…}, setpageid: {…}, makerefresh: {…}}
  
   mainprops: {mainprops: {…}}
  </code></pre>
  <p>after breaking my head, I came up with this:</p>
  <pre><code>const Navbar = (props) =&gt; {
    const {allprops} = props;
  
    const {mainprops, ...userprops} = allprops
    const {mainprops:{} = {}} = mainprops;
    const {userprops:{} = {}} = userprops;
  </code></pre>
  <p>is there a way to turn this into a one liner? Or a loop or something faster/shorter?</p>