Can't parse document when auth is added in Root.js

[biboc]

If I add an auth in src/theme/Root.js, search-local can't parse meta data:

[ERROR] Error: The `docusaurus_tag` meta tag could not be found. Please make sure that your page is wrapped in the `<Layout>` component (from `@theme/Layout`). If it is, then this is a bug, please report it.

src/theme/Root.js:

export default function Root({children}) {
  const [isConnected, setIsConnected] = useState(false); // Manage authentification

  return <>{
    isConnected ? (
      <>{children}</>
    ) : (
      <div className="login">
        <div className="login__container">
          <button className="login__btn" onClick={() => setIsConnected(true)}>
            Login
          </button>
        </div>
      </div>
    )
  }</>;
}

Could I first build the index in dev env without authentification and then build in prod and use the index generated previously? Thanks,

[lucasalberto01]

+1

[rivenlogik]

+1 running into this as well (trying to swizzle Root) to add authentication layer.

[anthony-df-nguyen]

I ran into this issue as well, what ended up working for me was swizzling the Layout component and putting my authentication logic within the <LayoutProvider>

[rivenlogik]

I ended up going with a different Docusaurus plugin, which still had a similar issue (it wouldn't index anything but ran fine). So I essentially created a check within the Root component that looked for an environment variable to be set to disable auth that I utilized during build to index .. copied/pasted index files out .. rebuild with authentication and copy index files back in.

It's not great, but it worked :) in case anyone else was considering this approach. Be sure to consider the risks involved if you accidentally break authentication of your site during deploy. Sounds like the option above is a better idea. I might migrate to it to avoid the workaround I built.

[biboc]

I ran into this issue as well, what ended up working for me was swizzling the Layout component and putting my authentication logic within the <LayoutProvider>

Thanks for your answer Can you share your code?