feat: Use Translation component in Home view

src/app/home/Home.tsx

@@ -2,15 +2,15 @@ import { Fragment } from 'react';
 
 import { useLocale } from 'hooks/useLocale/useLocale';
 import { AppLocale } from 'context/locale/AppLocale.enum';
-import { AppMessages } from 'i18n/messages';
+import { Translation } from 'ui/translation/Translation';
 import { LocationInfo } from 'ui/locationInfo/LocationInfo';
 import { useAuth } from 'hooks/useAuth/useAuth';
 import { useUsers } from '../../hooks/useUsers/useUsers';
 import { AppRoute } from 'routing/AppRoute.enum';
 import { useNavigate } from 'hooks/useNavigate/useNavigate';
 
 export const Home = () => {
-  const { formatMessage, locale, setLocale } = useLocale();
+  const { locale, setLocale } = useLocale();
   const { user, login, logout, isAuthenticated, isAuthenticating } = useAuth();
 
   const {
@@ -28,13 +28,12 @@ export const Home = () => {
     <>
       <h2>Home</h2>
       <p>
-        {formatMessage({ id: AppMessages['home.helloWorld'] })}
+        <Translation id="home.helloWorld" />
         <span style={{ margin: '0 1rem' }}>&#x2190;</span>
-        This text is translated using{' '}
-        <a href="https://github.com/formatjs/react-intl/blob/master/docs/API.md#formatmessage">
-          <code>formatMessage</code>
-        </a>{' '}
-        function from <a href="https://github.com/formatjs/react-intl">react-intl</a>. Click{' '}
+        <span>This text is translated using <strong>Translation</strong> component.</span>
+        <span>
+          Click{' '}
+        </span>
         <button
           style={{ fontSize: 'inherit' }}
           onClick={() => setLocale(locale === AppLocale.pl ? AppLocale.en : AppLocale.pl)}