@credix/credix-client

Credix Client

Typescript SDK to interact with the Credix smart contract.

Getting started

We will cover both a JS script example and a react example.

JS script example

Before we get started, it is important to note that you should use "@project-serum/anchor": "^0.18.0" to make use of the NodeWallet.

Let's create a script that fetches the instruction data to deposit in the liquidity pool of the Credix Marketplace.

import { CredixClient } from "@credix/credix-client";
import { PublicKey, Keypair, Connection } from "@solana/web3.js";
import { NodeWallet } from "@project-serum/anchor/dist/cjs/provider";

async function getDepositIxData() {
const connection = new Connection("https://api.mainnet-beta.solana.com");
const dummy_keypair = Keypair.generate();
const wallet = new NodeWallet(dummy_keypair);
const confirmOptions = {
commitment: "confirmed",
preflightCommitment: "processed",
};
const programId = new PublicKey(
"CRDx2YkdtYtGZXGHZ59wNv1EwKHQndnRc1gT4p8i2vPX"
);
const secondaryMarketProgramId = new PublicKey(
"MSMTVTYZXBGJB1SCViC4yGY17tcF2S9meV7iGTyfoAn"
);
const config = { programId: programId, secondaryMarketProgramId, confirmOptions: confirmOptions };
const client = new CredixClient(connection, wallet, config);

// the market for which we want to deposit in the liquidity pool
const market = await client.fetchMarket("credix-marketplace");

// the investor for which we want to get the deposit instruction data
const investor = new PublicKey("CwyQtt6xGptR7PaxrrksgqBSRCZ3Zb2GjUYjKD9jH3tf")

// amount to deposit
const amount = 1_000_000 * 10**6;

const depositIx = await market.depositIx(amount, investor)

return (depositIx);
}

React app example

Create a Client provider (components/ClientProvider.tsx):

import React, { FC, ReactNode } from "react";
import { Wallet } from "@project-serum/anchor";
import { useAnchorWallet, useConnection } from "@solana/wallet-adapter-react";
import { ConfirmOptions, PublicKey } from "@solana/web3.js";
import { CredixClientProvider } from "@credix/credix-client";

const confirmOptions: ConfirmOptions = {
commitment: "confirmed",
preflightCommitment: "processed",
};

const programId = new PublicKey("CRDx2YkdtYtGZXGHZ59wNv1EwKHQndnRc1gT4p8i2vPX")
const secondaryMarketProgramId = new PublicKey(
"MSMTVTYZXBGJB1SCViC4yGY17tcF2S9meV7iGTyfoAn"
);

export const ClientProvider: FC<{ children: ReactNode }> = ({ children }) => {
const { connection } = useConnection();
const wallet = useAnchorWallet();

return (
<CredixClientProvider
connection={connection}
wallet={wallet as Wallet}
config={{
programId: programId,
secondaryMarketProgramId,
confirmOptions: confirmOptions,
}}
>
{children}
</CredixClientProvider>
);
};

In your app.tsx, use the provider:

import React, { FC, useMemo } from "react";
import { AppProps } from "next/app";
import { ConnectionProvider, WalletProvider } from "@solana/wallet-adapter-react";
import { WalletModalProvider } from "@solana/wallet-adapter-react-ui";
import {
LedgerWalletAdapter,
PhantomWalletAdapter,
SlopeWalletAdapter,
SolflareWalletAdapter,
TorusWalletAdapter,
} from "@solana/wallet-adapter-wallets";
import { ClientProvider } from "@components/ClientProvider";

const App: FC<> = ({ Component }) => {
const RPCEndpoint = "https://api.mainnet-beta.solana.com"
const wallets = useMemo(
() => [
new PhantomWalletAdapter(),
new SolflareWalletAdapter(),
new TorusWalletAdapter(),
new LedgerWalletAdapter(),
],
[]
);

return (
<>
<ConnectionProvider endpoint={RPCEndpoint}>
<WalletProvider wallets={wallets} autoConnect>
<WalletModalProvider>
<ClientProvider>
{Component}
</ClientProvider>
</WalletModalProvider>
</WalletProvider>
</ConnectionProvider>
</>
);
};

export default App;

Start using the client in your components:

import { Market, useCredixClient } from "@credix/credix-client";
import { useState } from 'react';

function Invest() {
const [amount, setAmount] = useState(0);
const client = useCredixClient();
const marketSeed = "credix-marketplace"
const market = await client.fetchMarket(marketSeed);

const handleChangeAmount = (event) => {
setAmount(event.target.value);
}

const invest = async () => {
try {
await market.deposit(amount);
} catch (error) {
console.log(error)
}
};

return (
<div>
<h3>Enter the amount you would like to deposit.</h3>
<input
name="depositAmount"
type="number"
onChange={handleChangeAmount}
/>
<Button
onClick={invest}
>
Deposit!
</Button>
</div>
);
}

Generated using TypeDoc