SAML error page (#582)

* add saml error page

* prettier

* update logo

* update logo

* fix issue with error

* make it a page

---------

Co-authored-by: guyp-descope <[email protected]>
Co-authored-by: Omer C <[email protected]>

.eslintrc.json

@@ -21,7 +21,7 @@
 		},
 		"ecmaVersion": "latest",
 		"sourceType": "module",
-		"project": "./tsconfig.json"
+		"project": true
 	},
 	"plugins": [
 		"react",

.husky/pre-commit

@@ -1,4 +1,2 @@
-#!/usr/bin/env sh
-. "$(dirname -- "$0")/_/husky.sh"
 
 yarn run format-lint

src/SamlError.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import logo from './assets/logo.svg';
+
+const SamlError: React.FC = () => {
+	let error = 'An error occurred';
+
+	const queryParam = new URLSearchParams(window.location.search);
+	error = queryParam.get('error') || 'An error occurred';
+
+	return (
+		<div className="app-content">
+			<img
+				src={logo}
+				alt="logo"
+				style={{
+					marginBottom: '16px'
+				}}
+			/>
+			<h2 className="header-label">Uh-oh, something went wrong</h2>
+			<div
+				style={{
+					marginBottom: '96px'
+				}}
+			>
+				<p
+					className="text-body1"
+					style={{
+						marginTop: '32px'
+					}}
+				>
+					{error}
+				</p>
+			</div>
+		</div>
+	);
+};
+
+export default SamlError;

src/index.tsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App';
+import SamlError from './SamlError';
 
 const contentBaseUrl = process.env.REACT_APP_CONTENT_BASE_URL;
 if (contentBaseUrl) {
@@ -10,8 +11,16 @@ if (contentBaseUrl) {
 const root = ReactDOM.createRoot(
 	document.getElementById('root') as HTMLElement
 );
+
+const routerSwitch = (page: string) => {
+	switch (page) {
+		case '/login/saml-error':
+			return <SamlError />;
+		default:
+			return <App />;
+	}
+};
+
 root.render(
-	<React.StrictMode>
-		<App />
-	</React.StrictMode>
+	<React.StrictMode>{routerSwitch(window.location.pathname)}</React.StrictMode>
 );