feat: remove react-bundle

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "makefile.configureOnOpen": false
+}

index.html

@@ -40,6 +40,6 @@
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
     -->
-    <script type="module" src="/src/index.jsx"></script>
+    <script type="module" src="/src/index.tsx"></script>
   </body>
 </html>

package.json

@@ -5,7 +5,7 @@
   "leadMaintainer": "Diogo Silva <fsdiogo@gmail.com>",
   "private": true,
   "type": "module",
-  "main": "src/index.jsx",
+  "main": "src/index.tsx",
   "scripts": {
     "start": "vite",
     "prebuild": "lol public/locales > src/lib/languages.json",
@@ -50,14 +50,14 @@
     "pull-file-reader": "^1.0.2",
     "qrcode.react": "^1.0.1",
     "react": "^17.0.1",
-    "react-circular-progressbar": "^2.0.3",
+    "react-circular-progressbar": "^2.0.4",
     "react-copy-to-clipboard": "^5.0.3",
     "react-dnd": "^13.1.1",
     "react-dnd-html5-backend": "^12.1.1",
     "react-dom": "^17.0.1",
     "react-helmet": "^6.1.0",
     "react-i18next": "^11.8.8",
-    "react-intl": "^5.13.1",
+    "react-intl": "^6.6.8",
     "react-loader-spinner": "^4.0.0",
     "react-modal": "^3.12.1",
     "react-router-dom": "^5.2.0",
@@ -67,7 +67,8 @@
     "shortid": "^2.2.16",
     "tachyons": "^4.12.0",
     "uglifyjs-webpack-plugin": "^2.2.0",
-    "video-extensions": "^1.1.0"
+    "video-extensions": "^1.1.0",
+    "wouter": "^3.3.5"
   },
   "devDependencies": {
     "@olizilla/lol": "2.0.0",
@@ -96,7 +97,7 @@
     "ipfsd-ctl": "^7.2.0",
     "npm-run-all": "^4.1.5",
     "source-map-explorer": "^2.5.2",
-    "typescript": "^4.9.5",
+    "typescript": "^5.6.2",
     "vite": "^5.4.6"
   },
   "homepage": "./",

src/App.tsx

@@ -0,0 +1,27 @@
+// Components
+import Header from './components/header/Header'
+import Footer from './components/footer/Footer'
+
+// Styles
+import './App.css'
+import { useHelia } from './hooks/useHelia'
+import { Page } from './page/Page'
+
+export const App = () => {
+  const { starting, error } = useHelia()
+
+  // Only shows the page if IPFS is ready or if the initialization has failed.
+  const ready = !starting || error
+
+  return (
+    <div className='App sans-serif'>
+      <div className='flex flex-column min-vh-100'>
+        <Header />
+        <main className='flex-auto ph4'>
+          { ready && <Page /> }
+        </main>
+        <Footer />
+      </div>
+    </div>
+  )
+}