feat: FIT-391: Validate Project Name field on Create Project and General Settings page #8041

ricardoantoniocm · 2025-07-24T20:00:53Z

Before:

The field wasn't validated at all. This PR introduces validation and fixes styles for fields with errors.

This PR also moves the validation error messages to the top of the form, so that errors are clearly visible.

After:

LSO

Create Project

Project / General Settings

LSE

Create Project

Project / General Settings

…t-users-not-fill-mandatory-fields

netlify · 2025-07-24T20:01:44Z

✅ Deploy Preview for heartex-docs canceled.

Name	Link
🔨 Latest commit	`5fc3df1`
🔍 Latest deploy log	https://app.netlify.com/projects/heartex-docs/deploys/689f30b9ed917e0008fa82f9

netlify · 2025-07-24T20:01:57Z

✅ Deploy Preview for label-studio-storybook ready!

Name	Link
🔨 Latest commit	`5fc3df1`
🔍 Latest deploy log	https://app.netlify.com/projects/label-studio-storybook/deploys/689f30b90baffb0008b43dc3
😎 Deploy Preview	https://deploy-preview-8041--label-studio-storybook.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify · 2025-07-24T20:01:57Z

✅ Deploy Preview for label-studio-playground ready!

Name	Link
🔨 Latest commit	`5fc3df1`
🔍 Latest deploy log	https://app.netlify.com/projects/label-studio-playground/deploys/689f30b950a1a70008088868
😎 Deploy Preview	https://deploy-preview-8041--label-studio-playground.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

netlify · 2025-07-24T20:02:04Z

✅ Deploy Preview for label-studio-docs-new-theme canceled.

Name	Link
🔨 Latest commit	`5fc3df1`
🔍 Latest deploy log	https://app.netlify.com/projects/label-studio-docs-new-theme/deploys/689f30b9dd137e0008ee9890

codecov · 2025-07-24T20:05:01Z

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 65.96%. Comparing base (2898db8) to head (5fc3df1).
⚠️ Report is 6 commits behind head on develop.

Additional details and impacted files

@@             Coverage Diff             @@
##           develop    #8041      +/-   ##
===========================================
- Coverage    70.48%   65.96%   -4.52%     
===========================================
  Files          720      504     -216     
  Lines        52128    34141   -17987     
  Branches      8813     8813              
===========================================
- Hits         36741    22521   -14220     
+ Misses       15384    11617    -3767     
  Partials         3        3

Flag	Coverage Δ
lsf-e2e	`58.88% <ø> (-0.87%)`	⬇️
lsf-integration	`55.57% <ø> (ø)`
lsf-unit	`9.42% <ø> (ø)`
pytests	`?`

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

… wizard.

… not the bottom. Moves submit container below form.

…e displayed at the top.

…play. Enhances FormField to support error state and updates Input component to reflect error styles. Adjusts GeneralSettings to trigger validation on blur and refines layout for better user experience.

…ield.jsx, enhancing its structure and maintaining functionality. Updates Input component to utilize the new FormField structure for improved validation handling and error display.

Copilot

Pull Request Overview

This PR adds comprehensive validation for project names on both the Create Project modal and General Settings page. The validation includes minimum/maximum length requirements (3-50 characters) and displays real-time error messages to improve user experience.

Key Changes:

Added minLength and maxLength validators with configurable character limits
Implemented real-time form validation with immediate error feedback on blur events
Enhanced error message consistency by removing field names from validation messages
Added visual error states with red borders and error styling for invalid inputs

Reviewed Changes

Copilot reviewed 12 out of 12 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
web/libs/datamanager/src/components/Common/Form/Validation/Validators.js	Updated error messages to remove field names for consistency
web/libs/datamanager/src/components/Common/Form/Validation/Validation.scss	Removed top margin and updated spacing with CSS variables
web/apps/labelstudio/src/pages/Settings/GeneralSettings.jsx	Added project name validation with min/max length requirements and real-time error feedback
web/apps/labelstudio/src/pages/CreateProject/CreateProject.scss	Enhanced styling for validation errors and form layout improvements
web/apps/labelstudio/src/pages/CreateProject/CreateProject.jsx	Implemented comprehensive validation flow with error state management
web/apps/labelstudio/src/components/Form/Validation/Validators.js	Added new minLength and maxLength validators and updated error messages
web/apps/labelstudio/src/components/Form/Validation/Validation.scss	Removed margin-top and updated spacing
web/apps/labelstudio/src/components/Form/FormField.jsx	Added error state management and propagation to form fields
web/apps/labelstudio/src/components/Form/Form.scss	Added error styling and improved form layout ordering
web/apps/labelstudio/src/components/Form/Form.jsx	Enhanced form validation to propagate errors to individual fields
web/apps/labelstudio/src/components/Form/Elements/Input/Input.scss	Added error state styling for input fields
web/apps/labelstudio/src/components/Form/Elements/Input/Input.jsx	Integrated error prop handling for visual error states

