Skip to content

Can't access NFT claim page after signing up with my wallet #22

@zatarx

Description

@zatarx

After cloning the repo and running the setup commands, I've adjusted my config.ts as follows:

import {
  AlchemyAccountsUIConfig,
  cookieStorage,
  createConfig,
} from "@account-kit/react";
import { alchemy, arbitrumSepolia } from "@account-kit/infra";
import { QueryClient } from "@tanstack/react-query";

const API_KEY = process.env.NEXT_PUBLIC_ALCHEMY_API_KEY;
if (!API_KEY) {
  throw new Error("NEXT_PUBLIC_ALCHEMY_API_KEY is not set");
}

const SPONSORSHIP_POLICY_ID = process.env.NEXT_PUBLIC_ALCHEMY_POLICY_ID;
if (!SPONSORSHIP_POLICY_ID) {
  throw new Error("NEXT_PUBLIC_ALCHEMY_POLICY_ID is not set");
}

const uiConfig: AlchemyAccountsUIConfig = {
  illustrationStyle: "outline",
  auth: {
    sections: [
      [
        {
          type: "external_wallets",
        },
      ],
    ],
    addPasskeyOnSignup: false,
  },
};

export const config = createConfig(
  {
    transport: alchemy({ apiKey: API_KEY }),
    // Note: This quickstart is configured for Arbitrum Sepolia.
    chain: arbitrumSepolia,
    ssr: true, // more about ssr: https://www.alchemy.com/docs/wallets/react/ssr
    storage: cookieStorage, // more about persisting state with cookies: https://www.alchemy.com/docs/wallets/react/ssr#persisting-the-account-state
    enablePopupOauth: true, // must be set to "true" if you plan on using popup rather than redirect in the social login flow
    policyId: SPONSORSHIP_POLICY_ID,
  },
  uiConfig
);

export const queryClient = new QueryClient();

Basically, the idea is that user's wallet is the only way to log in. But after I get prompted by Metamask and click connect, I don't get forwarded to the main NFT claim page (although when I use OTP email login route, it works fine). No errors in dumped in the terminal stdout, browser console or network page.

Versions:

Firefox 128.8.0esr
Metamask 12.17.3
Node v20.18.3
npm 9.2.0

npm list
ui-components-qs-nextjs@0.1.0 /home/kali/Projects/account-kit-app
├── @account-kit/core@4.35.1
├── @account-kit/infra@4.35.1
├── @account-kit/react@4.35.1
├── @radix-ui/react-slot@1.2.3
├── @radix-ui/react-tooltip@1.2.7
├── @tanstack/react-query@5.79.2
├── @types/node@20.17.57
├── @types/react-dom@18.3.7
├── @types/react@18.3.23
├── class-variance-authority@0.7.1
├── clsx@2.1.1
├── eslint-config-next@14.2.4
├── eslint@8.57.1
├── lucide-react@0.511.0
├── next@14.2.4
├── postcss@8.5.4
├── react-dom@18.3.1
├── react@18.3.1
├── tailwind-merge@3.3.0
├── tailwindcss-animate@1.0.7
├── tailwindcss@3.4.17
├── typescript@5.8.3
├── viem@2.30.0
└── wagmi@2.15.4

Could someone take a look?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions