Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-01-31 00:16:47 +01:00
Code Issues Projects Releases Wiki Activity

feat(1-3267): some re-juggling

Browse Source
This commit is contained in:
Thomas Heartman 2025-01-24 12:23:46 +01:00
parent b0b80d913f
commit c9a78fa674
No known key found for this signature in database
GPG Key ID: BD1F880DAED1EE78
2 changed files with 22 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/hooks/api/getters/useInstanceTrafficMetrics/useInstanceTrafficMetrics.ts
View File

@ -65,18 +65,16 @@ export type SegmentedSchema = {
apiData: [ apiData: [
{ {
apiPath: string; apiPath: string;
dataPoints: [ dataPoints: {
{ // other options: period? time? interval? for?
// other options: period? time? interval? for? when: string; // in API: string formatted as full date or YYYY-MM, depending on monthly/daily
when: string; // in API: string formatted as full date or YYYY-MM, depending on monthly/daily trafficTypes: [
trafficTypes: [ {
{ group: string; // we could do 'successful-requests', but that might constrain us in the future
group: string; // we could do 'successful-requests', but that might constrain us in the future count: number; // natural number
count: number; // natural number },
}, ];
]; }[];
},
];
}, },
]; ];
}; };

88
frontend/src/hooks/useTrafficData.ts
View File

@ -119,7 +119,13 @@ export const newToChartData = (
traffic?: SegmentedSchema, traffic?: SegmentedSchema,
): { datasets: ChartDatasetType[]; labels: (string | number)[] } => { ): { datasets: ChartDatasetType[]; labels: (string | number)[] } => {
if (!traffic) { if (!traffic) {
return { labels: [], datasets: [] }; const datasets = Object.values(endpointsInfo).map((info) => ({
label: info.label,
data: [],
backgroundColor: info.color,
hoverBackgroundColor: info.color,
}));
return { labels: [], datasets };
} }
if (traffic.format === 'monthly') { if (traffic.format === 'monthly') {
@ -168,69 +174,13 @@ const toMonthlyChartData = (
}, },
); );
const labels = Array.from({ length: numMonths + 1 }).map((_, index) => const labels = Array.from({ length: numMonths }).map((_, index) =>
formatMonth(addMonths(from, index)), formatMonth(addMonths(from, index)),
); );
return { datasets, labels }; return { datasets, labels };
}; };
// const getDailyChartDataRec = (period: { from: string; to: string }) => {
// const from = new Date(period.from);
// const to = new Date(period.to);
// const numDays = Math.abs(differenceInCalendarDays(to, from));
// const formatDay = (date: Date) => format(date, 'yyyy-MM-dd');
// const daysRec: { [day: string]: number } = {};
// for (let i = 0; i <= numDays; i++) {
// daysRec[formatDay(addDays(from, i))] = 0;
// }
// return () => ({
// ...daysRec,
// });
// };
// const toAnyChartData =
// (getDataRec: () => { [key: string]: number }) =>
// (
// traffic: InstanceTrafficMetricsResponse2,
// endpointsInfo: Record<string, EndpointInfo>,
// ): ChartDatasetType[] => {
// if (!traffic || !traffic.usage || !traffic.usage.apiData) {
// return [];
// }
// const data = traffic.usage.apiData
// .filter((item) => !!endpointsInfo[item.apiPath])
// .sort(
// (
// item1: SegmentedSchemaApiData,
// item2: SegmentedSchemaApiData,
// ) =>
// endpointsInfo[item1.apiPath].order -
// endpointsInfo[item2.apiPath].order,
// )
// .map((item: SegmentedSchemaApiData) => {
// const entries = getDataRec();
// for (const day of Object.values(item.dataPoints)) {
// entries[day.when] = day.trafficTypes[0].count;
// }
// const epInfo = endpointsInfo[item.apiPath];
// return {
// label: epInfo.label,
// data: Object.values(entries),
// backgroundColor: epInfo.color,
// hoverBackgroundColor: epInfo.color,
// };
// });
// return data;
// };
const toDailyChartData = ( const toDailyChartData = (
traffic: SegmentedSchema, traffic: SegmentedSchema,
endpointsInfo: Record<string, EndpointInfo>, endpointsInfo: Record<string, EndpointInfo>,
@ -249,14 +199,8 @@ const toDailyChartData = (
...daysRec, ...daysRec,
}); });
const datasets = traffic.apiData const datasets = prepareApiData(traffic.apiData).map(
.filter((item) => !!endpointsInfo[item.apiPath]) (item: SegmentedSchemaApiData) => {
.sort(
(item1: SegmentedSchemaApiData, item2: SegmentedSchemaApiData) =>
endpointsInfo[item1.apiPath].order -
endpointsInfo[item2.apiPath].order,
)
.map((item: SegmentedSchemaApiData) => {
const daysRec = getDaysRec(); const daysRec = getDaysRec();
for (const day of Object.values(item.dataPoints)) { for (const day of Object.values(item.dataPoints)) {
@ -271,7 +215,8 @@ const toDailyChartData = (
backgroundColor: epInfo.color, backgroundColor: epInfo.color,
hoverBackgroundColor: epInfo.color, hoverBackgroundColor: epInfo.color,
}; };
}); },
);
// simplification: assuming days run in a single month from the 1st onwards // simplification: assuming days run in a single month from the 1st onwards
const labels = Array.from({ length: numDays }).map((_, index) => index + 1); const labels = Array.from({ length: numDays }).map((_, index) => index + 1);
@ -331,15 +276,6 @@ const toChartData = (
}; };
}); });
console.log(
'traffic data to chart data',
days,
traffic.usage,
endpointsInfo,
'result:',
data,
);
return data; return data;
}; };