import LoggedInAvatarView from "@/components/LoggedInAvatarView";
import NotLoggedInAvatarView from "@/components/NotLoggedInAvatarView";

import { useTaehuiStore } from "@/state/Stores";
import { observer } from "mobx-react-lite";

export default observer(
  ({ isSessionLoading }: { isSessionLoading: boolean }) => {
    const { totem, taehuiAvatarID, taehuiAvatarName } = useTaehuiStore();

    if (isSessionLoading) {
      return <LoggedInAvatarView avatarID="" avatarName={"Loading..."} />;
    }

    if (totem) {
      return (
        <LoggedInAvatarView
          avatarID={taehuiAvatarID}
          avatarName={taehuiAvatarName}
        />
      );
    }

    return <NotLoggedInAvatarView />;
  },
);