title: Is it okay to change the name of the custom React Hook in 3rd party library?
body: <p>There is a rule that react hooks should not be used inside conditional statements. However, I found that if I rename the function when importing it, this rule doesn't apply. Using zustand, a third-party library, I avoid this rule as follows, but I haven't found any errors yet. When I create a <code>store</code> function in zustand it seems to be implicitly named <code>useStore</code>, but is it ok to rename it to something like this to avoid the rules of react hooks? Here is some code examples.</p>
  <pre><code>// zustandModule.js
  import create from 'zustand'
  
  const useStore = create(set =&gt; ({
    bears: 0,
    increasePopulation: () =&gt; set(state =&gt; ({ bears: state.bears + 1 })),
  }));
  
  
  
  // App.jsx
  import { useStore } from '../zustandModule';
  
  export default function App({ someBoolean }) {
    const count = someBoolean ? useStore((state) =&gt; (state.bears)) : 1;
  //                            ^
  // Error: React Hook &quot;useStore&quot; is called conditionally. React Hooks must be called in the exact same order in every component render.
    return &lt;div&gt;count: {count}&lt;/div&gt;
  }
  </code></pre>
  <p>No error</p>
  <pre><code>// App.jsx
  import { useStore as getStore } from '../zustandModule';
      
  export default function App({ someBoolean }) {
    const count = someBoolean ? getStore((state) =&gt; (state.bears)) : 1;
  
    return &lt;div&gt;count: {count}&lt;/div&gt;
  }
  </code></pre>