Getting the following error when I call the add_account function in the below contract . The function takes a address argument, so from the react app, when i convert the address to ScVal using StellarSdk.Address, I get the error . I get thesame error when I try to call a simple contract that takes a simple i128 value . How do I convert javascipt types from a react app to scVal the corret way ?

list.tsx?t=1717348093628:50 Error in contractInvoke:  TypeError: XDR Write Error: [object Object] is not a ScVal
    at n2.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:778:25)
    at F.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:605:35)
    at n2.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:710:22)
    at n2.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:779:69)
    at n2.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:710:22)
    at n2.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:779:69)
    at n2.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:710:22)
    at F.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:605:35)
    at n2.write (@soroban-react_contracts.js?t=1717347073433&v=55163878:710:22)
    at n2.toXDR (@soroban-react_contracts.js?t=1717347073433&v=55163878:205:29)

import { TxResponse, contractInvoke} from "@soroban-react/contracts";
import { useSorobanReact } from '@soroban-react/core';
 
import * as StellarSdk from '@stellar/stellar-sdk';
import { useEffect } from "react";
 
const List = () =>  {
     const sorobanContext = useSorobanReact();

    const addr = new StellarSdk.Address('CB3RBKDU2ERADNOOQ2RVLEUSGSASPO53D67SUNRP2DJ7WR5JIZ3GXS4D').toScVal();
 
    const sendTx = async() => {
        try {
        const response = (await contractInvoke({
            contractAddress: "CD6VCRGMFSUKRSHJLC3OD5MDYZZ5EYL4EEIPHADZU4N2W3K2SH245UYA",
            method: 'add_account', 
            args: [addr], 
            sorobanContext,
            signAndSend: true,
            skipAddingFootprint: true, //
            fee: 100, 
          })) as TxResponse;

          console.log('response ', response)
        } catch (error) {
            console.error('Error in contractInvoke: ', error);
        }   
    }
    useEffect(() => {
        sendTx();
    }, [])

    return(<>
    </>)
}
export default List

Contract

#![no_std]
use soroban_sdk::{contract, contractimpl, log, symbol_short, Address, Env, Symbol};
 
const ACCOUNT: Symbol = symbol_short!("ACCOUNT");

#[contract]
pub struct MyContract;

#[contractimpl]
impl MyContract {
 
    pub fn add_account(env: Env, account: Address) {

        env.storage().instance().set(&ACCOUNT, &account); 
        env.storage().instance().extend_ttl(50, 100);
    }
 

    pub fn get_account(e: Env) -> Address {
        e.storage().instance().get(&ACCOUNT).unwrap()
    }
}