@ebubekirylmaz/link-test 1.1.2 → 1.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ebubekirylmaz/link-test",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "type": "module",
   "private": false,
   "exports": {

package/src/config/schemas.js

@@ -12,9 +12,9 @@ export const ConfigSchema = Joi.object({
   }).optional(),
   credentials: Joi.object({
     provider: Joi.string().valid("DEMO", "COGNITO").required(),
-    region: Joi.string().required(),
-    userPoolId: Joi.string().required(),
-    clientId: Joi.string().required(),
+    region: Joi.string().optional(),
+    userPoolId: Joi.string().optional(),
+    clientId: Joi.string().optional(),
   }).optional(),
   project: Joi.object({
     nucleoid: Joi.object().optional(),

package/src/pages/LoginPage.jsx

@@ -1,4 +1,5 @@
 import CognitoLogin from "../widgets/Login/CognitoLogin";
+import DemoLogin from "../widgets/Login/DemoLogin";
 import LoginForm from "../widgets/LoginForm/LoginForm";
 import Page from "../layouts/Page";
 import React from "react";
@@ -33,6 +34,14 @@ function LoginPage() {
     return <CognitoLogin />;
   }
 
+  if (credentials?.provider === "DEMO") {
+    return (
+      <Page title={`Sign in to ${name}`}>
+        <DemoLogin />
+      </Page>
+    );
+  }
+
   return (
     <Page title={`Sign in to ${name}`}>
       <LoginForm icon={template.login.icon} name={name} formColor={formColor} />

package/src/widgets/Login/DemoLogin.jsx

@@ -0,0 +1,42 @@
+import { storage } from "@nucleoidjs/webstorage";
+import { useNavigate } from "react-router-dom";
+
+import { Button, Stack, TextField, Typography } from "@mui/material";
+import React, { useState } from "react";
+
+export default function DemoLogin() {
+  const [username, setUsername] = useState("");
+  const [password, setPassword] = useState("");
+  const navigate = useNavigate();
+
+  function handleLogin() {
+    if (username === "admin" && password === "admin") {
+      storage.set("link", "accessToken", "demo-access-token");
+      storage.set("link", "refreshToken", "demo-refresh-token");
+      navigate("/");
+    } else {
+      alert("Demo credentials are: admin / admin");
+    }
+  }
+
+  return (
+    <Stack spacing={2} maxWidth={400} mx="auto">
+      <Typography variant="h5">Demo Login</Typography>
+      <TextField
+        label="Username"
+        value={username}
+        onChange={(e) => setUsername(e.target.value)}
+      />
+      <TextField
+        label="Password"
+        type="password"
+        value={password}
+        onChange={(e) => setPassword(e.target.value)}
+      />
+      <Button variant="contained" onClick={handleLogin}>
+        Sign in (Demo)
+      </Button>
+      <Typography variant="caption">Use: admin / admin</Typography>
+    </Stack>
+  );
+}

package/src/widgets/Login/Login.jsx

@@ -11,17 +11,11 @@ import { useNavigate } from "react-router-dom";
 // ----------------------------------------------------------------------
 
 export default function Auth0LoginView() {
-  const { name, project, credentials } = config();
+  const { name, project } = config();
 
   const handleOAuthLogin = ({ authUrl, clientId, redirectUri, scope }) => {
     window.location.href = `${authUrl}?client_id=${clientId}&redirect_uri=${redirectUri}&scope=${scope}&response_type=code`;
   };
-
-  function signInAsDemo() {
-    storage.set("link", "accessToken", "demo-access-token");
-    storage.set("link", "refreshToken", "demo-refresh-token");
-  }
-
   const navigate = useNavigate();
 
   function token() {
@@ -39,11 +33,6 @@ export default function Auth0LoginView() {
     if (token()) {
       navigate("/");
     }
-
-    if (credentials?.provider === "DEMO") {
-      signInAsDemo();
-      navigate("/");
-    }
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [navigate]);