From cfa250220105406b5859db6b60831dc34901d705 Mon Sep 17 00:00:00 2001
From: ShareVB <sharevb@gmail.com>
Date: Wed, 1 Jan 2025 21:54:11 +0100
Subject: [PATCH] fix: fix handling of milliseconds

in parsing and in formatting iso duration
in parsing of timestamp
---
 .../command-palette/command-palette.vue       |  2 +-
 .../duration-calculator.service.test.ts       | 68 +++++++++++++++----
 .../duration-calculator.service.ts            | 33 ++++-----
 src/ui/c-select/c-select.vue                  |  2 +-
 src/ui/c-table/c-table.vue                    |  2 +-
 5 files changed, 73 insertions(+), 34 deletions(-)

diff --git a/src/modules/command-palette/command-palette.vue b/src/modules/command-palette/command-palette.vue
index bceef5cd..5d953fee 100644
--- a/src/modules/command-palette/command-palette.vue
+++ b/src/modules/command-palette/command-palette.vue
@@ -128,7 +128,7 @@ function activateOption(option: PaletteOption) {
       <c-input-text ref="inputRef" v-model:value="searchPrompt" raw-text placeholder="Type to search a tool or a command..." autofocus clearable />
 
       <div v-for="(options, category) in filteredSearchResult" :key="category">
-        <div ml-3 mt-3 text-sm font-bold text-primary op-60>
+        <div ml-3 mt-3 text-sm text-primary font-bold op-60>
           {{ category }}
         </div>
         <command-palette-option v-for="option in options" :key="option.name" :option="option" :selected="selectedOptionIndex === getOptionIndex(option)" @activated="activateOption" />
diff --git a/src/tools/duration-calculator/duration-calculator.service.test.ts b/src/tools/duration-calculator/duration-calculator.service.test.ts
index 8db3c061..80e50a27 100644
--- a/src/tools/duration-calculator/duration-calculator.service.test.ts
+++ b/src/tools/duration-calculator/duration-calculator.service.test.ts
@@ -24,6 +24,8 @@ describe('duration-calculator', () => {
   describe('computeDuration', () => {
     it('should compute correct sum/values', () => {
       expect(computeDuration('')).to.deep.eq(zeroResult);
+      expect(computeDuration('00:00:00')).to.deep.eq(zeroResult);
+      expect(computeDuration('0h')).to.deep.eq(zeroResult);
       expect(computeDuration('0s')).to.deep.eq(zeroResult);
       expect(computeDuration('3600s')).to.deep.eq({
         errors: [],
@@ -120,7 +122,7 @@ describe('duration-calculator', () => {
         total: {
           days: 0.11128616898148148,
           hours: 2.6708680555555557,
-          iso8601Duration: 'P0Y0M0DT2H40M15S',
+          iso8601Duration: 'P0Y0M0DT2H40M15.125S',
           milliseconds: 9615125,
           minutes: 160.25208333333333,
           prettified: '2h 40m 15s 125ms',
@@ -173,19 +175,19 @@ describe('duration-calculator', () => {
       expect(computeDuration('P4DT12H20M20.3S')).to.deep.eq({
         errors: [],
         total: {
-          days: 0.5138891238425926,
-          hours: 12.333338972222222,
-          iso8601Duration: 'P0Y0M0DT12H20M0S',
-          milliseconds: 44400020.3,
-          minutes: 740.0003383333333,
-          prettified: '12h 20m 20ms 300µs',
-          prettifiedColonNotation: '12:20:00',
-          prettifiedDaysColon: '12:20:00.20.299999997019768',
-          prettifiedHoursColon: '12:20:00.20.299999997019768',
-          prettifiedVerbose: '12 hours 20 minutes 20 milliseconds 300 microseconds',
-          seconds: 44400.0203,
-          weeks: 0.07341273197751322,
-          years: 0.0014079154077879248,
+          days: 4.514123842592593,
+          hours: 108.33897222222222,
+          iso8601Duration: 'P0Y0M4DT12H20M20.3S',
+          milliseconds: 390020300,
+          minutes: 6500.338333333333,
+          prettified: '4d 12h 20m 20s 300ms',
+          prettifiedColonNotation: '4:12:20:20.3',
+          prettifiedDaysColon: '4d 12:20:20.300',
+          prettifiedHoursColon: '108:20:20.300',
+          prettifiedVerbose: '4 days 12 hours 20 minutes 20 seconds 300 milliseconds',
+          seconds: 390020.3,
+          weeks: 0.6448748346560846,
+          years: 0.012367462582445459,
         },
       });
       expect(computeDuration('25s\n+PT20H\n-10s')).to.deep.eq({
@@ -315,7 +317,7 @@ describe('duration-calculator', () => {
         total: {
           days: 2.000001446759259,
           hours: 48.000034722222225,
-          iso8601Duration: 'P0Y0M2DT0H0M0S',
+          iso8601Duration: 'P0Y0M2DT0H0M0.125S',
           milliseconds: 172800125,
           minutes: 2880.0020833333333,
           prettified: '2d 125ms',
@@ -328,6 +330,42 @@ describe('duration-calculator', () => {
           years: 0.005479456018518519,
         },
       });
+      expect(computeDuration('12:12:12.1')).to.deep.eq({
+        errors: [],
+        total: {
+          days: 0.5084733796296297,
+          hours: 12.20336111111111,
+          iso8601Duration: 'P0Y0M0DT12H12M12.1S',
+          milliseconds: 43932100,
+          minutes: 732.2016666666667,
+          prettified: '12h 12m 12s 100ms',
+          prettifiedColonNotation: '12:12:12.1',
+          prettifiedDaysColon: '12:12:12.100',
+          prettifiedHoursColon: '12:12:12.100',
+          prettifiedVerbose: '12 hours 12 minutes 12 seconds 100 milliseconds',
+          seconds: 43932.1,
+          weeks: 0.07263905423280423,
+          years: 0.0013930777524099442,
+        },
+      });
+      expect(computeDuration('12:12:12.12')).to.deep.eq({
+        errors: [],
+        total: {
+          days: 0.5084736111111111,
+          hours: 12.203366666666666,
+          iso8601Duration: 'P0Y0M0DT12H12M12.12S',
+          milliseconds: 43932120,
+          minutes: 732.202,
+          prettified: '12h 12m 12s 120ms',
+          prettifiedColonNotation: '12:12:12.1',
+          prettifiedDaysColon: '12:12:12.120',
+          prettifiedHoursColon: '12:12:12.120',
+          prettifiedVerbose: '12 hours 12 minutes 12 seconds 120 milliseconds',
+          seconds: 43932.12,
+          weeks: 0.0726390873015873,
+          years: 0.001393078386605784,
+        },
+      });
     });
   });
 });
diff --git a/src/tools/duration-calculator/duration-calculator.service.ts b/src/tools/duration-calculator/duration-calculator.service.ts
index dd47de17..254e3afb 100644
--- a/src/tools/duration-calculator/duration-calculator.service.ts
+++ b/src/tools/duration-calculator/duration-calculator.service.ts
@@ -23,7 +23,7 @@ interface DurationLine {
   rawLine: string
   cleanedDuration: string
   sign: number
-  durationMS: number | undefined
+  durationMS: number | null
   isValid: boolean
 }
 
@@ -33,14 +33,14 @@ export function computeDuration(s: string): {
 } {
   const lines: DurationLine[] = s.split('\n').filter(l => l && !/^\s*#/.test(l)).map((l) => {
     const isNeg = /^\s*-/.test(l);
-    const cleanedDuration = l.replace(/^\s*[+-]\s*/, '');
+    const cleanedDuration = l.replace(/^\s*[+-]\s*/, '').replace(/\s*#.*$/, ''); // NOSONAR
     const durationMS = convertDurationMS(cleanedDuration);
     return {
       rawLine: l,
       cleanedDuration,
       sign: isNeg ? -1 : 1,
       durationMS,
-      isValid: typeof durationMS !== 'undefined',
+      isValid: durationMS !== null,
     };
   });
 
@@ -60,8 +60,8 @@ export function computeDuration(s: string): {
   };
 }
 
-function convertDurationMS(s: string): number | undefined {
-  const hoursHandled = s.replace(/\b(?:(\d+)\.)?(\d+):(\d+)(?::(\d+)(?:\.(\d+))?)?\b/g,
+function convertDurationMS(s: string): number | null {
+  const hoursHandled = s.trim().replace(/^(?:(\d+)\.)?(\d+):(\d+)(?::(\d+)(?:\.(\d+))?)?$/g,
     (_, d, h, m, s, ms) => {
       const timeArr: string[] = [];
       const addPart = (part: string, unit: string) => {
@@ -76,26 +76,27 @@ function convertDurationMS(s: string): number | undefined {
       addPart(h, 'h');
       addPart(m, 'm');
       addPart(s, 's');
-      addPart(ms, 'ms');
+      addPart(ms?.padEnd(3, '0'), 'ms');
       return timeArr.join(' ');
     });
   if (!hoursHandled) {
     return 0;
   }
 
-  let parsedDuration = parse(hoursHandled);
-  if (parsedDuration !== 0 && !parsedDuration) {
-    try {
-      parsedDuration = iso8601Duration.toMilliseconds(iso8601Duration.parse(hoursHandled));
-    }
-    catch (_) {
-      return undefined;
-    }
+  try {
+    return iso8601Duration.toMilliseconds(iso8601Duration.parse(hoursHandled));
+  }
+  catch (_) {
+    const result = parse(hoursHandled);
+    if (typeof result === 'undefined') {
+      return null;
+    }
+    return result;
   }
-  return parsedDuration;
 }
-function prepareDurationResult(durationMS: any): ConvertedDuration {
+function prepareDurationResult(durationMS: number): ConvertedDuration {
   const dateFnsDuration = intervalToDuration({ start: 0, end: durationMS });
+  dateFnsDuration.seconds = (dateFnsDuration.seconds || 0) + (durationMS % 1000) / 1000;
   return {
     prettified: prettyMilliseconds(durationMS, { formatSubMilliseconds: true }),
     prettifiedVerbose: prettyMilliseconds(durationMS, { verbose: true, formatSubMilliseconds: true }),
diff --git a/src/ui/c-select/c-select.vue b/src/ui/c-select/c-select.vue
index 7b3607c9..38e2eb8f 100644
--- a/src/ui/c-select/c-select.vue
+++ b/src/ui/c-select/c-select.vue
@@ -151,7 +151,7 @@ function onSearchInput() {
       >
         <div flex-1 truncate>
           <slot name="displayed-value">
-            <input v-if="searchable && isOpen" ref="searchInputRef" v-model="searchQuery" type="text" placeholder="Search..." class="search-input" w-full lh-normal color-current @input="onSearchInput">
+            <input v-if="searchable && isOpen" ref="searchInputRef" v-model="searchQuery" type="text" placeholder="Search..." class="search-input" w-full color-current lh-normal @input="onSearchInput">
             <span v-else-if="selectedOption" lh-normal>
               {{ selectedOption.label }}
             </span>
diff --git a/src/ui/c-table/c-table.vue b/src/ui/c-table/c-table.vue
index ef569890..43293ab3 100644
--- a/src/ui/c-table/c-table.vue
+++ b/src/ui/c-table/c-table.vue
@@ -39,7 +39,7 @@ const headers = computed(() => {
 <template>
   <div class="relative overflow-x-auto rounded">
     <table class="w-full border-collapse text-left text-sm text-gray-500 dark:text-gray-400" role="table" :aria-label="description">
-      <thead v-if="!hideHeaders" class="bg-#ffffff uppercase text-gray-700 dark:bg-#333333 dark:text-gray-400" border-b="1px solid dark:transparent #efeff5">
+      <thead v-if="!hideHeaders" class="bg-#ffffff text-gray-700 uppercase dark:bg-#333333 dark:text-gray-400" border-b="1px solid dark:transparent #efeff5">
         <tr>
           <th v-for="header in headers" :key="header.key" scope="col" class="px-6 py-3 text-xs">
             {{ header.label }}