Merge pull request 'logo' (#67) from statistics into master

Reviewed-on: http://git.plannaplan.pl/y0rune/frontend/pulls/67

src/components/Administrator.tsx

@@ -7,6 +7,7 @@ import CloseIcon from '@material-ui/icons/Close';
 import { SyncLoader } from 'react-spinners';
 import { CASContext } from '../contexts/CASProvider';
 import LogoutIcon from '../assets/logout.svg';
+import LogoPlanNaPlan from '../assets/logo.svg';
 
 const StyledCloseIcon = styled(CloseIcon)`
   color: #000000;
@@ -58,12 +59,12 @@ const Wrap = styled.div`
   flex: 1;
   flex-direction: column;
   justify-content: center;
-  align-items: center;
+  align-items: center;  
+  margin:20px;
 `;
 
 const LogoWrapper = styled.div`
   display: flex;
-  flex: 1;
   flex-direction: column;
   justify-content: center;
   align-items: center;
@@ -74,6 +75,7 @@ const Text = styled.div`
   font-family: 'Roboto', sans-serif;
   font-size: 5rem;
   user-select: none;
+  margin-bottom:60px;
 `;
 
 const Logo = styled.img`
@@ -133,8 +135,6 @@ export const Administrator = () => {
 
     const {data} = await axiosInstance.get(`${process.env.REACT_APP_API_URL}/api/v1/commisions/export/csv`,{responseType:"blob"});
 
-    console.log("123",xd);
-
     const downloadUrl = window.URL.createObjectURL(new Blob([data]));
 
     const link = document.createElement('a');
@@ -211,7 +211,7 @@ export const Administrator = () => {
                   <Icon alt="logout" src={LogoutIcon} onClick={logout}/>
       <Wrap>
         <LogoWrapper>
-          <Logo alt="logo" src="https://plannaplan.pl/img/logo.svg" />
+          <Logo alt="logo" src={LogoPlanNaPlan} />
           <Text> plan na plan </Text>
         </LogoWrapper>
         {xd === true ? (

src/components/Dropdown.tsx

@@ -120,9 +120,10 @@ export const Dropdown = ({ open, input, handleCloseDropdown, selectedOption }: D
         <>
           {selectedOption === 'studenci' ? (
             <div>
-              {filteredStudents.map(({ surname, name, id }, index) => (
+              {filteredStudents.map(({ surname, name, email, id }, index) => (
                 <CourseContainer key={index} id={id.toString()} onClick={onUserClick}>
-                  <p>{name} {surname}</p>
+                  {name=== ''? <p>{email}</p> :<p>{name} {surname}</p>}
+                  
                 </CourseContainer>
               ))}
             </div>

src/components/Rightbar.tsx

@@ -3,6 +3,7 @@ import { CourseCard } from './CourseCard';
 import { coursesContext } from '../contexts/CoursesProvider';
 import styled from 'styled-components';
 import { debounce } from '../utils/index';
+import { SyncLoader } from 'react-spinners';
 
 const RightbarWrapper = styled.div`
   padding: 15px;
@@ -46,13 +47,13 @@ const SaveButton = styled.div`
 `;
 
 export const Rightbar = () => {
-  const { selectBasketCourses, saveBasket, userID } = useContext(coursesContext)!;
+  const { selectBasketCourses, saveBasket, userID, isSavingLoading } = useContext(coursesContext)!;
 
   const basketCourses = selectBasketCourses();
   const handleSave = debounce(() => saveBasket(userID), 500);
   return (
     <RightbarWrapper>
-      <SaveButton onClick={handleSave}>ZAPISZ</SaveButton>
+      <SaveButton onClick={()=> {!isSavingLoading && handleSave() }}> {isSavingLoading ? <SyncLoader size={9}/> : "ZAPISZ"}</SaveButton>
       {basketCourses.map((course) => (
         <CourseCard course={course} key={course.id} />
       ))}

src/components/Statistics.tsx

@@ -133,10 +133,6 @@ export const Statistics = () => {
     
   }, []);
 
-  useEffect(() => {
-    console.log(loaded);
-  }, [loaded]);
-
   return <StatisticsWrapper>{loaded === false ? <SyncLoader />:<><Row>
     <StatisticBox>
       <StatisticNumber>{createdGroupsNumber}</StatisticNumber>

src/components/Topbar.tsx

@@ -10,6 +10,7 @@ import { SelectMenu } from './SelectMenu';
 import { studentsContext } from '../contexts/StudentsProvider';
 import { CASContext } from '../contexts/CASProvider';
 import Tooltip from '@material-ui/core/Tooltip';
+import LogoPlanNaPlan from '../assets/logo.svg';
 
 const Topbar = styled.div`
   background-color: #e3e5ed;
@@ -180,7 +181,7 @@ export default function ({ handleTransfer }: TopbarProps) {
   return (
     <Topbar>
       <LogoWrapper>
-        <Logo alt="logo" src="https://plannaplan.pl/img/logo.svg" />
+        <Logo alt="logo" src={LogoPlanNaPlan} />
         <Text> plan na plan </Text>
       </LogoWrapper>
       <FlexboxColumn>
@@ -214,7 +215,7 @@ export default function ({ handleTransfer }: TopbarProps) {
         </ClickAwayListener>
       </FlexboxColumn>
       <IconWrapper>
-        <SelectedStudent>{selectedStudent?.surname}</SelectedStudent>
+        <SelectedStudent>{selectedStudent?.surname === '' ? selectedStudent?.email.replace(/@st.amu.edu.pl/, '') : selectedStudent?.surname}</SelectedStudent>
         {/* <Text>Maciej Głowacki</Text> */}
         {userPrivilige === 'STUDENT' && (
           <Tooltip title="Wymiana grupami">

src/components/Transfer.tsx

@@ -39,7 +39,6 @@ const TransferStyled = styled.div`
   background: white;
   margin: 0 auto;
   border-radius: 5px;
-  letter-spacing: 0.1ch;
 `;
 
 const BinIcon = styled(DeleteIcon)`
@@ -166,17 +165,20 @@ const Exchange = styled.div`
   align-items: center;
   justify-content: center;
   padding: 0.5rem;
-  line-height: 0;
+  line-height:2;
 `;
 
 const ExchangeTitle = styled.p`
   font-size: 16px;
   font-weight: bold;
+  
+  margin:0;
 `;
 
 const ExchangeParagraph = styled.p`
   font-size: 13px;
   color: #1a1a1a;
+  margin:0;
 `;
 
 export const Transfer = ({ handleClose, isTransferOpen }: TransferProps) => {

src/contexts/CASProvider.tsx

@@ -1,6 +1,7 @@
 import React, { useState, useEffect, createContext, ReactNode } from 'react';
 import { LoggedUser } from '../types';
-import { axiosInstance } from '../utils/axiosInstance';
+import { axiosInstance, getNewTokens } from '../utils/axiosInstance';
+
 
 export interface CASContext {
   user: LoggedUser | undefined;
@@ -42,6 +43,9 @@ export const CASProvider = ({ children }: CASProviderProps) => {
           localStorage.setItem('refreshToken', user.refreshToken);
           setIsFetchingToken(false);
         }
+        else{
+          getNewTokens();
+        }
         const token = localStorage.getItem('userToken');
         const refreshToken = localStorage.getItem('refreshToken');
         const role = localStorage.getItem('userPrivilige');

src/contexts/CoursesProvider.tsx

@@ -22,6 +22,7 @@ interface CourseContext {
   isDataLoading: boolean;
   historyBasket: Array<Basket>;
   tour: string;
+  isSavingLoading: boolean;
   getCurrentTour: () => void;
   addCourseToBasket: (courses: Course) => void;
   changeHoveredGroup: (group: Group | null) => void;
@@ -60,6 +61,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
   const [hoveredGroup, setHoveredGroup] = useState<Group | undefined | null>(null);
   const [isDataLoading, setIsDataLoading] = useState(false);
   const [tour, setTour] = useState('');
+  const [isSavingLoading, setIsSavingLoading] = useState(false);
 
   const selectBasketIds = () => {
     const classesIds = basket.map((course) => course?.classes?.id).filter((course) => course !== undefined);
@@ -143,6 +145,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
   };
 
   const saveBasket = async (userID: string) => {
+    setIsSavingLoading(true);
     const basketIds = selectBasketIds();
     const action = (key: any) => (
       <>
@@ -171,6 +174,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
       });
     }
     getStudentTimetablesHistory(userID);
+    setIsSavingLoading(false);
   };
 
   const changeGroupInBasket = (choosenGroup: any, courseId: number) => {
@@ -308,6 +312,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
         isDataLoading,
         historyBasket,
         tour,
+        isSavingLoading,
         getCurrentTour,
         addCourseToBasket,
         changeHoveredGroup,

src/utils/axiosInstance.ts

@@ -3,12 +3,13 @@ import axios from 'axios';
 export const axiosInstance = axios.create();
 
 //getting new tokens
-const getNewTokens = async () => {
+export const getNewTokens = async () => {
   try {
     const refreshToken = localStorage.getItem('refreshToken');
     const { data } = await axiosInstance.get(
       `${process.env.REACT_APP_API_URL}/token/refresh?refreshToken=${refreshToken}`,
     );
+    localStorage.setItem('userPrivilige',data.authorityRole);
     localStorage.setItem('userToken', data.token);
     localStorage.setItem('refreshToken', data.refreshToken);
     return data.token;