Is it possible to call useLocale() also in a client component?

[Yedidya10]

I'm using version next-intl@3.0.0-beta.10

When I try this:

'use client'

import { useLocale } from 'next-intl'
...

const SettingsMenuList () => {
  const locale = useLocale()

  return (
      ...
        <Box
          sx={{
            display: 'flex',
            alignItems: 'center',
          }}
        >
          Language: {locale === 'he' ? 'עברית' : 'English'}
        </Box>
    ...
    </MenuList>
  )
}

export default SettingsMenuList

I get the following errors:

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.
Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: null.
Error: Unsupported Server Component type: Null
at attemptResolveElement (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1421:19)
at resolveModelToJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1627:41)
at Object.toJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1169:28)
at stringify ()
at processModelChunk (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:2116:24)
at retryTask (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1882:38)
at performWork (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1920:21)
at Timeout.eval [as _onTimeout] (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1429:28)
at listOnTimeout (node:internal/timers:569:17)
at process.processTimers (node:internal/timers:512:7) {
digest: '135229182'
}

• error node_modules\next\dist\compiled\react-server-dom-webpack\cjs\react-server-dom-webpack-server.edge.development.js (1684:8) @ attemptResolveElement
• error Error: Unsupported Server Component type: Null
  at stringify ()
  null
• error node_modules\next\dist\compiled\react-server-dom-webpack\cjs\react-server-dom-webpack-server.edge.development.js (1684:8) @ attemptResolveElement
• error Error: Unsupported Server Component type: Null
  at attemptResolveElement (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1421:19)
  at resolveModelToJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1627:41)
  at Object.toJSON (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1169:28)
  at stringify ()
  at processModelChunk (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:2116:24)
  at retryTask (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1882:38)
  at performWork (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1920:21)
  at Timeout.eval [as _onTimeout] (webpack-internal:///(sc_server)/./node_modules/next/dist/compiled/react-server-dom-webpack/cjs/react-server-dom-webpack-server.edge.development.js:1429:28)
  at listOnTimeout (node:internal/timers:569:17)
  at process.processTimers (node:internal/timers:512:7) {
  digest: '135229182'
  }
  null

If it not possible, what is the recommended option to get the current local?

[Yedidya10]

I found an answer to that.
Use the following locale Param:

import { useParams } from 'next/navigation'
const { locale } = useParams()