Add intermediate placeholder for profiles page #92

New issue

Open

opened 2026-09-14 04:07:29 +00:00 by gostmeaper · 0 comments

gostmeaper commented

2026-09-14 04:07:29 +00:00

Member

Overall Objective

apps/frontend/src/components/Navbar.tsx renders a profile avatar that links to /profile. There is no /profile route registered in apps/frontend/src/App.tsx, so clicking it drops the user on the 404 page.

This issue is the placeholder. Here we just want the route to exist and render something in the mean time, the same way apps/frontend/src/app/reviews/page.tsx currently says "Coming soon!". Consistency here with our coming soon pages would be nice.

Later we'll get a design for the profile page when reviews data and other data can be added.

Suggested Approach

Create apps/frontend/src/app/profile/page.tsx. Copy the shape of apps/frontend/src/app/reviews/page.tsx, same wrapper classes, same heading treatment, so it looks like it belongs. We want them to look the same prettymuch.
Register it in apps/frontend/src/App.tsx. Add <Route path="/profile" element={<Profile />} /> alongside the others, and import it with the @/ alias like the rest do.
If the user isn't logged in, the page should say so and link to /api/auth/login rather than showing an empty shell. Look at how apps/frontend/src/app/launch-page/page.tsx links to the login endpoint. It's a plain <a href>, not a react-router <Link>, because it's a server redirect and not a client route. If ya don't do that it might break.
Run cd apps/frontend and deno task dev, click the avatar in both the desktop navbar and the mobile one and confirm both land on the new page.

Help & Resources

### Overall Objective `apps/frontend/src/components/Navbar.tsx` renders a profile avatar that links to `/profile`. There is no `/profile` route registered in `apps/frontend/src/App.tsx`, so clicking it drops the user on the 404 page. This issue is the placeholder. Here we just want the route to exist and render something in the mean time, the same way `apps/frontend/src/app/reviews/page.tsx` currently says "Coming soon!". Consistency here with our coming soon pages would be nice. Later we'll get a design for the profile page when reviews data and other data can be added. ### Suggested Approach 1. Create `apps/frontend/src/app/profile/page.tsx`. Copy the shape of `apps/frontend/src/app/reviews/page.tsx`, same wrapper classes, same heading treatment, so it looks like it belongs. We want them to look the same prettymuch. 2. Register it in `apps/frontend/src/App.tsx`. Add `<Route path="/profile" element={<Profile />} />` alongside the others, and import it with the `@/` alias like the rest do. 3. If the user isn't logged in, the page should say so and link to `/api/auth/login` rather than showing an empty shell. Look at how `apps/frontend/src/app/launch-page/page.tsx` links to the login endpoint. It's a plain `<a href>`, not a react-router `<Link>`, because it's a server redirect and not a client route. If ya don't do that it might break. 4. Run `cd apps/frontend` and `deno task dev`, click the avatar in both the desktop navbar and the mobile one and confirm both land on the new page. ### Help & Resources - [README](../../ScottyLabs/housing/src/branch/main/README.md) - [Contributing Guidelines](../../ScottyLabs/housing/src/branch/main/docs/CONTRIBUTING.md)

gostmeaper added the

labels

2026-09-14 04:08:07 +00:00

gostmeaper added this to the CMU Housing Development project

2026-09-14 04:08:11 +00:00