auto login / anon login

src/components/Layout.js

@@ -0,0 +1,11 @@
+import React from 'react';
+import { useAutoLogin } from '@/hooks/useAutoLogin';
+
+const Layout = ({ children }) => {
+  useAutoLogin(); 
+  console.log('Layout');
+
+  return <>{children}</>;
+};
+
+export default Layout;

src/hooks/useAutoLogin.js

@@ -0,0 +1,39 @@
+import { useEffect } from 'react';
+import { useRouter } from 'next/router';
+import { useDispatch } from 'react-redux';
+import axios from 'axios';
+import { setPubkey, setUsername } from "@/redux/reducers/userReducer";
+
+export const useAutoLogin = () => {
+  const dispatch = useDispatch();
+  const router = useRouter();
+  console.log('useAutoLogin');
+
+  useEffect(() => {
+      const publicKey = window.localStorage.getItem('pubkey');
+      console.log('Auto logging in with public key:', publicKey);
+
+    if (publicKey) {
+      const login = async () => {
+        try {
+          const response = await axios.get(`/api/users/${publicKey}`);
+          if (response.status === 200 && response.data) {
+            dispatch(setPubkey(publicKey));
+            if (response.data.username) {
+              dispatch(setUsername(response.data.username));
+            }
+          } else {
+            // Handle user not found or other errors appropriately
+          }
+        } catch (error) {
+          console.error('Error during auto login:', error);
+          // Handle error
+        }
+      };
+
+      login();
+    }
+  }, [dispatch]);
+
+  return null;
+};

src/pages/_app.js

@@ -3,6 +3,7 @@ import { Provider } from "react-redux";
 import { store } from "@/redux/store";
 import Navbar from '@/components/navbar/Navbar';
 import { ToastProvider } from '@/hooks/useToast';
+import Layout from '@/components/layout';
 import '@/styles/globals.css'
 import 'primereact/resources/themes/lara-dark-indigo/theme.css';
 
@@ -13,8 +14,10 @@ export default function MyApp({
         <Provider store={store}>
             <PrimeReactProvider>
                 <ToastProvider>
-                    <Navbar />
+                    <Layout>
-                    <Component {...pageProps} />
+                        <Navbar />
+                        <Component {...pageProps} />
+                    </Layout>
                 </ToastProvider>
             </PrimeReactProvider>
         </Provider>

src/pages/api/users/[slug].js

@@ -9,7 +9,6 @@ export default async function handler(req, res) {
   try {
     let user;
     if (isPubkey) {
-        console.log('is pub', slug);
       // If slug is a pubkey
       user = await getUserByPubkey(slug);
     } else {

src/pages/login.js

@@ -5,6 +5,7 @@ import { useRouter } from "next/router";
 import { Button } from 'primereact/button';
 import { useToast } from "@/hooks/useToast";
 import { useNostr } from "@/hooks/useNostr";
+import { generateSecretKey, getPublicKey } from 'nostr-tools'
 import { findKind0Username } from "@/utils/nostr";
 import { setPubkey, setUsername } from "@/redux/reducers/userReducer";
 
@@ -12,6 +13,7 @@ const Login = () => {
     const dispatch = useDispatch();
     const router = useRouter();
     const { showToast } = useToast();
+    const { fetchKind0 } = useNostr();
 
     const nostrLogin = async () => {
         try {
@@ -28,6 +30,7 @@ const Login = () => {
                 const response = await axios.get(`/api/users/${publicKey}`);
                 if (response.status === 200 && response.data) {
                     dispatch(setPubkey(publicKey));
+                    window.localStorage.setItem('pubkey', publicKey);
                     if (response.data.username) {
                         dispatch(setUsername(response.data.username));
                     }
@@ -47,6 +50,7 @@ const Login = () => {
                 const createUserResponse = await axios.post(`/api/users`, payload);
                 if (createUserResponse.status === 201) {
                     dispatch(setPubkey(publicKey));
+                    window.localStorage.setItem('pubkey', publicKey);
                     if (username) {
                         dispatch(setUsername(username));
                     }
@@ -60,6 +64,16 @@ const Login = () => {
         }
     };
 
+    const anonymousLogin = async () => {
+        const secretKey = generateSecretKey();
+        const publicKey = getPublicKey(secretKey);
+
+        dispatch(setPubkey(publicKey));
+        window.localStorage.setItem('pubkey', publicKey);
+        window.localStorage.setItem('seckey', secretKey);
+        router.push('/');
+    };
+
     return (
         <div className="w-fit mx-auto mt-24 flex flex-col justify-center">
             <h1 className="text-center mb-8">Login</h1>
@@ -75,6 +89,7 @@ const Login = () => {
                 icon="pi pi-user"
                 className="text-[#f8f8ff] w-[250px] my-4"
                 rounded
+                onClick={anonymousLogin}
             />
         </div>
     )