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
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions