Merge pull request #330 from HASKI-RAK/267-technical-user-should-not-…

…be-able-to-send-feedback-without-beeing-logged-in

267 technical user should not be able to send feedback without beeing logged in

src/components/Footer/Footer.test.tsx

@@ -25,6 +25,6 @@ describe('Footer', () => {
       fireEvent.click(button)
     })
 
-    expect(navigate).toHaveBeenCalledTimes(4)
+    expect(navigate).toHaveBeenCalledTimes(3)
   })
 })

src/components/Footer/Footer.tsx

@@ -1,7 +1,8 @@
-import { Fragment, memo } from 'react'
+import { Fragment, memo, useContext } from 'react'
 import { useTranslation } from 'react-i18next'
 import { useNavigate } from 'react-router-dom'
 import { Box, Container, Divider, Grid, Link, Typography } from '@common/components'
+import { AuthContext } from '@services'
 
 /**
  * Sticks to the bottom of the page and is always visible.
@@ -17,11 +18,13 @@ const Footer = () => {
   const navigate = useNavigate()
   const { t } = useTranslation()
 
+  const { isAuth } = useContext(AuthContext)
+
   const footerComponents = [
-    { name: [t('pages.home')], link: '/' },
-    { name: [t('pages.contact')], link: '/contact' },
-    { name: [t('pages.imprint')], link: '/imprint' },
-    { name: [t('pages.privacypolicy')], link: '/privacypolicy' }
+    { name: [t('pages.home')], link: '/', isVisibleBeforeLogin: true },
+    { name: [t('pages.contact')], link: '/contact', isVisibleBeforeLogin: false },
+    { name: [t('pages.imprint')], link: '/imprint', isVisibleBeforeLogin: true },
+    { name: [t('pages.privacypolicy')], link: '/privacypolicy', isVisibleBeforeLogin: true }
   ]
 
   return (
@@ -42,27 +45,30 @@ const Footer = () => {
               </Typography>
             </Grid>
             <Grid item xs={12} display="flex" width="100%" justifyContent="center">
-              {footerComponents.map((component) => (
-                <Fragment key={component.link}>
-                  <Link
-                    id={component.link.concat('-link').replaceAll(' ', '-')}
-                    marginX="0.2em"
-                    component="button"
-                    variant="subtitle1"
-                    color={'textSecondary'}
-                    href={component.link}
-                    underline="hover"
-                    onClick={() => navigate(component.link)}>
-                    {component.name}
-                  </Link>
-                  {footerComponents.indexOf(component) !== footerComponents.length - 1 && (
-                    <Typography marginX="0.2em" color="textSecondary" variant="subtitle1">
-                      {' '}
-                      |{' '}
-                    </Typography>
-                  )}
-                </Fragment>
-              ))}
+              {footerComponents.map(
+                (component) =>
+                  (component.isVisibleBeforeLogin || isAuth) && (
+                    <Fragment key={component.link}>
+                      <Link
+                        id={component.link.concat('-link').replaceAll(' ', '-')}
+                        marginX="0.2em"
+                        component="button"
+                        variant="subtitle1"
+                        color={'textSecondary'}
+                        href={component.link}
+                        underline="hover"
+                        onClick={() => navigate(component.link)}>
+                        {component.name}
+                      </Link>
+                      {footerComponents.indexOf(component) !== footerComponents.length - 1 && (
+                        <Typography marginX="0.2em" color="textSecondary" variant="subtitle1">
+                          {' '}
+                          |{' '}
+                        </Typography>
+                      )}
+                    </Fragment>
+                  )
+              )}
             </Grid>
           </Grid>
         </Container>

src/pages/Contact/Contact.test.tsx

@@ -8,6 +8,8 @@ import { FormDataType, SnackbarContext, SnackbarContextType } from '@services'
 import { getConfig } from '@shared'
 import { useContact } from './Contact.hooks'
 
+const { AuthContext } = jest.requireActual('@services')
+
 /*jest.mock('react', () => ({
   ...jest.requireActual('react'),
   useCallback: (a: any) => a
@@ -54,12 +56,25 @@ describe('Test Contactpage', () => {
   const useContact = jest.fn(() => {
     return { onSubmitHandler: submit }
   })
+  test('Contactform gets displayed and functions normally', () => {
+    render(
+      <SnackbarContext.Provider value={mockSnackbarContext}>
+        <MemoryRouter>
+          <AuthContext.Provider value={{ isAuth: true }}>
+            <Contact />
+          </AuthContext.Provider>
+        </MemoryRouter>
+      </SnackbarContext.Provider>
+    )
+  })
 
   test('not sending', () => {
     render(
       <SnackbarContext.Provider value={mockSnackbarContext}>
         <MemoryRouter>
-          <Contact />
+          <AuthContext.Provider value={{ isAuth: true }}>
+            <Contact />
+          </AuthContext.Provider>
         </MemoryRouter>
       </SnackbarContext.Provider>
     )
@@ -86,7 +101,9 @@ describe('Test Contactpage', () => {
 
     render(
       <MemoryRouter>
-        <Contact />
+        <AuthContext.Provider value={{ isAuth: true }}>
+          <Contact />
+        </AuthContext.Provider>
       </MemoryRouter>
     )
   })

src/pages/Contact/Contact.tsx

@@ -1,5 +1,6 @@
-import { useState } from 'react'
+import { useState, useContext } from 'react'
 import { ContactForm } from '@components'
+import { AuthContext } from '@services'
 import { ContactHookProps, ContactHookReturn, useContact as _useContact } from './Contact.hooks'
 
 export type ContactProps = {
@@ -16,10 +17,12 @@ export type ContactProps = {
  * @param props - Dependency injects {@link useContact} to control the sumbit on the page. Also displays a lodaing indicator when submitting.
  * @category Pages
  */
