feat: add memory chat

2 files changed, 65 insertions, 0 deletions

diff --git a/src/misc/chart-memory.ts b/src/misc/chart-memory.ts
new file mode 100644
index 0000000..4887b7f
--- /dev/null
+++ b/src/misc/chart-memory.ts
@@ -0,0 +1,64 @@
+import { createAsset } from 'use-asset';
+
+import prettyBytes from './pretty-bytes';
+export const chartJSResource = createAsset(() => {
+  return import('~/misc/chart-lib');
+});
+
+export const commonDataSetProps = { borderWidth: 1, pointRadius: 0, tension: 0.2, fill: true };
+
+export const memoryChartOptions: import('chart.js').ChartOptions<'line'> = {
+  responsive: true,
+  maintainAspectRatio: true,
+  plugins: {
+    legend: { labels: { boxWidth: 20 } },
+  },
+  scales: {
+    x: { display: false, type: 'category' },
+    y: {
+      type: 'linear',
+      display: true,
+      grid: {
+        display: true,
+        color: '#555',
+        drawTicks: false,
+      },
+      border: {
+        dash: [3, 6],
+      },
+      ticks: {
+        maxTicksLimit: 3,
+        callback(value: number) {
+          return prettyBytes(value);
+        },
+      },
+    },
+  },
+};
+
+export const chartStyles = [
+  {
+    inuse: {
+      backgroundColor: 'rgba(	116, 162, 249, 0.8)',
+      borderColor: 'rgb(116, 162, 249)',
+    },
+  },
+  {
+    inuse: {
+      backgroundColor: 'rgb(98, 190, 100)',
+      borderColor: 'rgb(78,146,79)',
+    },
+  },
+  {
+    inuse: {
+      backgroundColor: 'rgba(94, 175, 223, 0.3)',
+      borderColor: 'rgb(94, 175, 223)',
+    },
+  },
+  {
+    inuse: {
+      backgroundColor: 'rgba(242, 174, 62, 0.3)',
+      borderColor: 'rgb(242, 174, 62)',
+    },
+  },
+];
diff --git a/src/misc/chart.ts b/src/misc/chart.ts
index 56ffe87..07b1b51 100644
--- a/src/misc/chart.ts
+++ b/src/misc/chart.ts
@@ -27,6 +27,7 @@ export const commonChartOptions: import('chart.js').ChartOptions<'line'> = {
         dash: [3, 6],
       },
       ticks: {
+        maxTicksLimit: 5,
         callback(value: number) {
           return prettyBytes(value) + '/s ';
         },