title: Invalid Hook Call error after updating react vesion from 16.13.1 .to 17.0.1
body: <p>I am getting the following error in my react-web application.</p>
  <p>*Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:</p>
  <ol>
  <li>You might have mismatching versions of React and the renderer (such as React DOM)</li>
  <li>You might be breaking the Rules of Hooks</li>
  <li>You might have more than one copy of React in the same app
  See <a href="https://reactjs.org/link/invalid-hook-call" rel="nofollow noreferrer">https://reactjs.org/link/invalid-hook-call</a> for tips about how to debug and fix this problem.*.</li>
  </ol>
  <p>This is my code:</p>
  <pre><code>import React from 'react';
  import { useTranslation } from 'react-i18next';
  import { Button, Dropdown } from 'tabler-react';
  import regeneratorRuntime from 'regenerator-runtime';
  
  const LanguageSelector = () =&gt; {
    const {t, i18n} = useTranslation();
  
    const clicked = (event) =&gt; {
      i18n.changeLanguage(event.target.value);
    };
  
    const clickedEn = () =&gt; {
      i18n.changeLanguage(&quot;en&quot;);
    };
  
    const clickedTr = () =&gt; {
      i18n.changeLanguage(&quot;tr&quot;);
    };
  
    return (
      &lt;Button.List align={&quot;right&quot;}&gt;
        &lt;Dropdown
          outline
          type=&quot;button&quot;
          size=&quot;sm&quot;
          toggle={false}
          color=&quot;primary&quot;
          arrow
          icon=&quot;globe&quot;
          triggerContent={t('selectLanguage')}
          itemsObject={[
            {
              value: &quot;English&quot;,
              onClick: clickedEn
            },
            {isDivider: true},
            {
              value: &quot;Türkçe&quot;,
              onClick: clickedTr
            },
          ]}
        /&gt;
      &lt;/Button.List&gt;
    );
  };
  
  export default LanguageSelector;
  </code></pre>
  <p>Here is the package.json file:</p>
  <pre><code>{
    &quot;name&quot;: &quot;smt&quot;,
    &quot;version&quot;: &quot;1.0.0&quot;,
    &quot;main&quot;: &quot;dist/index.js&quot;,
    &quot;module&quot;: &quot;dist/index.es.js&quot;,
    &quot;jsnext:main&quot;: &quot;dist/index.es.js&quot;,
    &quot;engines&quot;: {
      &quot;node&quot;: &quot;&gt;=8&quot;,
      &quot;npm&quot;: &quot;&gt;=5&quot;
    },
    &quot;peerDependencies&quot;: {
      &quot;react&quot;: &quot;^15.0.0 || ^16.12.0&quot;,
      &quot;react-dom&quot;: &quot;^15.0.0 || ^16.12.0&quot;
    },
    &quot;dependencies&quot;: {
      &quot;js-file-download&quot;: &quot;^0.4.8&quot;,
      &quot;konva&quot;: &quot;^7.2.0&quot;,
      &quot;moment&quot;: &quot;^2.24.0&quot;,
      &quot;react-image-lightbox&quot;: &quot;^5.1.1&quot;,
      &quot;react-konva&quot;: &quot;^17.0.0-0&quot;,
      &quot;react-router-dom&quot;: &quot;^5.1.2&quot;,
    }
  }
  </code></pre>