title: React functional component destructuring
body: <p>I followed a react course on udemy. I can't understand the following code. What does this object after const InputGroup = (, does? I have seen tutorials use, props, but here props are not used. Instead an object is used. </p>
  
  <pre><code>const InputGroup = ({
    name,
    placeholder,
    value,
    error,
    icon,
    type,
    onChange,
    autoComplete,
  }) =&gt; {
    return (
      &lt;div className="input-group mb-3"&gt;
        &lt;div className="input-group-prepend"&gt;
          &lt;span className="input-group-text"&gt;
            &lt;i className={icon} /&gt;
          &lt;/span&gt;
        &lt;/div&gt;
        &lt;input
          type={type}
          className={classnames('form-control form-control-lg', {
            'is-invalid': error,
          })}
          placeholder={placeholder}
          name={name}
          value={value}
          onChange={onChange}
          autoComplete={autoComplete}
        /&gt;
        {error &amp;&amp; &lt;div className="invalid-feedback"&gt;{error}&lt;/div&gt;}
      &lt;/div&gt;
    )
  }
  </code></pre>