Createeffect not working in component where signal was defined

import FMHome from "./FMHome";
import FMSearch from "./FMSearch";
import FMBookmark from "./FMBookmark";
import FMAccount from "./FMAccount";
import "./floatingMenuStyles/fmStyle.css";
import "./floatingMenuStyles/fmItemStyle.css";
import { createEffect, createSignal } from "solid-js";

type MenuStates =
  | "allClosed"
  | "homeOpen"
  | "searchOpen"
  | "bookmarkOpen"
  | "loading";

export const [menuState, setMenuState] = createSignal<MenuStates>("homeOpen");

export default function FloatingMenu() {
  createEffect(() => {
    console.log(menuState());
  });
  return (
    <>
      <div class="floatingMenuContainer">
        <FMHome />
        <FMSearch />
        <FMBookmark />
        <FMAccount />
      </div>
    </>
  );
}

import FMHome from "./FMHome";
import FMSearch from "./FMSearch";
import FMBookmark from "./FMBookmark";
import FMAccount from "./FMAccount";
import "./floatingMenuStyles/fmStyle.css";
import "./floatingMenuStyles/fmItemStyle.css";
import { createEffect, createSignal } from "solid-js";

type MenuStates =
  | "allClosed"
  | "homeOpen"
  | "searchOpen"
  | "bookmarkOpen"
  | "loading";

export const [menuState, setMenuState] = createSignal<MenuStates>("homeOpen");

export default function FloatingMenu() {
  createEffect(() => {
    console.log(menuState());
  });
  return (
    <>
      <div class="floatingMenuContainer">
        <FMHome />
        <FMSearch />
        <FMBookmark />
        <FMAccount />
      </div>
    </>
  );
}