Changed layout.tsx to client-side component

[osawa-koki]

Issue #, if available:

When following the instructions at https://docs.amplify.aws/nextjs/start/quickstart/nextjs-app-router-client-components/, the following error occurs:

Attempted import error: 'useForm' is not exported from 'react-hook-form' (imported as 'useForm').

The cause is that the <Authenticator /> component, which is intended to be added in the tutorial, needs to be a client-side component, while the current layout.tsx is defined as a server-side component. In the tutorial code, the "use client"; directive is specified, but the code of this repo is not.

Description of changes:

• put "use client"; at the top of layout.tsx.
• remove metadata exports.
  • metadata exports is not needed when it's client-side component.

By submitting this pull request, I confirm that you can use, modify, copy, and redistribute this contribution, under the terms of your choice.

[Raghavendarlokineni]

Thanks @osawa-koki you saved my day. Was struggling with this issue for a long time.