feat(new tool): SLA Computer

Fix CorentinTh#738

Author: sharevb

components.d.ts

@@ -166,6 +166,7 @@ declare module '@vue/runtime-core' {
     NProgress: typeof import('naive-ui')['NProgress']
     NScrollbar: typeof import('naive-ui')['NScrollbar']
     NSlider: typeof import('naive-ui')['NSlider']
+    NSpace: typeof import('naive-ui')['NSpace']
     NStatistic: typeof import('naive-ui')['NStatistic']
     NSwitch: typeof import('naive-ui')['NSwitch']
     NTable: typeof import('naive-ui')['NTable']
@@ -186,6 +187,7 @@ declare module '@vue/runtime-core' {
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']
     RsaKeyPairGenerator: typeof import('./src/tools/rsa-key-pair-generator/rsa-key-pair-generator.vue')['default']
+    SlaCalculator: typeof import('./src/tools/sla-calculator/sla-calculator.vue')['default']
     SlugifyString: typeof import('./src/tools/slugify-string/slugify-string.vue')['default']
     SpanCopyable: typeof import('./src/components/SpanCopyable.vue')['default']
     SqlPrettify: typeof import('./src/tools/sql-prettify/sql-prettify.vue')['default']

package.json

@@ -41,12 +41,14 @@
     "@tiptap/pm": "2.1.6",
     "@tiptap/starter-kit": "2.1.6",
     "@tiptap/vue-3": "2.0.3",
+    "@types/big.js": "^6.2.2",
     "@vicons/material": "^0.12.0",
     "@vicons/tabler": "^0.12.0",
     "@vueuse/core": "^10.3.0",
     "@vueuse/head": "^1.0.0",
     "@vueuse/router": "^10.0.0",
     "bcryptjs": "^2.4.3",
+    "big.js": "^6.2.2",
     "change-case": "^4.1.2",
     "colord": "^2.9.3",
     "composerize-ts": "^0.6.2",
@@ -74,9 +76,11 @@
     "netmask": "^2.0.2",
     "node-forge": "^1.3.1",
     "oui-data": "^1.0.10",
+    "parse-duration": "^1.1.0",
     "pdf-signature-reader": "^1.4.2",
     "pinia": "^2.0.34",
     "plausible-tracker": "^0.3.8",
+    "pretty-ms": "^9.1.0",
     "qrcode": "^1.5.1",
     "sql-formatter": "^13.0.0",
     "ua-parser-js": "^1.0.35",

pnpm-lock.yaml

@@ -1,7 +1,8 @@
 import { useRouteQuery } from '@vueuse/router';
 import { computed } from 'vue';
+import { useStorage } from '@vueuse/core';
 
-export { useQueryParam };
+export { useQueryParam, useQueryParamOrStorage };
 
 const transformers = {
   number: {
@@ -16,6 +17,12 @@ const transformers = {
     fromQuery: (value: string) => value.toLowerCase() === 'true',
     toQuery: (value: boolean) => (value ? 'true' : 'false'),
   },
+  object: {
+    fromQuery: (value: string) => {
+      return JSON.parse(value);
+    },
+    toQuery: (value: object) => JSON.stringify(value),
+  },
 };
 
 function useQueryParam<T>({ name, defaultValue }: { name: string; defaultValue: T }) {
@@ -33,3 +40,27 @@ function useQueryParam<T>({ name, defaultValue }: { name: string; defaultValue:
     },
   });
 }
+
+function useQueryParamOrStorage<T>({ name, storageName, defaultValue }: { name: string; storageName: string; defaultValue: T }) {
+  const type = typeof defaultValue;
+  const transformer = transformers[type as keyof typeof transformers] ?? transformers.string;
+
+  const storageRef = useStorage(storageName, defaultValue);
+  const proxyDefaultValue = transformer.toQuery(defaultValue as never);
+  const proxy = useRouteQuery(name, proxyDefaultValue);
+
+  const r = ref(defaultValue);
+
+  watch(r,
+    (value) => {
+      proxy.value = transformer.toQuery(value as never);
+      storageRef.value = value as never;
+    },
+    { deep: true });
+
+  r.value = (proxy.value && proxy.value !== proxyDefaultValue
+    ? transformer.fromQuery(proxy.value) as unknown as T
+    : storageRef.value as T) as never;
+
+  return r;
+}

src/composable/queryParams.ts

@@ -1,6 +1,7 @@
 import { tool as base64FileConverter } from './base64-file-converter';
 import { tool as base64StringConverter } from './base64-string-converter';
 import { tool as basicAuthGenerator } from './basic-auth-generator';
+import { tool as slaCalculator } from './sla-calculator';
 import { tool as pdfSignatureChecker } from './pdf-signature-checker';
 import { tool as numeronymGenerator } from './numeronym-generator';
 import { tool as macAddressGenerator } from './mac-address-generator';
@@ -151,7 +152,12 @@ export const toolsByCategory: ToolCategory[] = [
   },
   {
     name: 'Measurement',
-    components: [chronometer, temperatureConverter, benchmarkBuilder],
+    components: [
+      chronometer,
+      temperatureConverter,
+      benchmarkBuilder,
+      slaCalculator,
+    ],
   },
   {
     name: 'Text',

src/tools/index.ts

@@ -0,0 +1,12 @@
+import { Clock } from '@vicons/tabler';
+import { defineTool } from '../tool';
+
+export const tool = defineTool({
+  name: 'SLA calculator',
+  path: '/sla-calculator',
+  description: 'Service Level Agreement Calcultator',
+  keywords: ['sla', 'service', 'level', 'agreement', 'calculator'],
+  component: () => import('./sla-calculator.vue'),
+  icon: Clock,
+  createdAt: new Date('2024-05-11'),
+});

src/tools/sla-calculator/index.ts

@@ -0,0 +1,81 @@
+import { describe, expect, it } from 'vitest';
+import { downTimeToSLA, slaToDowntimes } from './sla-calculator.service';
+
+describe('sla-calculator', () => {
+  describe('downTimeToSLA', () => {
+    it('compute correct values', () => {
+      expect(downTimeToSLA({
+        downTimeSeconds: 100,
+        mondayHours: 16,
+        tuesdayHours: 6,
+        wednesdayHours: 4,
+        thursdayHours: 24,
+        fridayHours: 21,
+        saturdayHours: 16,
+        sundayHours: 13,
+      })).to.deep.eq({
+        slaForDay: null,
+        slaForMonth: 99.99361155031703,
+        slaForQuarter: 99.99787051677234,
+        slaForWeek: 99.97222222222223,
+        slaForYear: 99.99946762919309,
+      });
+      expect(downTimeToSLA({
+        downTimeSeconds: 86400 / 10000,
+      })).to.deep.eq({
+        slaForDay: 99.99,
+        slaForMonth: 99.99967145115916,
+        slaForQuarter: 99.99989048371972,
+        slaForWeek: 99.99857142857142,
+        slaForYear: 99.99997262092992,
+      });
+      expect(downTimeToSLA({
+        downTimeSeconds: 86400 / 2,
+      })).to.deep.eq({
+        slaForDay: 50,
+        slaForMonth: 98.35725579580689,
+        slaForQuarter: 99.45241859860229,
+        slaForWeek: 92.85714285714286,
+        slaForYear: 99.86310464965058,
+      });
+    });
+  });
+  describe('slaToDowntimes', () => {
+    it('compute correct values', () => {
+      expect(slaToDowntimes({
+        targetSLA: 99,
+        mondayHours: 9,
+        tuesdayHours: 24,
+        wednesdayHours: 10,
+        thursdayHours: 8,
+        fridayHours: 3,
+        saturdayHours: 24,
+        sundayHours: 4,
+      })).to.deep.eq({
+        secondsPerDay: null,
+        secondsPerMonth: 12835.665,
+        secondsPerQuarter: 38506.995,
+        secondsPerWeek: 2952,
+        secondsPerYear: 154027.98,
+      });
+      expect(slaToDowntimes({
+        targetSLA: 99.99,
+      })).to.deep.eq({
+        secondsPerDay: 8.64,
+        secondsPerMonth: 262.9746,
+        secondsPerQuarter: 788.9238,
+        secondsPerWeek: 60.48,
+        secondsPerYear: 3155.6952,
+      });
+      expect(slaToDowntimes({
+        targetSLA: 99,
+      })).to.deep.eq({
+        secondsPerDay: 864,
+        secondsPerMonth: 26297.46,
+        secondsPerQuarter: 78892.38,
+        secondsPerWeek: 6048,
+        secondsPerYear: 315569.52,
+      });
+    });
+  });
+});