allow Text props in Time component

This commit is contained in:
Ajay Bura 2024-03-23 20:55:03 +05:30
parent 0846fc80ee
commit 2c6b4b4c52

View file

@ -1,4 +1,4 @@
import React from 'react'; import React, { ComponentProps } from 'react';
import { Text, as } from 'folds'; import { Text, as } from 'folds';
import { timeDayMonYear, timeHourMinute, today, yesterday } from '../../utils/time'; import { timeDayMonYear, timeHourMinute, today, yesterday } from '../../utils/time';
@ -7,21 +7,23 @@ export type TimeProps = {
ts: number; ts: number;
}; };
export const Time = as<'span', TimeProps>(({ compact, ts, ...props }, ref) => { export const Time = as<'span', TimeProps & ComponentProps<typeof Text>>(
let time = ''; ({ compact, ts, ...props }, ref) => {
if (compact) { let time = '';
time = timeHourMinute(ts); if (compact) {
} else if (today(ts)) { time = timeHourMinute(ts);
time = timeHourMinute(ts); } else if (today(ts)) {
} else if (yesterday(ts)) { time = timeHourMinute(ts);
time = `Yesterday ${timeHourMinute(ts)}`; } else if (yesterday(ts)) {
} else { time = `Yesterday ${timeHourMinute(ts)}`;
time = `${timeDayMonYear(ts)} ${timeHourMinute(ts)}`; } else {
} time = `${timeDayMonYear(ts)} ${timeHourMinute(ts)}`;
}
return ( return (
<Text as="time" style={{ flexShrink: 0 }} size="T200" priority="300" {...props} ref={ref}> <Text as="time" style={{ flexShrink: 0 }} size="T200" priority="300" {...props} ref={ref}>
{time} {time}
</Text> </Text>
); );
}); }
);