admin panel changes

src/components/Admin.tsx

@@ -12,7 +12,7 @@ const LeftSide = styled.div`
   flex: 1;
   flex-direction: column;
   background-color: white;
-  text-align:center;
+  text-align: center;
 `;
 
 const Wrap = styled.div`
@@ -90,7 +90,7 @@ const Icon = styled.img`
 `;
 
 export const Admin = () => {
-  const [currentTab, setCurrentTab] = useState<null | number>(null);
+  const [currentTab, setCurrentTab] = useState<null | number>(1);
 
   const handleClick = (e: MouseEvent<HTMLDivElement>) => {
     setCurrentTab(Number(e.currentTarget.id));

src/components/Dropdown.tsx

@@ -50,7 +50,9 @@ interface DropdownProps {
 }
 
 export const Dropdown = ({ open, input, handleCloseDropdown, selectedOption }: DropdownProps) => {
-  const { courses, selectBasketNames, addCourseToBasket, getUserID } = useContext(coursesContext)!;
+  const { courses, selectBasketNames, addCourseToBasket, changeStudent } = useContext(
+    coursesContext,
+  )!;
   const { students } = useContext(studentsContext)!;
   const basketNames = useMemo(() => selectBasketNames(), [selectBasketNames]);
   const [filteredCourses, setFilteredCourses] = useState<Array<Course>>([]);
@@ -67,7 +69,7 @@ export const Dropdown = ({ open, input, handleCloseDropdown, selectedOption }: D
 
   const onUserClick = (event: MouseEvent) => {
     const target = event.currentTarget;
-    getUserID(target.id);
+    changeStudent(target.id);
     handleCloseDropdown();
   };
 
@@ -119,7 +121,7 @@ export const Dropdown = ({ open, input, handleCloseDropdown, selectedOption }: D
               {filteredStudents.map(({ name, surname, id }, index) => (
                 <CourseContainer key={index} id={id.toString()} onClick={onUserClick}>
                   <p>
-                    {name} {surname}{' '}
+                    {name} {surname}
                   </p>
                 </CourseContainer>
               ))}

src/components/Scheduler.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect, useRef } from 'react';
+import React, { useEffect, useLayoutEffect, useRef } from 'react';
 import { useState } from 'react';
 import { SchedulerEvents } from './SchedulerEvents';
 import { days, hours } from '../constants/index';
@@ -66,7 +66,7 @@ export const Scheduler = () => {
   const [cellWidth, setCellWidth] = useState(0);
   const [cellHeight, setCellHeight] = useState(0);
 
-  useEffect(() => {
+  useLayoutEffect(() => {
     const handleResize = () => {
       if (cellRef.current) {
         setCellWidth(cellRef.current.getBoundingClientRect().width);

src/components/SchedulerRow.tsx

@@ -140,7 +140,6 @@ export const SchedulerRow = ({ groups, indexRow, rowTop, cellWidth, cellHeight }
   const [popoverId, setPopoverId] = useState<string | null>(null);
   //looks weird
   const handlePopoverOpen = (event: MouseEvent<HTMLDivElement, globalThis.MouseEvent>) => {
-    console.log('I was clicked!!!!');
     setAnchorEl(event.currentTarget);
     setPopoverId(event.currentTarget.id);
   };