How can I execute transactions using Internet Identity for canister IDs?

Hello,

I am using Next.js as the frontend for my canister to execute functions. It works fine with Plug Wallet and Bitfinity Wallet extensions. Now, I want to integrate Internet Identity so users can log in with Internet Identity and use the dApp smoothly.

Steps I have done so far:

  • I have integrated Internet Identity, and it works fine for login only.
  • I have added the DID for the required canister ID so I can call functions.

The problem is that when I try to execute the transaction, I am getting two errors:

  1. When I call after login, it gives this error:
    Error: Server returned an error: Code: 404 (Not Found)
  2. After login, when I try to call the approve function, I get this error:
    Error: actor.icrc2_approve is not a function

I have checked that the canister has this function.

What I am trying to achieve:
I want to call canister functions using Internet Identity. Specifically, I want to first call the approve function and then another function, both from different canisters.

Here is the GitHub code:
GitHub Internet Identity

Thank You