Refactor project structure and integrate Redux for state management. Update configuration files for new project name and add Webpack plugins for environment variables. Implement user authentication with Keycloak and create a context for challenge management. Add various components for user interaction, including dashboards and task workspaces. Enhance API integration and add error handling utilities. Introduce analytics and polling mechanisms for improved user experience.

src/index.tsx

@@ -1,24 +1,65 @@
-/* eslint-disable @typescript-eslint/ban-ts-comment */
-/* eslint-disable @typescript-eslint/no-explicit-any */
 /* eslint-disable react/display-name */
 import React from 'react'
 import ReactDOM from 'react-dom/client'
-  
+import i18next from 'i18next'
+import { i18nextReactInitConfig } from '@brojs/cli'
+
 import App from './app'
-  
-export default () => <App/>
+import { keycloak } from "./__data__/kc"
+import { createStore } from "./__data__/store"
+import { isAuthLoopBlocked, recordAuthAttempt, clearAuthAttempts } from './utils/authLoopGuard'
+
+i18next.t = i18next.t.bind(i18next)
+const i18nextPromise = i18nextReactInitConfig(i18next)
+
+export default (props) => <App {...props} />
   
 let rootElement: ReactDOM.Root
   
-export const mount = (Component, element = document.getElementById('app')) => {
-  rootElement = ReactDOM.createRoot(element)
-  rootElement.render(<Component/>)
+export const mount = async (Component, element = document.getElementById('app')) => {
+  let user = null
+  try {
+    if (isAuthLoopBlocked()) {
+      await i18nextPromise
+      rootElement = ReactDOM.createRoot(element)
+      rootElement.render(<button onClick={() => keycloak.login()} style={{
+        width: '100%',
+        height: '100%',
+        backgroundColor: 'red',
+        margin: 'auto'
+      }}>Login</button>)
+
+      return
+    }
+
+    recordAuthAttempt()
+    await keycloak.init({
+      onLoad: 'login-required'
+      // onLoad: 'check-sso'
+    })
+
+    const userInfo = await keycloak.loadUserInfo()
+
+    if (userInfo && keycloak.tokenParsed) {
+      user = { ...userInfo, ...keycloak.tokenParsed }
+    } else {
+      console.error('No userInfo or tokenParsed', userInfo, keycloak.tokenParsed)
+    }
+
+    clearAuthAttempts()
+  } catch (error) {
+    console.error('Failed to initialize adapter:', error)
+    // keycloak.login()
+  }
+  const store = createStore({ user })
+  await i18nextPromise
+
+  rootElement = ReactDOM.createRoot(element)
+  rootElement.render(<Component store={store} />)
 
-  // @ts-ignore
   if(module.hot) {
-    // @ts-ignore
     module.hot.accept('./app', ()=> {
-      rootElement.render(<Component/>)
+      rootElement.render(<Component store={store} />)
     })
   }
 }