@lightsparkdev/lightspark-sdk 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (223) hide show
  1. package/.fossa.yml +6 -0
  2. package/.prettierrc +1 -0
  3. package/.turbo/turbo-build.log +19 -0
  4. package/.turbo/turbo-lint.log +3 -0
  5. package/CHANGELOG.md +49 -0
  6. package/LICENSE +201 -0
  7. package/README.md +137 -0
  8. package/dist/Withdrawal-17e1c8af.d.ts +1672 -0
  9. package/dist/Withdrawal-27a4d10d.d.ts +1672 -0
  10. package/dist/chunk-3VRI7CHE.js +5508 -0
  11. package/dist/chunk-AGEUDR2V.js +4498 -0
  12. package/dist/chunk-N27QHRE4.js +5508 -0
  13. package/dist/client-3bba3f64.d.ts +1302 -0
  14. package/dist/index.cjs +6633 -0
  15. package/dist/index.d.ts +15 -0
  16. package/dist/index.js +1177 -0
  17. package/dist/objects/index.cjs +5347 -0
  18. package/dist/objects/index.d.ts +3 -0
  19. package/dist/objects/index.js +88 -0
  20. package/examples/node-scripts/authHelpers.ts +20 -0
  21. package/examples/node-scripts/createInvoice.ts +64 -0
  22. package/examples/node-scripts/example.ts +288 -0
  23. package/examples/node-scripts/getAccountDashboard.ts +24 -0
  24. package/examples/node-scripts/getNodeChannels.ts +34 -0
  25. package/examples/node-scripts/internalAuthHelpers.ts +26 -0
  26. package/examples/node-scripts/internal_example.ts +296 -0
  27. package/examples/node-scripts/package-lock.json +887 -0
  28. package/examples/node-scripts/package.json +22 -0
  29. package/examples/node-scripts/prettyPrintJsonForDocs.ts +62 -0
  30. package/examples/node-scripts/tsconfig.json +27 -0
  31. package/examples/oauth-example/README.md +19 -0
  32. package/examples/oauth-example/package-lock.json +16071 -0
  33. package/examples/oauth-example/package.json +50 -0
  34. package/examples/oauth-example/public/favicon.ico +0 -0
  35. package/examples/oauth-example/public/index.html +43 -0
  36. package/examples/oauth-example/public/logo192.png +0 -0
  37. package/examples/oauth-example/public/logo512.png +0 -0
  38. package/examples/oauth-example/public/manifest.json +25 -0
  39. package/examples/oauth-example/public/robots.txt +3 -0
  40. package/examples/oauth-example/src/App.css +7 -0
  41. package/examples/oauth-example/src/App.test.tsx +12 -0
  42. package/examples/oauth-example/src/App.tsx +16 -0
  43. package/examples/oauth-example/src/auth/AuthContext.ts +8 -0
  44. package/examples/oauth-example/src/auth/AuthProvider.tsx +44 -0
  45. package/examples/oauth-example/src/auth/RequireAuth.tsx +19 -0
  46. package/examples/oauth-example/src/auth/oauthProvider.ts +35 -0
  47. package/examples/oauth-example/src/components/Button.tsx +39 -0
  48. package/examples/oauth-example/src/components/CurrencyAmount.tsx +117 -0
  49. package/examples/oauth-example/src/components/Dashboard.tsx +158 -0
  50. package/examples/oauth-example/src/components/Table.tsx +22 -0
  51. package/examples/oauth-example/src/hooks/useAccountInfo.tsx +31 -0
  52. package/examples/oauth-example/src/icons/BitcoinB.tsx +20 -0
  53. package/examples/oauth-example/src/icons/Icon.tsx +121 -0
  54. package/examples/oauth-example/src/icons/Satoshi.tsx +28 -0
  55. package/examples/oauth-example/src/index.css +13 -0
  56. package/examples/oauth-example/src/index.tsx +23 -0
  57. package/examples/oauth-example/src/lightsparkclient/LightsparkClientContext.ts +10 -0
  58. package/examples/oauth-example/src/lightsparkclient/LightsparkClientProvider.tsx +53 -0
  59. package/examples/oauth-example/src/logo.svg +1 -0
  60. package/examples/oauth-example/src/pages/DashboardPage.tsx +71 -0
  61. package/examples/oauth-example/src/pages/LoginPage.tsx +63 -0
  62. package/examples/oauth-example/src/react-app-env.d.ts +1 -0
  63. package/examples/oauth-example/src/reportWebVitals.ts +15 -0
  64. package/examples/oauth-example/src/routes/index.tsx +15 -0
  65. package/examples/oauth-example/src/setupTests.ts +5 -0
  66. package/examples/oauth-example/src/utils/currency.ts +483 -0
  67. package/examples/oauth-example/tsconfig.json +20 -0
  68. package/examples/streaming-wallet-extension/.fossa.yml +6 -0
  69. package/examples/streaming-wallet-extension/README.md +17 -0
  70. package/examples/streaming-wallet-extension/craco.config.js +58 -0
  71. package/examples/streaming-wallet-extension/package-lock.json +18260 -0
  72. package/examples/streaming-wallet-extension/package.json +77 -0
  73. package/examples/streaming-wallet-extension/public/index.html +24 -0
  74. package/examples/streaming-wallet-extension/public/lightspark_full.png +0 -0
  75. package/examples/streaming-wallet-extension/public/lightspark_icon_circle.png +0 -0
  76. package/examples/streaming-wallet-extension/public/manifest.json +43 -0
  77. package/examples/streaming-wallet-extension/public/robots.txt +3 -0
  78. package/examples/streaming-wallet-extension/src/App.css +53 -0
  79. package/examples/streaming-wallet-extension/src/App.tsx +425 -0
  80. package/examples/streaming-wallet-extension/src/auth/AccountStorage.ts +28 -0
  81. package/examples/streaming-wallet-extension/src/auth/DemoAccountProvider.ts +99 -0
  82. package/examples/streaming-wallet-extension/src/auth/StreamingDemoCredentials.ts +10 -0
  83. package/examples/streaming-wallet-extension/src/background/PaymentStrategy.ts +36 -0
  84. package/examples/streaming-wallet-extension/src/background/PlaybackRange.ts +31 -0
  85. package/examples/streaming-wallet-extension/src/background/StreamingInvoiceHolder.ts +33 -0
  86. package/examples/streaming-wallet-extension/src/background/TransactionObserver.ts +66 -0
  87. package/examples/streaming-wallet-extension/src/background/VideoPlaybackRanges.ts +38 -0
  88. package/examples/streaming-wallet-extension/src/background/VideoProgressCache.ts +87 -0
  89. package/examples/streaming-wallet-extension/src/background/background.ts +145 -0
  90. package/examples/streaming-wallet-extension/src/background/messageHandling.ts +185 -0
  91. package/examples/streaming-wallet-extension/src/common/datetimes.ts +28 -0
  92. package/examples/streaming-wallet-extension/src/common/settings.ts +12 -0
  93. package/examples/streaming-wallet-extension/src/common/storage.ts +8 -0
  94. package/examples/streaming-wallet-extension/src/common/streamingTabs.ts +27 -0
  95. package/examples/streaming-wallet-extension/src/common/types.tsx +23 -0
  96. package/examples/streaming-wallet-extension/src/components/CirclePlusIcon.tsx +19 -0
  97. package/examples/streaming-wallet-extension/src/components/CurrencyAmount.tsx +110 -0
  98. package/examples/streaming-wallet-extension/src/components/CurrencyAmountRaw.tsx +195 -0
  99. package/examples/streaming-wallet-extension/src/components/LeftArrow.tsx +21 -0
  100. package/examples/streaming-wallet-extension/src/components/Loading.tsx +151 -0
  101. package/examples/streaming-wallet-extension/src/components/StreamingTransactionChip.tsx +95 -0
  102. package/examples/streaming-wallet-extension/src/components/TransactionRow.tsx +93 -0
  103. package/examples/streaming-wallet-extension/src/contentscript/content.ts +123 -0
  104. package/examples/streaming-wallet-extension/src/contentscript/lightsparkDemoDom.tsx +113 -0
  105. package/examples/streaming-wallet-extension/src/contentscript/videoElementParsers.ts +92 -0
  106. package/examples/streaming-wallet-extension/src/index.css +16 -0
  107. package/examples/streaming-wallet-extension/src/index.tsx +11 -0
  108. package/examples/streaming-wallet-extension/src/lightsparkClientProvider.tsx +26 -0
  109. package/examples/streaming-wallet-extension/src/react-app-env.d.ts +1 -0
  110. package/examples/streaming-wallet-extension/src/types/Messages.ts +17 -0
  111. package/examples/streaming-wallet-extension/tsconfig.json +20 -0
  112. package/package.json +87 -0
  113. package/src/auth/AccountTokenAuthProvider.ts +37 -0
  114. package/src/auth/index.ts +3 -0
  115. package/src/client.ts +759 -0
  116. package/src/graphql/BitcoinFeeEstimate.ts +13 -0
  117. package/src/graphql/CreateApiToken.ts +22 -0
  118. package/src/graphql/CreateInvoice.ts +18 -0
  119. package/src/graphql/CreateNodeWalletAddress.ts +13 -0
  120. package/src/graphql/CurrentAccount.ts +13 -0
  121. package/src/graphql/DecodeInvoice.ts +16 -0
  122. package/src/graphql/DeleteApiToken.ts +13 -0
  123. package/src/graphql/FundNode.ts +18 -0
  124. package/src/graphql/LightningFeeEstimateForInvoice.ts +21 -0
  125. package/src/graphql/LightningFeeEstimateForNode.ts +21 -0
  126. package/src/graphql/MultiNodeDashboard.ts +118 -0
  127. package/src/graphql/PayInvoice.ts +29 -0
  128. package/src/graphql/RecoverNodeSigningKey.ts +15 -0
  129. package/src/graphql/RequestWithdrawal.ts +25 -0
  130. package/src/graphql/SendPayment.ts +29 -0
  131. package/src/graphql/SingleNodeDashboard.ts +116 -0
  132. package/src/graphql/TransactionSubscription.ts +16 -0
  133. package/src/graphql/TransactionsForNode.ts +42 -0
  134. package/src/index.ts +5 -0
  135. package/src/objects/Account.ts +1222 -0
  136. package/src/objects/AccountToApiTokensConnection.ts +50 -0
  137. package/src/objects/AccountToChannelsConnection.ts +35 -0
  138. package/src/objects/AccountToNodesConnection.ts +62 -0
  139. package/src/objects/AccountToPaymentRequestsConnection.ts +50 -0
  140. package/src/objects/AccountToTransactionsConnection.ts +112 -0
  141. package/src/objects/ApiToken.ts +80 -0
  142. package/src/objects/BitcoinNetwork.ts +19 -0
  143. package/src/objects/BlockchainBalance.ts +102 -0
  144. package/src/objects/Channel.ts +283 -0
  145. package/src/objects/ChannelClosingTransaction.ts +150 -0
  146. package/src/objects/ChannelFees.ts +34 -0
  147. package/src/objects/ChannelOpeningTransaction.ts +150 -0
  148. package/src/objects/ChannelStatus.ts +25 -0
  149. package/src/objects/ChannelToTransactionsConnection.ts +86 -0
  150. package/src/objects/CreateApiTokenInput.ts +22 -0
  151. package/src/objects/CreateApiTokenOutput.ts +41 -0
  152. package/src/objects/CreateInvoiceInput.ts +27 -0
  153. package/src/objects/CreateInvoiceOutput.ts +21 -0
  154. package/src/objects/CreateNodeWalletAddressInput.ts +15 -0
  155. package/src/objects/CreateNodeWalletAddressOutput.ts +27 -0
  156. package/src/objects/CurrencyAmount.ts +55 -0
  157. package/src/objects/CurrencyUnit.ts +25 -0
  158. package/src/objects/DeleteApiTokenInput.ts +13 -0
  159. package/src/objects/DeleteApiTokenOutput.ts +23 -0
  160. package/src/objects/Deposit.ts +144 -0
  161. package/src/objects/Entity.ts +868 -0
  162. package/src/objects/FeeEstimate.ts +39 -0
  163. package/src/objects/FundNodeInput.ts +16 -0
  164. package/src/objects/FundNodeOutput.ts +28 -0
  165. package/src/objects/GraphNode.ts +110 -0
  166. package/src/objects/Hop.ts +108 -0
  167. package/src/objects/HtlcAttemptFailureCode.ts +65 -0
  168. package/src/objects/IncomingPayment.ts +141 -0
  169. package/src/objects/IncomingPaymentAttempt.ts +96 -0
  170. package/src/objects/IncomingPaymentAttemptStatus.ts +20 -0
  171. package/src/objects/IncomingPaymentToAttemptsConnection.ts +39 -0
  172. package/src/objects/Invoice.ts +226 -0
  173. package/src/objects/InvoiceData.ts +185 -0
  174. package/src/objects/InvoiceType.ts +15 -0
  175. package/src/objects/LightningFeeEstimateForInvoiceInput.ts +28 -0
  176. package/src/objects/LightningFeeEstimateForNodeInput.ts +25 -0
  177. package/src/objects/LightningFeeEstimateOutput.ts +33 -0
  178. package/src/objects/LightningTransaction.ts +393 -0
  179. package/src/objects/LightsparkNode.ts +377 -0
  180. package/src/objects/LightsparkNodePurpose.ts +17 -0
  181. package/src/objects/LightsparkNodeStatus.ts +29 -0
  182. package/src/objects/LightsparkNodeToChannelsConnection.ts +50 -0
  183. package/src/objects/Node.ts +273 -0
  184. package/src/objects/NodeAddress.ts +29 -0
  185. package/src/objects/NodeAddressType.ts +18 -0
  186. package/src/objects/NodeToAddressesConnection.ts +39 -0
  187. package/src/objects/OnChainTransaction.ts +318 -0
  188. package/src/objects/OutgoingPayment.ts +319 -0
  189. package/src/objects/OutgoingPaymentAttempt.ts +164 -0
  190. package/src/objects/OutgoingPaymentAttemptStatus.ts +18 -0
  191. package/src/objects/OutgoingPaymentAttemptToHopsConnection.ts +37 -0
  192. package/src/objects/OutgoingPaymentToAttemptsConnection.ts +39 -0
  193. package/src/objects/PageInfo.ts +31 -0
  194. package/src/objects/PayInvoiceInput.ts +33 -0
  195. package/src/objects/PayInvoiceOutput.ts +22 -0
  196. package/src/objects/PaymentFailureReason.ts +29 -0
  197. package/src/objects/PaymentRequest.ts +231 -0
  198. package/src/objects/PaymentRequestData.ts +183 -0
  199. package/src/objects/PaymentRequestStatus.ts +15 -0
  200. package/src/objects/Permission.ts +39 -0
  201. package/src/objects/RequestWithdrawalInput.ts +35 -0
  202. package/src/objects/RequestWithdrawalOutput.ts +24 -0
  203. package/src/objects/RichText.ts +19 -0
  204. package/src/objects/RoutingTransaction.ts +150 -0
  205. package/src/objects/RoutingTransactionFailureReason.ts +17 -0
  206. package/src/objects/Secret.ts +23 -0
  207. package/src/objects/SendPaymentInput.ts +30 -0
  208. package/src/objects/SendPaymentOutput.ts +22 -0
  209. package/src/objects/Transaction.ts +609 -0
  210. package/src/objects/TransactionFailures.ts +23 -0
  211. package/src/objects/TransactionStatus.ts +23 -0
  212. package/src/objects/TransactionType.ts +31 -0
  213. package/src/objects/TransactionUpdate.ts +67 -0
  214. package/src/objects/WalletDashboard.ts +32 -0
  215. package/src/objects/WebhookEventType.ts +15 -0
  216. package/src/objects/Withdrawal.ts +144 -0
  217. package/src/objects/WithdrawalMode.ts +15 -0
  218. package/src/objects/WithdrawalRequest.ts +224 -0
  219. package/src/objects/WithdrawalRequestStatus.ts +17 -0
  220. package/src/objects/WithdrawalRequestToChannelClosingTransactionsConnection.ts +57 -0
  221. package/src/objects/WithdrawalRequestToChannelOpeningTransactionsConnection.ts +57 -0
  222. package/src/objects/index.ts +108 -0
  223. package/tsconfig.json +5 -0
