GetStream / website-react-examples

122 stars 219 forks source link

Trouble running the examples #75

Open tjacobs opened 1 year ago

tjacobs commented 1 year ago

Hi, I'm trying to try out the examples. Running:

cd social-messenger
yarn
yarn start

gets me:

Error: error:0308010C:digital envelope routines::unsupported
    at new Hash (node:internal/crypto/hash:71:19)

and

cd social-messenger-ts
cp .env-example .env.development
cat .env.development
# The key of your App
REACT_APP_STREAM_KEY=qkg...key from here:
Screenshot 2023-03-04 at 11 42 52 AM
# The user id (must be a valid user in your app)
REACT_APP_USER_ID=TeleportConnect

Where do I get this from? here?

Screenshot 2023-03-04 at 11 47 08 AM
# The user token (you can use https://getstream.io/chat/docs/react/tokens_and_authentication/?language=javascript#manually-generating-tokens)
REACT_APP_USER_TOKEN=eyJ.....

Generated from https://getstream.io/chat/docs/react/tokens_and_authentication/?language=javascript#manually-generating-tokens with UserID TeleportConnect

# Not needed for local development, you can leave it empty
REACT_APP_TARGET_ORIGIN=

yarn install
yarn start

gets me in the browser:

useConnectUser.ts:39 Failed to connect user Error: userToken does not have a user_id or is not matching with user.id

with a blank page.

Any ideas?

Screenshot 2023-03-04 at 11 27 35 AM Screenshot 2023-03-04 at 11 32 05 AM

On a MacBook Air M2 Ventura. Node.js v18.12.1.

tjacobs commented 1 year ago

Oh nice! Now I capitalized the userID properly, TeleportConnect instead of teleportconnect, and generated a token from that page, the TypeScript one loads up in my browser!

tjacobs commented 1 year ago

Of course now the add channels button does nothing when I push it:

Screenshot 2023-03-04 at 11 54 33 AM
tjacobs commented 1 year ago

Ok I managed to manually add the user to a channel from the admin dashboard, but error on chatting:

Screenshot 2023-03-04 at 11 59 55 AM
tjacobs commented 1 year ago

Ok I got it running on my server. For some reason the channel is not showing up when running on the server but I'll worry about that next.

I'd like to make one small text change to the web app, changing "You have no channels currently" to just "No channels".

After much searching, I found that string was not in the src at all.

It's in some code that isn't even in my source control.

It's in:

vi node_modules/stream-chat-react/dist/components/EmptyStateIndicator/EmptyStateIndicator.js

Anyway, changing the text in there, and then running:

yarn start

Results in the web app not having that string changed. What gives?

Ok when I run yarn build now I get this inscrutable JS error:

Screenshot 2023-03-05 at 1 01 53 PM Screenshot 2023-03-05 at 1 03 56 PM

Anyway, so how am I expected to change this text? Am I meant to pull that component into my source and then reference it from in there somehow?

Ah! Now I have run yarn build, and restarting my browser, yarn start now has the change I made. WHAT THU? who cached it?

React seems.... not great.