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 ( +
+
+ image +
+
+ image + image + image + image +
+
+
+
+ + Logo + +
+ Cover Image +
+
+
+
+ {/*
+ + Logo + + +
*/} +
+
+
+ images +
+
+

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 = () => {
- Logo + Logo
Cover Image 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 = () => {
- Logo + Logo
Cover Image @@ -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 ( +
+ {/* Current password */} +
+ +
+ setCurrentPassword(e.target.value)} + required + /> + + + +
+
+ + {/* New password */} +
+ +
+ setNewPassword(e.target.value)} + required + /> + + + +
+
+ + {error &&

{error}

} + {success &&

{success}

} + + +
+ ); +}; + +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 = () => {
- logo - CrawlerX + logo + {/* 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 (
    - + {/* - + */} + logo
    ); }; 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 = () => {
    - logo - CrawlerX + logo + {/* CrawlerX */}