Transaction: 5ESeM31...gSCv

{ "data": { "relayer-demo.near": { "widget": { "RelayerMessageDemo": { "": "const contract = \"guest-book.near\";\nconst relayerAccountId = \"relayer.pagodaplatform.near\";\nconst messages = Near.view(contract, \"getMessages\", {})\n .reverse()\n .filter((message) => message.sender === context.accountId);\n\nState.init({\n newMessage: \"\",\n});\n\nconst addNewMessage = () => {\n if (state.newMessage.trim() == \"\") {\n return;\n }\n\n Near.call(contract, \"addMessage\", {\n text: state.newMessage,\n });\n};\n\nconst userAccountStatus = fetch(\"https://rpc.mainnet.near.org\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({\n jsonrpc: \"2.0\",\n id: \"dontcare\",\n method: \"query\",\n params: {\n request_type: \"view_account\",\n finality: \"final\",\n account_id: context.accountId,\n },\n }),\n});\n\nconst relayerAccountStatus = fetch(\"https://rpc.mainnet.near.org\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({\n jsonrpc: \"2.0\",\n id: \"dontcare\",\n method: \"query\",\n params: {\n request_type: \"view_account\",\n finality: \"final\",\n account_id: relayerAccountId,\n },\n }),\n});\n\nconst nearAmount = (yocto) => (parseInt(yocto) / Math.pow(10, 24)).toFixed(2);\n\nconst StyledContainer = styled.div`\n background-color: #f2f1ea;\n border-radius: 10px;\n padding: 40px;\n\n .wrapper {\n max-width: 1000px;\n margin: 0 auto;\n }\n\n a,\n textarea {\n display: block;\n }\n\n h1 {\n margin: 40px 0;\n font-weight: bold;\n }\n\n h4 {\n font-weight: normal;\n line-height: 150%;\n }\n\n .relayer-balance {\n color: inherit;\n border: 1px solid #000;\n border-radius: 8px;\n padding: 10px 20px;\n width: fit-content;\n font-size: 12px;\n margin: 40px auto;\n }\n\n .your-balance {\n font-size: 14px;\n color: #3e3e3e;\n }\n\n textarea {\n width: 100%;\n border-radius: 8px;\n padding: 20px;\n border: 1px solid #d6d6d6;\n margin: 20px 0;\n font-size: 16px;\n placeholder {\n color: #818181;\n }\n :focus {\n border: 1px solid #61e5e2;\n outline: none;\n }\n }\n\n button {\n color: white;\n background-color: #000000;\n border-radius: 8px;\n padding: 14px 24px;\n border: none;\n font-size: 16px;\n margin-left: auto;\n display: block;\n :hover {\n color: white;\n background-color: #000000;\n }\n }\n\n .messages {\n margin: 40px 0;\n ul {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n\n li {\n margin: 20px 0;\n padding: 0;\n background-color: #61e5e2;\n border-radius: 40px;\n padding: 10px 20px;\n color: #000000;\n width: fit-content;\n font-size: 14px;\n }\n }\n\n .view-txs-btn {\n color: black;\n font-size: 14px;\n border: 1px solid #000;\n width: fit-content;\n border-radius: 8px;\n padding: 10px 20px;\n }\n\n .learn-more-links-wrapper {\n display: flex;\n align-items: center;\n margin: 15px 0;\n\n :first-of-type {\n margin-top: 0;\n }\n }\n\n .learn-more-links {\n color: black;\n text-decoration: underline;\n font-size: 22px;\n }\n`;\n\nreturn (\n <StyledContainer>\n <div className=\"wrapper\">\n <h1>Relayer: No crypto no problem</h1>\n <h4>\n Got FastAuth? Got zero balance? Add messages to the guest book contract.\n </h4>\n <h4>You make transactions - Pagoda Relayer pays for them.</h4>\n <a\n className=\"relayer-balance\"\n href={`https://nearblocks.io/address/${relayerAccountId}`}\n >\n Pagoda Relayer balance:{\" \"}\n {nearAmount(relayerAccountStatus.body.result.amount)} NEAR\n </a>\n <div className=\"your-balance\">\n Your balance: {nearAmount(userAccountStatus.body.result.amount)} NEAR\n </div>\n <textarea\n name=\"\"\n id=\"\"\n cols=\"30\"\n rows=\"5\"\n placeholder=\"Add your message to the guest book contract...\"\n onChange={(e) => State.update({ newMessage: e.target.value })}\n ></textarea>\n <button\n onClick={async () => {\n addNewMessage();\n }}\n >\n Add Message\n </button>\n <div className=\"messages\">\n <ul>\n {messages.map((data, key) => {\n return <li key={key}>{data.text}</li>;\n })}\n </ul>\n </div>\n <a\n className=\"view-txs-btn\"\n href={`https://nearblocks.io/address/${context.accountId}`}\n >\n View all transactions\n </a>\n <h1>Learn More</h1>\n <div className=\"learn-more-links-wrapper\">\n <a\n className=\"learn-more-links\"\n href=\"https://github.com/near/pagoda-relayer-rs\"\n target=\"_blank\"\n >\n Pagoda Relayer Github Repo\n </a>\n <i class=\"ph-bold ph-arrow-up-right\"></i>\n </div>\n <div className=\"learn-more-links-wrapper\">\n <a\n className=\"learn-more-links\"\n href=\"https://wiki.near.org/overview/BOS/fast-auth\"\n target=\"_blank\"\n >\n Learn About FastAuth\n </a>\n <i class=\"ph-bold ph-arrow-up-right\"></i>\n </div>\n <div className=\"learn-more-links-wrapper\">\n <a\n className=\"learn-more-links\"\n href=\"https://github.com/near/NEPs/pull/366\"\n target=\"_blank\"\n >\n Learn About Meta Transactions\n </a>\n <i class=\"ph-bold ph-arrow-up-right\"></i>\n </div>\n </div>\n </StyledContainer>\n);\n" } } } } }