Arquivo padrão de slot em NextJS

Na lição anterior, nós criamos um slot dinâmico com o nome info:

app/layout.jsxexport default function RootLayout({children, info}) {
  return (
    <html lang="en">
      <body>
        <header>
          <div>
            {info}
          </div>
        </header>
        <main>
          {children}
        </main>
        <footer>
          footer
        </footer>
      </body>
    </html>
  );
}

No entanto, há um problema. A questão é que nosso slot funciona apenas para dois tipos de endereços: /users e /posts. Se digitarmos na barra de endereços outro endereço, para o qual nosso slot não está definido, o NextJS retornará um erro 404.

Para resolver o problema, deve-se colocar um arquivo especial default.jsx diretamente na pasta do slot. Este arquivo deve conter um componente que será exibido quando um URL não definido para nosso slot for digitado na barra de endereços.

Ou seja, no nosso caso, teremos a seguinte estrutura de arquivos:

• /app//@info/default.jsx/users/page.jsx/posts/page.jsx