flowbite-react version 0.7.2 error

[LordRall]

Hello, After updating "flowbite-react" to version "^0.7.2".
Uncaught TypeError: useThemeMode is not a function or its return value is not iterable

[SutuSebastian]

Fixed in the upper versions.

[Bijig0]

no lol it's still there for ^0.10.1

[SutuSebastian]

Make sure to remove node_modules and do a clean install of the new version.

Also, please give more info + output:

• package manager
• framework/dev env (eg: Vite, Next,js, Remix, etc)
• monorepo structure (yes/no)

[allenfuller]

Sad to report this is still happening in ^0.10.2

• Package manager: NPM
• flowbite ^2.5.2
• monorepo: yes
• React JS, not typescript

[SutuSebastian]

Monorepo using any tool? (Eg: turborepo/nx)

[allenfuller]

UPDATE: I discovered this issue, at least in my case, is due to the way useThemeMode is used in the Flowbite Pro React Admin Dashboard template.

In that template, the use of useThemeMode is presented as a hook:

const PersistFlowbiteThemeToLocalStorage: FC = function () {
  const [themeMode] = useThemeMode();

  useEffect(() => {
    localStorage.setItem("theme", themeMode);
  }, [themeMode]);

  return <></>;
};

However, the contents are not a hook but an object, so what worked for me was something like this:

const PersistFlowbiteThemeToLocalStorage = () => {
  const { mode } = useThemeMode();

  useEffect(() => {
    localStorage.setItem('theme', mode);
  }, [mode]);

  return <Fragment></Fragment>;
};

I don't know if we need to let the @flowbite team know, but that's the workflow in my case.

[SutuSebastian]

@allenfuller that is correct.

We will update, fix and extend all the React based templates soon.