feat: add modal

src/feature/article/sidebar/ui.tsx

@@ -1,7 +1,12 @@
+'use client';
+
 import s from './styles.module.scss';
 import Link from 'next/link';
 import { Button } from '@shared/ui';
 import { TSidebar } from '@shared/types/sidebar';
+import { useModal } from '@core/providers/modal-provider';
+import { ConsultationModal } from '@/feature/article';
+import { CONTACTS } from '@shared/const/contacts';
 
 type SidebarProps = TSidebar;
 
@@ -12,6 +17,11 @@ function Sidebar({
   warrantiesTitle,
   warranties,
 }: SidebarProps) {
+  const modal = useModal();
+  const openModal = () => modal.showModal(<ConsultationModal />);
+
+  const callTo = `tel:${CONTACTS.PHONE}`;
+
   return (
     <aside className={s.Sidebar}>
       <div className={s.Estimation}>
@@ -22,8 +32,12 @@ function Sidebar({
           определения точной стоимости.
         </p>
         <p className={s.Text}>Оставьте заявку или позвоните по телефону</p>
-        <Button variant={'white'}>Записаться</Button>
-        <p className={s.Phone}>+7 (900) 241-34-34</p>
+        <Button variant={'white'} onClick={openModal}>
+          Записаться
+        </Button>
+        <a href={callTo}>
+          <p className={s.Phone}>+7 (900) 241-34-34</p>
+        </a>
       </div>
       {related && (
         <div className={s.Related}>