[FEATURE] Saving HF and WandB tokens locally for improved UX by inclinedadarsh · Pull Request #27 · gemma-facet/frontend-ui

inclinedadarsh · 2025-09-04T10:31:43Z

Description

Fixes #14

This PR enables users to save Hugging Face token and WandB API Key locally.

Implemented changes

Created a profile page where users can see and update these tokens locally
Created a button in sidebar for users to go to the profile page
Logging out clears out all the local tokens saved
Prefill wandb token in the training config page
Add additional input field in training config page for hugging face token, make changes in types and add error handling when a user chooses hugging face as destination but doesn't provide hugging face token.
train route now takes in hf token and throws error when not provided one if the destinatino if hfhub.

Things to consider

The training config page now MUST have a HF token as input (which is prefilled if the user has set it locally). If no token is provided, it'll throw an error and not let the user proceed.
HF_TOKEN injection removed from train route and it throws an error if no backend route provided.
HF_TOKEN is used at many places like inferencing, evaluation and much more. Do you think we should add an input field at all those places so we just stop using our own HF_TOKEN (except for dataset preview tasks)?

- Introduced a new Profile component that allows users to manage their Hugging Face and Weights and Biases tokens. - Implemented functionality to update and clear tokens, with local storage integration and user feedback via toast notifications. - Enhanced user experience by displaying user email and providing a logout option.

…ngReviewPage - Implemented functionality to store and retrieve Hugging Face token from local storage. - Added validation to ensure Hugging Face token is provided when exporting to HF Hub. - Updated the export configuration type to include hf_token for better integration.

…ain route - Updated the POST request handler to check for the presence of the Hugging Face token when exporting to HF Hub. - Enhanced error handling to return a 400 status with an appropriate error message if the token is missing.

vercel · 2025-09-04T10:31:48Z

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
frontend-ui	Ready	Preview	Comment	Sep 5, 2025 8:05pm

inclinedadarsh · 2025-09-04T10:33:30Z

@supreme-gg-gg can you please go through the above Things to consider section provided in the description of this PR? Let me know what you think about having hf token input at every place in the frontend whenever the user needs it.

Other than that, I have tested it, but please clone this PR and test it. I believe this is ready to be merged.

…ingConfigPage

supreme-gg-gg

@inclinedadarsh the overall flow works well I have tested locally, I believe local storage is the simplest and most efficient as well. however, seems like there is a mismatch of the frontend types you updated and the backend schema, regarding where hf token should be injected. Pls fix the the backend routes, the type, and the UI where HF token is entered, this is good to merge afterwards

supreme-gg-gg · 2025-09-04T15:28:23Z

Regarding your things to consider:

Yes, the user should always input a HF token because Gemma is a gated model (technically unsloth ones don't require one, we can update that in the future, but this makes stuff much simpler and avoid user's mistakes)
Yes the backend should throw error is no token provided because the service will reject and fail
Yes, use one token for everywhere, perhaps update the inference and eval routes as well (and dataset preview etc if necessary), we should never use our own token because they can expire / get exploited etc

- Updated the evaluation form to include a field for Hugging Face token input, required for Hugging Face models. - Implemented validation to ensure the token is provided before running evaluations. - Adjusted the API request to use the user-provided Hugging Face token instead of a default value. - Enhanced error handling to notify users when the token is missing.

- Updated the inference API to require a Hugging Face token for Hugging Face models, returning a 400 error if not provided. - Modified JobDetailPage to load the Hugging Face token from local storage and validate its presence before making inference requests. - Added a user input field for the Hugging Face token in the JobDetailPage, ensuring it is included in the API request when applicable.

- Updated the batch inference API to require a Hugging Face token for Hugging Face models, returning a 400 error if not provided. - Modified the BatchInferenceForm component to load the Hugging Face token from local storage and validate its presence before making requests. - Added a user input field for the Hugging Face token in the BatchInferenceForm, ensuring it is included in the API request when applicable. - Implemented error handling to notify users when the token is missing during inference.

