chore: add JS tab to code snippets

interledger · May 23, 2024 · 82ba980 · 82ba980
1 parent 39ae12e
commit 82ba980
Show file tree

Hide file tree

Showing 18 changed files with 640 additions and 4 deletions.
diff --git a/docs/src/content/docs/snippets/grant-continue.mdx b/docs/src/content/docs/snippets/grant-continue.mdx
@@ -7,6 +7,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'
 import ChunkedSnippet from '/src/components/ChunkedSnippet.astro'
 import Begin from '/src/partials/before-you-begin.mdx'
 import Ts from '/src/partials/ts-prerequisites.mdx'
+import Js from '/src/partials/js-prerequisites.mdx'
 
 During a grant request flow, an authorization server can require an individual (typically a client's end user) to approve the grant by interacting directly with the server. For example, by tapping an Approve button on a web page provided by the auth server.
 
@@ -53,6 +54,40 @@ Run `tsx path/to/directory/index.ts`.
   <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/grant/grant-continuation.ts'>View full source</LinkOut>
 </p>
 
+</TabItem>
+
+<TabItem label='JavaScript'>
+<Js />
+
+#### Get started
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-continuation.ts'
+  chunk='1'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-continuation.ts'
+  chunk='2'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-continuation.ts'
+  chunk='3'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-continuation.ts'
+  chunk='4'
+/>
+
+Run `node path/to/directory/index.js`.
+
+{/* prettier-ignore */}
+<p>
+  <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/grant/grant-continuation.js'>View full source</LinkOut>
+</p>
+
 </TabItem>
 </Tabs>
 

diff --git a/docs/src/content/docs/snippets/grant-create.mdx b/docs/src/content/docs/snippets/grant-create.mdx
@@ -7,6 +7,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'
 import ChunkedSnippet from '/src/components/ChunkedSnippet.astro'
 import Begin from '/src/partials/before-you-begin.mdx'
 import Ts from '/src/partials/ts-prerequisites.mdx'
+import Js from '/src/partials/js-prerequisites.mdx'
 
 Before a client can call the Open Payments API, it must request/receive a grant from the appropriate authorization server. The request must indicate the resource type the client intends to work with and the actions the client wants to take at the resource server.
 
@@ -65,6 +66,49 @@ Run `tsx path/to/directory/index.ts`.
   <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/grant/grant-incoming-payment.ts'>View full source</LinkOut>
 </p>
 
+</TabItem>
+<TabItem label='JavaScript'>
+<Js />
+
+#### Get started
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-incoming-payment.ts'
+  chunk='1'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-incoming-payment.ts'
+  chunk='2'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-incoming-payment.ts'
+  chunk='3'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-incoming-payment.ts'
+  chunk='4'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-incoming-payment.ts'
+  chunk='5'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-incoming-payment.ts'
+  chunk='6'
+/>
+
+Run `node path/to/directory/index.js`.
+
+{/* prettier-ignore */}
+<p>
+  <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/grant/grant-incoming-payment.js'>View full source</LinkOut>
+</p>
+
 </TabItem>
 </Tabs>
 

diff --git a/docs/src/content/docs/snippets/grant-revoke.mdx b/docs/src/content/docs/snippets/grant-revoke.mdx
@@ -7,6 +7,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'
 import ChunkedSnippet from '/src/components/ChunkedSnippet.astro'
 import Begin from '/src/partials/before-you-begin.mdx'
 import Ts from '/src/partials/ts-prerequisites.mdx'
+import Js from '/src/partials/js-prerequisites.mdx'
 
 If an authorized client no longer needs access to protected resources, the client can revoke the corresponding grant request.
 
@@ -46,6 +47,34 @@ Run `tsx path/to/directory/index.ts`.
   <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/grant/grant-revoke.ts'>View full source</LinkOut>
 </p>
 
+</TabItem>
+<TabItem label='JavaScript'>
+<Js />
+
+#### Get started
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-revoke.ts'
+  chunk='1'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-revoke.ts'
+  chunk='2'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/grant/grant-revoke.ts'
+  chunk='3'
+/>
+
+Run `node path/to/directory/index.js`.
+
+{/* prettier-ignore */}
+<p>
+  <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/grant/grant-revoke.js'>View full source</LinkOut>
+</p>
+
 </TabItem>
 </Tabs>
 

diff --git a/docs/src/content/docs/snippets/incoming-complete.mdx b/docs/src/content/docs/snippets/incoming-complete.mdx
@@ -7,6 +7,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'
 import ChunkedSnippet from '/src/components/ChunkedSnippet.astro'
 import Begin from '/src/partials/before-you-begin.mdx'
 import Ts from '/src/partials/ts-prerequisites.mdx'
+import Js from '/src/partials/js-prerequisites.mdx'
 
 An authorized client can complete an unexpired incoming payment to indicate it will not send any additional payments to the wallet address.
 
@@ -51,6 +52,39 @@ Run `tsx path/to/directory/index.ts`.
   <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/incoming-payment/incoming-payment-complete.ts'>View full source</LinkOut>
 </p>
 
+</TabItem>
+<TabItem label='JavaScript'>
+<Js />
+
+#### Get started
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-complete.ts'
+  chunk='1'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-complete.ts'
+  chunk='2'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-complete.ts'
+  chunk='3'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-complete.ts'
+  chunk='4'
+/>
+
+Run `node path/to/directory/index.js`.
+
+{/* prettier-ignore */}
+<p>
+  <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/incoming-payment/incoming-payment-complete.js'>View full source</LinkOut>
+</p>
+
 </TabItem>
 </Tabs>
 

diff --git a/docs/src/content/docs/snippets/incoming-create.mdx b/docs/src/content/docs/snippets/incoming-create.mdx
@@ -7,6 +7,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'
 import ChunkedSnippet from '/src/components/ChunkedSnippet.astro'
 import Begin from '/src/partials/before-you-begin.mdx'
 import Ts from '/src/partials/ts-prerequisites.mdx'
+import Js from '/src/partials/js-prerequisites.mdx'
 
 Once an authorized client obtains the requisite grant from the recipient’s authentication server, the client must create an incoming payment resource before any payments can be sent to the recipient’s wallet address.
 
@@ -44,16 +45,49 @@ These code snippets create an incoming payment of $10 USD at a given wallet addr
   chunk='4'
 />
 
-</TabItem>
-</Tabs>
-
 Run `tsx path/to/directory/index.ts`.
 
 {/* prettier-ignore */}
 <p>
   <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/incoming-payment/incoming-payment-create.ts'>View full source</LinkOut>
 </p>
 
+</TabItem>
+<TabItem label='JavaScript'>
+<Js />
+
+#### Get started
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-create.ts'
+  chunk='1'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-create.ts'
+  chunk='2'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-create.ts'
+  chunk='3'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-create.ts'
+  chunk='4'
+/>
+
+Run `node path/to/directory/index.js`.
+
+{/* prettier-ignore */}
+<p>
+  <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/incoming-payment/incoming-payment-create.js'>View full source</LinkOut>
+</p>
+
+</TabItem>
+</Tabs>
+
 ## References
 
 - [API specification](/apis/resource-server/operations/create-incoming-payment)
diff --git a/docs/src/content/docs/snippets/incoming-get.mdx b/docs/src/content/docs/snippets/incoming-get.mdx
@@ -7,6 +7,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'
 import ChunkedSnippet from '/src/components/ChunkedSnippet.astro'
 import Begin from '/src/partials/before-you-begin.mdx'
 import Ts from '/src/partials/ts-prerequisites.mdx'
+import Js from '/src/partials/js-prerequisites.mdx'
 
 An authorized client can look up the state of an incoming payment on a wallet address. This is useful when a client must determine if an incoming payment is still active and pending payment.
 
@@ -51,6 +52,39 @@ Run `tsx path/to/directory/index.ts`.
   <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/incoming-payment/incoming-payment-get.ts'>View full source</LinkOut>
 </p>
 
+</TabItem>
+<TabItem label='JavaScript'>
+<Js />
+
+#### Get started
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-get.ts'
+  chunk='1'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-get.ts'
+  chunk='2'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-get.ts'
+  chunk='3'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-get.ts'
+  chunk='4'
+/>
+
+Run `node path/to/directory/index.js`.
+
+{/* prettier-ignore */}
+<p>
+  <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/incoming-payment/incoming-payment-get.js'>View full source</LinkOut>
+</p>
+
 </TabItem>
 </Tabs>
 

diff --git a/docs/src/content/docs/snippets/incoming-list.mdx b/docs/src/content/docs/snippets/incoming-list.mdx
@@ -7,6 +7,7 @@ import { Tabs, TabItem } from '@astrojs/starlight/components'
 import ChunkedSnippet from '/src/components/ChunkedSnippet.astro'
 import Begin from '/src/partials/before-you-begin.mdx'
 import Ts from '/src/partials/ts-prerequisites.mdx'
+import Js from '/src/partials/js-prerequisites.mdx'
 
 After one or more incoming payments have been created on a wallet address, an authorized client can look up active and pending incoming payments on that wallet address.
 
@@ -51,6 +52,39 @@ Run `tsx path/to/directory/index.ts`.
   <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/incoming-payment/incoming-payment-list.ts'>View full source</LinkOut>
 </p>
 
+</TabItem>
+<TabItem label='JavaScript'>
+<Js />
+
+#### Get started
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-list.ts'
+  chunk='1'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-list.ts'
+  chunk='2'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-list.ts'
+  chunk='3'
+/>
+
+<ChunkedSnippet
+  source='https://raw.githubusercontent.com/interledger/open-payments-snippets/main/incoming-payment/incoming-payment-list.ts'
+  chunk='4'
+/>
+
+Run `node path/to/directory/index.js`.
+
+{/* prettier-ignore */}
+<p>
+  <LinkOut href='https://github.com/interledger/open-payments-snippets/blob/main/incoming-payment/incoming-payment-list.js'>View full source</LinkOut>
+</p>
+
 </TabItem>
 </Tabs>