Skip to content

fix: allow valid GitHub usernames with hyphens and numbers#616

Open
harendra-godara wants to merge 1 commit into
GitMetricsLab:mainfrom
harendra-godara:fix-username-validation
Open

fix: allow valid GitHub usernames with hyphens and numbers#616
harendra-godara wants to merge 1 commit into
GitMetricsLab:mainfrom
harendra-godara:fix-username-validation

Conversation

@harendra-godara
Copy link
Copy Markdown

@harendra-godara harendra-godara commented May 30, 2026

Related Issue


Description

Updated the username validation logic to support valid GitHub usernames.

Changes Made

  • Removed the restrictive letter-only validation.

  • Added support for:

    • Letters (a-z, A-Z)
    • Numbers (0-9)
    • Hyphens (-)

Examples

  • harendra-godara ✅
  • user123 ✅
  • react-dev ✅

Previously, valid GitHub usernames containing hyphens or numbers were incorrectly rejected with the message "Only letters are allowed".


How Has This Been Tested?

  • Tested with usernames containing hyphens:

    • harendra-godara
    • react-dev
  • Tested with usernames containing numbers:

    • user123
  • Verified that invalid usernames are still rejected.

  • Confirmed that the previous "Only letters are allowed" error no longer appears for valid GitHub usernames.


Screenshots (if applicable)

Screenshot From 2026-05-30 11-22-53

Type of Change

  • Bug fix
  • New feature
  • Code style update
  • Breaking change
  • Documentation update

Summary by CodeRabbit

  • Bug Fixes
    • Updated username validation to require GitHub-username-compatible format instead of letters-only pattern
    • Improved validation error message to provide clearer guidance on acceptable username requirements

Review Change Stack

@netlify
Copy link
Copy Markdown

netlify Bot commented May 30, 2026

Deploy Preview for github-spy ready!

Name Link
🔨 Latest commit fbbffc9
🔍 Latest deploy log https://app.netlify.com/projects/github-spy/deploys/6a1a7b626abc5900083742b5
😎 Deploy Preview https://deploy-preview-616--github-spy.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

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

@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 30, 2026

📝 Walkthrough

Walkthrough

The signup page validation was updated to accept GitHub-username-compatible patterns instead of letters only. The entire form JSX was restructured across header branding, input fields, error messages, and footer links for improved readability while preserving all rendered content and control flow.

Changes

Signup Form Validation and UI Update

Layer / File(s) Summary
Input field validation rules
src/pages/Signup/Signup.tsx
Username validation in handleChange now applies a GitHub-username-compatible regex pattern instead of letters-only; password validation is reformatted across multiple lines with unchanged logic.
Form submission and pre-submit validation
src/pages/Signup/Signup.tsx
handleSubmit applies the same GitHub-username regex pattern in its pre-submit validation, alongside existing email and password checks; form submission flow posts to /api/auth/signup and conditionally navigates to /login on success.
Form UI and layout restructuring
src/pages/Signup/Signup.tsx
Header/hero section, username/email/password inputs with password visibility toggle, inline error rendering, and status message banner with login link are all reformatted into expanded multiline JSX while maintaining identical behavior and display.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Possibly related issues

Possibly related PRs

Suggested labels

type:bug, level:intermediate, quality:clean

Poem

🐰 A signup form hops into shape,
GitHub usernames now escape their cape,
JSX breathes easier, line by line,
Validation rules align just fine,
Clean and tidy, oh what a sight! ✨

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (2 inconclusive)

Check name Status Explanation Resolution
Linked Issues check ❓ Inconclusive The PR addresses the username validation fix from #177, but the linked issue requirements also include header/footer fixes and navigation restoration which are mentioned in the raw summary as structural JSX reformatting. Clarify whether the JSX reformatting changes addressed all header/footer/navigation requirements from #177, or if additional changes are needed for full issue closure.
Out of Scope Changes check ❓ Inconclusive The PR includes username validation updates directly tied to the linked issue, though extensive JSX reformatting for header branding and form field structure may extend beyond the strict scope of username validation. Verify that all JSX reformatting (header branding, form field structure) is necessary for the username validation fix or if some changes should be separated into a dedicated UI improvements PR.
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The title directly and clearly describes the main change: updating username validation to allow GitHub-compatible usernames with hyphens and numbers.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Description check ✅ Passed The pull request description is comprehensive and well-structured, matching the required template with all key sections completed.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown

