e48adbcb00
- Migrated from Python pre-commit to NodeJS-native solution - Reorganized documentation structure - Set up Husky + lint-staged for efficient pre-commit hooks - Fixed Dockerfile healthcheck issue - Added comprehensive documentation index
39 lines
1.3 KiB
TypeScript
39 lines
1.3 KiB
TypeScript
import React from 'react';
|
|
import { ReminderInstance } from '../../types';
|
|
import { ClockIcon, getReminderIcon } from '../icons/Icons';
|
|
|
|
interface ReminderCardProps {
|
|
reminder: ReminderInstance;
|
|
}
|
|
|
|
const ReminderCard: React.FC<ReminderCardProps> = ({ reminder }) => {
|
|
const timeString = reminder.scheduledTime.toLocaleTimeString([], {
|
|
hour: '2-digit',
|
|
minute: '2-digit',
|
|
});
|
|
const ReminderIcon = getReminderIcon(reminder.icon);
|
|
|
|
return (
|
|
<li className='shadow-md rounded-lg p-4 flex flex-col justify-between transition-all duration-300 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700'>
|
|
<div>
|
|
<div className='flex justify-between items-start'>
|
|
<div className='flex items-center space-x-3'>
|
|
<ReminderIcon className='w-7 h-7 text-sky-500 dark:text-sky-400 flex-shrink-0' />
|
|
<div>
|
|
<h4 className='font-bold text-lg text-slate-800 dark:text-slate-100'>
|
|
{reminder.title}
|
|
</h4>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div className='flex items-center space-x-2 mt-4 font-semibold text-lg text-slate-500 dark:text-slate-400'>
|
|
<ClockIcon className='w-5 h-5' />
|
|
<span>{timeString}</span>
|
|
</div>
|
|
</div>
|
|
</li>
|
|
);
|
|
};
|
|
|
|
export default ReminderCard;
|