ChatCraft week 5: Storing multiple providers

#chatcraft #chatgpt #typescript #opensource

Issue

This week I finally was able to close the issue I was working on which was allowing ChatCraft users to store api keys for multiple providers. ChatCraft currently only supports two providers (OpenAI and OpenRouter) but we may add more providers in the future!

If you are a ChatCraft user, you can now toggle between OpenAI and OpenRouter in User Settings without having to re-enter your API key.

PR

This is PR I worked on which resolved the above issue.

This PR builds upon the PR I did last week, which completed the set up necessary for this functionality.

Since all the set up was already completed last week, I did not need to make many code changes to complete this. The main things I did was:

when switching providers, saving the user's current api key to settings.providers array if it is not already saved
when switching providers, loading the api key from settings.providers if it is there

This is the event handler function I wrote which will be triggered when the user toggles the provider:

Reviews of my PR

Before my PR got merged, I had many useful reviews from the repo admin and fellow teammates, which helped me discover issues with my code and ways to refactor the code.

This review by Dave helped me find an issue with my old code.

Old code:

if (newProvider.name in settings.providers) {
  newProvider = settings.providers[newProvider.name];
  ...
}

Here I forgot to parse settings.providers[newProvider.name] into a ChatCraftProvider object. We are getting this data from localStorage, so it is safer to use my fromJSON function to parse it into a ChatCraftProvider object.

New code:

const newProvider = settings.providers[selectedProvider.name] ? 
  ChatCraftProvider.fromJSON(
    settings.providers[selectedProvider.name]
  ) : 
  selectedProvider;

This review by Amnish helped me refactor my code by moving it into a handler function.

My Reviews on Teammates' PRs

I reviewed multiple PRs this week and commented on issues I found and suggestions on how the user experience could be improved.

ChatCraft now supports uploading images! See PR#286 and try it for yourself by going to ChatCraft.org selecting "Ask gpt-4-vision-preview" and uploading some images. This functionality is extremely useful! ChatCraft is faster than other image parsing web apps at converting images into text, and you could even do something like upload a UI and ask it to code it for you!