Add team renaming functionality to API and frontend. Implement backend logic for renaming teams, including validation and synchronization with event rosters. Update frontend components to allow team name editing and ensure proper state management. Enhance translations and styles for new features.

frontend/src/api/client.test.ts

@@ -120,4 +120,17 @@ describe('actual backend routes', () => {
       body: JSON.stringify({ moderator: true }),
     }))
   })
+
+  it('renames a live team through its team route', async () => {
+    const team = { id: 'team-a', eventId: 'event-1', name: 'Ember Wolves', captainPlayerId: 'player-1', slots: [] }
+    const fetchMock = vi.spyOn(globalThis, 'fetch').mockResolvedValue(new Response(JSON.stringify(team), {
+      status: 200,
+      headers: { 'Content-Type': 'application/json' },
+    }))
+    await api.renameTeam(team.id, team.name)
+    expect(fetchMock).toHaveBeenCalledWith('/api/teams/team-a/name', expect.objectContaining({
+      method: 'PUT',
+      body: JSON.stringify({ name: 'Ember Wolves' }),
+    }))
+  })
 })

frontend/src/api/client.ts

@@ -615,6 +615,8 @@ export const api = {
   },
   assignCaptain: async (teamId: string, playerId: string) =>
     adaptTeam(await request<RawTeam>(`/teams/${teamId}/captain`, { method: 'PUT', body: JSON.stringify({ playerId }) }), new Map()),
+  renameTeam: (teamId: string, name: string) =>
+    request<RawTeam>(`/teams/${teamId}/name`, { method: 'PUT', body: JSON.stringify({ name }) }),
   series: async (seriesId: string) => {
     const series = await request<RawSeries>(`/series/${seriesId}`)
     return adaptSeriesWithTeams(series)