Changed services h1 to new h1 atom

frontend/src/components/layouts/Container.tsx

@@ -2,7 +2,7 @@ import { FC, HTMLProps } from "react";
 import clsx from "clsx";
 
 const styleClasses = {
-  base: "w-full lg:w-1/2 mx-auto",
+  base: "w-full lg:w-1/2 mx-auto px-2",
 };
 
 const Container: FC<HTMLProps<HTMLDivElement>> = (props) => {

frontend/src/components/molecules/Sidebar.tsx

@@ -108,10 +108,10 @@ const Sidebar = () => {
                 </ul>
               </nav>
             </div>
-            <div className="flex flex-shrink-0 py-4 px-5 justify-between items-center border-t border-gray-200">
+            <div className="flex flex-shrink-0 py-4 px-5 justify-between items-center border-t border-gray-200 space-x-4">
-              <div className="flex flex-row justify-center items-center space-x-4">
+              <SidebarTab onClick={navFactory("/me")}>
-                <p>admin</p>
+                <span className="ml-3">admin</span>
-              </div>
+              </SidebarTab>
               <div className="w-6 h-6">
                 <LogoutIcon
                   className="cursor-pointer"

frontend/src/components/pages/login/index.tsx

@@ -1,6 +1,5 @@
 import { useFormik } from "formik";
 import { useEffect, useState } from "react";
-import { Controller, useForm } from "react-hook-form";
 import { useNavigate } from "react-router-dom";
 import { useLoginMutation } from "../../../generated/graphql";
 
@@ -23,12 +22,11 @@ const LoginPage = () => {
   });
 
   useEffect(() => {
-    if (!loginMutation.data) return;
+    if (!loginMutation.data) {
-    if (Object.hasOwn(loginMutation.data.login, "message")) {
-      setSubmitError(loginMutation.data.login.message);
       return;
-    }
+    } else if (loginMutation.data.login.__typename == "CommonError") {
-    if (Object.hasOwn(loginMutation.data.login, "token")) {
+      setSubmitError(loginMutation.data.login.message);
+    } else if (loginMutation.data.login.__typename == "AuthSuccess") {
       localStorage.setItem("token", loginMutation.data.login.token);
       navigator("/services");
     }

frontend/src/components/pages/services/index.tsx

@@ -14,6 +14,7 @@ import {
 } from "../../../generated/graphql";
 import { queryClient } from "../../../main";
 import { useFormik } from "formik";
+import Header1 from "../../atoms/Header1";
 
 const ServicesPage = () => {
   const [toggleCreate, setToggleCreate] = useState(false);
@@ -89,8 +90,8 @@ const ServicesPage = () => {
 
   return (
     <DashboardLayout>
-      <Container className="px-2">
+      <Container>
-        <h1 className="text-3xl font-bold mt-12 mb-8">Services</h1>
+        <Header1>Services</Header1>
         <div className="mb-4 flex items-end justify-between">
           <TextField
             label="Search"

frontend/src/queries/auth.graphql

@@ -1,5 +1,6 @@
 mutation Login($credentials: LoginInput!) {
   login(body: $credentials) {
+    __typename
     ... on AuthSuccess {
       user {
         name