now all datasets operation need hf token which user can enter

and also move it at the top in the config page

inclinedadarsh · 2025-09-04T20:45:54Z

Done with these changes. That was a nice design catch @supreme-gg-gg! Fixed all those in the latest commit.

It will be great if you can spend some time testing it and reading the code for a bit, there's a chance I might have missed something because there are just too many atoms/states on the frontend.

Also, there seems to be some conflicts. I'm not sure how bad they are, I'll have a look at them and should be able to merge.

inclinedadarsh · 2025-09-04T20:49:02Z

Checked those conflicts, doesn't seem to be hard. I'll try to resolve them soon. If you can review the rest before that then that'll be fine, otherwise I'll push a commit by tomorrow resolving them.

supreme-gg-gg

This looks good, make sure to update .env.example (push this) and .env (locally or on Vercel) to remove the token. Regarding merge conflict, did you forget to pull from main / rebase / merge before working on this because I don't think I pushed anything new to main after my last feature

inclinedadarsh · 2025-09-05T10:46:39Z

@supreme-gg-gg there seems to be an api route POST /api/jobs but I can't see anywhere it being used.

That route still uses the HF_TOKEN but I believe it's unnecessary to have that route. That route basically calls FastAPI's POST {API_GETWAY_URL}/train (which I believe is to create a training job. However there's another route POST /api/train which does the same thing and is actually being used.

So I believe we can just remove the POST /api/jobs route. After that we'll be good with removing the HF_TOKEN completely.

I'll go ahead and remove it, and make necessary changes. Let me know if I'm making a mistake and I'll revert that.

- Updated InferenceRequest, BatchInferenceRequest, and EvaluationRequest interfaces to make hf_token a mandatory field. - Adjusted JobDetailPage and BatchInferenceForm components to directly use hfToken without conditional checks for provider.

inclinedadarsh · 2025-09-05T10:58:24Z

This looks good, make sure to update .env.example (push this) and .env (locally or on Vercel) to remove the token. Regarding merge conflict, did you forget to pull from main / rebase / merge before working on this because I don't think I pushed anything new to main after my last feature

Oh yes I did most probably. Will have to go these conflicts now 🫠

inclinedadarsh · 2025-09-05T13:33:47Z

@supreme-gg-gg the conflict has been resolved. Can you please check if everything's working properly, especially the part which has conflicts.

Btw, you don't need to run it locally, it's deployed it here: https://frontend-mnrvv1knx-inclinedadarshs-projects.vercel.app/login?_vercel_share=peaI5ckNFbozqZBbHEwfuCNWjS3pcnu6

If you feel it's good to go, please go ahead and merge it.

supreme-gg-gg · 2025-09-05T14:52:22Z

@inclinedadarsh are we enforcing required token for both unsloth and hugging face? It seems like the logic is different a different places (e.g. job vs inference). I think let's just standardise everything to always require token since that's how the backend works for now

supreme-gg-gg · 2025-09-05T19:44:11Z

@inclinedadarsh the new commit seems to have resolved my suggestions, shall we merge this and I'll test it once more?

inclinedadarsh · 2025-09-05T19:47:13Z

@inclinedadarsh the new commit seems to have resolved my suggestions, shall we merge this and I'll test it once more?

Ahh no, I'm so sorry. As soon as I started testing it, the final training page started behaving very weirdly. Even though the hf_token was set on the profile page, the training configuration page wasn't loading it for some reason. I tested it locally and it works just fine, so I'm not really able to figure it out.

Right now I'm triaging that issue.

Can you test it yourself? You can do it here: https://frontend-68146grz8-inclinedadarshs-projects.vercel.app/dashboard?_vercel_share=TwAUtJ4T2lryWQp3f14SsYAoa6SYEnAS

inclinedadarsh · 2025-09-05T20:07:12Z

@supreme-gg-gg the issue is fixed now. I'm going ahead to merge it.

inclinedadarsh added 6 commits September 4, 2025 14:47

refactor: update sidebar user display with link to profile

0e3f8c0

feat: clear user tokens on logout in Profile and AppSidebar components

d8e5f44

feat: prefill wandb stored API keys in TrainingConfigPage

a29bb85

inclinedadarsh self-assigned this Sep 4, 2025

inclinedadarsh added the enhancement New feature or request label Sep 4, 2025

inclinedadarsh requested a review from supreme-gg-gg September 4, 2025 10:34

feat: add tooltips for Hugging Face and WandB API key inputs in Train…

019bdd6

…ingConfigPage

vercel Bot deployed to Preview September 4, 2025 10:57 View deployment

supreme-gg-gg requested changes Sep 4, 2025

View reviewed changes

Comment thread src/app/api/train/route.ts

Comment thread src/app/dashboard/training/new/configuration/page.tsx Outdated

Comment thread src/app/dashboard/training/new/configuration/page.tsx Outdated

Comment thread src/types/training.ts Outdated

inclinedadarsh added 7 commits September 4, 2025 21:50

fix: update train route schema to match that of backend

4541da8

feat: implement user provided hf token for datasets operation

774d177

now all datasets operation need hf token which user can enter

feat: implement tooltip at every hugging face label

c662395

refactor: move hf token to root of training config

b04dafb

vercel Bot deployed to Preview September 4, 2025 20:02 View deployment

refactor: move hf tokens at the root of train request

fa1e938

and also move it at the top in the config page

vercel Bot deployed to Preview September 4, 2025 20:45 View deployment

inclinedadarsh requested a review from supreme-gg-gg September 4, 2025 20:48

supreme-gg-gg approved these changes Sep 4, 2025

View reviewed changes

Comment thread src/types/inference.ts Outdated

inclinedadarsh added 3 commits September 5, 2025 16:18

refactor: remove unnecessary POST /api/jobs route

8eda361

refactor: remove HF_TOKEN from environment configuration

f3a3baa

vercel Bot deployed to Preview September 5, 2025 10:58 View deployment

Merge branch 'main' into saving-keys-locally

f9f3133

vercel Bot deployed to Preview September 5, 2025 13:28 View deployment

supreme-gg-gg approved these changes Sep 5, 2025

View reviewed changes

Comment thread src/app/dashboard/training/new/configuration/page.tsx Outdated

refactor: make hf token compulsory for model training

359d732

vercel Bot deployed to Preview September 5, 2025 19:27 View deployment

fix: config page tokens update

75e8dd8

vercel Bot deployed to Preview September 5, 2025 20:05 View deployment

inclinedadarsh merged commit bdbc651 into main Sep 5, 2025
2 checks passed

Conversation

inclinedadarsh commented Sep 4, 2025

Description

Implemented changes

Things to consider

Uh oh!

vercel Bot commented Sep 4, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

inclinedadarsh commented Sep 4, 2025

Uh oh!

supreme-gg-gg left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

supreme-gg-gg commented Sep 4, 2025

Uh oh!

inclinedadarsh commented Sep 4, 2025

Uh oh!

inclinedadarsh commented Sep 4, 2025

Uh oh!

supreme-gg-gg left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

inclinedadarsh commented Sep 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

inclinedadarsh commented Sep 5, 2025

Uh oh!

inclinedadarsh commented Sep 5, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

supreme-gg-gg commented Sep 5, 2025

Uh oh!

supreme-gg-gg commented Sep 5, 2025

Uh oh!

inclinedadarsh commented Sep 5, 2025

Uh oh!

inclinedadarsh commented Sep 5, 2025

Uh oh!

Uh oh!

This branch was successfully deployed

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

vercel Bot commented Sep 4, 2025 •

edited

Loading

inclinedadarsh commented Sep 5, 2025 •

edited

Loading

inclinedadarsh commented Sep 5, 2025 •

edited

Loading