package/examples/streaming-wallet-extension/package.json ADDED
@@ -0,0 +1,77 @@
1
+ {
2
+ "name": "@lightsparkdev/lightspark-streaming-example",
3
+ "version": "1.0.1",
4
+ "private": true,
5
+ "dependencies": {
6
+ "@babel/core": "^7.16.0",
7
+ "@craco/craco": "^7.0.0",
8
+ "@emotion/css": "^11.10.5",
9
+ "@emotion/react": "^11.10.5",
10
+ "@emotion/styled": "^11.10.5",
11
+ "@lightsparkdev/lightspark-sdk": "file:../../",
12
+ "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
13
+ "@svgr/webpack": "^5.5.0",
14
+ "babel-loader": "^8.2.3",
15
+ "babel-plugin-named-asset-import": "^0.3.8",
16
+ "babel-preset-react-app": "^10.0.1",
17
+ "browserslist": "^4.18.1",
18
+ "case-sensitive-paths-webpack-plugin": "^2.4.0",
19
+ "css-loader": "^6.5.1",
20
+ "css-minimizer-webpack-plugin": "^3.2.0",
21
+ "dotenv": "^10.0.0",
22
+ "dotenv-expand": "^5.1.0",
23
+ "eslint": "^8.3.0",
24
+ "eslint-config-react-app": "^7.0.1",
25
+ "eslint-webpack-plugin": "^3.1.1",
26
+ "html-webpack-plugin": "^5.5.0",
27
+ "react": "^17.0.2",
28
+ "react-app-polyfill": "^3.0.0",
29
+ "react-dev-utils": "^12.0.1",
30
+ "react-dom": "^17.0.2",
31
+ "react-refresh": "^0.11.0",
32
+ "resolve": "^1.20.0",
33
+ "resolve-url-loader": "^4.0.0",
34
+ "sass-loader": "^12.3.0",
35
+ "source-map-loader": "^3.0.0",
36
+ "style-loader": "^3.3.1",
37
+ "terser-webpack-plugin": "^5.2.5",
38
+ "typescript": "^4.5.4",
39
+ "uuid": "^9.0.0",
40
+ "webpack": "^5.64.4",
41
+ "webpack-dev-server": "^4.6.0",
42
+ "webpack-manifest-plugin": "^4.0.2",
43
+ "workbox-webpack-plugin": "^6.4.1"
44
+ },
45
+ "scripts": {
46
+ "start": "craco start",
47
+ "build": "INLINE_RUNTIME_CHUNK=false craco build",
48
+ "package": "rm -f streaming-extension.zip && INLINE_RUNTIME_CHUNK=false craco build && zip -r streaming-extension.zip build",
49
+ "test": "craco test"
50
+ },
51
+ "eslintConfig": {
52
+ "extends": [
53
+ "react-app",
54
+ "react-app/jest"
55
+ ]
56
+ },
57
+ "browserslist": {
58
+ "production": [
59
+ ">0.2%",
60
+ "not dead",
61
+ "not op_mini all"
62
+ ],
63
+ "development": [
64
+ "last 1 chrome version",
65
+ "last 1 firefox version",
66
+ "last 1 safari version"
67
+ ]
68
+ },
69
+ "devDependencies": {
70
+ "@types/chrome": "^0.0.213",
71
+ "@types/uuid": "^9.0.1",
72
+ "@types/jest": "^27.4.0",
73
+ "@types/node": "^16.11.17",
74
+ "@types/react": "^17.0.38",
75
+ "@types/react-dom": "^17.0.11"
76
+ }
77
+ }
package/examples/streaming-wallet-extension/public/index.html ADDED
@@ -0,0 +1,24 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="utf-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
6
+ <meta name="theme-color" content="#000000" />
7
+ <meta name="description" content="Lightspark Lightning Wallet" />
8
+ <link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
9
+ <link
10
+ rel="preload"
11
+ href="https://fonts.googleapis.com/css?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
12
+ as="style"
13
+ />
14
+ <link
15
+ rel="stylesheet"
16
+ href="https://fonts.googleapis.com/css?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
17
+ />
18
+ <title>Lightspark Wallet</title>
19
+ </head>
20
+ <body>
21
+ <noscript>You need to enable JavaScript to run this app.</noscript>
22
+ <div id="root"></div>
23
+ </body>
24
+ </html>
package/examples/streaming-wallet-extension/public/manifest.json ADDED
@@ -0,0 +1,43 @@
1
+ {
2
+ "name": "Lightspark Streaming Money Wallet Demo",
3
+ "description": "A Lightspark demo that shows money streaming in real-time using the Lightning Network.",
4
+ "version": "1.0.4",
5
+ "manifest_version": 3,
6
+ "action": {
7
+ "default_popup": "index.html",
8
+ "default_title": "Lightspark Streaming Money Wallet Demo",
9
+ "default_icon": "lightspark_icon_circle.png"
10
+ },
11
+ "key": "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEAx4PZEKMOT+8wEFd8QMoSC++lYxhxf45Wo8zB4DO/ZzEMHPdr5ugvttK8G11L7RVnWQcN2lzKIGbR1S1a5XNnEuv+SlOqv/qKMF+LBao5DOShWQbAg9ImDutSGqPIslQHYurayV8GcZY876NpaOkpCPnKDVddNmSn8MSRB6uYuqlHWn1xk5VDHi6/hDTIcDihEZkRvp/N1UQbjNTCgpCPbejoJ3SFMuCjD9joYo52NOwmEOcrJL4dlFnAnMWlWavlZD5dTol8Yh4VyLZP5thZUZ4IEUG0gpLFV9nue+qvJmge3dJmNYjOSg8QEr7D3feRqhWFRu2O6S5PHMSdd1O06QIDAQAB",
12
+ "permissions": ["activeTab", "tabs", "storage"],
13
+ "icons": {
14
+ "16": "lightspark_icon_circle.png",
15
+ "32": "lightspark_icon_circle.png",
16
+ "48": "lightspark_icon_circle.png",
17
+ "128": "lightspark_icon_circle.png"
18
+ },
19
+ "host_permissions": [
20
+ "https://api.dev.dev.sparkinfra.net/",
21
+ "https://api.lightspark.com/"
22
+ ],
23
+ "content_scripts": [
24
+ {
25
+ "matches": [
26
+ "https://localhost:3000/demos/streaming*",
27
+ "https://dev.dev.sparkinfra.net/demos/streaming*",
28
+ "https://app.lightspark.com/demos/streaming*"
29
+ ],
30
+ "js": ["./static/js/content.js"]
31
+ }
32
+ ],
33
+ "externally_connectable": {
34
+ "matches": [
35
+ "https://localhost:3000/demos/streaming*",
36
+ "https://dev.dev.sparkinfra.net/demos/streaming*",
37
+ "https://app.lightspark.com/demos/streaming*"
38
+ ]
39
+ },
40
+ "background": {
41
+ "service_worker": "./static/js/background.js"
42
+ }
43
+ }
package/examples/streaming-wallet-extension/public/robots.txt ADDED
@@ -0,0 +1,3 @@
1
+ # https://www.robotstxt.org/robotstxt.html
2
+ User-agent: *
3
+ Disallow:
package/examples/streaming-wallet-extension/src/App.css ADDED
@@ -0,0 +1,53 @@
1
+ .app-wrapper {
2
+ background-color: white;
3
+ color: black;
4
+ height: 100%;
5
+ width: 100%;
6
+ display: flex;
7
+ flex-direction: column;
8
+ align-items: center;
9
+ }
10
+
11
+ .app-logo {
12
+ display: inline-block;
13
+ margin-inline-end: 8px;
14
+ object-fit: contain;
15
+ width: 180px;
16
+ }
17
+
18
+ .loading-text {
19
+ display: flex;
20
+ font-size: 32px;
21
+ text-align: center;
22
+ overflow-wrap: break-word;
23
+ width: 100%;
24
+ height: 100%;
25
+ justify-content: center;
26
+ align-items: center;
27
+ }
28
+
29
+ .content-wrapper {
30
+ flex: 1;
31
+ width: 100%;
32
+ overflow: auto;
33
+ }
34
+
35
+ .header {
36
+ display: flex;
37
+ flex-direction: row;
38
+ justify-content: space-between;
39
+ height: 100px;
40
+ width: 100%;
41
+ padding: 32px 24px;
42
+ box-sizing: border-box;
43
+ align-items: center;
44
+ }
45
+
46
+ .header button {
47
+ width: 40px;
48
+ height: 100%;
49
+ border: none;
50
+ background: none;
51
+ color: black;
52
+ font-size: 26px;
53
+ }
package/examples/streaming-wallet-extension/src/App.tsx ADDED
@@ -0,0 +1,425 @@
1
+ import styled from "@emotion/styled";
2
+ import {
3
+ AccountTokenAuthProvider,
4
+ BitcoinNetwork,
5
+ CurrencyAmount,
6
+ CurrencyUnit,
7
+ LightsparkClient,
8
+ Transaction,
9
+ WalletDashboard,
10
+ } from "@lightsparkdev/lightspark-sdk";
11
+ import React from "react";
12
+ import "./App.css";
13
+ import AccountStorage from "./auth/AccountStorage";
14
+ import { reserveStreamingDemoAccountCredentials } from "./auth/DemoAccountProvider";
15
+ import StreamingDemoAccountCredentials from "./auth/StreamingDemoCredentials";
16
+ import VideoProgressCache from "./background/VideoProgressCache";
17
+ import { clearStorageKeepingInstanceId } from "./common/storage";
18
+ import { findActiveStreamingDemoTabs } from "./common/streamingTabs";
19
+ import { Maybe } from "./common/types";
20
+ import CirclePlusIcon from "./components/CirclePlusIcon";
21
+ import CurrencyAmountElement from "./components/CurrencyAmount";
22
+ import CurrencyAmountRaw from "./components/CurrencyAmountRaw";
23
+ import LeftArrow from "./components/LeftArrow";
24
+ import { LoadingSpinner } from "./components/Loading";
25
+ import StreamingTransactionChip from "./components/StreamingTransactionChip";
26
+ import TransactionRow from "./components/TransactionRow";
27
+ import { getWalletClient } from "./lightsparkClientProvider";
28
+
29
+ enum Screen {
30
+ Balance,
31
+ Transactions,
32
+ Login,
33
+ }
34
+
35
+ const DEMO_VIDEO_ID = "ls_demo";
36
+
37
+ function App() {
38
+ const [walletDashboard, setWalletDashboard] =
39
+ React.useState<WalletDashboard>();
40
+ const [transactions, setTransactions] = React.useState<Transaction[]>([]);
41
+ const [screen, setScreen] = React.useState<Screen>(Screen.Login);
42
+ const [lightsparkClient, setLightsparkClient] =
43
+ React.useState<LightsparkClient>();
44
+ const [credentials, setCredentials] =
45
+ React.useState<StreamingDemoAccountCredentials | null>();
46
+ const [isStreaming, setIsStreaming] = React.useState(false);
47
+ const [demoStreamingDuration, setDemoStreamingDuration] = React.useState(0);
48
+
49
+ React.useEffect(() => {
50
+ chrome.storage.local
51
+ .get(["walletDashboard"])
52
+ .then(async (cachedBalance) => {
53
+ if (cachedBalance) {
54
+ setWalletDashboard(cachedBalance.walletDashboard);
55
+ }
56
+ const accountStorage = new AccountStorage();
57
+ let credentials = await accountStorage.getAccountCredentials();
58
+ if (credentials && Date.now() > credentials.expiresAt) {
59
+ await clearStorageKeepingInstanceId();
60
+ credentials = null;
61
+ }
62
+ setCredentials(credentials);
63
+ const client = await getWalletClient(accountStorage);
64
+ setLightsparkClient(client);
65
+ });
66
+
67
+ const progressCache = new VideoProgressCache();
68
+ progressCache.listenForProgressChanges((videoId) => {
69
+ if (videoId === DEMO_VIDEO_ID) {
70
+ setDemoStreamingDuration(
71
+ progressCache.getPlayedDuration(DEMO_VIDEO_ID)
72
+ );
73
+ }
74
+ });
75
+ progressCache.whenLoaded().then(() => {
76
+ setDemoStreamingDuration(progressCache.getPlayedDuration(DEMO_VIDEO_ID));
77
+ });
78
+
79
+ chrome.runtime.onMessage.addListener((message, _sender, _sendResponse) => {
80
+ if (message.id === "video_play" || message.id === "video_pause") {
81
+ setIsStreaming(message.isPlaying);
82
+ } else if (message.id === "video_progress") {
83
+ progressCache.addProgress(
84
+ message.videoID,
85
+ message.prevProgress || 0,
86
+ message.progress
87
+ );
88
+ } else if (message.id === "transactions_updated") {
89
+ setTransactions(message.transactions);
90
+ }
91
+ });
92
+
93
+ findActiveStreamingDemoTabs().then((tabs) => {
94
+ if (tabs.length === 0) return;
95
+ chrome.tabs.sendMessage(
96
+ tabs[0].id!,
97
+ { id: "is_video_playing" },
98
+ (isPlaying) => {
99
+ setIsStreaming(isPlaying);
100
+ }
101
+ );
102
+ });
103
+ }, []);
104
+
105
+ const joinedTransactions = React.useMemo(() => {
106
+ const transactionMap = new Map<string, Transaction>();
107
+ walletDashboard?.recentTransactions.forEach((t) =>
108
+ transactionMap.set(t.id, t)
109
+ );
110
+ transactions.forEach((t) => transactionMap.set(t.id, t));
111
+ return Array.from(transactionMap.values());
112
+ }, [walletDashboard, transactions]);
113
+
114
+ const balance = React.useMemo(() => {
115
+ if (!walletDashboard || !walletDashboard.totalLocalBalance) return null;
116
+ const baseBalance = walletDashboard.totalLocalBalance;
117
+ const transactionsInBalance = new Set<string>();
118
+ walletDashboard?.recentTransactions.forEach((t) =>
119
+ transactionsInBalance.add(t.id)
120
+ );
121
+ const streamingTransactions = transactions.filter(
122
+ (t) => !transactionsInBalance.has(t.id)
123
+ );
124
+ return streamingTransactions.reduce((acc, t) => {
125
+ if (t.typename !== "OutgoingPayment") return acc;
126
+ if (
127
+ t.amount.preferredCurrencyUnit !== baseBalance.preferredCurrencyUnit ||
128
+ t.amount.originalUnit !== baseBalance.originalUnit
129
+ ) {
130
+ console.warn("Transaction amount units do not match wallet balance");
131
+ return acc;
132
+ }
133
+
134
+ return {
135
+ ...acc,
136
+ originalValue: acc.originalValue - t.amount.originalValue,
137
+ preferredCurrencyValueApprox:
138
+ acc.preferredCurrencyValueApprox -
139
+ t.amount.preferredCurrencyValueApprox,
140
+ preferredCurrencyValueRounded:
141
+ acc.preferredCurrencyValueRounded -
142
+ t.amount.preferredCurrencyValueRounded,
143
+ };
144
+ }, baseBalance);
145
+ }, [walletDashboard, transactions]);
146
+
147
+ React.useEffect(() => {
148
+ if (!lightsparkClient || !credentials) {
149
+ return;
150
+ }
151
+ setScreen(Screen.Balance);
152
+ lightsparkClient
153
+ .getSingleNodeDashboard(
154
+ credentials.viewerWalletId,
155
+ BitcoinNetwork.REGTEST,
156
+ credentials.allocationTime
157
+ )
158
+ .then(async (dashboard) => {
159
+ setWalletDashboard(dashboard);
160
+ await chrome.storage.local.set({ walletDashboard: dashboard });
161
+ });
162
+ }, [lightsparkClient, credentials]);
163
+
164
+ const body = !lightsparkClient ? (
165
+ <></>
166
+ ) : screen === Screen.Balance ? (
167
+ <BalanceScreen
168
+ balance={balance}
169
+ transactions={joinedTransactions}
170
+ streamingDuration={demoStreamingDuration}
171
+ isStreaming={isStreaming}
172
+ />
173
+ ) : screen === Screen.Transactions ? (
174
+ <TransactionsScreen transactions={joinedTransactions} />
175
+ ) : (
176
+ <LoginScreen
177
+ lightsparkClient={lightsparkClient}
178
+ onCreatedAccount={async (credentials) => {
179
+ lightsparkClient?.setAuthProvider(
180
+ new AccountTokenAuthProvider(
181
+ credentials.clientId,
182
+ credentials.clientSecret
183
+ )
184
+ );
185
+ await new AccountStorage().saveAccountCredentials(credentials);
186
+ setCredentials(credentials);
187
+ }}
188
+ />
189
+ );
190
+ return (
191
+ <div className="app-wrapper">
192
+ {Header(screen, setScreen)}
193
+ <div className="content-wrapper">{body}</div>
194
+ </div>
195
+ );
196
+ }
197
+
198
+ function Header(screen: Screen, setScreen: (screen: Screen) => void) {
199
+ if (screen === Screen.Balance) {
200
+ return (
201
+ <div className="header">
202
+ <img
203
+ src="lightspark_full.png"
204
+ className="app-logo"
205
+ alt="Lightspark logo"
206
+ />
207
+ {/* Disabled for now, but goes to the transaction list screen: */}
208
+ {/* <button onClick={() => setScreen(Screen.Transactions)}>☰</button> */}
209
+ </div>
210
+ );
211
+ } else if (screen === Screen.Transactions) {
212
+ return (
213
+ <div className="header">
214
+ <button onClick={() => setScreen(Screen.Balance)}>
215
+ <LeftArrow />
216
+ </button>
217
+ <HeaderBackText>Transactions</HeaderBackText>
218
+ </div>
219
+ );
220
+ }
221
+ return (
222
+ <div className="header">
223
+ <img
224
+ src="lightspark_full.png"
225
+ className="app-logo"
226
+ alt="Lightspark logo"
227
+ />
228
+ </div>
229
+ );
230
+ }
231
+
232
+ function BalanceScreen(props: {
233
+ balance: Maybe<CurrencyAmount>;
234
+ transactions: Transaction[];
235
+ streamingDuration: number;
236
+ isStreaming: boolean;
237
+ }) {
238
+ const screenContent = !props.balance ? (
239
+ <LoadingWrapper>
240
+ <LoadingSpinner size={48} />
241
+ </LoadingWrapper>
242
+ ) : (
243
+ <>
244
+ <BalanceLabel>Balance</BalanceLabel>
245
+ <BigBalance>
246
+ <CurrencyAmountElement
247
+ useLocaleString
248
+ shortUnit
249
+ amount={props.balance}
250
+ displayUnit={CurrencyUnit.SATOSHI}
251
+ symbol
252
+ />
253
+ </BigBalance>
254
+ <SmallBalance>
255
+ <CurrencyAmountRaw
256
+ shortNumber
257
+ shortUnit
258
+ value={props.balance?.preferredCurrencyValueApprox}
259
+ unit={props.balance?.preferredCurrencyUnit}
260
+ symbol
261
+ />
262
+ </SmallBalance>
263
+ {props.transactions.length > 0 ? (
264
+ <StreamingTransactionChip
265
+ transactions={props.transactions}
266
+ streamingDuration={props.streamingDuration}
267
+ isStreaming={props.isStreaming}
268
+ />
269
+ ) : (
270
+ <InstructionsText style={{ fontSize: "16px" }}>
271
+ Your wallet is now set up.
272
+ </InstructionsText>
273
+ )}
274
+ </>
275
+ );
276
+ return (
277
+ <div
278
+ style={{
279
+ display: "flex",
280
+ flexDirection: "column",
281
+ justifyContent: "end",
282
+ padding: "0 24px",
283
+ height: "100%",
284
+ }}
285
+ >
286
+ {screenContent}
287
+ </div>
288
+ );
289
+ }
290
+
291
+ function LoginScreen(props: {
292
+ lightsparkClient: LightsparkClient | undefined;
293
+ onCreatedAccount: (credentials: StreamingDemoAccountCredentials) => void;
294
+ }) {
295
+ const [isLoading, setIsLoading] = React.useState(false);
296
+ const [errorText, setErrorText] = React.useState<string | undefined>(
297
+ undefined
298
+ );
299
+
300
+ const createWallet = async () => {
301
+ setIsLoading(true);
302
+ const creds = await reserveStreamingDemoAccountCredentials();
303
+ if (creds) {
304
+ props.onCreatedAccount(creds);
305
+ setErrorText(undefined);
306
+ } else {
307
+ setErrorText("Failed to create wallet.");
308
+ setTimeout(() => {
309
+ setErrorText(undefined);
310
+ }, 3000);
311
+ }
312
+ setIsLoading(false);
313
+ };
314
+
315
+ return (
316
+ <div
317
+ style={{
318
+ display: "flex",
319
+ flexDirection: "column",
320
+ justifyContent: "end",
321
+ padding: "0 24px",
322
+ height: "100%",
323
+ }}
324
+ >
325
+ <LoginHeader>One more step</LoginHeader>
326
+ <InstructionsText>
327
+ Create a wallet in test mode and we’ll load test funds for the demo.
328
+ </InstructionsText>
329
+ <CreateWalletButton onClick={createWallet} disabled={isLoading}>
330
+ {!isLoading ? (
331
+ <span style={{ marginInlineEnd: "8px", height: "13px" }}>
332
+ <CirclePlusIcon />
333
+ </span>
334
+ ) : (
335
+ <></>
336
+ )}
337
+ {isLoading ? "Loading..." : "Create Wallet"}
338
+ </CreateWalletButton>
339
+ {errorText ? <ErrorText>{errorText}</ErrorText> : <></>}
340
+ </div>
341
+ );
342
+ }
343
+
344
+ function TransactionsScreen(props: { transactions: Transaction[] }) {
345
+ return (
346
+ <div style={{ width: "100%" }}>
347
+ {props.transactions.map((transaction) => (
348
+ <TransactionRow transaction={transaction} />
349
+ ))}
350
+ </div>
351
+ );
352
+ }
353
+
354
+ const LoadingWrapper = styled.div`
355
+ display: flex;
356
+ width: 100%;
357
+ height: 100%;
358
+ justify-content: center;
359
+ align-items: center;
360
+ `;
361
+
362
+ const BalanceLabel = styled.p`
363
+ font-size: 18px;
364
+ font-weight: 600;
365
+ color: #666666;
366
+ margin-bottom: 4px;
367
+ `;
368
+
369
+ const BigBalance = styled.div`
370
+ overflow-wrap: break-word;
371
+ font-size: 48px;
372
+ font-weight: 800;
373
+ `;
374
+
375
+ const SmallBalance = styled.div`
376
+ overflow-wrap: break-word;
377
+ font-size: 16px;
378
+ font-weight: 500;
379
+ color: #666666;
380
+ `;
381
+
382
+ const InstructionsText = styled.p`
383
+ font-size: 14px;
384
+ font-weight: 500;
385
+ color: #666666;
386
+ margin-bottom: 32px;
387
+ `;
388
+
389
+ const ErrorText = styled.p`
390
+ font-size: 10px;
391
+ font-weight: 700;
392
+ color: red;
393
+ margin-bottom: 8px;
394
+ `;
395
+
396
+ const LoginHeader = styled.p`
397
+ font-size: 21px;
398
+ font-weight: 700;
399
+ color: black;
400
+ margin-bottom: 0;
401
+ `;
402
+
403
+ const HeaderBackText = styled.span`
404
+ font-size: 18px;
405
+ color: black;
406
+ font-weight: 700;
407
+ `;
408
+
409
+ const CreateWalletButton = styled.button`
410
+ background: black;
411
+ color: white;
412
+ display: flex;
413
+ border: none;
414
+ border-radius: 32px;
415
+ padding: 14px 24px;
416
+ font-size: 14px;
417
+ font-weight: 600;
418
+ cursor: pointer;
419
+ margin-bottom: 46px;
420
+ width: 162px;
421
+ justify-content: center;
422
+ align-items: center;
423
+ `;
424
+
425
+ export default App;
package/examples/streaming-wallet-extension/src/auth/AccountStorage.ts ADDED
@@ -0,0 +1,28 @@
1
+ import autoBind from "auto-bind";
2
+ import StreamingDemoAccountCredentials from "./StreamingDemoCredentials";
3
+
4
+ export default class AccountStorage {
5
+ constructor() {
6
+ autoBind(this);
7
+ }
8
+
9
+ saveAccountCredentials(
10
+ credentials: StreamingDemoAccountCredentials
11
+ ): Promise<void> {
12
+ return chrome.storage.local.set({ credentials });
13
+ }
14
+
15
+ async getAccountCredentials(): Promise<StreamingDemoAccountCredentials | null> {
16
+ const savedCreds = (await chrome.storage.local.get("credentials"))
17
+ ?.credentials;
18
+ if (
19
+ !savedCreds ||
20
+ !savedCreds.clientId ||
21
+ !savedCreds.clientSecret ||
22
+ !savedCreds.viewerWalletId
23
+ ) {
24
+ return null;
25
+ }
26
+ return savedCreds as StreamingDemoAccountCredentials;
27
+ }
28
+ }