transfer fix

src/components/Administrator.tsx

@@ -59,11 +59,11 @@ const Wrap = styled.div`
   flex-direction: column;
   justify-content: 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 +74,7 @@ const Text = styled.div`
   font-family: 'Roboto', sans-serif;
   font-size: 5rem;
   user-select: none;
+  margin-bottom:60px;
 `;
 
 const Logo = styled.img`

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={handleSave}> {isSavingLoading ? <SyncLoader size={9}/> : "ZAPISZ"}</SaveButton>
       {basketCourses.map((course) => (
         <CourseCard course={course} key={course.id} />
       ))}

src/components/Topbar.tsx

@@ -214,7 +214,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/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,