+
 export const Contact = ({ useContact = _useContact }: ContactProps) => {
   const [isLoading, setIsLoading] = useState(false)
+  const { isAuth } = useContext(AuthContext)
 
   const { onSubmitHandler } = useContact({ setIsLoading })
-  return <ContactForm onSubmit={onSubmitHandler} isLoading={isLoading} />
+  return <>{isAuth && <ContactForm onSubmit={onSubmitHandler} isLoading={isLoading} />}</>
 }
 export default Contact

src/pages/Course/Course.tsx

@@ -17,7 +17,7 @@ const Course = () => {
   // Hooks
   const theme = useTheme()
   const isSmOrDown = useMediaQuery(theme.breakpoints.down('sm'))
-  const { courseId } = useParams<{courseId: string}>()
+  const { courseId } = useParams<{ courseId: string }>()
   const { topicProgress, isLoading, topics } = useLearningPathTopicProgress({ courseId })
 
   return (

src/pages/Home/Home.tsx

@@ -28,32 +28,32 @@ export const Home = () => {
   const getCourses = useStore((state) => state.getCourses)
 
   useEffect(() => {
-      if (isAuth) {
-        getUser()
-          .then((user) => {
-            getCourses(user.settings.user_id, user.lms_user_id, user.id)
-              .then((CourseResponse) => {
-                setCourses(CourseResponse.courses)
-              })
-              .catch((error) => {
-                addSnackbar({
-                  message: t('error.getCourses'),
-                  severity: 'error',
-                  autoHideDuration: 5000
-                })
-                log.error(t('error.getCourses') + ' ' + error)
+    if (isAuth) {
+      getUser()
+        .then((user) => {
+          getCourses(user.settings.user_id, user.lms_user_id, user.id)
+            .then((CourseResponse) => {
+              setCourses(CourseResponse.courses)
+            })
+            .catch((error) => {
+              addSnackbar({
+                message: t('error.getCourses'),
+                severity: 'error',
+                autoHideDuration: 5000
               })
-          })
-          .catch((error) => {
-            addSnackbar({
-              message: t('error.getUser'),
-              severity: 'error',
-              autoHideDuration: 5000
+              log.error(t('error.getCourses') + ' ' + error)
             })
-            log.error(t('error.getUser') + ' ' + error)
+        })
+        .catch((error) => {
+          addSnackbar({
+            message: t('error.getUser'),
+            severity: 'error',
+            autoHideDuration: 5000
           })
-        setLoading(false)
-      }
+          log.error(t('error.getUser') + ' ' + error)
+        })
+      setLoading(false)
+    }
   }, [getUser, getCourses, setCourses, isAuth])
 
   // Card cointaining the courses with a button to the specific course