Enable Setting API Key and Other Settings via Environment Variables

[decolygs]

Thank you for releasing the OSS version of Stable Studio!!

I built it immediately, but I have one question.
How can I set the API Key in advance?

I would appreciate your answer.

[radhe021]

As this app uses local storage of the Browser to store the API-Key with key name stability-apiKey, You can set
API key in advance using the terminal of your browser by running :
localStorage.setItem("stability-apiKey","YOUR_STABILITY_API_KEY")

Or you can follow the guide :
When you clone the repo, open cli / terminal in the same folder where your repo is placed and hit yarn && yarn dev After
that visit the link http://localhost:3000/settings , after that, you will see the page shown below and from there you can follow the exact steps to generate the API key and use it during the whole development

[decolygs]

@radhe021

Thank you for your comment and explanation!

And sorry my comment was not well explained.

API_Key,
-be included in the cloned code.
or
-Pass API_Key as an argument when yarn dev

I would like to achieve either of the above.

[cruhl]

I think it’s reasonable to allow API keys to be set via environment variables. 👍

Would need some small tweaks to enable that.

[radhe021]

@cruhl please assign this issue to me .I would love to contribute to the project.

[hafriedlander]

Would be great if the API endpoint URL could be overridden with the same method.

I've got some minimal changes that get StableStudio working with gyre.ai - but it needs a different API endpoint (usually http://localhost:5000 instead of https://grpc.stability.ai but sometimes a remote server).

[KAJdev]

If you are looking to implement settings and a different backend I would suggest creating a custom plugin. You can define values that are displayed in the settings panel of your plugin and even persist them to localStorage or a backend if you like.

[mickmcgrath13]

@cruhl @hafriedlander @KAJdev
I took a quick stab at something here: #58

it's got some Docker stuff in there, too.. sorry about that :/

[hafriedlander]

If you are looking to implement settings and a different backend I would suggest creating a custom plugin.

It's the same API (I've re-implemented the stability GRPC protocol), just a different endpoint URL.

There are some tweaks I want to make, but it's not immediately obvious to me how to extend the plugin (rather than duplicate it for two lines of code). I'll take another look tonight.

[santigibo]

Is there any update on seetting the apiKey via environment variables? I've tried to do it with a localstorage.setItem("stability-apiKey") at the App component, but it seems that when the createPlugin method is called, it doesn't work, since the Dream button seems disabled. When i reload, it becomes enabled, but I don't really understand why. Has someone thought of a workaround for this? thanks in regards :)