diff --git a/components/LoginButton.tsx b/components/LoginButton.tsx new file mode 100644 index 0000000..29b1e24 --- /dev/null +++ b/components/LoginButton.tsx @@ -0,0 +1,21 @@ +import React from 'react'; + +interface ButtonProps { + onClick: () => void; + text: string; +} + +const Button: React.FC = ({ onClick, text }) => { + return ( + + ); +}; + +export default Button; \ No newline at end of file diff --git a/pages/auth.tsx b/pages/auth.tsx index 2519ee4..aa56f4b 100644 --- a/pages/auth.tsx +++ b/pages/auth.tsx @@ -4,6 +4,8 @@ import { useEffect } from 'react'; import axios from 'axios'; import { usePrivy } from '@privy-io/react-auth'; import Link from 'next/link'; +import Button from '../components/LoginButton'; +import Head from 'next/head'; const Home: React.FC = () => { const { login, ready, user } = usePrivy(); @@ -65,33 +67,43 @@ const Home: React.FC = () => { }, [ready, user]); return ( -
+ +
+ + Link W3B Launcher · W3B Games + + +
+
+
+
+
+

METAHUNT

+
+
+ +
+
+
{user && ready ? (
-

Login Successful!

+

Login Successful!

Your W3B Launcher is now securely connected.

- -
- Enter Dashboard -
- +
) : ( -
-

Connect your W3B Games Launcher

-

Connect your crypto wallet to access the W3B Games ecosystem

- +
+

Link your W3B Games Launcher

+ {/*

Connect your crypto wallet to access the W3B Games ecosystem

*/} +
)}
+
+
); }; diff --git a/pages/index.tsx b/pages/index.tsx index 2bba6bd..b881997 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -4,7 +4,8 @@ import { GetServerSideProps } from "next"; import Head from "next/head"; import { useRouter } from "next/router"; import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; -import { faCube, faRocket } from "@fortawesome/free-solid-svg-icons"; +import { faRocket } from "@fortawesome/free-solid-svg-icons"; +import Button from "../components/LoginButton"; export const getServerSideProps: GetServerSideProps = async ({ req }) => { const cookieAuthToken = req.cookies["privy-token"]; @@ -37,28 +38,30 @@ export default function LoginPage() { <> Login · W3B Games + -
-
-
-
- -
-

- Welcome to W3B Game Dashboard -

-

- Embark on a Web3 adventure like no other -

-
- +
+
+
+
+
+
+

METAHUNT

+
+
+ +
+
+
+ +
+
+
diff --git a/pages/logincomplete.tsx b/pages/logincomplete.tsx index 4faf4a3..f2df38b 100644 --- a/pages/logincomplete.tsx +++ b/pages/logincomplete.tsx @@ -3,68 +3,100 @@ import axios from "axios"; import Head from "next/head"; import { useRouter } from "next/router"; import { SetStateAction, useEffect, useState } from "react"; +import Button from "../components/LoginButton"; export default function LoginComplete() { const [username, setUsername] = useState(""); - const [error, setError] = useState(""); - const {ready, user,authenticated} = usePrivy(); + const [error, setError] = useState(""); + const { ready, user, authenticated } = usePrivy(); const router = useRouter(); + const [loading, setLoading] = useState(true); // Add loading state + const handleUsernameChange = (e: { target: { value: SetStateAction; }; }) => { setUsername(e.target.value); setError(""); }; - useEffect(()=>{ + useEffect(() => { if (ready && !authenticated) { router.push("/"); } - },[ready, user]) + }, [ready, user]) + + useEffect(() => { + const fetchUsername = async () => { + const params = new URLSearchParams(window.location.search); + const requestIdFromUrl = params.get('request_id'); + + try { + const response = await fetch(`https://vps.playpoolstudios.com/metahunt/api/launcher/get_display_name_public.php?id=${user?.id}`); + const databaseUsername = await response.text(); + + if (databaseUsername != "-1") { + router.push("/dashboard"); + + return; + } else { + setLoading(false); // Set loading to false after fetch completes + + } + } catch (error) { + console.error('Error fetching username:', error); + } finally { + + } + }; + + if (ready && authenticated) { + fetchUsername(); + } + }, [ready, authenticated, user]); const setResult = async (result: string, wallet: string) => { const params = new URLSearchParams(window.location.search); const requestIdFromUrl = params.get('request_id'); if (!result.includes('privy')) { - return; + return; } try { - //Get username from database - const response = await fetch(`https://vps.playpoolstudios.com/metahunt/api/launcher/get_display_name_public.php?id=${user?.id}`); - const databaseUsername = await response.text(); + //Get username from database + const response = await fetch(`https://vps.playpoolstudios.com/metahunt/api/launcher/get_display_name_public.php?id=${user?.id}`); + const databaseUsername = await response.text(); - if (databaseUsername == "-1") { - console.log(user?.id); - router.push("/logincomplete?request_id=" + requestIdFromUrl); - return; - } + if (databaseUsername == "-1") { + console.log(user?.id); + router.push("/logincomplete?request_id=" + requestIdFromUrl); + return; + } - await axios({ - method: 'get', - url: `https://vps.playpoolstudios.com/metahunt/api/launcher/set_request_response.php`, - withCredentials: false, - params: { - id: requestIdFromUrl, - result: result - }, - }); - console.log(`https://vps.playpoolstudios.com/metahunt/api/launcher/set_request_response.php?id=${requestIdFromUrl}&result=${result}`); - await axios({ - method: 'get', - url: `https://vps.playpoolstudios.com/metahunt/api/launcher/set_wallet.php`, - withCredentials: false, - params: { - id: result, - wallet: wallet, - init: "true" - }, - }); + await axios({ + method: 'get', + url: `https://vps.playpoolstudios.com/metahunt/api/launcher/set_request_response.php`, + withCredentials: false, + params: { + id: requestIdFromUrl, + result: result + }, + }); + console.log(`https://vps.playpoolstudios.com/metahunt/api/launcher/set_request_response.php?id=${requestIdFromUrl}&result=${result}`); + await axios({ + method: 'get', + url: `https://vps.playpoolstudios.com/metahunt/api/launcher/set_wallet.php`, + withCredentials: false, + params: { + id: result, + wallet: wallet, + init: "true" + }, + }); } catch (error) { - console.error('Error making GET request:', error); + console.error('Error making GET request:', error); } -}; + }; const handleClaim = async () => { - + try { const response = await fetch( `https://vps.playpoolstudios.com/metahunt/api/web/validate_username.php?username=${username}` @@ -80,7 +112,7 @@ export default function LoginComplete() { setResult(user?.id ?? "", user?.wallet?.address ?? ""); console.log("Username successfully set!"); - router.push("/dashboard"); + router.push("/dashboard"); } else { setUsername(""); setError(`Sorry, ${username} is not available`); @@ -93,33 +125,46 @@ export default function LoginComplete() { return ( <> - - Complete Login - -
-
-

Complete Your Login

-

Enter your unique username

-
- - {error &&

{error}

} - -
- + + Complete Login + +
+
+
+
+
+
+

METAHUNT

+
+
+ +
+
+ + {loading ? ( // Conditional rendering based on loading state +
Loading...
// Replace with your loading animation + ) : ( +
+

Claim your username

+
+ + {error &&

{error}

} + +
+
+
+
+ )} +
-
); } diff --git a/public/logos/logo.png b/public/logos/logo.png new file mode 100644 index 0000000..a6b5aa9 Binary files /dev/null and b/public/logos/logo.png differ diff --git a/tailwind.config.js b/tailwind.config.js index 394a3e7..bc3c900 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -7,6 +7,7 @@ module.exports = { extend: { fontFamily: { sans: ['Adelle Sans', ...defaultTheme.fontFamily.sans], + inter: ['Inter', 'sans-serif'], }, colors: { 'privy-navy': '#160B45',