thirdweb-dev / examples Goto Github PK

import { IRouteComponentProps } from 'umi'
import { ThirdwebProvider } from "@thirdweb-dev/react";

export default function Layout({ children, location, route, history, match }: IRouteComponentProps) {
  const desiredChainId = 80001;
  return(
    <ThirdwebProvider desiredChainId={desiredChainId}>
      {children}
    </ThirdwebProvider>
  )
}

{
  "name": "react-dapp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "umi dev",
    "build": "umi build",
    "postinstall": "umi generate tmp",
    "prettier": "prettier --write '**/*.{js,jsx,tsx,ts,less,md,json}'",
    "test": "umi-test",
    "test:coverage": "umi-test --coverage"
  },
  "gitHooks": {
    "pre-commit": "lint-staged"
  },
  "lint-staged": {
    "*.{js,jsx,less,md,json}": [
      "prettier --write"
    ],
    "*.ts?(x)": [
      "prettier --parser=typescript --write"
    ]
  },
  "dependencies": {
    "@ant-design/pro-layout": "^6.38.2",
    "@thirdweb-dev/react": "^2.2.7",
    "@thirdweb-dev/sdk": "^2.2.9",
    "ethers": "^5.6.6",
    "react": "^18.1.0",
    "react-dom": "^18.1.0",
    "umi": "^3.5.23"
  },
  "devDependencies": {
    "@types/react": "^18.0.9",
    "@types/react-dom": "^18.0.4",
    "@umijs/preset-react": "1.x",
    "@umijs/test": "^3.5.23",
    "lint-staged": "^12.4.1",
    "prettier": "^2.6.2",
    "react-dev-inspector": "^1.8.0",
    "typescript": "^4.6.4",
    "yorkie": "^2.0.0"
  },
  "engines": {
    "node": ">=12.0.0"
  },
  "create-umi": {
    "ignoreScript": [
      "docker*",
      "functions*",
      "site",
      "generateMock"
    ],
    "ignoreDependencies": [
      "netlify*",
      "serverless"
    ],
    "ignore": [
      ".dockerignore",
      ".git",
      ".github",
      ".gitpod.yml",
      "CODE_OF_CONDUCT.md",
      "Dockerfile",
      "Dockerfile.*",
      "lambda",
      "LICENSE",
      "netlify.toml",
      "README.*.md",
      "azure-pipelines.yml",
      "docker",
      "CNAME",
      "create-umi"
    ]
  }
}

<ConnectButton
  client={client}
  chain={chain}
  chains={[chain]}
  auth={{
    isLoggedIn: async (address) => {
      const loggedIn = await isLoggedIn(address);
      if (!loggedIn) {
        await logout();
      }
      return loggedIn;
    },
    doLogin: async (params) => {
      await login(params);
    },
    getLoginPayload: async ({ address }) => generatePayload({ address }),
    doLogout: async () => {
      await logout();
    },
  }}
/>

const privateKey = env.THIRDWEB_ADMIN_PRIVATE_KEY;

if (!privateKey) {
  throw new Error('Missing THIRDWEB_ADMIN_PRIVATE_KEY in .env file.');
}

const thirdwebAuth = createAuth({
  domain: env.NEXT_PUBLIC_APP_URL || '',
  adminAccount: privateKeyToAccount({ client, privateKey }),
});

export const { generatePayload } = thirdwebAuth;

export async function login(payload: VerifyLoginPayloadParams) {
  const verifiedPayload = await thirdwebAuth.verifyPayload(payload);
  if (verifiedPayload.valid) {
    const jwt = await thirdwebAuth.generateJWT({
      payload: verifiedPayload.payload,
    });
    cookies().set('jwt', jwt);
  }
}

export async function isLoggedIn(address: string) {
  const jwt = cookies().get('jwt');
  if (!jwt?.value) {
    return false;
  }

  const authResult = await thirdwebAuth.verifyJWT({ jwt: jwt.value });
  if (!authResult.valid || authResult.parsedJWT.sub !== address) {
    return false;
  }
  return true;
}

export async function logout() {
  cookies().delete('jwt');
}