adalal/solidtime
1
0
Fork 0
mirror of https://github.com/solidtime-io/solidtime.git synced 2026-08-13 10:42:16 +01:00
Code Issues Packages Projects Releases Wiki Activity

Use locale-aware parseTimeInput for duration inputs

Browse Source
This commit is contained in:
Gregor Vostrak
2026-03-11 15:36:00 +01:00
parent a1d5563fc4
commit 97df779d1e
6 changed files with 567 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
resources/js/packages/ui/src/Input/DurationHumanInput.vue
View File

@@ -1,7 +1,10 @@
<script setup lang="ts">
import parse from 'parse-duration';
import { onMounted, ref, watch, inject } from 'vue';
import { formatHumanReadableDuration, getDayJsInstance } from '@/packages/ui/src/utils/time';
import {
formatHumanReadableDuration,
getDayJsInstance,
parseTimeInput,
} from '@/packages/ui/src/utils/time';
import dayjs from 'dayjs';
import { twMerge } from 'tailwind-merge';
import { TextInput } from '@/packages/ui/src';
@@ -20,51 +23,23 @@ const end = defineModel('end', {
const organization = inject<ComputedRef<Organization>>('organization');
function isHHMM(value: string): boolean {
return HHMMtimeRegex.test(value);
}
function parseHHMM(value: string): string[] | null {
return value.match(HHMMtimeRegex);
}
function updateDuration() {
const time = parse(temporaryCustomTimerEntry.value, 's');
if (isNumeric(temporaryCustomTimerEntry.value)) {
const newStartDate = getDayJsInstance()(end.value).subtract(
parseInt(temporaryCustomTimerEntry.value),
'm'
);
start.value = newStartDate.utc().format();
} else if (isHHMM(temporaryCustomTimerEntry.value)) {
const results = parseHHMM(temporaryCustomTimerEntry.value);
if (results) {
const newStartDate = getDayJsInstance()(end.value)
.subtract(parseInt(results[1]!), 'h')
.subtract(parseInt(results[2]!), 'm');
start.value = newStartDate.utc().format();
}
}
// try to parse natural language like "1h 30m"
else if (time && time > 1) {
const newStartDate = getDayJsInstance()(end.value).subtract(time, 's');
const seconds = parseTimeInput(
temporaryCustomTimerEntry.value,
organization?.value?.number_format,
organization?.value?.interval_format === 'decimal' ? 'hours' : 'minutes'
);
if (seconds && seconds > 0) {
const newStartDate = getDayJsInstance()(end.value).subtract(seconds, 's');
start.value = newStartDate.utc().format();
}
// fallback to minutes if just a number is given
updateTimeEntryInputValue();
}
function isNumeric(value: string) {
return /^-?\d+$/.test(value);
}
const props = defineProps<{
class?: string;
}>();
const HHMMtimeRegex = /^([0-9]{1,2}):([0-5]?[0-9])$/;
watch([start, end], updateTimeEntryInputValue);
onMounted(() => updateTimeEntryInputValue());

7
resources/js/packages/ui/src/Input/EstimatedTimeInput.vue
View File

@@ -26,8 +26,11 @@ function updateDuration() {
return;
}
// Use parseTimeInput with 'hours' as default unit for estimated time
const seconds = parseTimeInput(input, 'hours');
const seconds = parseTimeInput(
input,
organization?.value?.number_format,
'hours'
);
if (seconds !== null && seconds > 0) {
model.value = seconds;
}

8
resources/js/packages/ui/src/TimeEntry/TimeEntryRowDurationInput.vue
View File

@@ -27,9 +27,11 @@ const temporaryCustomTimerEntry = ref<string>('');
const open = ref(false);
function updateTimerAndStartLiveTimerUpdate() {
const defaultUnit =
organizationSettings?.value?.intervalFormat === 'decimal' ? 'hours' : 'minutes';
const seconds = parseTimeInput(temporaryCustomTimerEntry.value, defaultUnit);
const seconds = parseTimeInput(
temporaryCustomTimerEntry.value,
organizationSettings.value.numberFormat,
organizationSettings.value.intervalFormat === 'decimal' ? 'hours' : 'minutes'
);
if (seconds && seconds > 0) {
let newEndDate = props.end;
let newStartDate = props.start;

2
resources/js/packages/ui/src/TimeTracker/TimeTrackerRangeSelector.vue
View File

@@ -56,7 +56,7 @@ const currentTime = computed({
});
function updateTimerAndStartLiveTimerUpdate() {
const seconds = parseTimeInput(temporaryCustomTimerEntry.value, 'minutes');
const seconds = parseTimeInput(temporaryCustomTimerEntry.value);
if (seconds && seconds > 0) {
const newStartDate = dayjs().subtract(seconds, 's');

37
resources/js/packages/ui/src/utils/time.ts
View File

@@ -39,7 +39,31 @@ export type IntervalFormat =
| 'hours-minutes'
| 'hours-minutes-colon-separated'
| 'hours-minutes-seconds-colon-separated';
export type TimeInputUnit = 'minutes' | 'hours';
function configureParseLocale(numberFormat?: string) {
switch (numberFormat) {
case 'point-comma':
parse.unit.group = '.';
parse.unit.decimal = ',';
break;
case 'space-comma':
parse.unit.group = ' ';
parse.unit.decimal = ',';
break;
case 'space-point':
parse.unit.group = ' ';
parse.unit.decimal = '.';
break;
case 'apostrophe-point':
parse.unit.group = "'";
parse.unit.decimal = '.';
break;
default:
// 'comma-point' or unset — default English
parse.unit.group = ',';
parse.unit.decimal = '.';
break;
}
}
dayjs.extend(relativeTime);
dayjs.extend(isToday);
@@ -210,8 +234,11 @@ export function formatStartEnd(
export function parseTimeInput(
input: string,
defaultUnit: TimeInputUnit = 'minutes'
numberFormat?: string,
defaultUnit: 'minutes' | 'hours' = 'minutes'
): number | null {
configureParseLocale(numberFormat);
// Check if input is a decimal number (hours)
const decimalRegex = /^-?\d+[.,]\d+$/;
if (decimalRegex.test(input)) {
@@ -219,10 +246,10 @@ export function parseTimeInput(
return Math.round(hours * 3600);
}
// Check if input is just a number (minutes or hours based on defaultUnit)
// Check if input is just a number
if (/^-?\d+$/.test(input)) {
const value = parseInt(input);
return defaultUnit === 'minutes' ? value * 60 : value * 3600;
return defaultUnit === 'hours' ? value * 3600 : value * 60;
}
// Check if input is in HH:MM:SS format
@@ -248,7 +275,7 @@ export function parseTimeInput(
}
}
// Try to parse natural language like "1h 30m"
// Try to parse natural language like "1h 30m" or locale-formatted like "1,00 h"
const parsedDuration = parse(input, 's');
if (parsedDuration && parsedDuration > 0) {
return parsedDuration;