Feat: improve data handling performance in frontend

[0xLE]

Currently, the frontend performs a full computation on every state change done to the teamFlagStatusAtom:

kriger/frontend/src/utils/atoms.ts

Lines 97 to 121 in 61a7d2a

	// TODO: Add tiered caching? We are aggregating everything every time 'teamFlagStatusAtom' updates.
	// Premature optimization here can lead to inconsistent aggregation. We have to deeal with status updates,
	// purging and the message delivery order.
	export const flagStatusAggregateAtom = atom((get) => {
	const flagStatus = get(teamFlagStatusAtom);
	let count = 0;
	const map = new Map<FLAG_CODE, number>();
	// We probably don't want to do FP here to avoid a lot of extra allocations
	for (const [_, serviceMap] of Object.entries(flagStatus)) {
	for (const [_, serviceFlags] of Object.entries(serviceMap)) {
	for (const [_, status] of Object.entries(serviceFlags)) {
	const key = status.status ?? FLAG_CODE.Pending;
	map.set(key, (map.get(key) ?? 0) + 1);
	++count;
	}
	}
	}
	return {
	count,
	statusMap: map,
	};
	});

Each state change will cause the frontend to recompute the entire aggregation, having a runtime complexity of O(|F|) where F is the set of flags. Frequent updates will result in a performance degradation.