web/apps/labelstudio/src/components/Form/Validation/Validators.js

web/apps/labelstudio/src/components/Form/Form.scss

Copilot · 2025-07-28T15:49:01Z

web/apps/labelstudio/src/pages/CreateProject/CreateProject.jsx

+  }, [
+    project,
+    projectBody,
+    finishUpload,


[nitpick] The dependency array includes finishUpload but also includes stable references that don't change. Consider using useCallback to memoize finishUpload or remove unnecessary stable dependencies to avoid potential re-renders.

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

Workflow run: https://github.com/HumanSignal/label-studio/actions/runs/16596963799

ricardoantoniocm · 2025-07-30T20:34:06Z

/git merge

Workflow run
Successfully merged: create mode 100644 web/libs/ui/src/assets/icons/cloud-provider-s3.svg

…tory-fields' Workflow run: https://github.com/HumanSignal/label-studio/actions/runs/16633159765

ricardoantoniocm · 2025-08-14T15:03:26Z

/git merge

Workflow run
Successfully merged: 191 files changed, 9672 insertions(+), 2441 deletions(-)

…tory-fields' Workflow run: https://github.com/HumanSignal/label-studio/actions/runs/16968971277

ricardoantoniocm added 4 commits July 23, 2025 16:27

feat: FIT-391: Dont let users not fill in mandatory fields

a3790df

Adds validation to Project Name field on General Settings page.

ec28ce7

Refactors implementation to follow standards and best practices.

012f836

Merge remote-tracking branch 'origin/develop' into fb-fit-391/dont-le…

fc514d9

…t-users-not-fill-mandatory-fields

github-actions bot added the title needs formatting label Jul 24, 2025

ricardoantoniocm added 2 commits July 25, 2025 16:23

Implements proper validation for Project Name field on Create Project…

3d64439

… wizard.

Linter fixes.

a64a0e1

ricardoantoniocm changed the title ~~Fb fit 391/dont let users not fill mandatory fields~~ feat: FIT-391: Validate Project Name field on Create Project and General Settings page Jul 25, 2025

github-actions bot added feat and removed title needs formatting labels Jul 25, 2025

ricardoantoniocm requested a review from Copilot July 25, 2025 20:57

This comment was marked as outdated.

Sign in to view

ricardoantoniocm added 4 commits July 25, 2025 17:07

Removes unnecessary dependencies.

3e49c0d

Linter fixes.

dddc1f7

References are needed for linter.

56064ca

Linter fixes.

fad7542

ricardoantoniocm requested a review from Copilot July 25, 2025 21:17

This comment was marked as outdated.

Sign in to view

ricardoantoniocm added 7 commits July 25, 2025 17:50

Improves inline validation error message to remove redundancy.

b0ba1dc

Linter fixes.

b7fe3df

Removes unused message parameter from maxLength.

31d19c5

Linter fixes.

406af51

Adds missing return condition.

e521cd2

Linter fixes.

f032f4f

Adds name dependency that was originally present.

08671dd

ricardoantoniocm added 10 commits July 28, 2025 09:24

Reverts dependency array back to empty.

42d6bf9

Adds error style to input and textareas on error state.

4bc1255

Alters form order so that validation is shown at the top of the form,…

56aae77

… not the bottom. Moves submit container below form.

Removes extra line.

2030037

Fixes hover state of inputs with errors.

f494d8c

Removed top margin on form-validation, given that it's now meant to b…

8efebef

…e displayed at the top.

Refactors Form component to improve validation handling and error dis…

161f871

…play. Enhances FormField to support error state and updates Input component to reflect error styles. Adjusts GeneralSettings to trigger validation on blur and refines layout for better user experience.

Linter fixes.

f139e91

Refactors FormField component by moving it from FormField.js to FormF…

adf61b3

…ield.jsx, enhancing its structure and maintaining functionality. Updates Input component to utilize the new FormField structure for improved validation handling and error display.

Linter fixes.

379707b

ricardoantoniocm requested a review from Copilot July 28, 2025 15:48

Copilot AI reviewed Jul 28, 2025

View reviewed changes

ricardoantoniocm and others added 2 commits July 29, 2025 09:05

Update web/apps/labelstudio/src/components/Form/Validation/Validators.js

fd96155

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

ci: Build tag docs

36e4508

Workflow run: https://github.com/HumanSignal/label-studio/actions/runs/16596963799

ricardoantoniocm and others added 2 commits July 30, 2025 20:34

Merge branch 'develop' into 'fb-fit-391/dont-let-users-not-fill-manda…

607441c

…tory-fields' Workflow run: https://github.com/HumanSignal/label-studio/actions/runs/16633159765

Removes unnecessary display:block declaration.

7256820

ricardoantoniocm self-assigned this Jul 31, 2025

ricardoantoniocm marked this pull request as ready for review July 31, 2025 14:58

ricardoantoniocm requested a review from a team as a code owner July 31, 2025 14:58

ricardoantoniocm requested review from nass600 and hlomzik August 14, 2025 03:40

ricardoantoniocm and others added 2 commits August 14, 2025 15:04

Merge branch 'develop' into 'fb-fit-391/dont-let-users-not-fill-manda…

d1dd9fb

…tory-fields' Workflow run: https://github.com/HumanSignal/label-studio/actions/runs/16968971277

Update Validators.js

5fc3df1

nass600 approved these changes Aug 20, 2025

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat: FIT-391: Validate Project Name field on Create Project and General Settings page #8041

feat: FIT-391: Validate Project Name field on Create Project and General Settings page #8041

ricardoantoniocm commented Jul 24, 2025 •

edited

Loading

Uh oh!

netlify bot commented Jul 24, 2025 •

edited

Loading

Uh oh!

netlify bot commented Jul 24, 2025 •

edited

Loading

Uh oh!

netlify bot commented Jul 24, 2025 •

edited

Loading

Uh oh!

netlify bot commented Jul 24, 2025 •

edited

Loading

Uh oh!

codecov bot commented Jul 24, 2025 •

edited

Loading

Uh oh!

This comment was marked as outdated.

Uh oh!

This comment was marked as outdated.

Uh oh!

Copilot AI left a comment

Uh oh!

Uh oh!

Uh oh!

Copilot AI Jul 28, 2025

Uh oh!

ricardoantoniocm commented Jul 30, 2025 •

edited by robot-ci-heartex

Loading

Uh oh!

ricardoantoniocm commented Aug 14, 2025 •

edited by robot-ci-heartex

Loading

Uh oh!

Uh oh!

feat: FIT-391: Validate Project Name field on Create Project and General Settings page #8041

Are you sure you want to change the base?

feat: FIT-391: Validate Project Name field on Create Project and General Settings page #8041

Conversation

ricardoantoniocm commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Before:

After:

LSO

Create Project

Project / General Settings

LSE

Create Project

Project / General Settings

Uh oh!

netlify bot commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for heartex-docs canceled.

Uh oh!

netlify bot commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for label-studio-storybook ready!

Uh oh!

netlify bot commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for label-studio-playground ready!

Uh oh!

netlify bot commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

✅ Deploy Preview for label-studio-docs-new-theme canceled.

Uh oh!

codecov bot commented Jul 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

This comment was marked as outdated.

Uh oh!

This comment was marked as outdated.

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull Request Overview

Key Changes:

Reviewed Changes

Uh oh!

Uh oh!

Uh oh!

Copilot AI Jul 28, 2025

Choose a reason for hiding this comment

Uh oh!

ricardoantoniocm commented Jul 30, 2025 • edited by robot-ci-heartex Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

ricardoantoniocm commented Aug 14, 2025 • edited by robot-ci-heartex Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Uh oh!

ricardoantoniocm commented Jul 24, 2025 •

edited

Loading

netlify bot commented Jul 24, 2025 •

edited

Loading

netlify bot commented Jul 24, 2025 •

edited

Loading

netlify bot commented Jul 24, 2025 •

edited

Loading

netlify bot commented Jul 24, 2025 •

edited

Loading

codecov bot commented Jul 24, 2025 •

edited

Loading

ricardoantoniocm commented Jul 30, 2025 •

edited by robot-ci-heartex

Loading

ricardoantoniocm commented Aug 14, 2025 •

edited by robot-ci-heartex

Loading