diff --git a/src/pages/auth/components/DirectLogin.tsx b/src/pages/auth/components/DirectLogin.tsx
new file mode 100644
index 0000000..1a3f964
--- /dev/null
+++ b/src/pages/auth/components/DirectLogin.tsx
@@ -0,0 +1,64 @@
+import Button from '@/components/Button'
+import DefaulModal from '@/components/DefaulModal'
+import Input from '@/components/Input'
+import { useState, type FC } from 'react'
+import { useDirectLogin } from '../hooks/useAuthData'
+import { toast } from '@/components/Toast'
+import { extractErrorMessage } from '@/helpers/utils'
+import { setRefreshToken, setToken } from '@/config/func'
+
+const DirectLogin: FC = () => {
+
+    const [showModal, setShowModal] = useState<boolean>(false)
+    const [subscriptionId, setSubscriptionId] = useState<string>('')
+    const directLogin = useDirectLogin()
+
+    const handleSubmit = () => {
+        directLogin.mutate({ subscriptionId: subscriptionId }, {
+            onSuccess: (data) => {
+                setToken(data?.data?.tokens?.accessToken?.token)
+                setRefreshToken(data?.data?.tokens?.refreshToken?.token)
+                toast('با موفقیت لاگین شدید', 'success')
+                window.location.reload()
+            },
+            onError: (error) => {
+                toast(extractErrorMessage(error), 'error')
+            }
+        })
+    }
+
+    return (
+        <div>
+            <Button
+                onClick={() => setShowModal(true)}
+                className='w-fit px-4'
+            >
+                لاگین
+            </Button>
+
+            <DefaulModal
+                open={showModal}
+                close={() => setShowModal(false)}
+                title_header='لاگین مستقیم'
+                isHeader
+            >
+                <div className='mt-4'>
+                    <Input
+                        label='شماره اشتراک'
+                        value={subscriptionId}
+                        onChange={(e) => setSubscriptionId(e.target.value)}
+                    />
+                </div>
+
+                <div className='mt-5'>
+                    <Button disabled={directLogin.isPending} onClick={handleSubmit} className='w-full'>
+                        لاگین
+                    </Button>
+                </div>
+
+            </DefaulModal>
+        </div>
+    )
+}
+
+export default DirectLogin
\ No newline at end of file
diff --git a/src/pages/auth/hooks/useAuthData.ts b/src/pages/auth/hooks/useAuthData.ts
new file mode 100644
index 0000000..c4c0979
--- /dev/null
+++ b/src/pages/auth/hooks/useAuthData.ts
@@ -0,0 +1,8 @@
+import { useMutation } from "@tanstack/react-query";
+import * as api from "../service/AuthService";
+
+export const useDirectLogin = () => {
+  return useMutation({
+    mutationFn: api.directLogin,
+  });
+};
diff --git a/src/pages/auth/service/AuthService.ts b/src/pages/auth/service/AuthService.ts
index 2bd2e27..4395ce2 100644
--- a/src/pages/auth/service/AuthService.ts
+++ b/src/pages/auth/service/AuthService.ts
@@ -1,4 +1,6 @@
 import axios from "@/config/axios";
+import axiosBase from "axios";
+import type { DirectLoginParamsTypes } from "../types/Types";
 
 export const refreshToken = async ({
   refreshToken,
@@ -10,3 +12,16 @@ export const refreshToken = async ({
   });
   return data;
 };
+
+export const directLogin = async (params: DirectLoginParamsTypes) => {
+  const { data } = await axiosBase.post(
+    `${import.meta.env.VITE_API_URL}/super-admin/auth/direct-login`,
+    params,
+    {
+      headers: {
+        Authorization: "Basic ZGFuYWtAZHNjLmNvbTpEc0NkQW5Baz9AQUJD",
+      },
+    },
+  );
+  return data;
+};
diff --git a/src/pages/auth/types/Types.ts b/src/pages/auth/types/Types.ts
new file mode 100644
index 0000000..39dca8b
--- /dev/null
+++ b/src/pages/auth/types/Types.ts
@@ -0,0 +1,3 @@
+export type DirectLoginParamsTypes = {
+  subscriptionId: string;
+};
diff --git a/src/pages/home/Home.tsx b/src/pages/home/Home.tsx
index a84583e..6acc606 100644
--- a/src/pages/home/Home.tsx
+++ b/src/pages/home/Home.tsx
@@ -8,6 +8,7 @@ import { toast } from '@/components/Toast'
 import { useCreateCatalog } from './hooks/useHomeData'
 import { useNavigate } from 'react-router-dom'
 import { Paths } from '@/config/Paths'
+import DirectLogin from '../auth/components/DirectLogin'
 
 const Home: FC = () => {
 
@@ -34,9 +35,12 @@ const Home: FC = () => {
 
     return (
         <div className='mt-4 w-full'>
-            <h1 className='text-lg font-light'>
-                ساخت  کاتالوگ ب ویرایشگر داناک
-            </h1>
+            <div className='flex justify-between'>
+                <h1 className='text-lg font-light'>
+                    ساخت  کاتالوگ ب ویرایشگر داناک
+                </h1>
+                <DirectLogin />
+            </div>
 
             <div className='mt-20 bg-white rounded-4xl p-10'>
                 <div className='text-center'>