Skip to content

fix router error#6

Closed
Remi561 wants to merge 1 commit into
mainfrom
features/connected-to-frontend
Closed

fix router error#6
Remi561 wants to merge 1 commit into
mainfrom
features/connected-to-frontend

Conversation

@Remi561

@Remi561 Remi561 commented Jun 23, 2026

Copy link
Copy Markdown
Owner

Summary by CodeRabbit

Release Notes

  • New Features

    • Integrated Vercel Analytics for usage tracking and insights
    • Enhanced Admin dashboard with expanded metrics display, including role-based user counts
    • Added "Roles" column to Admin users table with conditional styling
    • Configured SPA routing for improved navigation handling
  • Bug Fixes

    • Fixed incorrect response message when demoting admin users
  • Chores

    • Removed debug console logging statements throughout components
    • Standardized React Query configurations for consistency

@vercel

vercel Bot commented Jun 23, 2026

Copy link
Copy Markdown

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

Project Deployment Actions Updated (UTC)
subly Ready Ready Preview, Comment Jun 23, 2026 7:48pm

@coderabbitai

coderabbitai Bot commented Jun 23, 2026

Copy link
Copy Markdown

Review Change Stack

📝 Walkthrough

Walkthrough

The PR prepares the client for Vercel deployment by adding a SPA rewrite rule, production API URL, and Vercel Analytics. The admin controller is extended to compute per-role user counts via a Prisma groupBy, which the Admin dashboard surfaces as new metric cards with color-coded dots and a Roles column. Debug console logs are removed across several components, and AddForm fixes its defaultValues field name.

Changes

Vercel Deployment & Production API Wiring

Layer / File(s) Summary
Vercel config, env, and API URL wiring
client/vercel.json, client/.env, client/src/lib/utils.js, client/package.json
Adds a vercel.json SPA rewrite rule mapping all paths to /index.html, sets VITE_API_URL pointing to the production backend, removes the "http://localhost:3000" fallback from getApiBaseUrl(), and adds @vercel/analytics as a dependency.
Vercel Analytics in main.jsx
client/src/main.jsx
Imports Analytics from @vercel/analytics/react and renders it inside the root provider tree.

Admin Role-Based Stats (Server + Client)

Layer / File(s) Summary
Server: per-role groupBy in getAdminStats and demoteUser fix
server/src/controllers/admin.controller.js
Extends the Prisma $transaction with a groupBy on role to compute ADMIN/USER counts, builds a roleCounts accumulator, and returns it under stats.users.totalUserByRoles. Fixes demoteUser success message. Reformats getAllUsers select projection.
Admin dashboard: role metric cards and Roles column
client/src/pages/dashboard/Admin.jsx
Rewrites metricCards to include ADMIN/USER role count entries with color fields. Updates AdminMetricCard to render colored status dots via toneStyles and capitalized item.key headings. Adds a "Roles" column to the Users table with conditional green/red role text.

Debug Cleanup, Form Fix, and Breadcrumb Refactor

Layer / File(s) Summary
AddForm billingCycle fix and Breadcrumb Fragment refactor
client/src/components/dashboard/AddForm.jsx, client/src/components/Breadcrumb.jsx
Fixes AddForm defaultValues to initialize billingCycle instead of duration. Refactors Breadcrumb to wrap each BreadcrumbItem and BreadcrumbSeparator in a Fragment, moving the separator outside BreadcrumbItem.
Remove debug console.logs and minor formatting
client/src/components/dashboard/Stats.jsx, client/src/components/dashboard/Overview.jsx, client/src/pages/dashboard/Overview.jsx, client/src/pages/dashboard/Subscriptions.jsx
Removes console.log calls from StatCard, OverviewTable, Overview page, and Subscriptions page. Reformats useQuery hooks in the Overview page with consistent arrow function syntax.

Sequence Diagram(s)

sequenceDiagram
  participant Browser
  participant AdminController
  participant Prisma

  Browser->>AdminController: GET /admin/stats
  AdminController->>Prisma: $transaction([count users, count subs, groupBy role, ...])
  Prisma-->>AdminController: [totalUser, totalSubs, totalRoleUser[{role, _count}], ...]
  AdminController->>AdminController: build roleCounts {ADMIN, USER} from totalRoleUser
  AdminController-->>Browser: stats { users: { total, totalUserByRoles }, ... }
  Browser->>Browser: render metricCards with ADMIN/USER counts + colored dots
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

  • Remi561/Subly#4: Directly connected — both PRs modify client/src/lib/utils.js and VITE_API_URL handling in getApiBaseUrl(), with this PR removing the localhost fallback introduced or used in that PR.
  • Remi561/Subly#5: Both PRs touch client/.env and client/src/lib/utils.js for VITE_API_URL resolution and getApiBaseUrl() behavior.

Poem

🐇 Hopping to the cloud with a vercel.json in paw,
No more localhost—just production, raw!
Role counts grouped, the dots glow green and red,
Debug logs removed, clean console ahead.
Analytics watching every bunny trail,
Subly's deployed without a fail! 🚀

🚥 Pre-merge checks | ✅ 3 | ❌ 2

❌ Failed checks (1 warning, 1 inconclusive)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Write docstrings for the functions missing them to satisfy the coverage threshold.
Title check ❓ Inconclusive The title 'fix router error' is vague and does not clearly reflect the actual changes in this PR, which include API URL configuration, analytics integration, component refactoring, debug log cleanup, and admin dashboard updates. Consider revising the title to be more specific and descriptive of the main change, such as 'Add Vercel Analytics and refactor components' or 'Configure backend API URL and integrate analytics'.
✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

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

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch features/connected-to-frontend

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.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)
client/src/components/dashboard/AddForm.jsx (1)

