Merge branch 'main' into issue-139

web/src/components/header.tsx

@@ -21,17 +21,21 @@ const PORT_API = process.env.PORT_API
 const baseUrl =
   NODE_ENV === 'development' ? `http://localhost:${PORT_API ?? 5000}` : ''
 
+const validTabs = ['/', '/SASjsDrive', '/SASjsStudio']
+
 const Header = (props: any) => {
   const history = useHistory()
   const { pathname } = useLocation()
   const appContext = useContext(AppContext)
-  const [tabValue, setTabValue] = useState(pathname)
+  const [tabValue, setTabValue] = useState(
+    validTabs.includes(pathname) ? pathname : '/'
+  )
   const [anchorEl, setAnchorEl] = useState<
     (EventTarget & HTMLButtonElement) | null
   >(null)
 
   useEffect(() => {
-    setTabValue(pathname)
+    setTabValue(validTabs.includes(pathname) ? pathname : '/')
   }, [pathname])
 
   const handleMenu = (
@@ -49,7 +53,10 @@ const Header = (props: any) => {
   }
 
   const handleLogout = () => {
-    if (appContext.logout) appContext.logout()
+    if (appContext.logout) {
+      handleClose()
+      appContext.logout()
+    }
   }
   return (
     <AppBar
@@ -141,11 +148,12 @@ const Header = (props: any) => {
               <Button
                 component={Link}
                 to="/SASjsSettings"
+                onClick={handleClose}
                 variant="contained"
                 color="primary"
                 startIcon={<SettingsIcon />}
               >
-                Setting
+                Settings
               </Button>
             </MenuItem>
             <MenuItem onClick={handleLogout} sx={{ justifyContent: 'center' }}>

web/src/components/home.tsx

@@ -9,8 +9,8 @@ const Home = () => {
       <CssBaseline />
       <h2>Welcome to SASjs Server!</h2>
       <p>
-        This portal provides an interface for executing Stored Programs (drive)
-        and ad hoc code (studio) against a SAS executable. The source code is
+        SASjs Server provides a REST interface for executing Stored Programs and
+        ad hoc code (studio) against SAS and JS executables. The source is
         available on{' '}
         <a
           href="https://github.com/sasjs/server"

web/src/components/login.tsx

@@ -1,88 +1,39 @@
 import axios from 'axios'
 import React, { useState, useContext } from 'react'
-import { useLocation } from 'react-router-dom'
 import PropTypes from 'prop-types'
 
-import { CssBaseline, Box, TextField, Button, Typography } from '@mui/material'
+import { CssBaseline, Box, TextField, Button } from '@mui/material'
 import { AppContext } from '../context/appContext'
 
-const getAuthCode = async (credentials: any) =>
-  axios.post('/SASjsApi/auth/authorize', credentials).then((res) => res.data)
-
 const login = async (payload: { username: string; password: string }) =>
-  axios.get('/form').then((res1) =>
-    axios
-      .post('/login', payload, {
-        headers: { 'csrf-token': res1.data.csrfToken }
-      })
-      .then((res2) => res2.data)
-  )
+  axios.post('/SASLogon/login', payload).then((res) => res.data)
 
-const Login = ({ getCodeOnly }: any) => {
-  const location = useLocation()
+const Login = () => {
   const appContext = useContext(AppContext)
   const [username, setUsername] = useState('')
   const [password, setPassword] = useState('')
   const [errorMessage, setErrorMessage] = useState('')
-  let error: boolean
-  const [displayCode, setDisplayCode] = useState(null)
 
   const handleSubmit = async (e: any) => {
-    error = false
     setErrorMessage('')
     e.preventDefault()
 
-    if (getCodeOnly) {
-      const params = new URLSearchParams(location.search)
-      const responseType = params.get('response_type')
-      if (responseType === 'code') {
-        const clientId = params.get('client_id')
-
-        const { code } = await getAuthCode({
-          clientId,
-          username,
-          password
-        }).catch((err: any) => {
-          error = true
-          setErrorMessage(err.response.data)
-          return {}
-        })
-        if (!error) return setDisplayCode(code)
-        return
-      }
-    }
-
     const { loggedIn, user } = await login({
       username,
       password
     }).catch((err: any) => {
-      error = true
       setErrorMessage(err.response.data)
       return {}
     })
 
     if (loggedIn) {
-      appContext.setLoggedIn?.(loggedIn)
+      appContext.setUserId?.(user.id)
       appContext.setUsername?.(user.username)
       appContext.setDisplayName?.(user.displayName)
+      appContext.setLoggedIn?.(loggedIn)
     }
   }
 
-  if (displayCode) {
-    return (
-      <Box className="main">
-        <CssBaseline />
-        <br />
-        <h2>Authorization Code</h2>
-        <Typography m={2} p={3} style={{ overflowWrap: 'anywhere' }}>
-          {displayCode}
-        </Typography>
-
-        <br />
-      </Box>
-    )
-  }
-
   return (
     <Box
       className="main"
@@ -95,13 +46,6 @@ const Login = ({ getCodeOnly }: any) => {
       <CssBaseline />
       <br />
       <h2 style={{ width: 'auto' }}>Welcome to SASjs Server!</h2>
-      {getCodeOnly && (
-        <p style={{ width: 'auto' }}>
-          Provide credentials to get authorization code.
-        </p>
-      )}
-      <br />
-
       <TextField
         id="username"
         label="Username"