How to use the stellar-sdk.Asset.native function in stellar-sdk

function TradingForm(props: Props) {
  const isSmallScreen = useIsMobile()
  const [primaryAsset, setPrimaryAsset] = React.useState(props.initialPrimaryAsset)
  const [primaryAmountString, setPrimaryAmountString] = React.useState("")
  const [secondaryAsset, setSecondaryAsset] = React.useState(Asset.native())
  const [manualPrice, setManualPrice] = React.useState({})
  const [priceMode, setPriceMode] = React.useState<"primary" | "secondary">("secondary")

  const horizon = useHorizon(props.account.testnet)
  const tradePair = useLiveOrderbook(primaryAsset || Asset.native(), secondaryAsset, props.account.testnet)

  const price =
    manualPrice.value && isValidAmount(manualPrice.value)
      ? priceMode === "secondary"
        ? BigNumber(manualPrice.value)
        : BigNumber(manualPrice.value).eq(0) // prevent division by zero
        ? BigNumber(0)
        : BigNumber(1).div(manualPrice.value)
      : BigNumber(0)

  const primaryAmount =
    primaryAmountString && isValidAmount(primaryAmountString) ? BigNumber(primaryAmountString) : BigNumber(0)

  const primaryBalance = primaryAsset ? findMatchingBalance(props.accountData.balances, primaryAsset) : undefined

  const secondaryBalance = secondaryAsset ? findMatchingBalance(props.accountData.balances, secondaryAsset) : undefined

export function parseAssetID(assetID: string) {
  if (assetID === "XLM") {
    return Asset.native()
  } else {
    const [issuer, code] = assetID.split(":")
    return new Asset(code, issuer)
  }
}

issuer: string;
    assetcode: string;
    tlimit: string;
    balance: string;
    flags: number;
    lastmodified: number;
  }) {
    this.accountID = data.accountid;
    this.limit = toFloatAmountString(data.tlimit);
    this.balance = toFloatAmountString(data.balance);
    this.lastModified = data.lastmodified;
    this.authorized = (data.flags & stellar.xdr.TrustLineFlags.authorizedFlag().value) > 0;

    this.asset =
      data.assettype === stellar.xdr.AssetType.assetTypeNative().value
        ? Asset.native()
        : new Asset(data.assetcode, data.issuer);
  }
}

import { mobiAsset } from 'utils/env';
import { Asset } from 'stellar-sdk';

export const assets = {
  mobi: mobiAsset,
  native: Asset.native(),
  xlm: Asset.native(),
  usd: new Asset(
    'USD',
    'GA2HGBJIJKI6O4XEM7CZWY5PS6GKSXL6D34ERAJYQSPYA6X6AI7HYW36'
  ),
};

export function parseBalance(account) {
  if (!account) {
    return null;
  }

  return account.balances.reduce((acc, b) => {
    acc[(b.asset_code || b.asset_type).toLowerCase()] = b;
    return acc;
  }, {});
}

export const AssetInstance = asset => {
  if(!asset) return null;
  if(asset instanceof Asset) {
    return asset;
  }
  if(asset.asset_type === 'native') {
    return Asset.native();
  }
  return new Asset(asset.asset_code, asset.asset_issuer);
};

        onClick={() => props.onOpenAssetDetails(Asset.native())}
        spendableBalance

() => [
      ...trustedAssets.map((asset, index) => {
        const [metadata] = assetMetadata.get(asset) || [undefined, false]
        return (
           (domElement ? balanceItemsRef.current.set(index, domElement) : undefined)}
            assetMetadata={metadata}
            balance={accountData.balances.find(balance => isAssetMatchingBalance(asset, balance))!}
            compact={props.compact}
            onClick={props.onClick && isAccountActivated ? handleClick : undefined}
          />
        )
      }),
      
          domElement ? balanceItemsRef.current.set(accountData.balances.length - 1, domElement) : undefined
        }
        balance={nativeBalance}
        compact={props.compact}
        onClick={props.onClick && isAccountActivated ? handleClick : undefined}
      />
    ],
    [

path: this.data["path_payment_op.assets_path"].map((assetData: IAssetData) => {
          return assetData.native
            ? Asset.native()
            : new Asset(assetData.code, assetData[assetIssuerPredicate][accountIdPredicate]);
        })
      }

private mapPathPayment(): IDgraphPathPaymentOperation {
    const destinationAssetData = this.data["path_payment_op.asset_destination"];
    const sourceAssetData = this.data["path_payment_op.asset_source"];

    const destinationAsset = destinationAssetData.native
      ? Asset.native()
      : new Asset(destinationAssetData.code, destinationAssetData[assetIssuerPredicate][accountIdPredicate]);
    const sourceAsset = sourceAssetData.native
      ? Asset.native()
      : new Asset(sourceAssetData.code, sourceAssetData[assetIssuerPredicate][accountIdPredicate]);

    return {
      ...this.baseData,
      ...{
        sendMax: this.data.send_max,
        destinationAmount: this.data.amount,
        destinationAccount: this.data[opDestinationPredicate][accountIdPredicate],
        destinationAsset,
        sourceAccount: this.data["op.source"][accountIdPredicate],
        sourceAsset,
        path: this.data["path_payment_op.assets_path"].map((assetData: IAssetData) => {
          return assetData.native