[fix] Fit chart in box boundaries

src/App.tsx

@@ -24,17 +24,16 @@ function App() {
 
   return (
     <TamaguiProvider config={config}>
+      <StatisticBox
+        memory="45"
+        stateIcon="https://placehold.co/16x16"
+        stateText="Improving performance"
+        title="Title of the box"
+      />
       <StatusProvider>
         <div style={{ height: '500px', width: '300px' }}>
           <StandardGauge data={data} />
         </div>
-
-        <StatisticBox
-          memory="30"
-          stateIcon="https://placehold.co/60x40"
-          stateText="Oooo"
-          title="Auuuu"
-        />
       </StatusProvider>
     </TamaguiProvider>
   )

src/components/StandardLineChart.tsx

@@ -7,25 +7,61 @@ const MyResponsiveLine = () => {
       color: 'hsl(315, 70%, 50%)',
       data: [
         {
-          x: 'plane',
+          x: '1',
-          y: 34,
+          y: 15,
         },
         {
-          x: 'helicopter',
+          x: '2',
+          y: 12,
+        },
+        {
+          x: '3',
+          y: 43,
+        },
+        {
+          x: '4',
+          y: 20,
+        },
+        {
+          x: '5',
           y: 60,
         },
         {
-          x: 'boat',
+          x: '6',
+          y: 5,
+        },
+        {
+          x: '7',
+          y: 15,
+        },
+        {
+          x: '8',
+          y: 12,
+        },
+        {
+          x: '9',
+          y: 43,
+        },
+        {
+          x: '10',
           y: 20,
         },
+        {
+          x: '11',
+          y: 60,
+        },
+        {
+          x: '12',
+          y: 5,
+        },
       ],
     },
   ]
   return (
     <ResponsiveLine
       data={data}
-      margin={{ top: 0, right: 0, bottom: 0, left: 30 }}
+      margin={{ top: 0, right: 0, bottom: 0, left: -75 }}
-      xScale={{ type: 'point' }}
+      xScale={{ type: 'linear', min: 0, max: 12 }}
       yScale={{
         type: 'linear',
         min: 'auto',
@@ -40,7 +76,7 @@ const MyResponsiveLine = () => {
       enableGridX={false}
       enableGridY={false}
       enablePoints={false}
-      pointSize={10}
+      pointSize={1}
       pointColor={{ theme: 'background' }}
       pointBorderWidth={2}
       pointBorderColor={{ from: 'serieColor' }}