title: React Typescript hook error - This expression is not callable
body: <p>im having this issue since i moved the code from React Javascript to React Typescript</p>
  
  <p>I have this simple hook that switch state from on/off (or true false) (code below)
  I'm struggling into this since this code were working on Javascript </p>
  
  <p><a href="https://codesandbox.io/s/react-hooks-typescript-issue-fwhdd?file=/src/Switch.tsx" rel="noreferrer">Code here to test it</a></p>
  
  <p>So the toggle function has some error but cannot figure it out. Some help would be much appreciated</p>
  
  <p><a href="https://i.stack.imgur.com/J3HJS.png" rel="noreferrer"><img src="https://i.stack.imgur.com/J3HJS.png" alt="enter image description here"></a></p>
  
  <pre class="lang-js prettyprint-override"><code>// useToggle.tsx
  import { useState } from "react";
  
  export const useToggle = (initialMode = false) =&gt; {
    const [open, setOpen] = useState(initialMode);
    const toggle = () =&gt; setOpen(!open);
    return [open, setOpen, toggle];
  };
  
  </code></pre>
  
  <p>My switch component</p>
  
  <pre class="lang-js prettyprint-override"><code>// Switch.tsx
  import { useToggle } from "./useToggle";
  
  import React from "react";
  
  export const Switch = () =&gt; {
    const [open, toggle] = useToggle();
    const [open2, toggle2] = useToggle();
    return (
      &lt;&gt;
        &lt;p&gt;Testing toggle 1: {`${open}`}&lt;/p&gt;
        &lt;p&gt;Testing toggle 2: {`${open2}`}&lt;/p&gt;
        &lt;button
          onClick={() =&gt; {
            toggle();
          }}
        &gt;
          Toggle 1
        &lt;/button&gt;
        &lt;button
          onClick={() =&gt; {
            toggle2();
          }}
        &gt;
          Toggle 2
        &lt;/button&gt;
      &lt;/&gt;
    );
  };
  </code></pre>
  
  <p>And now i use my switch component</p>
  
  <pre class="lang-js prettyprint-override"><code>// App.tsx
  import * as React from "react";
  import "./styles.css";
  import { Switch } from "./Switch";
  
  export default function App() {
    return (
      &lt;div className="App"&gt;
        &lt;h1&gt;Hello CodeSandbox&lt;/h1&gt;
        &lt;Switch /&gt;
      &lt;/div&gt;
    );
  }
  </code></pre>