From 8610f1d78e44a1cfa93a489d1b8bd0aef6b61c1d Mon Sep 17 00:00:00 2001
From: cif <email@benipsen.com>
Date: Mon, 12 Dec 2022 16:16:02 +0000
Subject: [PATCH] docs: :memo: Shorten left nav, touch up a few spots

---
 README.md                |  4 +++
 docs/migrate.js          |  2 +-
 packages/react/README.md | 54 ++++++++++++++++++----------------------
 3 files changed, 29 insertions(+), 31 deletions(-)

diff --git a/README.md b/README.md
index c29493287..17af49293 100644
--- a/README.md
+++ b/README.md
@@ -51,11 +51,15 @@ The new library currently consists of the following packages and features:
 In order to use mintbase JS functions, often environment variables will need to be supplied via `process.env`, [dotenv](https://www.npmjs.com/package/dotenv) etc.
 
 ```
+# api key
+MINTBASE_API_KEY=<your-api-key>
+
 # default testnet
 NEAR_NETWORK = mainnet | testnet
 
 # default sandbox
 NEAR_DATA_ENV = mainnet | testnet | sandbox
+
 ```
 
 
diff --git a/docs/migrate.js b/docs/migrate.js
index afd63ac83..207a76dc6 100644
--- a/docs/migrate.js
+++ b/docs/migrate.js
@@ -112,7 +112,7 @@ for (const line of lines) {
     if (currentSection.name.indexOf('Developer') > -1 && line.indexOf('mintbase-sdk-ref') > -1 && !hasInjectedContent) {
 
       // inject all the content
-      currentSection.items.push('* [📚 MintbaseJS Reference](mintbase-sdk-ref/README.md)');
+      currentSection.items.push('* [📚 Mintbase JS](mintbase-sdk-ref/README.md)');
 
       // sort pages
       pages.sort((a, b) => {
diff --git a/packages/react/README.md b/packages/react/README.md
index 8915c8bad..1476a2a36 100644
--- a/packages/react/README.md
+++ b/packages/react/README.md
@@ -3,7 +3,7 @@
 # @mintbase-js/react
 
 
-This package contains React helpers for interacting with Mintbase SDKs.
+This package contains React helpers for interacting with Mintbase JS.
 
 # Hooks
 
@@ -25,14 +25,11 @@ The WalletContext provides methods for:
 2. Interacting with @mintbase-js/sdk
 
 
-
-
 The following props are provided to consumers of the `WalletContext.Provider`:
 
 
-
-```ts
-
+{% code title="NearWalletConnector.ts" overflow="wrap" lineNumbers="true" %}
+```typescript
 export  type  WalletContext = {
 
 // a reference to the near wallet selector
@@ -68,16 +65,14 @@ signMessage: (params: VerifyOwnerParams) =>  Promise<VerifiedOwner>;
 }
 
 ```
+{% endcode %}
 
-Example usage:
-
+Example usage in React components:
 
-
-```tsx
+{% code title="NearWalletConnector.ts" overflow="wrap" lineNumbers="true" %}
+```typescript
 import { useWallet } from  '@mintbase-js/react'
 
-
-
 const  NearWalletConnector = () => {
   const {
     connect,
@@ -88,25 +83,23 @@ const  NearWalletConnector = () => {
     errorMessage,
   } = useWallet();
 
-const  signTxn = async () => {
-const  wallet = await selector.wallet();
-  // ... call mintbase SDK methods with wallet as signingOption arg
-}
-
+  const  signTxn = async () => {
+  const  wallet = await selector.wallet();
+    // ... call mintbase SDK methods with wallet as signingOption arg
+  }
 
+  if (errorMessage) {
+    return (
+      <div>
+        <p>Major bummer! Could not connect to NEAR {errorMessage}</p>
+        <button  onClick={connect}>Try Again</button>
+      </div>
+    )
+  }
 
-if (errorMessage) {
-  return (
-    <div>
-      <p>Major bummer! Could not connect to NEAR {errorMessage}</p>
-      <button  onClick={connect}>Try Again</button>
-    </div>
-  )
-}
-
-if (!isConnected) {
-  return <button  onClick={connect}>Connect To NEAR</button>
-}
+  if (!isConnected) {
+    return <button  onClick={connect}>Connect To NEAR</button>
+  }
 
   return (
     <div>
@@ -117,4 +110,5 @@ if (!isConnected) {
   )
 }
 
-```
\ No newline at end of file
+```
+{% endcode %}
\ No newline at end of file