When testing locally using .env.local with all azure services configured, error raised in MicAudioSource.js and also RestError: Authorization failed.

I am using commit: 14feee0ff332511be1c0da88f3b8a520d1d65dab. next.js 14

I am stuck with several issues. I have yet to try the whole application.

For the moment I don't have rights to add secrets to vault that I created.
Can the app work locally if I don't have secrets added to azure vault?

The main error is:
MicAudioSource.js:85 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'reject')

I am also receiving Prop className did not match - which might not be relevant to microphone activity.

I have text to speech working, vision responding to image uploaded.
I also cannot upload a document to strorage account
RestError: Authorization failed.
0:["$@1",["development",null]]
1:{"status":"ERROR","errors":[{"message":"RestError: Authorization failed."}]}

I made sure azure ai search settings are correct:

AZURE_SEARCH_API_KEY=oVQmM......zSeDdLczF
AZURE_SEARCH_NAME=azurechat
AZURE_SEARCH_INDEX_NAME=searchindex

app-index.js:32 Warning: Prop className did not match. Server: "h-full w-full overflow-hidden text-sm light" Client: "h-full w-full overflow-hidden text-sm"
at html
at RedirectErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:72:9)
at RedirectBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/redirect-boundary.js:80:11)
at NotFoundErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:54:9)
at NotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/not-found-boundary.js:62:11)
at DevRootNotFoundBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/dev-root-not-found-boundary.js:32:11)
at ReactDevOverlay (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/internal/ReactDevOverlay.js:66:9)
at HotReload (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/react-dev-overlay/hot-reloader-client.js:295:11)
at Router (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:159:11)
at ErrorBoundaryHandler (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js💯9)
at ErrorBoundary (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/error-boundary.js:130:11)
at AppRouter (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/components/app-router.js:436:13)
at ServerRoot (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:128:11)
at RSCComponent
at Root (webpack-internal:///(app-pages-browser)/./node_modules/next/dist/client/app-index.js:144:11)
window.console.error @ app-index.js:32
console.error @ hydration-error-info.js:45
printWarning @ react-dom.development.js:94
error @ react-dom.development.js:68
warnForPropDifference @ react-dom.development.js:32523
hydrateAttribute @ react-dom.development.js:34091
diffHydratedGenericElement @ react-dom.development.js:34497
diffHydratedProperties @ react-dom.development.js:34916
hydrateInstance @ react-dom.development.js:35925
prepareToHydrateHostInstance @ react-dom.development.js:7287
completeWork @ react-dom.development.js:19622
completeUnitOfWork @ react-dom.development.js:25793
performUnitOfWork @ react-dom.development.js:25598
workLoopConcurrent @ react-dom.development.js:25573
renderRootConcurrent @ react-dom.development.js:25529
performConcurrentWorkOnRoot @ react-dom.development.js:24382
workLoop @ scheduler.development.js:261
flushWork @ scheduler.development.js:230
performWorkUntilDeadline @ scheduler.development.js:534
MicAudioSource.js:85 Uncaught (in promise) TypeError: Cannot read properties of null (reading 'reject')
at eval (MicAudioSource.js:85:1)
eval @ MicAudioSource.js:85
WebsocketMessageAdapter.js:81 WebSocket connection to 'wss://eastus.stt.speech.microsoft.com/speech/recognition/conversation/cognitiveservices/v1?language=en-US&format=simple&lidEnabled=true&Authorization=Bearer%20eyJhbG-ConnectionId=C92B06D88F964235A5C5A123BA78993D' failed:
open @ WebsocketMessageAdapter.js:81
open @ WebsocketConnection.js:79
eval @ ServiceRecognizerBase.js:700
fulfilled @ ServiceRecognizerBase.js:7
WebsocketMessageAdapter.js:81 WebSocket connection to 'wss://eastus.stt.speech.microsoft.com/speech/recognition/conversation/cognitiveservices/v1?language=en-US&format=simple&lidEnabled=true&Authorization=Bearer%20eyJhbG-ConnectionId=C92B06D88F964235A5C5A123BA78993D' failed:
open @ WebsocketMessageAdapter.js:81
open @ WebsocketConnection.js:79
eval @ ServiceRecognizerBase.js:700
fulfilled @ ServiceRecognizerBase.js:7
WebsocketMessageAdapter.js:81 WebSocket connection to 'wss://eastus.stt.speech.microsoft.com/speech/recognition/conversation/cognitiveservices/v1?language=en-US&format=simple&lidEnabled=true&Authorization=Bearer%20eyJhbG-ConnectionId=C92B06D88F964235A5C5A123BA78993D' failed:

Reproduce commit 14feee0 with Next.js 14 and the reported .env.local setup, then inspect MicAudioSource.js:85 and the WebsocketMessageAdapter.js failure first. Check the Azure Key Vault, Speech, Search, and Storage prerequisites separately, including the reported upload authorization error. Done means the failures are isolated to confirmed prerequisites or a reproducible application bug, with the local setup requirements documented.