diff --git a/app/(auth)/change-password/page.tsx b/app/(auth)/change-password/page.tsx
new file mode 100644
index 0000000..3d08d6b
--- /dev/null
+++ b/app/(auth)/change-password/page.tsx
@@ -0,0 +1,60 @@
+import ComponentsAuthUnlockForm from '@/components/auth/components-auth-unlock-form';
+import { Metadata } from 'next';
+import Link from 'next/link';
+import React from 'react';
+
+export const metadata: Metadata = {
+ title: 'Unlock Cover',
+};
+
+const CoverLockScreen = () => {
+ return (
+
+
+

+
+
+

+

+

+

+
+
+
+
+
+

+
+
+

+
+
+
+
+ {/*
+
+

+
+
+
*/}
+
+
+
+

+
+
+
Shaun Park
+
Enter your password to unlock your ID
+
+
+
+
+
© {new Date().getFullYear()}.VRISTO All Rights Reserved.
+
+
+
+
+ );
+};
+
+export default CoverLockScreen;
diff --git a/app/(auth)/login/page.tsx b/app/(auth)/login/page.tsx
index c8b06c7..c60c7c8 100644
--- a/app/(auth)/login/page.tsx
+++ b/app/(auth)/login/page.tsx
@@ -29,7 +29,7 @@ const CoverLogin = () => {
-

+

diff --git a/app/(auth)/register/page.tsx b/app/(auth)/register/page.tsx
index ba6f192..083d17d 100644
--- a/app/(auth)/register/page.tsx
+++ b/app/(auth)/register/page.tsx
@@ -29,7 +29,7 @@ const CoverRegister = () => {
-

+

@@ -101,7 +101,7 @@ const CoverRegister = () => {
-
© {new Date().getFullYear()}.CrawlerX All Rights Reserved.
+
© {new Date().getFullYear()}.Metatroncube All Rights Reserved.
diff --git a/app/icon.png b/app/icon.png
index 9ee75c5..40658d6 100644
Binary files a/app/icon.png and b/app/icon.png differ
diff --git a/components/auth/components-auth-unlock-form.tsx b/components/auth/components-auth-unlock-form.tsx
new file mode 100644
index 0000000..487aed3
--- /dev/null
+++ b/components/auth/components-auth-unlock-form.tsx
@@ -0,0 +1,118 @@
+'use client';
+
+import IconLockDots from '@/components/icon/icon-lock-dots';
+import { useRouter } from 'next/navigation';
+import React, { useState } from 'react';
+import axios from 'axios';
+
+const ComponentsAuthChangePasswordForm = () => {
+ const router = useRouter();
+
+ const [currentPassword, setCurrentPassword] = useState('');
+ const [newPassword, setNewPassword] = useState('');
+ const [loading, setLoading] = useState(false);
+ const [error, setError] = useState('');
+ const [success, setSuccess] = useState('');
+
+ const submitForm = async (e: React.FormEvent) => {
+ e.preventDefault();
+ setError('');
+ setSuccess('');
+ setLoading(true);
+
+ try {
+ const token = localStorage.getItem('token');
+ if (!token) {
+ setError('You are not logged in.');
+ setLoading(false);
+ return;
+ }
+
+ // 👉 Create FormData and append fields
+ const formData = new FormData();
+ formData.append('currentPassword', currentPassword);
+ formData.append('newPassword', newPassword);
+
+ // 👉 Axios call with Bearer token
+ const res = await axios.post(
+ `http://localhost:3020/api/auth/change-password`,
+ formData,
+ {
+ headers: {
+ Authorization: `Bearer ${token}`,
+ "Content-Type": "application/json", // axios will set correct multipart/form-data boundary automatically
+ },
+ }
+ );
+
+ setSuccess(res.data.message || 'Password updated successfully!');
+ // Optional: force user to re-login after password change
+ localStorage.removeItem('token');
+ router.push('/login');
+ } catch (err: any) {
+ const msg = err.response?.data?.error || err.message;
+ setError(msg);
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ return (
+
+ );
+};
+
+export default ComponentsAuthChangePasswordForm;
diff --git a/components/layouts/footer.tsx b/components/layouts/footer.tsx
index 9dd3d06..9bd39fd 100644
--- a/components/layouts/footer.tsx
+++ b/components/layouts/footer.tsx
@@ -1,6 +1,6 @@
const Footer = () => {
return (
- © {new Date().getFullYear()}. CrawlerX All rights reserved.
+ © {new Date().getFullYear()}.Metatroncube All rights reserved.
);
};
diff --git a/components/layouts/header.tsx b/components/layouts/header.tsx
index ee1353d..805b7c3 100644
--- a/components/layouts/header.tsx
+++ b/components/layouts/header.tsx
@@ -162,8 +162,8 @@ const Header = () => {
-

-
CrawlerX
+

+ {/*
CrawlerX */}
-
+ {/*
-
@@ -192,9 +192,9 @@ const Header = () => {
-
-
-
+
*/}
+
*/}
{themeConfig.theme === 'light' ? (
)}
-
*/}
{
Profile
-
+ {/*
Inbox
@@ -451,7 +451,18 @@ const Header = () => {
Lock Screen
-
+ */}
+ {
+ token && (
+
+
+
+ Change Password
+
+
+ )
+ }
+
{token ? (
diff --git a/components/layouts/loading.tsx b/components/layouts/loading.tsx
index eb42fc0..c9d8f09 100644
--- a/components/layouts/loading.tsx
+++ b/components/layouts/loading.tsx
@@ -3,14 +3,15 @@ import React from 'react';
const Loading = () => {
return (
-
*/}
+
);
};
diff --git a/components/layouts/sidebar.tsx b/components/layouts/sidebar.tsx
index 104142a..cd06507 100644
--- a/components/layouts/sidebar.tsx
+++ b/components/layouts/sidebar.tsx
@@ -90,8 +90,8 @@ const Sidebar = () => {
-

-
CrawlerX
+

+ {/*
CrawlerX */}