import React, { useState, useEffect } from 'react'; import { useTranslation } from 'react-i18next'; import { HeartIcon, InformationCircleIcon } from '@heroicons/react/24/outline'; const About: React.FC = () => { const { t } = useTranslation(); const [version, setVersion] = useState('0.3'); useEffect(() => { // Fetch version from the deployed app fetch('/api/version') .then((response) => response.json()) .then((data) => { if (data.version) { setVersion(data.version); } }) .catch((error) => { console.error('Error fetching version:', error); // Keep default version if fetch fails }); }, []); return (

{t('about.title', 'About')}

{/* Logo and Version */}

tududi

{t('about.version', 'Version')} {version}

{/* Description */}

{t( 'about.description', 'Self-hosted task management with hierarchical organization, multi-language support, and Telegram integration. Built with love for productivity enthusiasts.' )}

{/* Appreciation */}
{t('about.madeWithLove', 'Made with love')}

{t( 'about.appreciation', 'Thank you for using tududi! Your support helps keep this project alive and growing. If you find it useful, consider supporting the development.' )}

{/* Support Links */}

{t( 'about.supportDevelopment', 'Support Development' )}

{/* Community Links */}

{t('about.community', 'Community')}

{/* Links */}
{t('about.viewOnGitHub', 'View on GitHub')} {t( 'about.license', 'Licensed for personal use' )}
{/* Footer */}

{t('about.builtBy', 'Built by')}{' '} Chris Veleris

); }; export default About;