Zenuxs OAuth

const oauth = new ZenuxOAuth({ clientId: 'your-client-id' });

import React, { useEffect, useRef } from 'react';
import 'zenuxs-oauth'; // Registers <zenuxs-auth> custom element

export default function LoginPage() {
  const authRef = useRef(null);

  useEffect(() => {
    const el = authRef.current;
    if (!el) return;

    const onSuccess = (e) => {
      console.log('Authenticated tokens:', e.detail);
    };

    const onError = (e) => {
      console.error('Auth error:', e.detail);
    };

    el.addEventListener('success', onSuccess);
    el.addEventListener('error', onError);

    return () => {
      el.removeEventListener('success', onSuccess);
      el.removeEventListener('error', onError);
    };
  }, []);

  return (
    <div style={{ maxWidth: 480, margin: '40px auto' }}>
      <zenuxs-auth
        ref={authRef}
        client-id="your-client-id"
        redirect-uri="https://your-app.com/dashboard"
        scope="openid profile email discord:profile"
        theme="dark"
        height="540px"
      />
    </div>
  );
}

import ZenuxOAuth from 'zenuxs-oauth';

const oauth = new ZenuxOAuth({
  clientId: 'your-client-id',
  redirectUri: 'https://your-app.com/callback',
  scopes: 'openid profile email discord:profile'
});

// 1. Trigger login redirect
await oauth.login({ mode: 'redirect' });

// 2. On your callback page (https://your-app.com/callback):
await oauth.init(); // automatically parses URL, exchanges code, and stores tokens

// 3. Retrieve user profile
const userInfo = await oauth.getUserInfo();
console.log('User:', userInfo);

import ZenuxOAuth from 'zenuxs-oauth';

const oauth = new ZenuxOAuth({
  clientId: 'your-client-id',
  scopes: 'openid profile email discord:profile'
});

try {
  const tokens = await oauth.login({ mode: 'popup' });
  console.log('Authenticated via popup:', tokens);

  const userInfo = await oauth.getUserInfo();
  console.log('User profile:', userInfo);
} catch (error) {
  console.error('Popup sign-in failed or closed:', error.message);
}

const oauth = new ZenuxOAuth({
  clientId: 'your-client-id',
  scopes: 'openid profile email discord:profile discord:join_server:1289796285678882847'
});

const userInfo = await oauth.getUserInfo();

// Standard profile
console.log(userInfo.sub);      // "673f8a9b..."
console.log(userInfo.name);     // "Alex Smith"
console.log(userInfo.email);    // "alex@example.com"

// Discord data (when discord:profile scope is requested)
if (userInfo.discord) {
  console.log(userInfo.discord.id);          // Discord Snowflake ID
  console.log(userInfo.discord.username);    // Discord username
  console.log(userInfo.discord.avatar);      // Discord avatar CDN URL
  console.log(userInfo.discord.email);       // Discord email
}

// Discord Guilds (when discord:guilds scope is requested)
if (userInfo.discord_guilds) {
  console.log(userInfo.discord_guilds);      // Array of Discord guilds
}

const express = require('express');
const ZenuxOAuth = require('zenuxs-oauth');

const app = express();

const oauth = new ZenuxOAuth({
  clientId: process.env.ZENUX_CLIENT_ID,
  clientSecret: process.env.ZENUX_CLIENT_SECRET, // Confidential secret (server-side only)
  redirectUri: 'https://your-domain.com/auth/callback',
  scopes: 'openid profile email discord:profile discord:join_server:1289796285678882847'
});

// 1. Step 1: Initiate OAuth Login
app.get('/auth/login', async (req, res) => {
  const authData = await oauth.login({ mode: 'manual' });
  res.redirect(authData.url);
});

// 2. Step 2: Handle OAuth Callback using built-in handleCallback
app.get('/auth/callback', async (req, res) => {
  try {
    const tokens = await oauth.handleCallback({ request: req });
    // tokens contains: { access_token, token_type, expires_in, refresh_token, id_token }

    // Fetch user profile using built-in method
    const userInfo = await oauth.getUserInfo();
    console.log('Logged in user:', userInfo.name, userInfo.discord?.username);

    res.redirect('/dashboard');
  } catch (error) {
    console.error('Callback failed:', error.message);
    res.redirect('/login?error=' + encodeURIComponent(error.message));
  }
});

const oauth = new ZenuxOAuth({
  clientId: 'your-client-id',
  clientSecret: 'your-client-secret', // Backend only! Never in frontend!
  redirectUri: 'https://your-app.com/callback',
  scopes: 'openid profile email discord:profile',
  theme: 'dark', // 'auto', 'light', or 'dark'
  usePKCE: true, // Defaults to true (S256 PKCE)
  validateState: true,
  autoRefresh: true, // Automatically refreshes expired tokens
  debug: false
});