@github-actions github-actions Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@src/pages/Signup/Signup.tsx`:
- Around line 42-43: The current username validation regex in Signup.tsx (the
branch that tests the variable named "value" in the Signup component's username
validation logic) allows consecutive hyphens and unlimited length; update both
occurrences of that regex (the check around the first validation block and the
similar check near lines ~70–72) to a pattern that (1) enforces a 1–39 character
limit, (2) requires the username to start and end with an alphanumeric
character, (3) allows hyphens only between alphanumeric groups, and (4) forbids
consecutive hyphens (i.e., use a regex with a negative lookahead for "--", a
length check for max 39, and a structure like alnum groups separated by single
hyphens); replace the old test with that stricter pattern so invalid GitHub
usernames are rejected client-side.
- Around line 105-109: The catch currently uses catch (error: any) which
violates no-explicit-any; change it to catch (error: unknown) and narrow the
type before using error.response: add a type guard that checks if error is an
AxiosError (import and use axios.isAxiosError) or at minimum if (typeof error
=== 'object' && error !== null && 'response' in error) cast appropriately, then
call setMessage(error.response?.data?.message || "Something went wrong. Please
try again."); keep setMessage and the rest of the error-handling logic
unchanged.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 86271262-19f1-4e8e-9a3d-f62bde722b52

📥 Commits

Reviewing files that changed from the base of the PR and between e7b8fc8 and fbbffc9.

📒 Files selected for processing (1)
  • src/pages/Signup/Signup.tsx

Comment on lines +42 to +43
} else if (!/^[A-Za-z0-9](?:[A-Za-z0-9-]*[A-Za-z0-9])?$/.test(value)) {
errorMessage = "Enter a valid GitHub username";
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major | ⚡ Quick win

Username regex still accepts invalid GitHub usernames.

Line 42 and Line 70 allow consecutive hyphens and unlimited length, which are not GitHub-compatible. This will still pass some invalid usernames client-side.

Proposed fix
+const GITHUB_USERNAME_REGEX = /^(?=.{1,39}$)(?!.*--)[A-Za-z0-9]+(?:-[A-Za-z0-9]+)*$/;
...
-      } else if (!/^[A-Za-z0-9](?:[A-Za-z0-9-]*[A-Za-z0-9])?$/.test(value)) {
+      } else if (!GITHUB_USERNAME_REGEX.test(value)) {
         errorMessage = "Enter a valid GitHub username";
       }
...
-      : !/^[A-Za-z0-9](?:[A-Za-z0-9-]*[A-Za-z0-9])?$/.test(formData.username)
+      : !GITHUB_USERNAME_REGEX.test(formData.username)
         ? "Enter a valid GitHub username"
         : "";

Also applies to: 70-72

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/pages/Signup/Signup.tsx` around lines 42 - 43, The current username
validation regex in Signup.tsx (the branch that tests the variable named "value"
in the Signup component's username validation logic) allows consecutive hyphens
and unlimited length; update both occurrences of that regex (the check around
the first validation block and the similar check near lines ~70–72) to a pattern
that (1) enforces a 1–39 character limit, (2) requires the username to start and
end with an alphanumeric character, (3) allows hyphens only between alphanumeric
groups, and (4) forbids consecutive hyphens (i.e., use a regex with a negative
lookahead for "--", a length check for max 39, and a structure like alnum groups
separated by single hyphens); replace the old test with that stricter pattern so
invalid GitHub usernames are rejected client-side.

Comment on lines 105 to +109
} catch (error: any) {
setMessage(error.response?.data?.message || "Something went wrong. Please try again.");
setMessage(
error.response?.data?.message ||
"Something went wrong. Please try again.",
);
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟠 Major | ⚡ Quick win

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
# Verify there are no explicit `any` catch parameters in TS/TSX files.
rg -nP --type=ts --type=tsx 'catch\s*\(\s*[A-Za-z_$][A-Za-z0-9_$]*\s*:\s*any\s*\)'

Repository: GitMetricsLab/github_tracker

Length of output: 100


🏁 Script executed:

#!/bin/bash
set -euo pipefail

# Inspect the exact lines around the reported catch
echo "---- src/pages/Signup/Signup.tsx (around 100-115) ----"
nl -ba src/pages/Signup/Signup.tsx | sed -n '90,125p'

# Search for explicit `any` in catch parameters across the repo
echo "---- Searching for `catch (..: any)` in .ts/.tsx ----"
rg -n --glob='*.ts' --glob='*.tsx' -P 'catch\s*\(\s*[^)]*:\s*any\s*\)'

Repository: GitMetricsLab/github_tracker

Length of output: 188


🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "---- src/pages/Signup/Signup.tsx (around 100-115) ----"
cat -n src/pages/Signup/Signup.tsx | sed -n '90,125p'

echo "---- Searching for `catch (..: any)` in .ts/.tsx ----"
rg -n --glob='*.ts' --glob='*.tsx' -P 'catch\s*\(\s*[^)]*:\s*any\s*\)'

Repository: GitMetricsLab/github_tracker

Length of output: 1711


🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "---- src/pages/Signup/Signup.tsx (around 100-115) ----"
cat -n src/pages/Signup/Signup.tsx | sed -n '100,112p'

echo "---- Searching for explicit typed `any` in catch parameters ----"
rg -n --glob='*.ts' --glob='*.tsx' -P 'catch\s*\(\s*[^)]*:\s*any\s*\)' .

echo "---- Searching ESLint for no-explicit-any rule ----"
rg -n "no-explicit-any" .eslintrc* package.json eslint.* --hidden || true

echo "---- Searching tsconfig for useUnknownInCatchVariables ----"
rg -n "useUnknownInCatchVariables" tsconfig*.json . --hidden || true

Repository: GitMetricsLab/github_tracker

Length of output: 919


🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "---- repo root ----"
ls -a

echo "---- Searching for explicit typed any in catch parameters (.ts/.tsx) ----"
rg -n --glob='*.ts' --glob='*.tsx' -P 'catch\s*\(\s*[^)]*:\s*any\s*\)' .

echo "---- Searching for ESLint rule no-explicit-any in repo ----"
rg -n "no-explicit-any" . || true

echo "---- Searching for TS compiler option useUnknownInCatchVariables in tsconfig ----"
rg -n "useUnknownInCatchVariables" tsconfig*.json . || true

echo "---- Searching for `@typescript-eslint` in package.json ----"
cat package.json | head -n 80

Repository: GitMetricsLab/github_tracker

Length of output: 2796


🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "---- src/pages/Signup/Signup.tsx imports (top) ----"
sed -n '1,60p' src/pages/Signup/Signup.tsx

echo "---- eslint.config.js (relevant excerpts) ----"
sed -n '1,200p' eslint.config.js

echo "---- tsconfig.json (relevant excerpts) ----"
cat tsconfig.json

echo "---- tsconfig.app.json (relevant excerpts) ----"
cat tsconfig.app.json

echo "---- tsconfig.node.json (relevant excerpts) ----"
cat tsconfig.node.json

Repository: GitMetricsLab/github_tracker

Length of output: 4439


🏁 Script executed:

#!/bin/bash
set -euo pipefail

echo "---- Running eslint on src/pages/Signup/Signup.tsx ----"
npx eslint src/pages/Signup/Signup.tsx

Repository: GitMetricsLab/github_tracker

Length of output: 306


Replace catch (error: any) with typed narrowing

src/pages/Signup/Signup.tsx uses catch (error: any) at line 105, and @typescript-eslint/no-explicit-any makes eslint fail with “Unexpected any. Specify a different type”.

Proposed fix
+import type { AxiosError } from "axios";
...
-    } catch (error: any) {
-      setMessage(
-        error.response?.data?.message ||
-          "Something went wrong. Please try again.",
-      );
+    } catch (error: unknown) {
+      const axiosError = error as AxiosError<{ message?: string }>;
+      setMessage(
+        axiosError.response?.data?.message ??
+          "Something went wrong. Please try again.",
+      );
     } finally {
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
} catch (error: any) {
setMessage(error.response?.data?.message || "Something went wrong. Please try again.");
setMessage(
error.response?.data?.message ||
"Something went wrong. Please try again.",
);
import type { AxiosError } from "axios";
// ... other code ...
} catch (error: unknown) {
const axiosError = error as AxiosError<{ message?: string }>;
setMessage(
axiosError.response?.data?.message ??
"Something went wrong. Please try again.",
);
} finally {
🧰 Tools
🪛 ESLint

[error] 105-105: Unexpected any. Specify a different type.

(@typescript-eslint/no-explicit-any)

🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

In `@src/pages/Signup/Signup.tsx` around lines 105 - 109, The catch currently uses
catch (error: any) which violates no-explicit-any; change it to catch (error:
unknown) and narrow the type before using error.response: add a type guard that
checks if error is an AxiosError (import and use axios.isAxiosError) or at
minimum if (typeof error === 'object' && error !== null && 'response' in error)
cast appropriately, then call setMessage(error.response?.data?.message ||
"Something went wrong. Please try again."); keep setMessage and the rest of the
error-handling logic unchanged.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

🐛 Bug Report: Username validation allows only letters and rejects valid usernames

1 participant