> For the complete documentation index, see [llms.txt](https://style-protocol.gitbook.io/sdk/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://style-protocol.gitbook.io/sdk/referenence/for-developers/web.md).

# Web

{% hint style="info" %}
[Repository](https://github.com/STYLE-Protocol/STYLE-Protocol-SDK)
{% endhint %}

## Fetch NFTs

### Fetch requested NFTs

**How to import:**

```javascript
import { getRequestedNFTs } from '@style-protocol/sdk'
```

**How it looks like:**

```javascript
const getRequestedNFTs = async ({
  cursor = 0,
  amount = 100,
  chainId = 5,
  metaverseFilter = [],
  typeFilter = [],
  subtypeFilter = [],
})
```

* `cursor: integer` - Start index of `getStakes` protocol\`s function (as it uses pagination).
* `amount: integer` - Number of viewed indexes of `getStakes` protocol\`s function (as it uses pagination).
* `chainId: integer` - Chain Id to be able to use it cross-chain.
* `metaverseFilter: string | string[]` - Using for metaverse filter. Any alone strings are converted to `[string]`. Currently possible values are: `decentranland`, `sandbox`, `somnium_space`, `cryptovoxels, fabwelt`. Use empty array to get items from all metaverses.
* `typeFilter: string | string[]` - Using for asset type filter. Any alone strings are converted to `[string]`. Currently possible values are: `AVATAR`, `WEARABLE`, `MISC`. Use empty array to get items of all types.
* `subtypeFilter: string | string[]` - Using for asset subtype filter. Any alone strings are converted to `[string]`.  Use empty array to get items of all types.

**Return value:**

* If succeded:

```javascript
[
    {
      tokenAddress: '0xc36442b4a4522e871399cd717abdd847ab11fe88',
      tokenId: 36639,
      payment: {
        value: { type: 'BigNumber', hex: '0x014d1120d7b1600000' },
        stringValue: '24',
      },
      paymentToken: {
        address: '0x48d373E2B7f0930DAEF4C51CA63711bdD9b5C5B0',
        name: 'USD Circle',
        symbol: 'USDC',
      },
      type: 'AVATAR',
      subtype: 'Other',
      tailorId: '632422280100cd8980997351',
      jobId: '633dd5ae8e81caae508afad9',
      uri: 'https://stylexchange.mypinata.cloud/ipfs/QmVab2rT96LjdqTWEaQihj4CDVvq9bbm7bgTxUZ5b8YeVt',
      bidder: '0xb396aedb7e8eea5b29501f5dba173d82458c8e17',
      signature:
        '0x531fa0f96276037b14f61ebd2bf1702594e5ed9a67e6261e763e2163a63352d34e57d1e9d2ebee6255da18f313a873255842d4b8d391a2da63a5fe043fb5de2e1b',
      environment: '0x67701e71F9412Af1BcB2D77897F40139B6Ccc073',
      metaverseId: 0,
      adminSignature:
        '0x5a16fe5d80fa1c9a3a4400babfba2e298465eb04e429e9ea0e2e0d52cf33aea404143ffb77e03487adb56c6d048c6e6390a98da8333adb0dd1070b98fdba4a401c',
      asset: {
        name: 'Derivative from Uniswap - 0.3% - USDC/SP - MIN<>100050',
        description:
          'StyleXchange derivative from Uniswap - 0.3% - USDC/SP - MIN<>100050 for DECENTRALAND',
        image:
          'https://stylexchange.mypinata.cloud/ipfs/QmdE18pYr2RE8toGZVC8PJ87ryfZ2u1pL73wX6y4Ansuz6',
        animation_url:
          'https://stylexchange.mypinata.cloud/ipfs/bafkreidqpr3ixz5wahwmpuoqwdhlwsraju3tz2wbf3nnopo4uexxnafgpu',
      },
      cid: 'QmSTGGifjf669XWEFA7RxHkTGDNS23GLXjzyHKPFFuhBV8',
      numberOfDerivatives: 5,
    },
  ]
```

* If failed:

```javascript
[]
```

## Buy NFTs

### Approve ERC20 tokens to protocol

#### Web3.js

**How to import:**

```javascript
import { approveERC20 } from '@style-protocol/sdk'
```

**How it looks like:**

```javascript
const approveERC20 = async ({ web3, walletAddress, NFT, spender })
```

* `web3: Web3` - Web3 object from [web3](https://www.npmjs.com/package/web3) library (to use user's wallet).
* `walletAddress: string` - Wallet address to use it to sign transactions.
* `NFT: dict` - Object with NFT data (element of array taken from [fetch](#fetch-nfts) functions).
* spender`: approve`- Spender of allowance.

**Return value:**

* If succeded:

```javascript
true
```

* If failed:

```javascript
false
```

#### Ethers.js

**How to import:**

```javascript
import { approveERC20Ethers } from '@style-protocol/sdk'
```

**How it looks like:**

```javascript
const approveERC20Ethers = async ({ signer, NFT, spender })
```

* `signer: Signer` - Signer object from [ethers](https://www.npmjs.com/package/ethers) library (to use user's wallet).
* `NFT: dict` - Object with NFT data (element of array taken from [fetch](#fetch-nfts) functions).
* spender`: approve`- Spender of allowance.

**Return value:**

* If succeded:

```javascript
true
```

* If failed:

```javascript
false
```

### Buy requested NFTs

#### Web3.js

**How to import:**

```javascript
import { buyAndMintItem } from '@style-protocol/sdk'
```

**How it looks like:**

```javascript
const buyAndMintItem = async ({ web3, walletAddress, chainId, NFT })
```

* `web3: Web3` - Web3 object from [web3](https://www.npmjs.com/package/web3) library (to use user's wallet).
* `walletAddress: string` - Wallet address to use it to sign transactions.
* `chainId: integer` - Chain Id to be able to use it cross-chain.
* `NFT: dict` - Object with NFT data (element of array taken from [fetch requested NFTs](#fetch-requested-nfts) function).

**Return value:**

* If succeded:

```javascript
true
```

* If failed:

```javascript
false
```

#### Ethers.js

**How to import:**

```javascript
import { buyAndMintItemEthers } from '@style-protocol/sdk'
```

**How it looks like:**

```javascript
const buyAndMintItemEthers = async ({ signer, chainId, NFT })
```

* `signer: Signer` - Signer object from [ethers](https://www.npmjs.com/package/ethers) library (to use user's wallet).
* `chainId: integer` - Chain Id to be able to use it cross-chain.
* `NFT: dict` - Object with NFT data (element of array taken from [fetch requested NFTs](#fetch-requested-nfts) function).

**Return value:**

* If succeded:

```javascript
true
```

* If failed:

```javascript
false
```

## Fetch Models

> Our protocol uses semi-decentralized storage architecture for models conneted with our NFTs, so that only the owner is able to see his NFT's model.

### Get User Proof

#### Web3.js

**How to import:**

```javascript
import { getUserProof } from '@style-protocol/sdk'
```

**How it looks like:**

```javascript
const getUserProof = async ({ web3, walletAddress, cached=true })
```

* `web3: Web3` - Web3 object from [web3](https://www.npmjs.com/package/web3) library (to use user's wallet).
* `walletAddress: string` - Wallet address to use it to sign transactions.
* cached`: bool` - If the userProof could be saved to the cache or not.

**Return value:**

* If succeded:

```javascript
{
    signature: "0x00",
    walletAddress: "0x00",
}
```

* If failed:

```javascript
Error
```

#### Ethers.js

**How to import:**

```javascript
import { getUserProofEthers } from '@style-protocol/sdk'
```

**How it looks like:**

```javascript
const getUserProofEthers = async ({ signer, cached=true})
```

* `signer: Signer` - Signer object from [ethers](https://www.npmjs.com/package/ethers) library (to use user's wallet).
* cached`: bool` - If the User Proof could be saved to the cache or not.

**Return value:**

* If succeded:

```javascript
{
    signature: "0x00",
    walletAddress: "0x00",
}
```

* If failed:

```javascript
Error
```

### Get an URL of the model

**How to import:**

```javascript
import { getParsedURI } from '@style-protocol/sdk'
```

**How it looks like:**

```javascript
const getParsedURI = async ({ uri, userProof })
```

* uri`: string` - model\_url from the NFT's metadata.
* userProof`: Dict` - User Proof got using the [section](#get-user-proof) above.

**Return value:**

* If succeded:

```javascript
https://<host>/<signature>/<walletAddress>/<modelName>
OR
ipfs://<ipfsHash> (old ones)
```

* If failed:

```javascript
Error
```