Fix frontend compatibility with new API response format
Some checks failed
Lint and Build / build (22) (pull_request) Failing after 45s
Lint and Build / build (20) (pull_request) Failing after 47s

Frontend Updates:
- Handle both old and new API response formats for backward compatibility
- Updated Teams, Streams, and Edit Stream pages to parse new response structure
- Added graceful handling of { success: true, data: [...] } format
- Maintained support for legacy direct array responses

Bug Fix:
- Resolved TypeError: teamsData.map is not a function
- Ensures smooth transition as we update API endpoints
- Prevents breaking changes during API modernization

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Decobus 2025-07-19 05:52:25 -04:00
parent f4df3df698
commit a66979fb34
3 changed files with 13 additions and 4 deletions

View file

@ -65,9 +65,12 @@ export default function EditStream() {
team_id: streamData.team_id,
});
// Handle both old and new API response formats
const teams = teamsData.success ? teamsData.data : teamsData;
// Map teams for dropdown
setTeams(
teamsData.map((team: Team) => ({
teams.map((team: Team) => ({
id: team.team_id,
name: team.team_name,
}))

View file

@ -44,15 +44,19 @@ export default function AddStream() {
const teamsData = await teamsResponse.json();
const streamsData = await streamsResponse.json();
// Handle both old and new API response formats
const teams = teamsData.success ? teamsData.data : teamsData;
const streams = streamsData.success ? streamsData.data : streamsData;
// Map the API data to the format required by the Dropdown
setTeams(
teamsData.map((team: Team) => ({
teams.map((team: Team) => ({
id: team.team_id,
name: team.team_name,
}))
);
setStreams(streamsData);
setStreams(streams);
} catch (error) {
console.error('Failed to fetch data:', error);
showError('Failed to Load Data', 'Could not fetch teams and streams. Please refresh the page.');

View file

@ -26,7 +26,9 @@ export default function Teams() {
try {
const res = await fetch('/api/teams');
const data = await res.json();
setTeams(data);
// Handle both old and new API response formats
const teams = data.success ? data.data : data;
setTeams(teams);
} catch (error) {
console.error('Error fetching teams:', error);
} finally {