TP-12345 | Env Differentiation Added

src/App.tsx

@@ -7,6 +7,7 @@ import { setAuthData, setAuthToken } from './redux/slices/GoogleAuthSlice';
 import { getRoutesMapping } from './routes';
 import { checkAdminPermission } from './utils';
 import { AppProps } from './utils/interface';
+import LitmusHeader from './components/LitmusHeader';
 
 const App = ({ auth, isAuthenticated }: AppProps) => {
   const dispatch = useAppDispatch();
@@ -28,6 +29,7 @@ const App = ({ auth, isAuthenticated }: AppProps) => {
         <Suspense fallback={<div />}>
           <BrowserRouter>
             <LeftSideBar>
+              <LitmusHeader />
               <Routes>
                 {getRoutesMapping(isAdmin)?.map((route) => (
                   <Route path={route.path} element={route.element} />

src/components/LitmusHeader/index.scss

@@ -0,0 +1,29 @@
+.litmus {
+  left: 0;
+  right: 0;
+  width: fit-content;
+  cursor: pointer;
+  z-index: 1000;
+  position: fixed;
+  background: #ffffff;
+  box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.05);
+  text-align: center;
+  align-items: center;
+  margin-left: auto;
+  margin-right: auto;
+  border-bottom: 1px solid #e8e8e8;
+  border-radius: 0px 0px 8px 8px;
+}
+
+.litmus-details {
+  display: flex;
+  padding: 10px 14px;
+  min-width: 200px;
+  align-items: center;
+  justify-content: center;
+  border-left: 1px solid #e8e8e8;
+  border-right: 1px solid #e8e8e8;
+  border-radius: 0px 0px 8px 8px;
+  font-weight: 500;
+  font-family: 'Inter';
+}

src/components/LitmusHeader/index.tsx

@@ -0,0 +1,15 @@
+import { getEnvName } from '../../utils';
+import './index.scss';
+
+const LitmusHeader = () => {
+  return (
+    <div className="litmus">
+      <div className="litmus-details">
+        <div>Litmus {'-->'} </div>
+        <div>&nbsp;{getEnvName()}</div>
+      </div>
+    </div>
+  );
+};
+
+export default LitmusHeader;

src/utils/index.tsx

@@ -449,8 +449,10 @@ export const logout = () => {
   window.location.reload();
 };
 
-export const isValidEmail = (email: string): boolean => {
-  // Regular expression for validating email addresses
-  const emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
-  return emailPattern.test(email);
+export const getEnvName = () => {
+  const url = window.location.href;
+
+  if (url.includes('dev')) return 'Dev';
+  else if (url.includes('qa')) return 'QA';
+  else return 'Prod';
 };