chore(deps): update dependency recharts to v3 (#4302)

Co-authored-by: homarr-renovate[bot] <158783068+homarr-renovate[bot]@users.noreply.github.com>
Co-authored-by: Manuel <30572287+manuel-rw@users.noreply.github.com>
Co-authored-by: Meier Lukas <meierschlumpf@gmail.com>

packages/widgets/src/speedtest-tracker/recent-results.tsx

@@ -46,7 +46,7 @@ function buildXAxisTicks(data: { ts: number }[]): XAxisTicks {
 }
 
 function makeXTickRenderer(midnightTs: number | null) {
-  return ({ x, y, payload }: { x: number; y: number; payload: { value: number } }) => {
+  return ({ x, y, payload }: { x: number | string; y: number | string; payload: { value: number } }) => {
     const date = new Date(payload.value);
     const timeStr = date.toLocaleTimeString([], { hour: "2-digit", minute: "2-digit" });
     const isMidnight = midnightTs !== null && payload.value === midnightTs;
@@ -67,7 +67,12 @@ function makeXTickRenderer(midnightTs: number | null) {
   };
 }
 
-function renderTopDateTick(props: { x: number; y: number; payload: { value: number }; index: number }) {
+function renderTopDateTick(props: {
+  x: number | string;
+  y: number | string;
+  payload: { value: number };
+  index: number;
+}) {
   const { x, y, payload, index } = props;
   const date = new Date(payload.value);
   const dateStr = date.toLocaleDateString([], { weekday: "short", month: "short", day: "numeric" });

packages/widgets/src/system-resources/chart/combined-network-traffic.tsx

@@ -37,9 +37,6 @@ export const CombinedNetworkTrafficChart = ({
       labelDisplayMode={labelDisplayMode}
       tooltipProps={{
         content: ({ payload }) => {
-          if (!payload) {
-            return null;
-          }
           return (
             <Paper px={3} py={2} withBorder shadow="md" radius="md">
               <Stack gap={0}>
@@ -50,7 +47,7 @@ export const CombinedNetworkTrafficChart = ({
                       {payloadData.value === undefined ? (
                         <>N/A</>
                       ) : (
-                        <>{humanFileSize(Math.round(payloadData.value))}/s</>
+                        <>{humanFileSize(Math.round(Number(payloadData.value)))}/s</>
                       )}
                     </Text>
                   </Group>

packages/widgets/src/system-resources/chart/cpu-chart.tsx

@@ -34,9 +34,6 @@ export const SystemResourceCPUChart = ({
       labelDisplayMode={labelDisplayMode}
       tooltipProps={{
         content: ({ payload }) => {
-          if (!payload) {
-            return null;
-          }
           const value = payload[0] ? Number(payload[0].value) : 0;
           return (
             <Paper px={3} py={2} withBorder shadow="md" radius="md">

packages/widgets/src/system-resources/chart/gpu-chart.tsx

@@ -34,9 +34,6 @@ export const SystemResourceGPUChart = ({
       labelDisplayMode={labelDisplayMode}
       tooltipProps={{
         content: ({ payload }) => {
-          if (!payload) {
-            return null;
-          }
           const value = payload[0] ? Number(payload[0].value) : 0;
           return (
             <Paper px={3} py={2} withBorder shadow="md" radius="md">

packages/widgets/src/system-resources/chart/memory-chart.tsx

@@ -40,9 +40,6 @@ export const SystemResourceMemoryChart = ({
       chartType={hasShadow ? "area" : "line"}
       tooltipProps={{
         content: ({ payload }) => {
-          if (!payload) {
-            return null;
-          }
           const value = payload[0] ? Number(payload[0].value) : 0;
           return (
             <Paper px={3} py={2} withBorder shadow="md" radius="md">

packages/widgets/src/system-resources/chart/network-traffic.tsx

@@ -37,9 +37,6 @@ export const NetworkTrafficChart = ({
       labelDisplayMode={labelDisplayMode}
       tooltipProps={{
         content: ({ payload }) => {
-          if (!payload) {
-            return null;
-          }
           const value = payload[0] ? Number(payload[0].value) : 0;
           return (
             <Paper px={3} py={2} withBorder shadow="md" radius="md">