diff --git a/docker-compose.yml b/docker-compose.yml index e87110c..054a2ed 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -21,8 +21,9 @@ services: working_dir: /app volumes: - ./webui:/app - expose: - - "3000" + - /app/node_modules + ports: + - "3000:3000" environment: - NODE_ENV=development - AUTH0_SECRET=${AUTH0_SECRET} @@ -35,10 +36,11 @@ services: - NEXT_PUBLIC_API_URL=${NEXT_PUBLIC_API_URL} - NEXT_PUBLIC_AUTH0_CLIENT_ID=${NEXT_PUBLIC_AUTH0_CLIENT_ID} - NEXT_PUBLIC_AUTH0_DOMAIN=${NEXT_PUBLIC_AUTH0_DOMAIN} - command: "sh -c 'npm install && npm run dev'" + command: sh -c "npm install && npm run dev" networks: - app-network + mssql: image: mcr.microsoft.com/mssql/server:2022-latest container_name: sqlserver diff --git a/webui/auth0-templates/login.html b/webui/auth0-templates/login.html index aab1df5..0219257 100644 --- a/webui/auth0-templates/login.html +++ b/webui/auth0-templates/login.html @@ -61,7 +61,7 @@ display: flex; align-items: center; justify-content: center; - animation: slideLeft 1s ease-out; + animation: slideLeft 0.5s cubic-bezier(0.77, 0, 0.175, 1); position: relative; z-index: 0; } @@ -76,7 +76,7 @@ display: flex; align-items: center; justify-content: center; - animation: slideRight 1s ease-out; + animation: slideRight 0.5s cubic-bezier(0.77, 0, 0.175, 1); position: relative; z-index: 1; } diff --git a/webui/src/app/page.js b/webui/src/app/page.js index af50faf..5c582f4 100644 --- a/webui/src/app/page.js +++ b/webui/src/app/page.js @@ -1,9 +1,180 @@ -import Image from "next/image"; +'use client'; + +import { useUser } from "@auth0/nextjs-auth0"; +import {useEffect, useState} from "react"; export default function Home() { - return ( -
- Login -
- ); -} + const { user, error, isLoading } = useUser(); + const [accessToken, setAccessToken] = useState(null); + + useEffect(() => { + const fetchAccessToken = async () => { + if (user) { + try { + const response = await fetch('/auth/access-token'); + if (response.ok) { + const tokenData = await response.text(); + setAccessToken(tokenData); + } else { + setAccessToken('Token not available'); + } + } catch (error) { + setAccessToken('Error fetching token'); + } + } + }; + + fetchAccessToken().then(r => console.log(r)); + }, [user]); + + if (isLoading) { + return ( +
+
+
+
+
+
+
+
+ ); + } + + if (error) { + return ( +
+
+
{error.message}
+
+ +
+ + Sign In + + +
+
+
+ ); + } + + return ( +
+
+ {user ? ( +
+
+
+ {user.picture ? ( + Profile + ) : ( +
+ {user.name?.charAt(0) || user.email?.charAt(0) || '👤'} +
+ )} +
+

+ Just testing :P +

+
+ +
+
+

+ Auth Details +

+
+
+
+
+
+ +
+ {user.name || 'Not provided'} +
+
+
+ +
+ {user.email || 'Not provided'} +
+
+
+ +
+ {user.sub || 'Not available'} +
+
+ {user.nickname && ( +
+ +
+ {user.nickname} +
+
+ )} +
+ +
+ {accessToken} +
+
+
+ +
+ +
+ 
+                                                {JSON.stringify(user, null, 2)}
+
+
+
+
+
+
+ +
+ +
+ + Sign Out + + +
+
+ ) : ( +
+ )} +
+
+ ); +} \ No newline at end of file diff --git a/webui/src/lib/auth0.js b/webui/src/lib/auth0.js index 79fd779..4c63bf2 100644 --- a/webui/src/lib/auth0.js +++ b/webui/src/lib/auth0.js @@ -2,7 +2,7 @@ import { Auth0Client } from "@auth0/nextjs-auth0/server"; export const auth0 = new Auth0Client({ authorizationParameters: { - scope: 'openid profile email read:shows', + scope: 'openid profile email', audience: 'imprink-front' } }); \ No newline at end of file