Please copy/paste the below prompt into Caffeine AI to create your own BOB payment integration.
DISCLAIMER: You will need to publish the app for token operations to work properly. This site takes zero responsibility for anything this prompt does or fails to do.
Thanks to WebTree for the original prompt https://vibrew.app/.
>>>
This is a web 3 application.
This is a starter kit for BOB Developers looking to integrate BOB payments into their Caffeine AI apps.
The frontend must use agent host: "https://ic0.app"
Visitors can access the Web3 functionality of the app through the "Web 3 Console" that can be toggled on and off from the bottom of the screen. This console should be semi transparent.
This console allows 4 commands.
"login" command
initiates internet identity 2.0 authentication via "https://id.ai/authorize"
When the user is logged in their BOB balance and principal id (icrc1 address) should be displayed in the upper right hand corner of the console. Clicking on the icrc1 address must copy it to the clipboard. Balance must auto update every 10 seconds. Balance must be displayed with 2 points of decimal precision.
The console ui must display an admin label, if the authenticated user is the admin.
The admin is the first user to log into the service.
"logout" command
Logs the user out of internet identity.
"send " command
Sends BOB to a valid icrc1 address (principal).
"make payment " command
sends BOB to the admin's principal
Avoid use of browser incompatible dependencies that require node, i.e. Buffer.
BOB Token Functionality
1. Sending BOB
Implement functionality for the user to send BOB via the ledger canister 7pail-xaaaa-aaaas-aabmq-cai
2. Displaying Balance
To retrieve the balance, call the ledger canister method:
icrc1balanceof : (record { owner: principal; subaccount: opt vec nat8 }) → (nat) query.
icrc1_decimals: () → (nat8) query
Do not include the optional subaccount parameter in icrc1balanceof.
Use the returned nat value and convert it to BOB by using conversion from icrc1_decimals.
Precision must not be lost
Use compatible types during:
ledger call
conversion
formatting
UI display
Balance Retrieval (pseudocode reference)
export function useGetTokenBalance(token: Token | null) {
const { identity } = useInternetIdentity();
return useQuery({
queryKey: ['tokenBalance', token?.symbol, identity?.getPrincipal().toString()],
queryFn: async () => {
if (!identity || !token) throw new Error('Identity or token not available');
const account = createAccount(identity.getPrincipal());
// For ICP, use the index canister's icrc1balanceof method
if (token.symbol === 'ICP' && token.indexcanisterid) {
const indexActor = await createICPIndexActor(token.indexcanisterid, identity);
const balance = await indexActor.icrc1balanceof(account);
// Convert nat64 to bigint
return BigInt(balance.toString());
}
// For other tokens, use the ledger canister
const ledger = await createGenericLedgerActor(token.ledgercanisterid, identity);
const balance = await ledger.icrc1balanceof(account);
// Return raw balance without normalization
return balance;
},
enabled: !!identity && !!token,
refetchInterval: 10000,
});
}
Summary of Requirements
Implement:
transfer functionality
balance retrieval with icrc1balanceof()
Balance conversion
Display balance with 2-decimal precision
No precision loss in type handling or formatting
Before you begin, what questions do you have?