From 2572da3456fb735ab6eae955a6b81d55e30243d4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Carl-Gerhard=20Lindesva=CC=88rd?= Date: Tue, 13 Feb 2024 19:03:51 +0100 Subject: [PATCH] improvement --- .../src/controllers/misc.controller.ts | 83 +++++++++++++++++++ apps/sdk-api/src/index.ts | 2 + apps/sdk-api/src/routes/misc.router.ts | 14 ++++ .../components/report/chart/ChartEmpty.tsx | 2 +- .../components/report/chart/ChartLoading.tsx | 2 +- .../report/chart/ReportAreaChart.tsx | 4 +- .../report/chart/ReportBarChart.tsx | 10 +-- .../report/chart/ReportHistogramChart.tsx | 4 +- .../report/chart/ReportLineChart.tsx | 4 +- .../src/components/report/chart/SerieIcon.tsx | 5 +- 10 files changed, 116 insertions(+), 14 deletions(-) create mode 100644 apps/sdk-api/src/controllers/misc.controller.ts create mode 100644 apps/sdk-api/src/routes/misc.router.ts diff --git a/apps/sdk-api/src/controllers/misc.controller.ts b/apps/sdk-api/src/controllers/misc.controller.ts new file mode 100644 index 00000000..8667e91e --- /dev/null +++ b/apps/sdk-api/src/controllers/misc.controller.ts @@ -0,0 +1,83 @@ +import type { FastifyReply, FastifyRequest } from 'fastify'; + +import { redis } from '@mixan/redis'; + +interface GetFaviconParams { + url: string; +} + +function toBuffer(arrayBuffer: ArrayBuffer) { + const buffer = Buffer.alloc(arrayBuffer.byteLength); + const view = new Uint8Array(arrayBuffer); + for (let i = 0; i < buffer.length; ++i) { + buffer[i] = view[i]!; + } + return buffer; +} + +async function getUrlBuffer(url: string) { + const arrayBuffer = await fetch(url).then((res) => { + if (res.ok) { + return res.arrayBuffer(); + } + }); + + if (arrayBuffer) { + return toBuffer(arrayBuffer); + } + + return null; +} + +export async function getFavicon( + request: FastifyRequest<{ + Querystring: GetFaviconParams; + }>, + reply: FastifyReply +) { + if (!request.query.url) { + return reply.status(404).send('Not found'); + } + + function sendBuffer(buffer: Buffer, hostname?: string) { + if (hostname) { + redis.set(`favicon:${hostname}`, buffer.toString('base64')); + } + reply.type('image/png'); + return reply.send(buffer); + } + + const url = decodeURIComponent(request.query.url); + const { hostname, origin } = new URL(url); + + const cache = await redis.get(`favicon:${hostname}`); + if (cache) { + return sendBuffer(Buffer.from(cache, 'base64')); + } + + // Try just get the favicon.ico + const buffer = await getUrlBuffer(`${origin}/favicon.ico`); + if (buffer) { + return sendBuffer(buffer, hostname); + } + + // If that didnt work try parse html + const res = await fetch(url).then((res) => res.text()); + const favicon = + res.match(//) || + res.match(//); + + if (favicon?.[1]) { + const faviconUrl = favicon[1].startsWith('http') + ? favicon[1] + : `${origin}${favicon[1]}`; + + const buffer = await getUrlBuffer(faviconUrl); + + if (buffer) { + return sendBuffer(buffer, hostname); + } + } + + return reply.status(404).send('Not found'); +} diff --git a/apps/sdk-api/src/index.ts b/apps/sdk-api/src/index.ts index fc8b90a3..93630943 100644 --- a/apps/sdk-api/src/index.ts +++ b/apps/sdk-api/src/index.ts @@ -6,6 +6,7 @@ import { redisPub } from '@mixan/redis'; import eventRouter from './routes/event.router'; import liveRouter from './routes/live.router'; +import miscRouter from './routes/misc.router'; import profileRouter from './routes/profile.router'; declare module 'fastify' { @@ -32,6 +33,7 @@ const startServer = async () => { fastify.register(eventRouter, { prefix: '/event' }); fastify.register(profileRouter, { prefix: '/profile' }); fastify.register(liveRouter, { prefix: '/live' }); + fastify.register(miscRouter, { prefix: '/misc' }); fastify.setErrorHandler((error, request, reply) => { fastify.log.error(error); }); diff --git a/apps/sdk-api/src/routes/misc.router.ts b/apps/sdk-api/src/routes/misc.router.ts new file mode 100644 index 00000000..3b4adf5b --- /dev/null +++ b/apps/sdk-api/src/routes/misc.router.ts @@ -0,0 +1,14 @@ +import * as controller from '@/controllers/misc.controller'; +import type { FastifyPluginCallback } from 'fastify'; + +const miscRouter: FastifyPluginCallback = (fastify, opts, done) => { + fastify.route({ + method: 'GET', + url: '/favicon', + handler: controller.getFavicon, + }); + + done(); +}; + +export default miscRouter; diff --git a/apps/web/src/components/report/chart/ChartEmpty.tsx b/apps/web/src/components/report/chart/ChartEmpty.tsx index 8b4e061d..068447a7 100644 --- a/apps/web/src/components/report/chart/ChartEmpty.tsx +++ b/apps/web/src/components/report/chart/ChartEmpty.tsx @@ -22,7 +22,7 @@ export function ChartEmpty() { return (
No data diff --git a/apps/web/src/components/report/chart/ChartLoading.tsx b/apps/web/src/components/report/chart/ChartLoading.tsx index b843d126..e3dfe1b2 100644 --- a/apps/web/src/components/report/chart/ChartLoading.tsx +++ b/apps/web/src/components/report/chart/ChartLoading.tsx @@ -7,7 +7,7 @@ export function ChartLoading({ className }: ChartLoadingProps) { return (
diff --git a/apps/web/src/components/report/chart/ReportAreaChart.tsx b/apps/web/src/components/report/chart/ReportAreaChart.tsx index be8c8d40..09162bc9 100644 --- a/apps/web/src/components/report/chart/ReportAreaChart.tsx +++ b/apps/web/src/components/report/chart/ReportAreaChart.tsx @@ -41,7 +41,7 @@ export function ReportAreaChart({ <>
@@ -49,7 +49,7 @@ export function ReportAreaChart({ {({ width }) => ( } /> diff --git a/apps/web/src/components/report/chart/ReportBarChart.tsx b/apps/web/src/components/report/chart/ReportBarChart.tsx index e65f8297..337982f9 100644 --- a/apps/web/src/components/report/chart/ReportBarChart.tsx +++ b/apps/web/src/components/report/chart/ReportBarChart.tsx @@ -20,15 +20,15 @@ export function ReportBarChart({ data }: ReportBarChartProps) { const { editMode, metric, onClick } = useChartContext(); const number = useNumber(); const series = useMemo( - () => (editMode ? data.series : data.series.slice(0, 20)), - [data] + () => (editMode ? data.series : data.series.slice(0, 10)), + [data, editMode] ); const maxCount = Math.max(...series.map((serie) => serie.metrics[metric])); return (
onClick(serie) } : {})} > diff --git a/apps/web/src/components/report/chart/ReportHistogramChart.tsx b/apps/web/src/components/report/chart/ReportHistogramChart.tsx index ab3a1016..080bb19a 100644 --- a/apps/web/src/components/report/chart/ReportHistogramChart.tsx +++ b/apps/web/src/components/report/chart/ReportHistogramChart.tsx @@ -45,7 +45,7 @@ export function ReportHistogramChart({ <>
@@ -53,7 +53,7 @@ export function ReportHistogramChart({ {({ width }) => ( diff --git a/apps/web/src/components/report/chart/ReportLineChart.tsx b/apps/web/src/components/report/chart/ReportLineChart.tsx index a5a95466..0d598bad 100644 --- a/apps/web/src/components/report/chart/ReportLineChart.tsx +++ b/apps/web/src/components/report/chart/ReportLineChart.tsx @@ -43,7 +43,7 @@ export function ReportLineChart({ <>
@@ -51,7 +51,7 @@ export function ReportLineChart({ {({ width }) => ( ( - + )) as LucideIcon; }