Add tool to convert human time to decimal time

public/locales/en/time.json

@@ -113,5 +113,11 @@
     "zeroPaddingDescription": "Make all time components always be two digits wide.",
     "zeroPrintDescription": "Display the dropped parts as zero values \"00\".",
     "zeroPrintTruncatedParts": "Zero-print Truncated Parts"
+  },
+  "convertTimeToDecimal": {
+    "title": "Convert time to decimal",
+    "description": "Convert formatted length of time (HH:MM:SS) to decimal format, e.g. 3.43 hours.",
+    "shortDescription": "Convert human time to decimal time",
+    "longDescription": "Convert formatted length of time (HH:MM:SS) to decimal format, e.g. 3.43 hours."
   }
 }

src/pages/tools/time/convert-time-to-decimal/convert-time-to-decimal.service.test.ts

@@ -0,0 +1,40 @@
+import { expect, describe, it } from 'vitest';
+import { convertTimeToDecimal } from './service';
+
+describe('convert-time-to-decimal', () => {
+  it('should convert time to decimal with default decimal places', () => {
+    const input = '31:23:59';
+    const result = convertTimeToDecimal(input, { decimalPlaces: '6' });
+    expect(result).toBe('31.399722');
+  });
+
+  it('should convert time to decimal with specified decimal places', () => {
+    const input = '31:23:59';
+    const result = convertTimeToDecimal(input, { decimalPlaces: '10' });
+    expect(result).toBe('31.3997222222');
+  });
+
+  it('should convert time to decimal with supplied format of HH:MM:SS', () => {
+    const input = '13:25:30';
+    const result = convertTimeToDecimal(input, { decimalPlaces: '6' });
+    expect(result).toBe('13.425000');
+  });
+
+  it('should convert time to decimal with supplied format of HH:MM', () => {
+    const input = '13:25';
+    const result = convertTimeToDecimal(input, { decimalPlaces: '6' });
+    expect(result).toBe('13.416667');
+  });
+
+  it('should convert time to decimal with supplied format of HH:MM:', () => {
+    const input = '13:25';
+    const result = convertTimeToDecimal(input, { decimalPlaces: '6' });
+    expect(result).toBe('13.416667');
+  });
+
+  it('should convert time to decimal with supplied format of HH.MM.SS', () => {
+    const input = '13.25.30';
+    const result = convertTimeToDecimal(input, { decimalPlaces: '6' });
+    expect(result).toBe('13.425000');
+  });
+});

src/pages/tools/time/convert-time-to-decimal/index.tsx

@@ -0,0 +1,72 @@
+import { Box } from '@mui/material';
+import React, { useState } from 'react';
+import ToolContent from '@components/ToolContent';
+import { ToolComponentProps } from '@tools/defineTool';
+import ToolTextInput from '@components/input/ToolTextInput';
+import ToolTextResult from '@components/result/ToolTextResult';
+import { GetGroupsType } from '@components/options/ToolOptions';
+import { CardExampleType } from '@components/examples/ToolExamples';
+import { convertTimeToDecimal } from './service';
+import { InitialValuesType } from './types';
+import TextFieldWithDesc from '@components/options/TextFieldWithDesc';
+
+const initialValues: InitialValuesType = {
+  decimalPlaces: '6'
+};
+
+const exampleCards: CardExampleType<InitialValuesType>[] = [
+  {
+    title: 'Convert time to decimal',
+    description:
+      'This example shows how to convert a formatted time (HH:MM:SS) to a decimal version.',
+    sampleText: '31:23:59',
+    sampleResult: `31.399722`,
+    sampleOptions: {
+      decimalPlaces: '6'
+    }
+  }
+];
+export default function ConvertTimeToDecimal({
+  title,
+  longDescription
+}: ToolComponentProps) {
+  const [input, setInput] = useState<string>('');
+  const [result, setResult] = useState<string>('');
+
+  const compute = (values: InitialValuesType, input: string) => {
+    setResult(convertTimeToDecimal(input, values));
+  };
+
+  const getGroups: GetGroupsType<InitialValuesType> | null = ({
+    values,
+    updateField
+  }) => [
+    {
+      title: 'Decimal places',
+      component: (
+        <Box>
+          <TextFieldWithDesc
+            description={'How many decimal places should the result contain?'}
+            value={values.decimalPlaces}
+            onOwnChange={(val) => updateField('decimalPlaces', val)}
+            type={'text'}
+          />
+        </Box>
+      )
+    }
+  ];
+  return (
+    <ToolContent
+      title={title}
+      input={input}
+      inputComponent={<ToolTextInput value={input} onChange={setInput} />}
+      resultComponent={<ToolTextResult value={result} />}
+      initialValues={initialValues}
+      exampleCards={exampleCards}
+      getGroups={getGroups}
+      setInput={setInput}
+      compute={compute}
+      toolInfo={{ title: `What is a ${title}?`, description: longDescription }}
+    />
+  );
+}

src/pages/tools/time/convert-time-to-decimal/meta.ts

@@ -0,0 +1,15 @@
+import { defineTool } from '@tools/defineTool';
+import { lazy } from 'react';
+
+export const tool = defineTool('time', {
+  i18n: {
+    name: 'time:convertTimeToDecimal.title',
+    description: 'time:convertTimeToDecimal.description',
+    shortDescription: 'time:convertTimeToDecimal.shortDescription',
+    longDescription: 'time:convertTimeToDecimal.longDescription'
+  },
+  path: 'convert-time-to-decimal',
+  icon: 'material-symbols:schedule',
+  keywords: ['convert', 'time', 'to', 'decimal'],
+  component: lazy(() => import('./index'))
+});

src/pages/tools/time/convert-time-to-decimal/service.ts

@@ -0,0 +1,24 @@
+import { InitialValuesType } from './types';
+
+export function convertTimeToDecimal(
+  input: string,
+  options: InitialValuesType
+): string {
+  if (!input || (!input.includes(':') && !input.includes('.'))) {
+    return '';
+  }
+
+  let splitTime = input.split(/[.:]/);
+
+  let hours = parseInt(splitTime[0]);
+  let minutes = parseInt(splitTime[1]);
+  let seconds = splitTime[2] ? parseInt(splitTime[2]) : 0;
+
+  let decimalTime = hours + minutes / 60;
+
+  if (seconds !== 0) {
+    decimalTime += seconds / 3600;
+  }
+
+  return decimalTime.toFixed(parseInt(options.decimalPlaces)).toString();
+}

src/pages/tools/time/convert-time-to-decimal/types.ts

@@ -0,0 +1,3 @@
+export type InitialValuesType = {
+  decimalPlaces: string;
+};

src/pages/tools/time/index.ts

@@ -1,3 +1,4 @@
+import { tool as timeConvertTimeToDecimal } from './convert-time-to-decimal/meta';
 import { tool as timeConvertUnixToDate } from './convert-unix-to-date/meta';
 import { tool as timeCrontabGuru } from './crontab-guru/meta';
 import { tool as timeBetweenDates } from './time-between-dates/meta';
@@ -17,5 +18,6 @@ export const timeTools = [
   timeBetweenDates,
   timeCrontabGuru,
   checkLeapYear,
-  timeConvertUnixToDate
+  timeConvertUnixToDate,
+  timeConvertTimeToDecimal
 ];