fix(profiles): make public profiles accessible without authentication and unify 404 behavior
Backend changes: - Removed authentication requirement from GET /api/users/:username endpoint - Removed authentication requirement from GET /api/users/:username/ratings endpoint - These are public profile endpoints and should be accessible to all users Frontend changes: - PublicProfilePage now shows NotFoundPage component when user doesn't exist - Unified 404 behavior: both invalid URLs and non-existent users show the same 404 page - NotFoundPage "Requested URL" box now only shows in dev mode (import.meta.env.DEV) - Removed unused AlertCircle icon import from PublicProfilePage
This commit is contained in:
@@ -82,7 +82,7 @@ router.patch('/me', authenticate, updateProfileValidation, updateProfile);
|
|||||||
router.patch('/me/password', authenticate, changePasswordValidation, changePassword);
|
router.patch('/me/password', authenticate, changePasswordValidation, changePassword);
|
||||||
|
|
||||||
// GET /api/users/:username - Get public user profile by username
|
// GET /api/users/:username - Get public user profile by username
|
||||||
router.get('/:username', authenticate, async (req, res, next) => {
|
router.get('/:username', async (req, res, next) => {
|
||||||
try {
|
try {
|
||||||
const { username } = req.params;
|
const { username } = req.params;
|
||||||
|
|
||||||
@@ -149,7 +149,7 @@ router.get('/:username', authenticate, async (req, res, next) => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
// GET /api/users/:username/ratings - Get ratings for a user
|
// GET /api/users/:username/ratings - Get ratings for a user
|
||||||
router.get('/:username/ratings', authenticate, async (req, res, next) => {
|
router.get('/:username/ratings', async (req, res, next) => {
|
||||||
try {
|
try {
|
||||||
const { username } = req.params;
|
const { username } = req.params;
|
||||||
|
|
||||||
|
|||||||
@@ -45,14 +45,16 @@ export default function NotFoundPage() {
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Current Path */}
|
{/* Current Path - Only show in dev mode */}
|
||||||
<div className="mb-8 p-4 bg-gray-100 rounded-lg">
|
{import.meta.env.DEV && (
|
||||||
<p className="text-sm text-gray-500 mb-1">Requested URL:</p>
|
<div className="mb-8 p-4 bg-gray-100 rounded-lg">
|
||||||
<code className="text-sm text-gray-800 break-all">
|
<p className="text-sm text-gray-500 mb-1">Requested URL:</p>
|
||||||
{location.pathname}
|
<code className="text-sm text-gray-800 break-all">
|
||||||
{location.search}
|
{location.pathname}
|
||||||
</code>
|
{location.search}
|
||||||
</div>
|
</code>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
{/* Action Buttons */}
|
{/* Action Buttons */}
|
||||||
<div className="flex flex-col sm:flex-row gap-3 justify-center">
|
<div className="flex flex-col sm:flex-row gap-3 justify-center">
|
||||||
|
|||||||
@@ -2,8 +2,9 @@ import { useState, useEffect } from 'react';
|
|||||||
import { useParams, Link } from 'react-router-dom';
|
import { useParams, Link } from 'react-router-dom';
|
||||||
import { authAPI, ratingsAPI } from '../services/api';
|
import { authAPI, ratingsAPI } from '../services/api';
|
||||||
import Layout from '../components/layout/Layout';
|
import Layout from '../components/layout/Layout';
|
||||||
import { User, MapPin, Globe, Hash, Youtube, Instagram, Facebook, Award, Users, Star, Calendar, Loader2, AlertCircle, ThumbsUp } from 'lucide-react';
|
import { User, MapPin, Globe, Hash, Youtube, Instagram, Facebook, Award, Users, Star, Calendar, Loader2, ThumbsUp } from 'lucide-react';
|
||||||
import Avatar from '../components/common/Avatar';
|
import Avatar from '../components/common/Avatar';
|
||||||
|
import NotFoundPage from './NotFoundPage';
|
||||||
|
|
||||||
const PublicProfilePage = () => {
|
const PublicProfilePage = () => {
|
||||||
const { username: rawUsername } = useParams();
|
const { username: rawUsername } = useParams();
|
||||||
@@ -61,25 +62,7 @@ const PublicProfilePage = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (error) {
|
if (error) {
|
||||||
return (
|
return <NotFoundPage />;
|
||||||
<Layout>
|
|
||||||
<div className="min-h-screen bg-gray-50 flex items-center justify-center">
|
|
||||||
<div className="max-w-md w-full mx-4">
|
|
||||||
<div className="bg-white rounded-lg shadow-sm p-8 text-center">
|
|
||||||
<AlertCircle className="w-16 h-16 text-red-500 mx-auto mb-4" />
|
|
||||||
<h2 className="text-2xl font-bold text-gray-900 mb-2">User Not Found</h2>
|
|
||||||
<p className="text-gray-600 mb-6">{error}</p>
|
|
||||||
<Link
|
|
||||||
to="/events"
|
|
||||||
className="inline-block px-6 py-2 bg-primary-600 text-white rounded-md hover:bg-primary-700"
|
|
||||||
>
|
|
||||||
Back to Events
|
|
||||||
</Link>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</Layout>
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
Reference in New Issue
Block a user