#44

src/Layout/Dashboard/AddButton/Add_Button.scss

@@ -36,3 +36,42 @@
         }
     }
 }
+
+    .Add_Button_notification{
+        button {
+            border: 2px solid var(--primary);
+            background-color: var(--primary);
+            border-radius: 0.5vw;
+            height: 40px;
+            width: 180px;
+            font-size: 1vw ;
+            display: flex; justify-content: center; align-items: center;
+            box-shadow: 2px 2px 7px 0 var(--primary);
+           }
+           button span {
+            display: flex;
+            align-items: center;
+            color: var(--bg);
+            font-weight: normal;
+            font-size: 14px;
+           }
+           
+           button:hover {
+            background-color:var(--primary);
+           }
+    }
+    
+    @media screen and (max-width: 700px) {
+        .Add_Button_notification{
+            button{
+                font-size: 2vw !important;
+            }
+        }
+    }
+    @media screen and (max-width: 470px) {
+        .Add_Button_notification{
+            button{
+                font-size: 3vw !important;
+            }
+        }
+    }

src/Pages/Users/Page.tsx

@@ -8,6 +8,9 @@ import { QueryStatusEnum } from '../../config/QueryStatus'
 
 import { useGetUsers } from '../../api/users'
 import SearchField from '../../Layout/Dashboard/SearchField'
+import { useNavigate } from 'react-router-dom'
+import AddButton from '../../Layout/Dashboard/AddButton/AddButton'
+import { useTranslation } from 'react-i18next'
 
 function Page() {
 
@@ -15,6 +18,8 @@ function Page() {
     const {data  ,status } = useGetUsers()
 
     const totalRows = data?.meta?.total;
+    const navigate = useNavigate()
+    const [t] = useTranslation()
 
   return (
     // Pass Status to Layout 
@@ -24,7 +29,23 @@ function Page() {
       <div className='RightSide d-flex gap-2 align-center '>
      <SearchField searchBy={"name"} />
 
-     {/* <AddButton  onClick={()=>navigate('/users/add')}></AddButton> */}
+     <div className='Add_Button_notification' onClick={()=>navigate('/notification/add')} >
+            <button >
+                <span >
+                    <svg
+                        xmlns="http://www.w3.org/2000/svg"
+                        viewBox="0 0 24 24"
+                        width={24}
+                        height={24}
+                    >
+                        <path fill="none" d="M0 0h24v24H0z" />
+                        <path fill="currentColor" d="M11 11V5h2v6h6v2h-6v6h-2v-6H5v-2z" />
+                    </svg>{" "}
+                    {t("create_notification")}
+                </span>
+            </button>
+            </div>
+
      </div>
       </DashHeader>
       <LyTable

src/Routes.tsx

@@ -171,12 +171,13 @@ export const RoutesLinks: RoutesLinksType[] = [
         hidden:true
     }
  
-    ,  {
+    ,  
-        name: "notification",
+    // {
-        element: <NotificationPage />,
+    //     name: "notification",
-        icon: <MdEmail  />,
+    //     element: <NotificationPage />,
-        href: "/notification",
+    //     icon: <MdEmail  />,
-    },
+    //     href: "/notification",
+    // },
     {
         href: "/notification/add",
         element: <AddNotificationPage />,

src/translate/text

@@ -1 +1,2 @@
 sorry_only_user_can_change_his_status
+create_notification