Add react-intl infrastructure

app/src/App.jsx

@@ -6,11 +6,13 @@
 
 import { lazy, Suspense, useEffect } from "react";
 import { HashRouter as Router, Routes, Route, useLocation } from "react-router-dom";
+import { IntlProvider } from 'react-intl';
 import "./App.css";
 import HomePage from "./pages/HomePage/HomePage";
 import LabPython from "./pages/LabPython/LabPython";
 import ScrollToTop from "./components/ScrollToTop";
 import { trackPageView } from "./services/plausible";
+import { getLocalizedMessages } from "./services/localizedMessages";
 
 const Playground = lazy(() => import("./pages/Playground/Playground"));
 const About = lazy(() => import("./pages/About/About"));
@@ -116,10 +118,15 @@ function AppRoutes() {
 }
 
 export default function App() {
+  const locale = 'ht';
+  const translatedMessages = getLocalizedMessages(locale);
+  console.log(translatedMessages);
   return (
     <Router>
       <Suspense fallback={<LoadingFallback />}>
-        <AppRoutes />
+        <IntlProvider messages={translatedMessages} locale={locale} defaultLocale="pt">
+          <AppRoutes />
+        </IntlProvider>
       </Suspense>
     </Router>
   );

app/src/services/localizedMessages.js

@@ -0,0 +1,8 @@
+import ht from "./../../lang/ht.json";
+import pt from "./../../lang/pt.json";
+export function getLocalizedMessages(locale) {
+    return {
+        ht,
+        pt
+    };
+}