Skip to content

fix: implement server-side auth API calls in signin/signup pages #38

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
OkiriGabriel wants to merge 1 commit into
base: master
Choose a base branch
from
Open

fix: implement server-side auth API calls in signin/signup pages #38

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
30 changes: 21 additions & 9 deletions DevOps-Project-39/wanderlust-3tier-project/frontend/src/pages/signin-page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,16 +19,28 @@ function signin() {
} = useForm<TSignInSchema>({ resolver: zodResolver(signInSchema) });

const onSubmit = async (data: FieldValues) => {
if (data.email === 'abc@gamil.com') {
toast.error('Submitting form is failed');
return;
try {
const apiUrl = import.meta.env.VITE_API_PATH ?? 'http://localhost:5000';
const response = await fetch(`${apiUrl}/api/auth/email-password/signin`, {
Comment on lines +23 to +24

@coderabbitai coderabbitai Bot Jun 26, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

🔒 Security & Privacy | 🟠 Major

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
frontend='DevOps-Project-39/wanderlust-3tier-project/frontend'

rg -n 'VITE_API_PATH|localhost:5000|import\.meta\.env\.(DEV|PROD)' "$frontend"

fd -H '^(\.env.*|vite\.config\..*)$' "$frontend" -x sh -c '
  printf "\n--- %s\n" "$1"
  rg -n "VITE_API_PATH|localhost:5000|import\.meta\.env\.(DEV|PROD)" "$1" || true
' sh {}

Repository: NotHarshhaa/DevOps-Projects

Length of output: 1603

Fail closed when the auth API URL is missing.

The fallback to http://localhost:5000 whenever VITE_API_PATH is unset is unsafe for production. In a production build, this causes the app to attempt posting credentials to a local service on the user's machine or fail unexpectedly. The same insecure fallback pattern is found in signup-page.tsx, blog-feed.tsx, home-page.tsx, details-page.tsx, and add-blog.tsx.

Gate the localhost fallback to dev builds only (import.meta.env.DEV) and fail safely in production by surfacing a configuration error when the endpoint is missing.

Suggested fix 
-      const apiUrl = import.meta.env.VITE_API_PATH ?? 'http://localhost:5000';
+      const configuredUrl = import.meta.env.VITE_API_PATH?.trim() || (import.meta.env.DEV ? 'http://localhost:5000' : '');
+      if (!configuredUrl) {
+        toast.error('Authentication service endpoint is not configured.');
+        return;
+      }
+      const apiUrl = configuredUrl.replace(/\/+$/, '');
       const response = await fetch(`${apiUrl}/api/auth/email-password/signin`, {
📝 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
const apiUrl = import.meta.env.VITE_API_PATH ?? 'http://localhost:5000';
const response = await fetch(`${apiUrl}/api/auth/email-password/signin`, {
const configuredUrl = import.meta.env.VITE_API_PATH?.trim() || (import.meta.env.DEV ? 'http://localhost:5000' : '');
if (!configuredUrl) {
toast.error('Authentication service endpoint is not configured.');
return;
}
const apiUrl = configuredUrl.replace(/\/+$/, '');
const response = await fetch(`${apiUrl}/api/auth/email-password/signin`, {
🤖 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
`@DevOps-Project-39/wanderlust-3tier-project/frontend/src/pages/signin-page.tsx`
around lines 23 - 24, The auth API URL fallback is unsafe because signin,
signup, and related pages default to localhost even in production. Update the
API URL resolution in signin-page and the same pattern in signup-page,
blog-feed, home-page, details-page, and add-blog so the localhost fallback is
used only when import.meta.env.DEV is true. In non-dev builds, fail closed by
surfacing a clear configuration error instead of attempting requests without a
valid endpoint. Keep the logic centralized around the existing apiUrl setup so
the behavior is consistent across these page components.

method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
body: JSON.stringify({
email: data.email,
password: data.password,
}),
});
const result = await response.json();
if (!response.ok) {
toast.error(result.message ?? 'Sign in failed. Please check your credentials.');
return;
Comment on lines +34 to +36

@coderabbitai coderabbitai Bot Jun 26, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

🔒 Security & Privacy | 🟠 Major | ⚡ Quick win

Use a generic signin failure message.

The backend contract shown here returns different messages for “email does not exist” and “invalid password”; Line 35 exposes those directly, enabling account enumeration. Keep signin errors generic on the client, and ideally align the backend response too.

Suggested fix 
       if (!response.ok) {
-        toast.error(result.message ?? 'Sign in failed. Please check your credentials.');
+        toast.error('Invalid email or password.');
         return;
       }
📝 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
if (!response.ok) {
toast.error(result.message ?? 'Sign in failed. Please check your credentials.');
return;
if (!response.ok) {
toast.error('Invalid email or password.');
return;
🤖 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
`@DevOps-Project-39/wanderlust-3tier-project/frontend/src/pages/signin-page.tsx`
around lines 34 - 36, The signin error handling in signin-page.tsx is exposing
backend-specific messages from result.message, which can reveal whether an email
exists. Update the failure path in the signin submit flow to always show a
single generic message in the toast.error call, and avoid passing through
backend-auth details from the response. If possible, also align the backend
signin response in the corresponding auth endpoint so it returns the same
generic failure text regardless of whether the email or password is wrong.

}
toast.success(result.message ?? 'Signed in successfully!');
reset();
navigate('/');
} catch {
toast.error('Unable to connect to the server. Please try again later.');
}

// TODO: Server-side validation
await new Promise((resolve) => setTimeout(resolve, 1000));

reset();
navigate('/');
};

return (
Expand Down
31 changes: 22 additions & 9 deletions DevOps-Project-39/wanderlust-3tier-project/frontend/src/pages/signup-page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,16 +19,29 @@ function signin() {
} = useForm<TSignUpSchema>({ resolver: zodResolver(signUpSchema) });

const onSubmit = async (data: FieldValues) => {
if (data.email === 'abc@gamil.com') {
toast.error('Submitting form is failed');
return;
try {
const apiUrl = import.meta.env.VITE_API_PATH ?? 'http://localhost:5000';
const response = await fetch(`${apiUrl}/api/auth/email-password/signup`, {
Comment on lines +23 to +24

@coderabbitai coderabbitai Bot Jun 26, 2026

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

🔒 Security & Privacy | 🟠 Major

🧩 Analysis chain

🏁 Script executed:

#!/bin/bash
frontend='DevOps-Project-39/wanderlust-3tier-project/frontend'

rg -n 'VITE_API_PATH|localhost:5000|import\.meta\.env\.(DEV|PROD)' "$frontend"

fd -H '^(\.env.*|vite\.config\..*)$' "$frontend" -x sh -c '
  printf "\n--- %s\n" "$1"
  rg -n "VITE_API_PATH|localhost:5000|import\.meta\.env\.(DEV|PROD)" "$1" || true
' sh {}

Repository: NotHarshhaa/DevOps-Projects

Length of output: 1603

Fail closed when the auth API URL is missing in production

Line 23 in DevOps-Project-39/wanderlust-3tier-project/frontend/src/pages/signup-page.tsx unconditionally falls back to http://localhost:5000 if VITE_API_PATH is missing. In a production build, remote users cannot reach a localhost endpoint, causing failed requests and a poor user experience. Restrict this fallback to development mode only and halt execution with a user-facing error if the API URL is missing in production.

Suggested fix 
-      const apiUrl = import.meta.env.VITE_API_PATH ?? 'http://localhost:5000';
+      const configuredApiUrl = import.meta.env.VITE_API_PATH?.trim();
+      const apiUrl = configuredApiUrl || (import.meta.env.DEV ? 'http://localhost:5000' : '');
+      if (!apiUrl) {
+        toast.error('Authentication service is not configured.');
+        return;
+      }
       const response = await fetch(`${apiUrl}/api/auth/email-password/signup`, {
📝 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
const apiUrl = import.meta.env.VITE_API_PATH ?? 'http://localhost:5000';
const response = await fetch(`${apiUrl}/api/auth/email-password/signup`, {
const configuredApiUrl = import.meta.env.VITE_API_PATH?.trim();
const apiUrl = configuredApiUrl || (import.meta.env.DEV ? 'http://localhost:5000' : '');
if (!apiUrl) {
toast.error('Authentication service is not configured.');
return;
}
const response = await fetch(`${apiUrl}/api/auth/email-password/signup`, {
🤖 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
`@DevOps-Project-39/wanderlust-3tier-project/frontend/src/pages/signup-page.tsx`
around lines 23 - 24, The signup flow in signup-page.tsx currently falls back to
localhost whenever VITE_API_PATH is missing, which should only happen in
development. Update the logic around the apiUrl used by the signup handler so it
uses the localhost default only in dev mode, and in production it should stop
before the fetch and surface a clear user-facing error if the auth API URL is
unset. Use the existing signup-page.tsx handler and the apiUrl / response flow
to locate the change.

method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
body: JSON.stringify({
name: data.username,
email: data.email,
password: data.password,
}),
});
const result = await response.json();
if (!response.ok) {
toast.error(result.message ?? 'Sign up failed. Please try again.');
return;
}
toast.success(result.message ?? 'Account created successfully!');
reset();
navigate('/');
} catch {
toast.error('Unable to connect to the server. Please try again later.');
}

// TODO: Server-side validation
await new Promise((resolve) => setTimeout(resolve, 1000));

reset();
navigate('/');
};

return (
Expand Down
30 changes: 21 additions & 9 deletions DevOps-Project-40/Devops-Mega-Project-Jenkins-ArgoCD-EKS/frontend/src/pages/signin-page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,16 +19,28 @@ function signin() {
} = useForm<TSignInSchema>({ resolver: zodResolver(signInSchema) });

const onSubmit = async (data: FieldValues) => {
if (data.email === 'abc@gamil.com') {
toast.error('Submitting form is failed');
return;
try {
const apiUrl = import.meta.env.VITE_API_PATH ?? 'http://localhost:5000';
const response = await fetch(`${apiUrl}/api/auth/email-password/signin`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
body: JSON.stringify({
email: data.email,
password: data.password,
}),
});
const result = await response.json();
if (!response.ok) {
toast.error(result.message ?? 'Sign in failed. Please check your credentials.');
return;
}
toast.success(result.message ?? 'Signed in successfully!');
reset();
navigate('/');
} catch {
toast.error('Unable to connect to the server. Please try again later.');
}

// TODO: Server-side validation
await new Promise((resolve) => setTimeout(resolve, 1000));

reset();
navigate('/');
};

return (
Expand Down
31 changes: 22 additions & 9 deletions DevOps-Project-40/Devops-Mega-Project-Jenkins-ArgoCD-EKS/frontend/src/pages/signup-page.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,16 +19,29 @@ function signin() {
} = useForm<TSignUpSchema>({ resolver: zodResolver(signUpSchema) });

const onSubmit = async (data: FieldValues) => {
if (data.email === 'abc@gamil.com') {
toast.error('Submitting form is failed');
return;
try {
const apiUrl = import.meta.env.VITE_API_PATH ?? 'http://localhost:5000';
const response = await fetch(`${apiUrl}/api/auth/email-password/signup`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
credentials: 'include',
body: JSON.stringify({
name: data.username,
email: data.email,
password: data.password,
}),
});
const result = await response.json();
if (!response.ok) {
toast.error(result.message ?? 'Sign up failed. Please try again.');
return;
}
toast.success(result.message ?? 'Account created successfully!');
reset();
navigate('/');
} catch {
toast.error('Unable to connect to the server. Please try again later.');
}

// TODO: Server-side validation
await new Promise((resolve) => setTimeout(resolve, 1000));

reset();
navigate('/');
};

return (
Expand Down