58-61: 📐 Maintainability & Code Quality | 🟡 Minor | ⚡ Quick win

Remove submit-time debug logging in production path.

Line 59 logs validated form payloads during submit. This reintroduces debug noise and can expose user-entered values in browser logs.

Suggested fix
   const onSubmit = (values) => {
-    console.log("Validated Data ready for TanStack Mutation:", values);
-      // mutation.mutate(values) goes here
-      mutation.mutate(values)
+    mutation.mutate(values);
   };
🤖 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 `@client/src/components/dashboard/AddForm.jsx` around lines 58 - 61, Remove the
console.log statement from the onSubmit function that logs the validated form
values. This debug logging in the production submission path should be
eliminated as it can expose user-entered data in browser logs and adds
unnecessary noise. Keep only the mutation.mutate(values) call inside the
onSubmit function.
🧹 Nitpick comments (2)
client/src/lib/utils.js (1)

10-10: 🩺 Stability & Availability | 🔵 Trivial | ⚡ Quick win

Fail fast when VITE_API_URL is missing (Line 10).

Returning the env value directly can propagate invalid URLs (undefined/api/...) into auth calls. Add a guard here so misconfiguration is detected immediately.

Proposed fix
 export function getApiBaseUrl() {
-  return import.meta.env.VITE_API_URL;
+  const baseUrl = import.meta.env.VITE_API_URL;
+  if (!baseUrl) {
+    throw new Error("Missing VITE_API_URL");
+  }
+  return baseUrl.replace(/\/$/, "");
 }
🤖 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 `@client/src/lib/utils.js` at line 10, The function is returning
import.meta.env.VITE_API_URL without validating that it exists, which allows
undefined values to propagate into auth calls and create invalid URLs. Add a
guard check before the return statement to ensure VITE_API_URL is defined and
not empty, and throw an error or log a clear error message if the environment
variable is missing. This way, misconfiguration will be caught immediately
rather than causing issues downstream.
client/.env (1)

1-1: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick win

Avoid using production API as the default in shared .env (Line 1).

This makes local/dev traffic hit production unless every developer overrides it. Prefer local default in .env and keep production in .env.production (or Vercel project env vars).

Suggested env split
# client/.env
- VITE_API_URL=https://subly-backend-iuej.onrender.com
+ VITE_API_URL=http://localhost:3000
# client/.env.production
VITE_API_URL=https://subly-backend-iuej.onrender.com
🤖 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 `@client/.env` at line 1, The shared .env file contains the production API URL
for VITE_API_URL, which forces all developers to hit production by default
unless they manually override it. Move the production URL
(https://subly-backend-iuej.onrender.com) to a new .env.production file and
replace the VITE_API_URL in the shared .env file with a local development
default (such as http://localhost:3000 or your local dev API endpoint). This
ensures developers use local/dev endpoints by default while production builds
automatically use the correct production URL.
🤖 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 `@client/src/pages/dashboard/Admin.jsx`:
- Around line 44-48: The getValue accessor in the role-count stat cards is using
an incorrect path to access the stats data. Currently it reads from
stats?.totalUserByRoles?.ADMIN, but the API payload provides this data nested
under stats.users.totalUserByRoles instead. Update the getValue function for the
admin role card (key: "admin") and all other role-count cards to access the data
through the correct nested path by changing stats?.totalUserByRoles to
stats?.users?.totalUserByRoles to properly retrieve the role counts from the API
response.

---

Outside diff comments:
In `@client/src/components/dashboard/AddForm.jsx`:
- Around line 58-61: Remove the console.log statement from the onSubmit function
that logs the validated form values. This debug logging in the production
submission path should be eliminated as it can expose user-entered data in
browser logs and adds unnecessary noise. Keep only the mutation.mutate(values)
call inside the onSubmit function.

---

Nitpick comments:
In `@client/.env`:
- Line 1: The shared .env file contains the production API URL for VITE_API_URL,
which forces all developers to hit production by default unless they manually
override it. Move the production URL (https://subly-backend-iuej.onrender.com)
to a new .env.production file and replace the VITE_API_URL in the shared .env
file with a local development default (such as http://localhost:3000 or your
local dev API endpoint). This ensures developers use local/dev endpoints by
default while production builds automatically use the correct production URL.

In `@client/src/lib/utils.js`:
- Line 10: The function is returning import.meta.env.VITE_API_URL without
validating that it exists, which allows undefined values to propagate into auth
calls and create invalid URLs. Add a guard check before the return statement to
ensure VITE_API_URL is defined and not empty, and throw an error or log a clear
error message if the environment variable is missing. This way, misconfiguration
will be caught immediately rather than causing issues downstream.
🪄 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: 946d4454-5aca-40f3-9e00-0bd54182ce09

📥 Commits

Reviewing files that changed from the base of the PR and between 9a5889e and 57f9b55.

⛔ Files ignored due to path filters (1)
  • client/package-lock.json is excluded by !**/package-lock.json
📒 Files selected for processing (13)
  • client/.env
  • client/package.json
  • client/src/components/Breadcrumb.jsx
  • client/src/components/dashboard/AddForm.jsx
  • client/src/components/dashboard/Overview.jsx
  • client/src/components/dashboard/Stats.jsx
  • client/src/lib/utils.js
  • client/src/main.jsx
  • client/src/pages/dashboard/Admin.jsx
  • client/src/pages/dashboard/Overview.jsx
  • client/src/pages/dashboard/Subscriptions.jsx
  • client/vercel.json
  • server/src/controllers/admin.controller.js

Comment thread client/src/pages/dashboard/Admin.jsx
@Remi561 Remi561 closed this Jun 23, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant