поменяла алерты на тостер/соннер + настройка отображения небольшая

src/components/Sonner.tsx

@@ -6,6 +6,7 @@ const Toaster: React.FC<ToasterProps> = ({ className, ...props }) => {
   return (
     <Sonner
       className={`toaster group ${className ?? ''}`}
+      position="bottom-center"
       {...props}
     />
   );

src/index.css

@@ -43,3 +43,23 @@
   }
 
   }
+
+.ToastRoot[data-swipe="move"] {
+	transform: translateX(var(--radix-toast-swipe-move-x));
+}
+.ToastRoot[data-swipe="cancel"] {
+	transform: translateX(0);
+	transition: transform 200ms ease-out;
+}
+.ToastRoot[data-swipe="end"] {
+	animation: slideRight 100ms ease-out;
+}
+
+@keyframes slideRight {
+	from {
+		transform: translateX(var(--radix-toast-swipe-end-x));
+	}
+	to {
+		transform: translateX(100%);
+	}
+}

src/pages/Courses.tsx

@@ -7,6 +7,32 @@ import { useHistory } from "react-router-dom"
 import HeaderNav from "../components/HeaderNav"
 import { getRouteCourseExercises } from "../shared/consts/router"
 
+const ProgressLine = () => {
+  return (<div
+    className="h-full bg-orange-400 transition-all duration-500 absolute left-0 top-0 rounded-l-xl"
+    style={{ width: '85%' }}
+  />
+  );
+}
+
+const AnalitcsCards = () => {
+
+  {/* Analytics Cards */ }
+  return (
+    <div className="px-6 mb-8" >
+      <div className="text-center relative ">
+        <div className="w-full h-10 bg-gray-500 rounded-xl relative flex items-center justify-center mb-4 shadow-xl">
+          {/* Прогрессная часть */}
+          <ProgressLine/>
+
+          {/* Текст поверх линии */}
+          <div className="absolute text-white font-semibold text-base">Вы прошли реабилитацию на {85}%</div>
+        </div>
+      </div>
+    </div>
+  )
+}
+
 const Home: React.FC = () => {
   const history = useHistory()
 
@@ -16,35 +42,10 @@ const Home: React.FC = () => {
     { id: 3, name: "Реабилитация плеча", progress: 90, color: "from-[#2BACBE]/80 to-[#5F5C5C]" },
   ];
 
-
-
-
   return (
-
-
-
     <div className="my-36 min-h-screen max-w-4xl mx-auto">
       <HeaderNav item='Курсы' text='все назначенные' />
-
-      {/* Analytics Cards */}
-      <div className="px-6 mb-8">
-
-        <div className="text-center relative ">
-
-          <div className="w-full h-10 bg-gray-500 rounded-xl relative flex items-center justify-center mb-4 shadow-xl">
-            {/* Прогрессная часть */}
-            <div
-              className="h-full bg-orange-400 transition-all duration-500 absolute left-0 top-0 rounded-l-xl"
-              style={{ width: '85%' }}
-            ></div>
-            {/* Текст поверх линии */}
-            <div className="absolute text-white font-semibold text-base">Вы прошли реабилитацию на {85}%</div>
-          </div>
-
-        </div>
-
-      </div>
-
+      <AnalitcsCards />
 
 
       {/* Courses */}

src/pages/Exercise.tsx

@@ -96,6 +96,51 @@ const Exercise: React.FC = () => {
     },
   ]
 
+  class User {
+    age = 18;
+    private _token = '';
+
+    constructor(age = 18, token = '') {
+      this.token = token
+      this.age = age
+    }
+
+    get isOld() {
+      return this.age > 70; 
+    }
+
+    get isAuth() {
+
+      return this._token.length > 0 && this._token.length <= 20;
+    }
+
+    set token (t: string) {
+      if(t.length === 0) return;
+
+      this._token = t;
+    }
+
+    get token () {
+      return this._token;
+    }
+  }
+
+  const user = new User();
+  
+  user.isOld // false
+
+  user.age = 71
+
+  user.isOld // true
+
+  user.isAuth // false
+
+  user.token = '123'
+
+  user.isAuth // true
+
+  user.token = '123'
+
   return (
 
     <div className="bg-gray-50 w-full h-full overflow-auto">
@@ -103,9 +148,6 @@ const Exercise: React.FC = () => {
 
         <HeaderNav item='Надо разобраться?' text='упражнение' />
 
-
-
-
         {/* Video/Image Section */}
         <div className="px-4 sm:px-6 mt-10 mb-6">
           <div className="glass-morphism rounded-3xl overflow-hidden shadow-2xl border border-white/20 backdrop-blur-2xl">

src/pages/ForgotPassword.tsx

@@ -23,7 +23,7 @@ const handleSubmit = async (e: React.FormEvent) => {
 
   try {
     await connect.post('/reset-password/api/add-request', { email });
-        toast.error('Письмо для сброса пароля отправлено.', {
+        toast.success('Письмо для сброса пароля отправлено.', {
 				richColors: true,
 			});
 
@@ -38,7 +38,6 @@ const handleSubmit = async (e: React.FormEvent) => {
   } catch (error: any) {
     setIsSubmitted(false);
     toast.error('Ошибка авторизации!', {
-				description: `${e}`,
 				richColors: true,
 			});
 

src/pages/Login.tsx

@@ -68,7 +68,6 @@ export default function LoginPage() {
           if (error.response.status === 400) {
 
             toast.error('Неверные данные для входа', {
-                    description: `${e}`,
               richColors: true,
             });
           }
@@ -109,14 +108,18 @@ export default function LoginPage() {
       localStorage.setItem('userName', data.user_name)
 
       console.log('Данные сохранены в localStorage')
-      alert('Вы успешно зерегистрировались!')
+      toast.success('Вы успешно зарегистрировались', {
+        richColors: true,
+      });
       console.log('Отправляемые данные:', { email, password });
 
       // После этого можно перейти или показать сообщение
       history.push(getRouteHome())
     } catch (error) {
       console.error('Ошибка при регистрации:', error)
-      alert('Ошибка при регистрации')
+      toast.error('Ошибка при регистрации', {
+        richColors: true,
+      });
     }
   }