diff --git a/.env.example b/.env.example index 2e42c094..fde429f0 100644 --- a/.env.example +++ b/.env.example @@ -1 +1 @@ -STORYBOOK_COVALENT_API_KEY +STORYBOOK_GOLDRUSH_API_KEY diff --git a/.storybook/preview.tsx b/.storybook/preview.tsx index b125a7eb..cd7f98a4 100644 --- a/.storybook/preview.tsx +++ b/.storybook/preview.tsx @@ -20,7 +20,7 @@ const preview: Preview = { decorators: [ (storyFn) => ( - - GoldRush Kit Logo + + GoldRush Kit Logo @@ -16,14 +16,19 @@ MIT

-

Beautifully designed React components for your dApp frontend.

+

+ Beautifully designed React components for your dApp frontend. +

-200+ Chains. Open-source. Customizable. + 200+ Chains. Open-source. Customizable.
+


- Explore the docs » + + Explore the docs » +

@@ -50,7 +55,8 @@ import { GoldRushProvider } from "@covalenthq/goldrush-kit"; ``` 2. Wrap `GoldRushProvider` around the application. -3. Configure the provider and add it to the `apikey` props with your Covalent API key. You can register for a free key on [Covalent's website](https://www.covalenthq.com/platform/auth/register/). +3. Configure the provider and add it to the `apikey` props with your GoldRush API key. You can register for a free key on [GoldRush's website](https://goldrush.dev/platform/auth/register/). + > **Note:** You should always keep your API key private, never put it directly into your code, especially front end code. Instead, use an environment variable to inject the key into your code. ```tsx {children} @@ -62,38 +68,38 @@ import { GoldRushProvider } from "@covalenthq/goldrush-kit"; import "@covalenthq/goldrush-kit/styles.css"; ``` -5. Add desired components. If you're using `next.js` versions `^13.0` and are using `app` router, make sure you have `use client;` at the top of the file to disable Next's server component modules. Visit GoldRush's [component documentation](https://www.covalenthq.com/docs/unified-api/goldrush/kit/gold-rush-provider/) for more information. +5. Add desired components. + > **Note:** If you're using `next.js` versions `^13.0` and are using `app` router, make sure you have `use client;` at the top of the file to disable Next's server component modules. Visit GoldRush's [component documentation](https://goldrush.dev/docs/unified-api/goldrush/kit/gold-rush-provider/) for more information. ```tsx import { GoldRushProvider, - NFTWalletTokenListView, - TokenBalancesListView, - TokenTransfersListView, - AddressActivityListView, + NFTWalletCollectionList, + TokenBalancesList, + TokenTransfersList, + AddressActivityList, } from "@covalenthq/goldrush-kit"; ``` ## Ready-to-go React Component example -Here's a full example to get you started. If you're using `next.js` versions `^13.0` and are using `app` router, make sure you have `use client;` at the top of the file to disable Next's server component modules. - -**Note:** You should always keep your API key private, never put it directly into your code, especially front end code. Instead, use an environment variable to inject the key into your code. +Here's a full example to get you started. -Be sure to secure your key to prevent unauthorized use in the Covalent platform by restricting usage to specific URLs. +Be sure to secure your key to prevent unauthorized use in the GoldRush platform by restricting usage to specific URLs. ```tsx "use client"; + import "@covalenthq/goldrush-kit/styles.css"; import { GoldRushProvider, - NFTWalletTokenListView, - TokenBalancesListView, - TokenTransfersListView, - AddressActivityListView, + NFTWalletCollectionList, + TokenBalancesList, + TokenTransfersList, + AddressActivityList, } from "@covalenthq/goldrush-kit"; -export default function GoldRushExample() { +const GoldRushExample = () => { return (
- - - - + +
); -} +}; + +export default GoldRushExample; ``` ## GoldRush Templates -| Template | Description | Link | -| ------------------------------------- | ---------------------------------------------------------- | ------------------------------------------------------------ | -| Wallet & Portfolio UI | Display your tokens and NFTs across multiple chains. | https://github.com/covalenthq/goldrush-wallet-portfolio-ui | -| NFT Collection Gallery & Analytics UI | Display NFTs by collection and see their details. | https://github.com/covalenthq/goldrush-nft-gallery-ui | -| Transaction Receipt View | A beautifully designed view for blockchain transactions. | https://github.com/covalenthq/goldrush-tx-receipt-ui | +| Template | Description | Link | +| ------------------------------------- | -------------------------------------------------------- | ---------------------------------------------------------- | +| Wallet & Portfolio UI | Display your tokens and NFTs across multiple chains. | https://github.com/covalenthq/goldrush-wallet-portfolio-ui | +| NFT Collection Gallery & Analytics UI | Display NFTs by collection and see their details. | https://github.com/covalenthq/goldrush-nft-gallery-ui | +| Transaction Receipt View | A beautifully designed view for blockchain transactions. | https://github.com/covalenthq/goldrush-tx-receipt-ui | ## HIGHLIGHT: GoldRush Transaction Receipt View @@ -167,7 +172,7 @@ Storybook provides developers with a way to quickly prototype and develop compon Create and add a `.env` file to the root directory of your project and the following to the file. ``` -STORYBOOK_COVALENT_API_KEY = "" +STORYBOOK_GOLDUSH_API_KEY = "" ``` ### Start @@ -199,4 +204,4 @@ Give a ⭐️ if this project helped you! ## License -This project is Apache 2.0 licensed. +This project is Apache 2.0 licensed. diff --git a/src/static/goldrush-kit-logo.png b/src/static/goldrush-kit-logo.png deleted file mode 100644 index 649866f5..00000000 Binary files a/src/static/goldrush-kit-logo.png and /dev/null differ diff --git a/src/static/grk-kit-banner.png b/src/static/grk-kit-banner.png index a5d20476..611fb81f 100644 Binary files a/src/static/grk-kit-banner.png and b/src/static/grk-kit-banner.png differ