create-near-app 2.0.0 → 3.0.0

package/templates/react/{src → frontend}/App.js

@@ -1,10 +1,11 @@
 import 'regenerator-runtime/runtime'
 import React from 'react'
-import { login, logout } from './utils'
-import './global.css'
 
-import getConfig from './config'
-const { networkId } = getConfig(process.env.NODE_ENV || 'development')
+import './assets/css/global.css'
+
+import {login, logout, get_greeting, set_greeting} from './assets/js/near/utils'
+import getConfig from './assets/js/near/config'
+
 
 export default function App() {
   // use React Hooks to store greeting in component state
@@ -20,15 +21,11 @@ export default function App() {
   // Learn more: https://reactjs.org/docs/hooks-intro.html
   React.useEffect(
     () => {
-      // in this case, we only care to query the contract when signed in
-      if (window.walletConnection.isSignedIn()) {
-
-        // window.contract is set by initContract in index.js
-        window.contract.getGreeting({ accountId: window.accountId })
-          .then(greetingFromContract => {
-            setGreeting(greetingFromContract)
-          })
-      }
+      // get_greeting is in near/utils.js
+      get_greeting()
+        .then(greetingFromContract => {
+          setGreeting(greetingFromContract)
+        })
     },
 
     // The second argument to useEffect tells React when to re-run the effect
@@ -41,19 +38,27 @@ export default function App() {
   if (!window.walletConnection.isSignedIn()) {
     return (
       <main>
-        <h1>Welcome to NEAR!</h1>
-        <p>
-          To make use of the NEAR blockchain, you need to sign in. The button
-          below will sign you in using NEAR Wallet.
-        </p>
+        <h1>
+          <label
+            htmlFor="greeting"
+            style={{
+              color: 'var(--secondary)',
+              borderBottom: '2px solid var(--secondary)'
+            }}
+          >
+            {greeting}
+          </label>!
+          Welcome to NEAR!
+        </h1>
         <p>
-          By default, when your app runs in "development" mode, it connects
-          to a test network ("testnet") wallet. This works just like the main
-          network ("mainnet") wallet, but the NEAR Tokens on testnet aren't
-          convertible to other currencies – they're just for testing!
+        Your contract is storing a greeting message in the NEAR blockchain. To
+        change it you need to sign in using the NEAR Wallet. It is very simple,
+        just use the button below.
         </p>
         <p>
-          Go ahead and click the button below to try it out:
+        Do not worry, this app runs in the test network ("testnet"). It works
+        just like the main network ("mainnet"), but using NEAR Tokens that are
+        only for testing!
         </p>
         <p style={{ textAlign: 'center', marginTop: '2.5em' }}>
           <button onClick={login}>Sign in</button>
@@ -96,10 +101,8 @@ export default function App() {
 
           try {
             // make an update call to the smart contract
-            await window.contract.setGreeting({
-              // pass the value that the user entered in the greeting field
-              message: newGreeting
-            })
+            // pass the value that the user entered in the greeting field
+            await set_greeting(newGreeting)
           } catch (e) {
             alert(
               'Something went wrong! ' +
@@ -157,7 +160,7 @@ export default function App() {
         </p>
         <ol>
           <li>
-            Look in <code>src/App.js</code> and <code>src/utils.js</code> – you'll see <code>getGreeting</code> and <code>setGreeting</code> being called on <code>contract</code>. What's this?
+            Look in <code>src/App.js</code> and <code>src/utils.js</code> – you'll see <code>get_greeting</code> and <code>set_greeting</code> being called on <code>contract</code>. What's this?
           </li>
           <li>
             Ultimately, this <code>contract</code> code is defined in <code>assembly/main.ts</code> – this is the source code for your <a target="_blank" rel="noreferrer" href="https://docs.near.org/docs/develop/contracts/overview">smart contract</a>.</li>
@@ -176,14 +179,16 @@ export default function App() {
 
 // this component gets rendered by App after the form is submitted
 function Notification() {
+  const { networkId } = getConfig(process.env.NODE_ENV || 'development')
   const urlPrefix = `https://explorer.${networkId}.near.org/accounts`
+
   return (
     <aside>
       <a target="_blank" rel="noreferrer" href={`${urlPrefix}/${window.accountId}`}>
         {window.accountId}
       </a>
       {' '/* React trims whitespace around tags; insert literal space character when needed */}
-      called method: 'setGreeting' in contract:
+      called method: 'set_greeting' in contract:
       {' '}
       <a target="_blank" rel="noreferrer" href={`${urlPrefix}/${window.contract.contractId}`}>
         {window.contract.contractId}

package/{common/frontend → templates/react/frontend/assets/css}/global.css

@@ -26,11 +26,12 @@ body {
 
 main {
   margin: 0 auto;
-  max-width: 25em;
+  max-width: 26em;
+  text-align: justify;
 }
 
 h1 {
-  background-image: url(assets/logo-black.svg);
+  background-image: url(../img/logo-black.svg);
   background-position: center 1em;
   background-repeat: no-repeat;
   background-size: auto 1.5em;
@@ -180,7 +181,7 @@ aside footer *:last-child {
     --light-gray: #444;
   }
   h1 {
-    background-image: url(assets/logo-white.svg);
+    background-image: url(../img/logo-white.svg);
   }
   input:focus {
     box-shadow: 0 0 10em rgba(255, 255, 255, 0.02) inset;

package/templates/react/{src → frontend/assets/js/near}/config.js

@@ -1,4 +1,4 @@
-const CONTRACT_NAME = process.env.CONTRACT_NAME ||'near-blank-project'
+const CONTRACT_NAME = process.env.CONTRACT_NAME ||'new-awesome-project'
 
 function getConfig(env) {
   switch (env) {

package/templates/{vue/src → react/frontend/assets/js/near}/utils.js

@@ -3,8 +3,6 @@ import getConfig from './config'
 
 const nearConfig = getConfig(process.env.NODE_ENV || 'development')
 
-console.log(nearConfig)
-
 // Initialize contract & set global variables
 export async function initContract() {
   // Initialize connection to the NEAR testnet
@@ -20,9 +18,9 @@ export async function initContract() {
   // Initializing our contract APIs by contract name and configuration
   window.contract = await new Contract(window.walletConnection.account(), nearConfig.contractName, {
     // View methods are read only. They don't modify the state, but usually return some value.
-    viewMethods: ['getGreeting'],
+    viewMethods: ['get_greeting'],
     // Change methods can modify the state. But you don't receive the returned value when called.
-    changeMethods: ['setGreeting'],
+    changeMethods: ['set_greeting'],
   })
 }
 
@@ -39,3 +37,15 @@ export function login() {
   // the private key in localStorage.
   window.walletConnection.requestSignIn(nearConfig.contractName)
 }
+
+export async function set_greeting(message){
+  let response = await window.contract.set_greeting({
+    args:{message: message}
+  })
+  return response
+}
+
+export async function get_greeting(){
+  let greeting = await window.contract.get_greeting()
+  return greeting
+}

package/templates/react/{src → frontend}/index.html

@@ -2,9 +2,9 @@
 <html lang="en">
   <head>
     <meta charset="utf-8" />
-    <link rel="icon" href="./assets/favicon.ico" />
+    <link rel="icon" href="./assets/img/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
-    <link rel="apple-touch-icon" href="./assets/favicon.ico" />
+    <link rel="apple-touch-icon" href="./assets/img/favicon.ico" />
     <title>Welcome to NEAR with React</title>
   </head>
   <body>
@@ -20,6 +20,6 @@
       To begin the development, run `npm start` or `yarn start`.
       To create a production bundle, use `npm run build` or `yarn build`.
     -->
-    <script src="./index.js"></script>
+    <script src="./index.js" type="module"></script>
   </body>
 </html>

package/templates/react/frontend/index.js

@@ -0,0 +1,14 @@
+import React from 'react'
+import { createRoot } from 'react-dom/client'
+import App from './App'
+import { initContract } from './assets/js/near/utils'
+
+const container = document.querySelector('#root')
+const root = createRoot(container) // createRoot(container!) if you use TypeScript
+
+window.nearInitPromise = initContract()
+  .then(() => {
+    <App />
+    root.render(<App tab="home" />)
+  })
+  .catch(console.error)

package/templates/react/near.gitignore

@@ -1,7 +1,7 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 # Developer note: near.gitignore will be renamed to .gitignore upon project creation
 # dependencies
-/node_modules
+node_modules
 /.pnp
 .pnp.js
 

package/templates/react/package.json

@@ -1,59 +1,45 @@
 {
-  "name": "near-blank-project",
-  "version": "0.1.0",
-  "license": "UNLICENSED",
+  "name": "greeter",
+  "version": "1.0.0",
+  "license": "(MIT AND Apache-2.0)",
   "scripts": {
     "build": "npm run build:contract && npm run build:web",
-    "build:contract": "node contract/compile.js",
-    "build:contract:debug": "node contract/compile.js --debug",
-    "build:web": "parcel build src/index.html --public-url ./",
-    "dev:deploy:contract": "near dev-deploy",
-    "deploy:contract": "near deploy",
-    "deploy:pages": "gh-pages -d dist/",
-    "deploy": "npm run build && npm run deploy:contract && npm run deploy:pages",
-    "prestart": "npm run build:contract:debug && npm run dev:deploy:contract",
-    "start": "echo The app is starting! It will automatically open in your browser when ready && env-cmd -f ./neardev/dev-account.env parcel src/index.html --open",
+      "build:contract": "cd contract && npm run build && mkdir -p ../out && rm -f ./out/main.wasm && cp ./build/release/greeter.wasm ../out/main.wasm",
+      "build:web": "parcel build frontend/index.html --public-url ./",
+    "deploy": "npm run build:contract && near dev-deploy",
+    "start": "npm run deploy && echo The app is starting! It will automatically open in your browser when ready && env-cmd -f ./neardev/dev-account.env parcel frontend/index.html --open",
     "dev": "nodemon --watch contract -e ts --exec \"npm run start\"",
-    "test": "npm run build:contract:debug && cd contract && npm run test && cd .. && jest test --runInBand"
+    "test": "npm run build:contract && npm run test:unit && npm run test:integration",
+      "test:unit": "cd contract && npm i && npm run test",
+      "test:integration": "npm run test:integration:ts && npm run test:integration:rs",
+        "test:integration:ts": "cd integration-tests/ts && npm run test",
+        "test:integration:rs": "cd integration-tests/rs && cargo run --example integration-tests"
   },
   "devDependencies": {
-    "@babel/core": "~7.14.0",
-    "@babel/preset-env": "~7.14.0",
-    "@babel/preset-react": "~7.13.13",
-    "babel-jest": "~26.6.2",
+    "@babel/core": "~7.18.2",
+    "@babel/preset-env": "~7.18.2",
+    "@babel/preset-react": "~7.17.12",
+    "ava": "^4.2.0",
     "env-cmd": "~10.1.0",
-    "gh-pages": "~3.1.0",
-    "jest": "~26.6.2",
-    "jest-environment-node": "~26.6.2",
-    "near-cli": "~1.6.0",
-    "nodemon": "~2.0.3",
-    "parcel-bundler": "~1.12.4",
-    "react-test-renderer": "~17.0.1",
-    "shelljs": "~0.8.4"
+    "near-cli": "~3.3.0",
+    "near-workspaces": "^2.0.0",
+    "nodemon": "~2.0.16",
+    "parcel": "^2.6.0",
+    "process": "^0.11.10",
+    "react-test-renderer": "~18.1.0",
+    "ts-node": "^10.8.0",
+    "typescript": "^4.7.2"
   },
   "dependencies": {
-    "near-api-js": "~0.41.0",
-    "react": "~17.0.1",
-    "react-dom": "~17.0.1",
-    "regenerator-runtime": "~0.13.5"
+    "near-api-js": "~0.44.2",
+    "near-sdk-as": "^3.2.3",
+    "react": "~18.1.0",
+    "react-dom": "~18.1.0",
+    "regenerator-runtime": "~0.13.9"
   },
   "resolutions": {
     "@babel/preset-env": "7.13.8"
   },
-  "jest": {
-    "moduleNameMapper": {
-      "\\.(jpg|ico|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$": "<rootDir>/src/__mocks__/fileMock.js",
-      "\\.(css|less)$": "<rootDir>/src/__mocks__/fileMock.js"
-    },
-    "setupFiles": [
-      "<rootDir>/src/jest.init.js"
-    ],
-    "testEnvironment": "near-cli/test_environment",
-    "testPathIgnorePatterns": [
-      "<rootDir>/contract/",
-      "<rootDir>/node_modules/"
-    ]
-  },
   "browserslist": {
     "production": [
       ">0.2%",

package/templates/vanilla/README.md

@@ -24,8 +24,8 @@ Exploring The Code
 
 1. The "backend" code lives in the `/contract` folder. See the README there for
    more info.
-2. The frontend code lives in the `/src` folder. `/src/index.html` is a great
-   place to start exploring. Note that it loads in `/src/index.js`, where you
+2. The frontend code lives in the `/frontend` folder. `/frontend/index.html` is a great
+   place to start exploring. Note that it loads in `/frontend/assets/src/js/index.js`, where you
    can learn how the frontend connects to the NEAR blockchain.
 3. Tests: there are different kinds of tests for the frontend and the smart
    contract. See `contract/README` for info about how it's tested. The frontend

package/templates/vanilla/frontend/assets/css/global.css

@@ -0,0 +1,189 @@
+* {
+  box-sizing: border-box;
+}
+
+html {
+  --bg: #efefef;
+  --fg: #1e1e1e;
+  --gray: #555;
+  --light-gray: #ccc;
+  --shadow: #e6e6e6;
+  --success: rgb(90, 206, 132);
+  --primary: #FF585D;
+  --secondary: #0072CE;
+
+  background-color: var(--bg);
+  color: var(--fg);
+  font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
+  font-size: calc(0.9em + 0.5vw);
+  line-height: 1.3;
+}
+
+body {
+  margin: 0;
+  padding: 1em;
+}
+
+main {
+  margin: 0 auto;
+  max-width: 26em;
+  text-align: justify;
+}
+
+h1 {
+  background-image: url(../img/logo-black.svg);
+  background-position: center 1em;
+  background-repeat: no-repeat;
+  background-size: auto 1.5em;
+  margin-top: 0;
+  padding: 3.5em 0 0.5em;
+  text-align: center;
+}
+
+a,
+.link {
+  color: var(--primary);
+  text-decoration: none;
+}
+a:hover,
+a:focus,
+.link:hover,
+.link:focus {
+  text-decoration: underline;
+}
+a:active,
+.link:active {
+  color: var(--secondary);
+}
+
+button, input {
+  font: inherit;
+  outline: none;
+}
+
+button {
+  background-color: var(--secondary);
+  border-radius: 5px;
+  border: none;
+  color: #efefef;
+  cursor: pointer;
+  padding: 0.3em 0.75em;
+  transition: transform 30ms;
+}
+button:hover, button:focus {
+  box-shadow: 0 0 10em rgba(255, 255, 255, 0.2) inset;
+}
+button:active {
+  box-shadow: 0 0 10em rgba(0, 0, 0, 0.1) inset;
+}
+button.link {
+  background: none;
+  border: none;
+  box-shadow: none;
+  display: inline;
+}
+[disabled] button, button[disabled] {
+  box-shadow: none;
+  background-color: var(--light-gray);
+  color: gray;
+  cursor: not-allowed;
+  transform: none;
+}
+[disabled] button {
+  text-indent: -900em;
+  width: 2em;
+  position: relative;
+}
+[disabled] button:after {
+  content: " ";
+  display: block;
+  width: 0.8em;
+  height: 0.8em;
+  border-radius: 50%;
+  border: 2px solid #fff;
+  border-color: var(--fg) transparent var(--fg) transparent;
+  animation: loader 1.2s linear infinite;
+  position: absolute;
+  top: 0.45em;
+  right: 0.5em;
+}
+@keyframes loader {
+  0% { transform: rotate(0deg) }
+  100% { transform: rotate(360deg) }
+}
+
+fieldset {
+  border: none;
+  padding: 2em 0;
+}
+
+input {
+  background-color: var(--shadow);
+  border: none;
+  border-radius: 5px 0 0 5px;
+  caret-color: var(--primary);
+  color: inherit;
+  padding: 0.25em 1em;
+}
+input::selection {
+  background-color: var(--secondary);
+  color: #efefef;
+}
+input:focus {
+  box-shadow: 0 0 10em rgba(0, 0, 0, 0.02) inset;
+}
+
+code {
+  color: var(--gray);
+}
+
+li {
+  padding-bottom: 1em;
+}
+
+aside {
+  animation: notify ease-in-out 10s;
+  background-color: var(--shadow);
+  border-radius: 5px;
+  bottom: 0;
+  font-size: 0.8em;
+  margin: 1em;
+  padding: 1em;
+  position: fixed;
+  transform: translateY(10em);
+  right: 0;
+}
+aside footer {
+  display: flex;
+  font-size: 0.9em;
+  justify-content: space-between;
+  margin-top: 0.5em;
+}
+aside footer *:first-child {
+  color: var(--success);
+}
+aside footer *:last-child {
+  color: var(--gray);
+}
+@keyframes notify {
+  0% { transform: translateY(10em) }
+  5% { transform: translateY(0) }
+  95% { transform: translateY(0) }
+  100% { transform: translateY(10em) }
+}
+
+@media (prefers-color-scheme: dark) {
+  html {
+    --bg: #1e1e1e;
+    --fg: #efefef;
+    --gray: #aaa;
+    --shadow: #2a2a2a;
+    --light-gray: #444;
+  }
+  h1 {
+    background-image: url(../img/logo-white.svg);
+  }
+  input:focus {
+    box-shadow: 0 0 10em rgba(255, 255, 255, 0.02) inset;
+  }
+}

package/templates/vanilla/frontend/assets/img/logo-black.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 288 288" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="76.81" x2="211.16" y1="211.17" y2="76.81"><stop offset=".21" stop-color="#24272a"/><stop offset=".42" stop-color="#24272a" stop-opacity="0"/><stop offset=".59" stop-color="#24272a" stop-opacity="0"/><stop offset=".81" stop-color="#24272a"/></linearGradient><path d="m88.46 216a16.45 16.45 0 0 0 12.46-5.71l112.56-130.57a16.42 16.42 0 0 0 -13.94-7.72 16.46 16.46 0 0 0 -12.41 5.65l-113.13 129.8a16.46 16.46 0 0 0 14.46 8.55z" fill="url(#a)"/><path d="m88.46 216a16.46 16.46 0 0 0 7.54-1.83v-109l87.45 104.94a16.44 16.44 0 0 0 12.64 5.89h3.45a16.46 16.46 0 0 0 16.46-16.46v-111.08a16.46 16.46 0 0 0 -16.46-16.46 16.36 16.36 0 0 0 -7.54 1.81v109.05l-87.45-104.94a16.44 16.44 0 0 0 -12.64-5.92h-3.45a16.46 16.46 0 0 0 -16.46 16.46v111.08a16.46 16.46 0 0 0 16.46 16.46z" fill="#24272a"/></svg>

package/templates/vanilla/frontend/assets/img/logo-white.svg

@@ -0,0 +1 @@
+<svg viewBox="0 0 288 288" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><linearGradient id="a" gradientUnits="userSpaceOnUse" x1="76.81" x2="211.16" y1="211.17" y2="76.81"><stop offset=".21" stop-color="#fff"/><stop offset=".42" stop-color="#fff" stop-opacity="0"/><stop offset=".59" stop-color="#fff" stop-opacity="0"/><stop offset=".81" stop-color="#fff"/></linearGradient><path d="m88.46 216a16.45 16.45 0 0 0 12.46-5.71l112.56-130.57a16.42 16.42 0 0 0 -13.94-7.72 16.46 16.46 0 0 0 -12.41 5.65l-113.13 129.8a16.46 16.46 0 0 0 14.46 8.55z" fill="url(#a)"/><path d="m88.46 216a16.46 16.46 0 0 0 7.54-1.83v-109l87.45 104.94a16.44 16.44 0 0 0 12.64 5.89h3.45a16.46 16.46 0 0 0 16.46-16.46v-111.08a16.46 16.46 0 0 0 -16.46-16.46 16.36 16.36 0 0 0 -7.54 1.81v109.05l-87.45-104.94a16.44 16.44 0 0 0 -12.64-5.92h-3.45a16.46 16.46 0 0 0 -16.46 16.46v111.08a16.46 16.46 0 0 0 16.46 16.46z" fill="#fff"/></svg>

package/templates/vanilla/frontend/assets/js/index.js

@@ -0,0 +1,74 @@
+import 'regenerator-runtime/runtime'
+import { initContract, login, logout, set_greeting, get_greeting } from './near/utils'
+
+// On submit, get the greeting and send it to the contract
+document.querySelector('form').onsubmit = async (event) => {
+  event.preventDefault()
+
+  // get elements from the form using their id attribute
+  const { fieldset, greeting } = event.target.elements
+
+  // disable the form while the value gets updated on-chain
+  fieldset.disabled = true
+
+  try {
+    await set_greeting(greeting.value)
+  } catch (e) {
+    alert(
+      'Something went wrong! ' +
+      'Maybe you need to sign out and back in? ' +
+      'Check your browser console for more info.'
+    )
+    throw e
+  }
+
+  // re-enable the form, whether the call succeeded or failed
+  fieldset.disabled = false
+
+  // update the greeting in the UI
+  await fetchGreeting()
+}
+
+document.querySelector('#sign-in-button').onclick = login
+document.querySelector('#sign-out-button').onclick = logout
+
+async function fetchGreeting() {
+  // Get greeting from the contract
+  const currentGreeting = await get_greeting()
+
+  // Set all elements marked as greeting with the current greeting
+  document.querySelectorAll('[data-behavior=greeting]').forEach(el => {
+    el.innerText = currentGreeting
+    el.value = currentGreeting
+  })
+}
+
+// `nearInitPromise` gets called on page load
+window.nearInitPromise = initContract()
+  .then(flow)
+  .catch(console.error)
+
+function flow(){
+  if (window.walletConnection.isSignedIn()){
+    signedInFlow()
+  }else{
+    signedOutFlow()
+  }
+}
+
+// Display the signed-out-flow container
+function signedOutFlow() {
+  document.querySelector('#signed-out-flow').style.display = 'block'
+  fetchGreeting()
+}
+
+// Displaying the signed in flow container and fill in account-specific data
+function signedInFlow() {
+  document.querySelector('#signed-in-flow').style.display = 'block'
+
+  document.querySelectorAll('[data-behavior=account-id]').forEach(el => {
+    el.innerText = window.accountId
+  })
+
+  fetchGreeting()
+}

package/templates/vanilla/{src → frontend/assets/js/near}/config.js

@@ -1,4 +1,4 @@
-const CONTRACT_NAME = process.env.CONTRACT_NAME ||'near-blank-project'
+const CONTRACT_NAME = process.env.CONTRACT_NAME ||'new-awesome-project'
 
 function getConfig(env) {
   switch (env) {

package/templates/{angular/src → vanilla/frontend/assets/js/near}/utils.js

@@ -3,8 +3,6 @@ import getConfig from './config'
 
 const nearConfig = getConfig(process.env.NODE_ENV || 'development')
 
-console.log(nearConfig)
-
 // Initialize contract & set global variables
 export async function initContract() {
   // Initialize connection to the NEAR testnet
@@ -20,9 +18,9 @@ export async function initContract() {
   // Initializing our contract APIs by contract name and configuration
   window.contract = await new Contract(window.walletConnection.account(), nearConfig.contractName, {
     // View methods are read only. They don't modify the state, but usually return some value.
-    viewMethods: ['getGreeting'],
+    viewMethods: ['get_greeting'],
     // Change methods can modify the state. But you don't receive the returned value when called.
-    changeMethods: ['setGreeting'],
+    changeMethods: ['set_greeting'],
   })
 }
 
@@ -39,3 +37,15 @@ export function login() {
   // the private key in localStorage.
   window.walletConnection.requestSignIn(nearConfig.contractName)
 }
+
+export async function set_greeting(message){
+  let response = await window.contract.set_greeting({
+    args:{message: message}
+  })
+  return response
+}
+
+export async function get_greeting(){
+  let greeting = await window.contract.get_greeting()
+  return greeting
+}