Embedded Wallets

npm install @civic/auth @civic/auth-web3

import express, { Request, Response, NextFunction } from "express";
import cookieParser from "cookie-parser";
import { CookieStorage, CivicAuth } from "@civic/auth/server";

const app = express();
app.use(cookieParser());

const config = {
  clientId: process.env.CLIENT_ID!,
  redirectUrl: "http://localhost:3001/auth/callback",
  postLogoutRedirectUrl: "http://localhost:3001/",
};

class ExpressCookieStorage extends CookieStorage {
  constructor(private req: Request, private res: Response) {
    super({ secure: process.env.NODE_ENV === "production" });
  }

  async get(key: string): Promise<string | null> {
    return this.req.cookies[key];
  }

  async set(key: string, value: string): Promise<void> {
    this.res.cookie(key, value, this.settings);
  }

  async clear(): Promise<void> {
    for (const key in this.req.cookies) {
      this.res.clearCookie(key);
    }
  }

  async delete(key: string): Promise<void> {
    this.res.clearCookie(key);
  }
}

app.use((req: Request, res: Response, next: NextFunction) => {
  req.storage = new ExpressCookieStorage(req, res);
  req.civicAuth = new CivicAuth(req.storage, config);
  next();
});

app.get("/", async (req: Request, res: Response) => {
  const url = await req.civicAuth.buildLoginUrl();
  res.redirect(url.toString());
});

app.get("/auth/callback", async (req: Request, res: Response) => {
  const { code, state } = req.query as { code: string; state: string };
  await req.civicAuth.resolveOAuthAccessCode(code, state);
  res.redirect("/admin/dashboard");
});

import { getWallets } from "@civic/auth-web3/server";

app.get("/admin/dashboard", async (req: Request, res: Response) => {
  const user = await req.civicAuth.getUser();
  const tokens = await req.civicAuth.getTokens();

  if (!user) return res.status(401).send("Unauthorized");

  const userDetails = {
    ...user,
    idToken: tokens?.idToken || "",
  };

  const wallets = await getWallets(userDetails);

  res.json({
    user: user.name,
    walletAddresses: wallets.map((wallet) => wallet.walletAddress),
  });
});

const authMiddleware = async (req: Request, res: Response, next: NextFunction) => {
  if (!req.civicAuth.isLoggedIn()) return res.status(401).send("Unauthorized");
  next();
};

app.use("/admin", authMiddleware);

declare global {
  namespace Express {
    interface Request {
      storage: ExpressCookieStorage;
      civicAuth: CivicAuth;
    }
  }
}