diff --git a/app/[locale]/[username]/ProfilePageClient.tsx b/app/[locale]/[username]/ProfilePageClient.tsx index 094a745b..49a38a41 100644 --- a/app/[locale]/[username]/ProfilePageClient.tsx +++ b/app/[locale]/[username]/ProfilePageClient.tsx @@ -122,23 +122,33 @@ const ProfilePageClient: React.FC = ({ setFetching(true) try { - // Construct URL for fetching more data - const url = new URL(`/api/parties`, window.location.origin) - url.searchParams.set('username', initialData.user.username) + // Construct URL for fetching more data - using the users endpoint + const url = new URL(`${process.env.NEXT_PUBLIC_SIERO_API_URL}/users/${initialData.user.username}`, window.location.origin) url.searchParams.set('page', (currentPage + 1).toString()) if (element) url.searchParams.set('element', element.toString()) - if (raid) url.searchParams.set('raid', raid) + if (raid) url.searchParams.set('raid_id', raid) if (recency) url.searchParams.set('recency', recency) - const response = await fetch(url.toString()) + const response = await fetch(url.toString(), { + headers: { + 'Content-Type': 'application/json' + } + }) const data = await response.json() - if (data.parties && Array.isArray(data.parties)) { - setParties([...parties, ...data.parties]) - setCurrentPage(data.pagination?.current_page || currentPage + 1) - setTotalPages(data.pagination?.total_pages || totalPages) - setRecordCount(data.pagination?.record_count || recordCount) + // Extract parties from the profile response + const newParties = data.profile?.parties || [] + + if (newParties.length > 0) { + setParties([...parties, ...newParties]) + + // Update pagination from meta + if (data.meta) { + setCurrentPage(currentPage + 1) + setTotalPages(data.meta.total_pages || totalPages) + setRecordCount(data.meta.count || recordCount) + } } } catch (error) { console.error('Error loading more parties', error) @@ -222,12 +232,7 @@ const ProfilePageClient: React.FC = ({ raidGroups={initialData.raidGroups} recency={recency} > - +
{renderInfiniteScroll}
diff --git a/app/[locale]/[username]/page.tsx b/app/[locale]/[username]/page.tsx index a6ee7f5d..bb6a5ad0 100644 --- a/app/[locale]/[username]/page.tsx +++ b/app/[locale]/[username]/page.tsx @@ -1,6 +1,6 @@ import { Metadata } from 'next' import { notFound } from 'next/navigation' -import { getUserInfo, getTeams, getRaidGroups } from '~/app/lib/data' +import { getUserProfile, getRaidGroups } from '~/app/lib/data' import ProfilePageClient from './ProfilePageClient' // Dynamic metadata @@ -10,10 +10,10 @@ export async function generateMetadata({ params: { username: string } }): Promise { try { - const userData = await getUserInfo(params.username) + const userProfileData = await getUserProfile(params.username, { page: 1 }) // If user doesn't exist, use default metadata - if (!userData || !userData.user) { + if (!userProfileData || !userProfileData.profile) { return { title: 'User not found / granblue.team', description: 'This user could not be found' @@ -47,26 +47,33 @@ export default async function ProfilePage({ const page = searchParams.page ? parseInt(searchParams.page, 10) : 1; // Parallel fetch data with Promise.all for better performance - const [userData, teamsData, raidGroupsData] = await Promise.all([ - getUserInfo(params.username), - getTeams({ username: params.username, element, raid, recency, page }), + const [userProfileData, raidGroupsData] = await Promise.all([ + getUserProfile(params.username, { element, raid, recency, page }), getRaidGroups() ]) // If user doesn't exist, show 404 - if (!userData || !userData.user) { + if (!userProfileData || !userProfileData.profile) { notFound() } - // Prepare data for client component + // Extract user and teams from the profile response + const user = userProfileData.profile + const teams = userProfileData.profile.parties || [] + const initialData = { - user: userData.user, - teams: teamsData.results || [], + user: { + id: user.id, + username: user.username, + avatar: user.avatar, + gender: user.gender + }, + teams: teams, raidGroups: raidGroupsData || [], pagination: { current_page: page, - total_pages: teamsData.meta?.total_pages || 1, - record_count: teamsData.meta?.count || 0 + total_pages: userProfileData.meta?.total_pages || 1, + record_count: userProfileData.meta?.count || 0 } } diff --git a/app/lib/data.ts b/app/lib/data.ts index d2e37e2e..a26a5ef2 100644 --- a/app/lib/data.ts +++ b/app/lib/data.ts @@ -62,6 +62,32 @@ export async function getUserInfo(username: string) { } } +// Get user profile with teams (combines user info and teams) +export async function getUserProfile(username: string, params?: { + element?: number; + raid?: string; + recency?: string; + page?: number; +}) { + try { + const queryParams: Record = {}; + if (params?.element) queryParams.element = params.element.toString(); + if (params?.raid) queryParams.raid_id = params.raid; + if (params?.recency) queryParams.recency = params.recency; + if (params?.page) queryParams.page = params.page.toString(); + + let endpoint = `/users/${username}`; + const queryString = new URLSearchParams(queryParams).toString(); + if (queryString) endpoint += `?${queryString}`; + + const data = await fetchFromApi(endpoint); + return data; + } catch (error) { + console.error(`Failed to fetch user profile for ${username}`, error); + throw error; + } +} + // Get raid groups export async function getRaidGroups() { try {