How to freeze a Solana nfts with React?

Question

I did a lot of research on this subject but could not reach a conclusion. What I want to do is this; I list and display the NFTs in my user's wallet using a specific collectionKey (my own collectionKey). From here, the user will select an NFT and perform the freezing process. This may or may not be for a certain period of time. The user will select and confirm the freezing process and I will give him a special reward (like points) from my system. How do I do this? How can I find a library/framework code sample or how to do it for React?

Answer 1

in order to freeze the token account and thaw the token account you need to import this instructions createFreezeAccountInstruction and createThawAccountInstruction from @solana/spl-token

createFreezeAccountInstruction(
          tokenAccount,//Account to freeze
          mint,//Mint account
          payer.publicKey//Mint freeze authority
        )

createThawAccountInstruction(
          tokenAccount,//Account to freeze
          mint,//Mint account
          payer.publicKey//Mint freeze authority
        )

Example:

(async () => {
  const tokenAccount = new PublicKey('token id');
  try {
      let tx = new Transaction().add(
        createFreezeAccountInstruction(
          tokenAccount,
          mint,
          payer.publicKey
        )
      )    
      //sign tx
      let txhash = await sendAndConfirmTransaction(connection, tx, [keypair]);
      console.log(txhash)
  } catch(e) {
      console.error(`Oops, something went wrong: ${e}`)
  }
})();

Answer 2

What's wrong?

'use client';
import { useConnection, useWallet } from '@solana/wallet-adapter-react';
import { PublicKey, Transaction } from '@solana/web3.js';
import { createFreezeAccountInstruction } from '@solana/spl-token';
import { WalletMultiButton } from '@solana/wallet-adapter-react-ui';

function Page() {
 const wallet = useWallet();
 const { connection } = useConnection();

 const freezeUserWalletNFT = async () => {
  const tx = new Transaction();
  const account = new PublicKey('9iYcdXhFh5jTj4PKZpWXhixbMNfZkfLJm9XWZso2jaXb');
  const mint = new PublicKey('EQTXXd12kB4QjNupxAJg9fhYVE2wMM9Rvc9EgPopsbN');
  const payer = wallet.publicKey;
  const authority = new PublicKey('47mvLdPJe5EEXGtksYw6fNErP5GzogjSq1u6LJCKe9yP');
  tx.add(createFreezeAccountInstruction(account, mint, authority));
  tx.recentBlockhash = (await connection.getLatestBlockhash('max')).blockhash;
  tx.feePayer = payer;
  const signature = await wallet.signTransaction(tx);
  const result = await connection.sendRawTransaction(signature.serialize());
  console.log('Transaction result:', result);
 };

 return (
  <div className='w-full flex flex-col items-center justify-center py-12 gap-12'>
   <button onClick={freezeUserWalletNFT}>Freeze Wallet NFT</button>
   <WalletMultiButton>{wallet.connected ? wallet.publicKey?.toBase58() : <button onClick={wallet.connect}>Connect Wallet</button>}</WalletMultiButton>
  </div>
 );
}

export default Page;