Typebot Error: NEXT_PUBLIC_UNSPLASH_ACCESS_KEY is missing in environment

[LoudLemur]

When trying to connect Typebot with Unsplash, this error keeps appearing.

Where can we set Unsplash in the environment?

Also, if you try and upload an image instead of connecting to Unsplash, the upload doesn't seem to work/display the image.

[robi]

See the docs, that environment variable needs to go into the env.sh file if you have an unsplash account with an access key.

[LoudLemur]

@robi said in Typebot Error: NEXT_PUBLIC_UNSPLASH_ACCESS_KEY is missing in environment:

See the docs, that environment variable needs to go into the env.sh file if you have an unsplash account with an access key.

There is a page with lots of configuration instructions including the ones for Unsplash:

https://docs.typebot.io/self-hosting/configuration

You can see this:

If you use the file browser on the Cloudron application page, you can navigate to env.sh, open it and it looks like this:

So, would we edit env.sh to add a couple of lines that looked something like this?

NEXT_PUBLIC_UNSPLASH_APP_NAME = Whatever_Name_I_Gave_This_App_On_Unsplash	
NEXT_PUBLIC_UNSPLASH_ACCESS_KEY = theRandomStringThatUnsplashGaveAsAnAPIkey

[robi]

@LoudLemur yes, except you need to prefix each line with export then your env vars

[LoudLemur]

Hey, @robi, you are fantastic! That worked:

export NEXT_PUBLIC_UNSPLASH_APP_NAME=Whatever_Name_I_Gave_This_App_On_Unsplash	
export NEXT_PUBLIC_UNSPLASH_ACCESS_KEY=theRandomStringThatUnsplashGaveAsAnAPIaccessKey

@girish - could we include something like this as a worked example in the Cloudron documentation?

Now, can anybody tell me why I can't get it to show an image uploaded from the computer instead of from using an Unsplash one?

[robi]

@LoudLemur said:

Now, can anybody tell me why I can't get it to show an image uploaded from the computer instead of from using an Unsplash one?

Check the logs?

On the demo server I found this when trying to add an image:

Aug 24 08:09:37Error: 'sharp' is required to be installed in standalone mode for the image optimization to function correctly. Read more at: https://nextjs.org/docs/messages/sharp-missing-in-production
Aug 24 08:09:37Error: 'sharp' is required to be installed in standalone mode for the image optimization to function correctly. Read more at: https://nextjs.org/docs/messages/sharp-missing-in-production
Aug 24 08:09:37Error: 'sharp' is required to be installed in standalone mode for the image optimization to function correctly. Read more at: https://nextjs.org/docs/messages/sharp-missing-in-production
Aug 24 08:09:37Failed to write image to cache FMGn9oDnFnwjdl4zJajpzhnJsa8jvzjY4CC73bVP+uE= [Error: ENOENT: no such file or directory, mkdir '/app/code/builder/apps/builder/.next/cache'] {
Aug 24 08:09:37Failed to write image to cache cP7C8t2ur-Xf7t0OBvSqnlSD9oTB9iatlDLora-GTf4= [Error: ENOENT: no such file or directory, mkdir '/app/code/builder/apps/builder/.next/cache'] {
Aug 24 08:09:37Failed to write image to cache xL9AS+8BP1fcnLhokPNm2VAxnHP5R+brAjcKp3UK5Ss= [Error: ENOENT: no such file or directory, mkdir '/app/code/builder/apps/builder/.next/cache'] {
Aug 24 08:09:37code: 'ENOENT',
Aug 24 08:09:37code: 'ENOENT',
Aug 24 08:09:37code: 'ENOENT',
Aug 24 08:09:37errno: -2,
Aug 24 08:09:37errno: -2,
Aug 24 08:09:37errno: -2,
Aug 24 08:09:37path: '/app/code/builder/apps/builder/.next/cache'
Aug 24 08:09:37path: '/app/code/builder/apps/builder/.next/cache'
Aug 24 08:09:37path: '/app/code/builder/apps/builder/.next/cache'
Aug 24 08:09:37syscall: 'mkdir',
Aug 24 08:09:37syscall: 'mkdir',
Aug 24 08:09:37syscall: 'mkdir',

So this needs a package fix to move the cache dir to /app/data/... . /cc @staff

[girish]

@LoudLemur thanks, added

[LoudLemur]

@girish said in Typebot Error: NEXT_PUBLIC_UNSPLASH_ACCESS_KEY is missing in environment:

@LoudLemur thanks, added

Great!
It is still a bit difficult to understand what one would need to do to be able to configure TypeBot so that you can:

a) Upload a file from your computer to TypeBot (e.g. an image for a reaction gif) so that it will display in the TypeBot chat.

b) Allow the Chat user to upload a file in response to one of TypeBot's questions e.g. "If you have a screenshot of your difficulty, please drop it here."

Currently, using that functionality seems to need configuration changes.

[nebulon]

@LoudLemur this might be a feature request upstream, so they provide a settings UI for it instead?

[robi]

@nebulon I think it's more about providing some sensible defaults in the package env.sh and including all the other options, just commented out so it's easier to pick and choose what one needs.

[girish]

@robi said in Typebot Error: NEXT_PUBLIC_UNSPLASH_ACCESS_KEY is missing in environment:

@nebulon I think it's more about providing some sensible defaults in the package env.sh and including all the other options, just commented out so it's easier to pick and choose what one needs.

Usually, options come and go. It's quite hard to keep those things up to date. Remember that once the option is in the /app/data then we have to write code to remove dead options and add new options etc into any existing config file. All this is more trouble that it's worth.

[robi]

@girish no fear. Let the user manage them, just make it easier (by listing them as a comment) and less error prone (example to uncomment or copy/paste) so you have less of a support burden.

[LoudLemur]

@robi right on, Robi!