open-notebook icon indicating copy to clipboard operation
open-notebook copied to clipboard

feat(frontend): add LLM Settings page to manage API keys (#195)

Open madhavansingh opened this issue 2 months ago • 3 comments

Overview

This PR introduces a new LLM Settings page in the frontend to let users manage API keys for OpenAI, Anthropic, and Ollama directly through the web UI. Previously, keys had to be set via .env files, which was cumbersome and required restarting the app.

What’s included

  • A dedicated /llm-settings page built with Next.js App Router.
  • Input fields for each LLM provider API key.
  • A “Save” button with frontend mock functionality for testing the UI.
  • Client-side state management using React’s useState.
  • Fully aligned with the project’s folder structure and coding conventions.

Benefits

  • Makes it easier for non-technical users to manage API keys.
  • Removes the dependency on environment variables for initial configuration.
  • Prepares the frontend for future backend integration.
  • Improves usability and accessibility of the Open Notebook setup.

Notes

  • Currently, the Save button is a mock and does not persist keys to the backend.
  • Backend integration and secure storage will be added in future PRs.

This addresses feature request #195 and provides a clear starting point for improving LLM key management in Open Notebook.

madhavansingh avatar Oct 22 '25 06:10 madhavansingh

Hi @dennysubke,

I added a /llm-settings page in the frontend to manage LLM API keys (OpenAI, Anthropic, Ollama) via the UI. The Save button currently works as a mock and backend integration will come in a future PR.

This should make it easier for users to update keys without touching .env files. Looking forward to feedback!

madhavansingh avatar Oct 22 '25 06:10 madhavansingh

Hey @madhavansingh I already opened a PR for this

SlayTheDragons avatar Oct 22 '25 07:10 SlayTheDragons

Hey @madhavansingh !

Thanks so much for adding this, really appreciate the effort and time you put into it.

It’s a great addition that will make things so much easier for everyone and really improves the overall user experience. 👍

dennysubke avatar Oct 22 '25 15:10 dennysubke

Hey everyone, thanks for putting an effort into this. I really appreciate it. But, instead of just having people enter API Keys, we need to go a step further. I created an issue explaining the idea for this feature. If any of you want to help build it, please comment on the issue so I can assign to you and maybe we can work on it together: https://github.com/lfnovo/open-notebook/issues/245

lfnovo avatar Nov 01 '25 18:11 lfnovo