ch: add redirect handler

fix: linting errors

fix: fallback handler

Author: fredshema

src/components/InvitationTable.tsx

@@ -63,10 +63,9 @@ function DataTableStats({ data, columns, error, loading }: TableData) {
 
   return (
     <div
-      className={``}
+      className=""
     >
-      <div className="flex items-center justify-between pb-6 ">
-      </div>
+      <div className="flex items-center justify-between pb-6 " />
       <div style={{ overflowX: 'auto' }}>
         <table className="min-w-full leading-normal" {...getTableProps()}>
           <thead>

src/containers/Routes.tsx

@@ -1,13 +1,13 @@
 /* eslint-disable */
 import React, { Suspense } from 'react';
-import { Routes, Route, Outlet } from 'react-router-dom';
-import Home from '../pages/Home';
-import Header from '../components/Header';
+import { Outlet, Route, Routes } from 'react-router-dom';
 import Footer from '../components/Footer';
-import Error from './../pages/Error';
+import Header from '../components/Header';
 import Skeleton from '../components/Skeleton';
-import UserRegister from '../pages/Organization/UserRegister';
+import Home from '../pages/Home';
 import Message from '../pages/Organization/Message';
+import UserRegister from '../pages/Organization/UserRegister';
+import Error from './../pages/Error';
 /* istanbul ignore next */
 const OrgRegister = React.lazy(() => import('../pages/OrgRegister'));
 /* istanbul ignore next */
@@ -32,19 +32,20 @@ const SignupOrgDocs = React.lazy(
 const SigninOrgDocs = React.lazy(
   () => import('../components/Docs/SigninOrgDocs'),
 );
-const UsersDocs = React.lazy( () => import ('../components/Docs/users'),)
+const UsersDocs = React.lazy(() => import('../components/Docs/users'));
 /* istanbul ignore next */
+import DashRoutes from '../containers/DashRoutes';
 import Noredirect from '../pages/Noredirect';
+import RedirectHandler from '../pages/RedirectHandler';
 import ProtectedRoutes from '../ProtectedRoute';
 import RemoveTokenPage from '../utils/RemoveTokenPage';
-import DashRoutes from '../containers/DashRoutes';
 
 function MainRoutes() {
   return (
     <div className="min-h-screen page-layout">
       <Suspense fallback={<Skeleton />}>
         <Routes>
-          <Route path="/*" element={<DashRoutes />} />     
+          <Route path="/*" element={<DashRoutes />} />
           <Route
             path="/"
             element={
@@ -91,7 +92,8 @@ function MainRoutes() {
             />
             <Route path="/docs/org-signup" element={<SignupOrgDocs />} />
             <Route path="/docs/org-signin" element={<SigninOrgDocs />} />
-            <Route path='/docs/getting-started' element={< UsersDocs />} />
+            <Route path="/docs/getting-started" element={<UsersDocs />} />
+            <Route path="/redirect" element={<RedirectHandler />} />
             <Route path="/noredirect" element={<Noredirect />} />
           </Route>
           <Route path="*" element={<Error />} />

src/pages/RedirectHandler.tsx

@@ -0,0 +1,56 @@
+import React, { useEffect } from 'react';
+
+const APP_ID = 'com.atlp.pulseapp';
+
+export default function RedirectHandler() {
+  const buildQueryString = (params: URLSearchParams) => {
+    let queryParams = '?';
+    const ignoredKeys = ['path', 'dest', 'fallback'];
+
+    params.forEach((value, key) => {
+      if (ignoredKeys.includes(key)) return;
+
+      if (!queryParams?.endsWith('?') && !queryParams?.endsWith('&'))
+        queryParams += '&';
+
+      queryParams += `${key}=${value}`;
+    });
+
+    return queryParams;
+  };
+
+  useEffect(() => {
+    const params = new URLSearchParams(window.location.search);
+    const queryParams = buildQueryString(params);
+    const path = params.get('path');
+    const destnation = params.get('dest');
+    const fallback = params.get('fallback');
+
+    if (path != null) {
+      if (destnation === 'web') {
+        return window.location.replace(path + queryParams);
+      }
+
+      if (destnation === 'app') {
+        setTimeout(
+          () => window.location.replace(`${APP_ID}://${path}${queryParams}`),
+          100,
+        );
+        window.location.replace(fallback ? fallback + queryParams : '/');
+      }
+
+      window.location.replace(fallback ? fallback + queryParams : '/');
+    } else {
+      // eslint-disable-next-line no-console
+      console.error('Invalid redirect data');
+    }
+
+    return () => {};
+  }, []);
+
+  return (
+    <div className=" dark:bg-dark-frame-bg flex flex-col py-8 px-5  items-center justify-center grow h-full w-full">
+      <p>Redirecting...</p>
+    </div>
+  );
+}