From 0a4186e4a5a66ec9ed80a8aa6cacc1cbc4e6c563 Mon Sep 17 00:00:00 2001 From: "Ibrahima G. Coulibaly" Date: Mon, 17 Mar 2025 17:50:26 +0000 Subject: [PATCH 1/5] chore: convert-days-to-hours init --- .../convert-days-to-hours.service.test.ts | 6 ++++++ src/pages/tools/date/convert-days-to-hours/index.tsx | 12 ++++++++++++ src/pages/tools/date/convert-days-to-hours/meta.ts | 12 ++++++++++++ .../tools/date/convert-days-to-hours/service.ts | 0 src/pages/tools/date/index.ts | 2 ++ src/tools/defineTool.tsx | 3 ++- 6 files changed, 34 insertions(+), 1 deletion(-) create mode 100644 src/pages/tools/date/convert-days-to-hours/convert-days-to-hours.service.test.ts create mode 100644 src/pages/tools/date/convert-days-to-hours/index.tsx create mode 100644 src/pages/tools/date/convert-days-to-hours/meta.ts create mode 100644 src/pages/tools/date/convert-days-to-hours/service.ts create mode 100644 src/pages/tools/date/index.ts diff --git a/src/pages/tools/date/convert-days-to-hours/convert-days-to-hours.service.test.ts b/src/pages/tools/date/convert-days-to-hours/convert-days-to-hours.service.test.ts new file mode 100644 index 0000000..3589ed4 --- /dev/null +++ b/src/pages/tools/date/convert-days-to-hours/convert-days-to-hours.service.test.ts @@ -0,0 +1,6 @@ +import { expect, describe, it } from 'vitest'; +// import { } from './service'; +// +// describe('convert-days-to-hours', () => { +// +// }) \ No newline at end of file diff --git a/src/pages/tools/date/convert-days-to-hours/index.tsx b/src/pages/tools/date/convert-days-to-hours/index.tsx new file mode 100644 index 0000000..976b069 --- /dev/null +++ b/src/pages/tools/date/convert-days-to-hours/index.tsx @@ -0,0 +1,12 @@ +import { Box } from '@mui/material'; +import React from 'react'; +import * as Yup from 'yup'; + +type InitialValuesType = {}; +const initialValues: InitialValuesType = {}; +const validationSchema = Yup.object({ + // splitSeparator: Yup.string().required('The separator is required') +}); +export default function ConvertDaysToHours() { + return Lorem ipsum; +} \ No newline at end of file diff --git a/src/pages/tools/date/convert-days-to-hours/meta.ts b/src/pages/tools/date/convert-days-to-hours/meta.ts new file mode 100644 index 0000000..6fc5f7b --- /dev/null +++ b/src/pages/tools/date/convert-days-to-hours/meta.ts @@ -0,0 +1,12 @@ +import { defineTool } from '@tools/defineTool'; +import { lazy } from 'react'; + +export const tool = defineTool('date', { + name: 'Convert days to hours', + path: 'convert-days-to-hours', + icon: '', + description: '', + shortDescription: '', + keywords: ['convert', 'days', 'to', 'hours'], + component: lazy(() => import('./index')) +}); \ No newline at end of file diff --git a/src/pages/tools/date/convert-days-to-hours/service.ts b/src/pages/tools/date/convert-days-to-hours/service.ts new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/tools/date/index.ts b/src/pages/tools/date/index.ts new file mode 100644 index 0000000..25fd82b --- /dev/null +++ b/src/pages/tools/date/index.ts @@ -0,0 +1,2 @@ +import { tool as dateConvertDaysToHours } from './convert-days-to-hours/meta'; +export const dateTools = []; diff --git a/src/tools/defineTool.tsx b/src/tools/defineTool.tsx index 0e4dcbd..f5f30ae 100644 --- a/src/tools/defineTool.tsx +++ b/src/tools/defineTool.tsx @@ -18,7 +18,8 @@ export type ToolCategory = | 'number' | 'gif' | 'list' - | 'json'; + | 'json' + | 'date'; export interface DefinedTool { type: ToolCategory; From 3c51268397a6379df7827ec34a043a0297d58a58 Mon Sep 17 00:00:00 2001 From: Chesterkxng Date: Mon, 24 Mar 2025 20:23:28 +0000 Subject: [PATCH 2/5] feat: convert-days-to-hours (time tools) --- .gitignore | 1 + .../convert-days-to-hours.service.test.ts | 15 +++ .../time/convert-days-to-hours/index.tsx | 104 ++++++++++++++++++ .../tools/time/convert-days-to-hours/meta.ts | 14 +++ .../time/convert-days-to-hours/service.ts | 25 +++++ src/pages/tools/time/index.ts | 3 + src/tools/defineTool.tsx | 3 +- src/tools/index.ts | 10 +- src/utils/string.ts | 11 +- 9 files changed, 183 insertions(+), 3 deletions(-) create mode 100644 src/pages/tools/time/convert-days-to-hours/convert-days-to-hours.service.test.ts create mode 100644 src/pages/tools/time/convert-days-to-hours/index.tsx create mode 100644 src/pages/tools/time/convert-days-to-hours/meta.ts create mode 100644 src/pages/tools/time/convert-days-to-hours/service.ts create mode 100644 src/pages/tools/time/index.ts diff --git a/.gitignore b/.gitignore index e4b8e25..f691227 100644 --- a/.gitignore +++ b/.gitignore @@ -41,3 +41,4 @@ yarn-error.log* dist.zip .aider* +.qodo diff --git a/src/pages/tools/time/convert-days-to-hours/convert-days-to-hours.service.test.ts b/src/pages/tools/time/convert-days-to-hours/convert-days-to-hours.service.test.ts new file mode 100644 index 0000000..17687e3 --- /dev/null +++ b/src/pages/tools/time/convert-days-to-hours/convert-days-to-hours.service.test.ts @@ -0,0 +1,15 @@ +import { expect, describe, it } from 'vitest'; +import { convertDaysToHours } from './service'; + +describe('Convert Days to Hours', () => { + it('should convert days to hours correctly', () => { + expect(convertDaysToHours('2', false)).toBe('48'); + expect(convertDaysToHours('0', false)).toBe('0'); + }); + + it('should handle invalid input', () => { + expect(() => { + convertDaysToHours('abc', false); + }).toThrow('The day on line 1 contains non-digits, so we skip it.'); + }); +}); diff --git a/src/pages/tools/time/convert-days-to-hours/index.tsx b/src/pages/tools/time/convert-days-to-hours/index.tsx new file mode 100644 index 0000000..0757444 --- /dev/null +++ b/src/pages/tools/time/convert-days-to-hours/index.tsx @@ -0,0 +1,104 @@ +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 CheckboxWithDesc from '@components/options/CheckboxWithDesc'; +import { convertDaysToHours } from './service'; + +const initialValues = { + hoursFlag: false +}; +type InitialValuesType = typeof initialValues; +const exampleCards: CardExampleType[] = [ + { + title: 'Full Days to Hours', + description: + 'This example calculates how many hours there are in 1 day, in one week (7 days), in one month (30 days), and in even longer time periods. To see all the results at once, we enter each individual day value on a new line. We also use the "days" suffix in the input and add the "hours" suffix to the output.', + sampleText: `1 day +7 days +30 days +90 days +125 days +500 days`, + sampleResult: `24 hours +168 hours +720 hours +2160 hours +3000 hours +12000 hours`, + sampleOptions: { hoursFlag: true } + }, + { + title: 'Fractional Days to Hours', + description: + 'In this example, we convert five decimal fraction day values to hours. Conversion of partial days is similar to the conversion of full days – they are all multiplied by 24. We turn off the option that appends the "hours" string after the converted values and get only the numerical hour values in the output.', + sampleText: `0.2 d +1.5 days +25.25 +9.999 +350.401`, + sampleResult: `4.8 +36 +606 +239.976 +8409.624`, + sampleOptions: { hoursFlag: false } + }, + { + title: 'Number of Hours in a Year', + description: + 'In the modern Gregorian calendar, a common year has 365 days and a leap year has 366 days. This makes the true average length of a year to be 365.242199 days. In this example, we load this number in the input field and convert it to the hours. It turns out that there 8765.812776 hours in an average year.', + sampleText: `365.242199 days`, + sampleResult: `8765.812776 hours`, + sampleOptions: { hoursFlag: true } + } +]; + +export default function ConvertDaysToHours({ + title, + longDescription +}: ToolComponentProps) { + const [input, setInput] = useState(''); + const [result, setResult] = useState(''); + + const compute = (optionsValues: typeof initialValues, input: string) => { + setResult(convertDaysToHours(input, optionsValues.hoursFlag)); + }; + + const getGroups: GetGroupsType | null = ({ + values, + updateField + }) => [ + { + title: 'Hours Name', + component: ( + + updateField('hoursFlag', val)} + checked={values.hoursFlag} + title={'Add Hours Name'} + description={'Append the string hours to output values'} + /> + + ) + } + ]; + + return ( + } + resultComponent={} + initialValues={initialValues} + exampleCards={exampleCards} + getGroups={getGroups} + compute={compute} + toolInfo={{ title: `What is a ${title}?`, description: longDescription }} + /> + ); +} diff --git a/src/pages/tools/time/convert-days-to-hours/meta.ts b/src/pages/tools/time/convert-days-to-hours/meta.ts new file mode 100644 index 0000000..81457fa --- /dev/null +++ b/src/pages/tools/time/convert-days-to-hours/meta.ts @@ -0,0 +1,14 @@ +import { defineTool } from '@tools/defineTool'; +import { lazy } from 'react'; + +export const tool = defineTool('time', { + path: 'convert-days-to-hours', + name: 'Convert Days to Hours', + icon: 'ri:24-hours-line', + description: 'A tool to convert days into hours.', + shortDescription: 'Convert days to hours easily.', + keywords: ['convert', 'days', 'hours'], + longDescription: + 'This is a quick online utility for converting days to hours. One day is 24 hours and to convert days to hours, we simply do the multiplication operation: hours = days × 24. For example, 2 days is 2 × 24 = 48 hours and 5 days is 5 × 24 = 120 hours. You can convert not only full days to hours but also fractional day values. For example, 1.5 days is 1.5 × 24 = 36 hours and 4.6 days is 4.6 × 24 = 110.4 hours. You can enter multiple days in the input field (one value per line). In this case, they will all be computed in parallel and at once. The program also supports the postfix "days" or "d" for the input values and you can add the postfix "hours" to the output values. Timeabulous!', + component: lazy(() => import('./index')) +}); diff --git a/src/pages/tools/time/convert-days-to-hours/service.ts b/src/pages/tools/time/convert-days-to-hours/service.ts new file mode 100644 index 0000000..430c0a8 --- /dev/null +++ b/src/pages/tools/time/convert-days-to-hours/service.ts @@ -0,0 +1,25 @@ +import { containsOnlyDigits } from '@utils/string'; + +function compute(input: string) { + if (!containsOnlyDigits(input)) { + return ''; + } + const days = parseFloat(input); + const hours = days * 24; + return hours; +} + +export function convertDaysToHours(input: string, hoursFlag: boolean): string { + const result: string[] = []; + + const lines = input.split('\n'); + + lines.forEach((line) => { + const parts = line.split(' '); + const days = parts[0]; // Extract the number before the space + const hours = compute(days); + result.push(hoursFlag ? `${hours} hours` : `${hours}`); + }); + + return result.join('\n'); +} diff --git a/src/pages/tools/time/index.ts b/src/pages/tools/time/index.ts new file mode 100644 index 0000000..5e43459 --- /dev/null +++ b/src/pages/tools/time/index.ts @@ -0,0 +1,3 @@ +import { tool as daysDoHours } from './convert-days-to-hours/meta'; + +export const timeTools = [daysDoHours]; diff --git a/src/tools/defineTool.tsx b/src/tools/defineTool.tsx index d86387e..0ba3a66 100644 --- a/src/tools/defineTool.tsx +++ b/src/tools/defineTool.tsx @@ -21,7 +21,8 @@ export type ToolCategory = | 'video' | 'list' | 'json' - | 'csv'; + | 'csv' + | 'time'; export interface DefinedTool { type: ToolCategory; diff --git a/src/tools/index.ts b/src/tools/index.ts index 15d7b66..e3156c9 100644 --- a/src/tools/index.ts +++ b/src/tools/index.ts @@ -8,6 +8,7 @@ import { listTools } from '../pages/tools/list'; import { Entries } from 'type-fest'; import { jsonTools } from '../pages/tools/json'; import { csvTools } from '../pages/tools/csv'; +import { timeTools } from '../pages/tools/time'; import { IconifyIcon } from '@iconify/react'; export const tools: DefinedTool[] = [ @@ -17,7 +18,8 @@ export const tools: DefinedTool[] = [ ...listTools, ...csvTools, ...videoTools, - ...numberTools + ...numberTools, + ...timeTools ]; const categoriesConfig: { type: ToolCategory; @@ -73,6 +75,12 @@ const categoriesConfig: { icon: 'lets-icons:video-light', value: 'Tools for working with videos – extract frames from videos, create GIFs from videos, convert videos to different formats, and much more.' + }, + { + type: 'time', + icon: 'fluent-mdl2:date-time', + value: + 'Tools for working with time and date – draw clocks and calendars, generate time and date sequences, calculate average time, convert between time zones, and much more.' } ]; export const filterTools = ( diff --git a/src/utils/string.ts b/src/utils/string.ts index a6ff6d7..f3aed52 100644 --- a/src/utils/string.ts +++ b/src/utils/string.ts @@ -5,7 +5,7 @@ export function capitalizeFirstLetter(string: string | undefined) { return string.charAt(0).toUpperCase() + string.slice(1); } -export function isNumber(number: any) { +export function isNumber(number: any): boolean { return !isNaN(parseFloat(number)) && isFinite(number); } @@ -37,3 +37,12 @@ export const replaceSpecialCharacters = (str: string) => { export function reverseString(input: string): string { return input.split('').reverse().join(''); } + +/** + * Checks if the input string contains only digits. + * @param input - The string to validate. + * @returns True if the input contains only digits, false otherwise. + */ +export function containsOnlyDigits(input: string): boolean { + return /^\d+$/.test(input.trim()); +} From 82b238ffe07cd935f9915780e9241251cfeab5b0 Mon Sep 17 00:00:00 2001 From: Chesterkxng Date: Mon, 24 Mar 2025 20:43:08 +0000 Subject: [PATCH 3/5] feat: convert-days-to-hours (time tools) --- src/pages/tools/time/convert-days-to-hours/index.tsx | 3 ++- src/pages/tools/time/convert-days-to-hours/meta.ts | 3 ++- src/pages/tools/time/convert-days-to-hours/service.ts | 4 ++-- src/utils/string.ts | 2 +- 4 files changed, 7 insertions(+), 5 deletions(-) diff --git a/src/pages/tools/time/convert-days-to-hours/index.tsx b/src/pages/tools/time/convert-days-to-hours/index.tsx index 0757444..96f200e 100644 --- a/src/pages/tools/time/convert-days-to-hours/index.tsx +++ b/src/pages/tools/time/convert-days-to-hours/index.tsx @@ -95,10 +95,11 @@ export default function ConvertDaysToHours({ inputComponent={} resultComponent={} initialValues={initialValues} - exampleCards={exampleCards} getGroups={getGroups} + setInput={setInput} compute={compute} toolInfo={{ title: `What is a ${title}?`, description: longDescription }} + exampleCards={exampleCards} /> ); } diff --git a/src/pages/tools/time/convert-days-to-hours/meta.ts b/src/pages/tools/time/convert-days-to-hours/meta.ts index 81457fa..9971f6c 100644 --- a/src/pages/tools/time/convert-days-to-hours/meta.ts +++ b/src/pages/tools/time/convert-days-to-hours/meta.ts @@ -5,7 +5,8 @@ export const tool = defineTool('time', { path: 'convert-days-to-hours', name: 'Convert Days to Hours', icon: 'ri:24-hours-line', - description: 'A tool to convert days into hours.', + description: + 'With this browser-based application, you can calculate how many hours there are in the given number of days. The application takes the input values (days), multiplies them by 24 and that converts them into hours. It supports both integer and decimal day values and it can convert multiple values at the same time.', shortDescription: 'Convert days to hours easily.', keywords: ['convert', 'days', 'hours'], longDescription: diff --git a/src/pages/tools/time/convert-days-to-hours/service.ts b/src/pages/tools/time/convert-days-to-hours/service.ts index 430c0a8..d24beaa 100644 --- a/src/pages/tools/time/convert-days-to-hours/service.ts +++ b/src/pages/tools/time/convert-days-to-hours/service.ts @@ -5,8 +5,8 @@ function compute(input: string) { return ''; } const days = parseFloat(input); - const hours = days * 24; - return hours; + const hours = (days * 24).toFixed(6); + return parseFloat(hours); } export function convertDaysToHours(input: string, hoursFlag: boolean): string { diff --git a/src/utils/string.ts b/src/utils/string.ts index f3aed52..ae1b08d 100644 --- a/src/utils/string.ts +++ b/src/utils/string.ts @@ -44,5 +44,5 @@ export function reverseString(input: string): string { * @returns True if the input contains only digits, false otherwise. */ export function containsOnlyDigits(input: string): boolean { - return /^\d+$/.test(input.trim()); + return /^-?\d+(\.\d+)?$/.test(input.trim()); } From d1b53fa62eecd45662b824c653df3bac7393825c Mon Sep 17 00:00:00 2001 From: Chesterkxng Date: Mon, 24 Mar 2025 20:59:53 +0000 Subject: [PATCH 4/5] test: fixed --- .../convert-days-to-hours.service.test.ts | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/src/pages/tools/time/convert-days-to-hours/convert-days-to-hours.service.test.ts b/src/pages/tools/time/convert-days-to-hours/convert-days-to-hours.service.test.ts index 17687e3..681d554 100644 --- a/src/pages/tools/time/convert-days-to-hours/convert-days-to-hours.service.test.ts +++ b/src/pages/tools/time/convert-days-to-hours/convert-days-to-hours.service.test.ts @@ -8,8 +8,6 @@ describe('Convert Days to Hours', () => { }); it('should handle invalid input', () => { - expect(() => { - convertDaysToHours('abc', false); - }).toThrow('The day on line 1 contains non-digits, so we skip it.'); + expect(convertDaysToHours('2\nc\n1', false)).toBe('48\n\n24'); }); }); From 76ca4254ca849b1fe6d3fc5305212ceb30460085 Mon Sep 17 00:00:00 2001 From: Chesterkxng Date: Mon, 24 Mar 2025 21:09:51 +0000 Subject: [PATCH 5/5] deleting date dir --- .../convert-days-to-hours.service.test.ts | 6 ------ src/pages/tools/date/convert-days-to-hours/index.tsx | 12 ------------ src/pages/tools/date/convert-days-to-hours/meta.ts | 12 ------------ .../tools/date/convert-days-to-hours/service.ts | 0 src/pages/tools/date/index.ts | 2 -- 5 files changed, 32 deletions(-) delete mode 100644 src/pages/tools/date/convert-days-to-hours/convert-days-to-hours.service.test.ts delete mode 100644 src/pages/tools/date/convert-days-to-hours/index.tsx delete mode 100644 src/pages/tools/date/convert-days-to-hours/meta.ts delete mode 100644 src/pages/tools/date/convert-days-to-hours/service.ts delete mode 100644 src/pages/tools/date/index.ts diff --git a/src/pages/tools/date/convert-days-to-hours/convert-days-to-hours.service.test.ts b/src/pages/tools/date/convert-days-to-hours/convert-days-to-hours.service.test.ts deleted file mode 100644 index ba8f33d..0000000 --- a/src/pages/tools/date/convert-days-to-hours/convert-days-to-hours.service.test.ts +++ /dev/null @@ -1,6 +0,0 @@ -import { expect, describe, it } from 'vitest'; -// import { } from './service'; -// -// describe('convert-days-to-hours', () => { -// -// }) diff --git a/src/pages/tools/date/convert-days-to-hours/index.tsx b/src/pages/tools/date/convert-days-to-hours/index.tsx deleted file mode 100644 index 77f954d..0000000 --- a/src/pages/tools/date/convert-days-to-hours/index.tsx +++ /dev/null @@ -1,12 +0,0 @@ -import { Box } from '@mui/material'; -import React from 'react'; -import * as Yup from 'yup'; - -type InitialValuesType = {}; -const initialValues: InitialValuesType = {}; -const validationSchema = Yup.object({ - // splitSeparator: Yup.string().required('The separator is required') -}); -export default function ConvertDaysToHours() { - return Lorem ipsum; -} diff --git a/src/pages/tools/date/convert-days-to-hours/meta.ts b/src/pages/tools/date/convert-days-to-hours/meta.ts deleted file mode 100644 index a0205cd..0000000 --- a/src/pages/tools/date/convert-days-to-hours/meta.ts +++ /dev/null @@ -1,12 +0,0 @@ -import { defineTool } from '@tools/defineTool'; -import { lazy } from 'react'; - -export const tool = defineTool('date', { - name: 'Convert days to hours', - path: 'convert-days-to-hours', - icon: '', - description: '', - shortDescription: '', - keywords: ['convert', 'days', 'to', 'hours'], - component: lazy(() => import('./index')) -}); diff --git a/src/pages/tools/date/convert-days-to-hours/service.ts b/src/pages/tools/date/convert-days-to-hours/service.ts deleted file mode 100644 index e69de29..0000000 diff --git a/src/pages/tools/date/index.ts b/src/pages/tools/date/index.ts deleted file mode 100644 index 25fd82b..0000000 --- a/src/pages/tools/date/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -import { tool as dateConvertDaysToHours } from './convert-days-to-hours/meta'; -export const dateTools = [];