create-near-app 6.0.0-beta.5 → 6.0.1-beta.0

package/dist/app.js

@@ -42,7 +42,6 @@ const show = __importStar(require("./messages"));
             contract,
             frontend,
             tests,
-            projectName,
             templatesDir: path_1.default.resolve(__dirname, '../templates'),
             projectPath,
         });

package/dist/make.js

@@ -32,22 +32,21 @@ const cross_spawn_1 = __importDefault(require("cross-spawn"));
 const fs_1 = __importDefault(require("fs"));
 const ncp_1 = require("ncp");
 const path_1 = __importDefault(require("path"));
-async function createProject({ contract, frontend, tests, projectPath, projectName, templatesDir }) {
+async function createProject({ contract, frontend, tests, projectPath, templatesDir }) {
     if (contract !== 'none') {
-        await createContract({ contract, tests, projectPath, projectName, templatesDir });
+        await createContract({ contract, tests, projectPath, templatesDir });
     }
     else {
-        await createGateway({ frontend, projectPath, projectName, templatesDir });
+        await createGateway({ frontend, projectPath, templatesDir });
     }
     return true;
 }
 exports.createProject = createProject;
-async function createContract({ contract, tests, projectPath, projectName, templatesDir }) {
+async function createContract({ contract, tests, projectPath, templatesDir }) {
     // contract folder
     const sourceContractDir = path_1.default.resolve(templatesDir, 'contracts', contract);
-    const targetContractDir = projectPath;
-    fs_1.default.mkdirSync(targetContractDir, { recursive: true });
-    await copyDir(sourceContractDir, targetContractDir);
+    fs_1.default.mkdirSync(projectPath, { recursive: true });
+    await copyDir(sourceContractDir, projectPath);
     // copy sandbox-test dir
     const targetTestDir = path_1.default.resolve(projectPath, `sandbox-${tests}`);
     const sourceTestDir = path_1.default.resolve(`${templatesDir}/sandbox-tests/sandbox-${tests}`);
@@ -71,11 +70,10 @@ async function createContract({ contract, tests, projectPath, projectName, templ
         }
     }
 }
-async function createGateway({ frontend, projectPath, projectName, templatesDir }) {
+async function createGateway({ frontend, projectPath, templatesDir }) {
     const sourceFrontendDir = path_1.default.resolve(`${templatesDir}/frontend/${frontend}`);
-    const targetFrontendDir = path_1.default.resolve(`${projectPath}`);
-    fs_1.default.mkdirSync(targetFrontendDir, { recursive: true });
-    await copyDir(sourceFrontendDir, targetFrontendDir);
+    fs_1.default.mkdirSync(projectPath, { recursive: true });
+    await copyDir(sourceFrontendDir, projectPath);
 }
 // Wrap `ncp` tool to wait for the copy to finish when using `await`
 function copyDir(source, dest) {

package/dist/messages.js

@@ -56,9 +56,10 @@ ${!install ? (0, chalk_1.default) `   - {inverse Install all dependencies}
    - {inverse Start your app}:
          {blue pnpm {bold run dev}}`;
 exports.gatewayInstructions = gatewayInstructions;
-const argsError = () => (0, exports.show)((0, chalk_1.default) `{red Arguments error}
+const argsError = (msg) => (0, exports.show)((0, chalk_1.default) `{red Arguments error: {white ${msg}}}
+
 Run {blue npx create-near-app} without arguments, or use:
-npx create-near-app <projectName> --frontend next|vanilla|none --contract rs|ts|none --tests rs|ts|none`);
+npx create-near-app <projectName> [--frontend next|vanilla|none] [--contract rs|ts|none --tests rs|ts|none]`);
 exports.argsError = argsError;
 const unsupportedNodeVersion = (supported) => (0, exports.show)((0, chalk_1.default) `{red We support node.js version ${supported} or later}`);
 exports.unsupportedNodeVersion = unsupportedNodeVersion;

package/dist/tracking.js

@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.trackUsage = exports.trackingMessage = void 0;
 const chalk_1 = __importDefault(require("chalk"));
 const mixpanel_1 = __importDefault(require("mixpanel"));
-const MIXPANEL_TOKEN = 'df164f13212cbb0dfdae991da60e87f2';
+const MIXPANEL_TOKEN = '24177ef1ec09ffea5cb6f68909c66a61';
 const tracker = mixpanel_1.default.init(MIXPANEL_TOKEN);
 exports.trackingMessage = (0, chalk_1.default) `Near collects anonymous information on the commands used. No personal information that could identify you is shared`;
 // TODO: track different failures & install usage
-const trackUsage = async (frontend, contract) => {
+const trackUsage = async (frontend, contract, testing) => {
     // prevents logging from CI
     if (process.env.NEAR_ENV === 'ci' || process.env.NODE_ENV === 'ci') {
         console.log('Mixpanel logging is skipped in CI env');
@@ -20,11 +20,12 @@ const trackUsage = async (frontend, contract) => {
         const mixPanelProperties = {
             frontend,
             contract,
+            testing,
             os: process.platform,
             nodeVersion: process.versions.node,
             timestamp: new Date().toString()
         };
-        tracker.track('track create near app', mixPanelProperties);
+        tracker.track('CNA', mixPanelProperties);
     }
     catch (e) {
         console.error('Warning: problem while sending tracking data. Error: ', e);

package/dist/user-input.js

@@ -26,7 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.projectPath = exports.promptAndGetConfig = exports.getUserAnswers = exports.validateUserArgs = exports.getUserArgs = void 0;
+exports.projectPath = exports.promptAndGetConfig = exports.getUserAnswers = exports.getUserArgs = void 0;
 const types_1 = require("./types");
 const chalk_1 = __importDefault(require("chalk"));
 const prompts_1 = __importDefault(require("prompts"));
@@ -38,8 +38,8 @@ const fs_1 = __importDefault(require("fs"));
 async function getUserArgs() {
     commander_1.program
         .argument('[projectName]')
-        .option('--contract [ts|rs|none]')
         .option('--frontend [next|vanilla|none]')
+        .option('--contract [ts|rs|none]')
         .option('--tests [rs|ts|none]')
         .option('--install')
         .addHelpText('after', 'You can create a frontend or a contract with tests');
@@ -50,31 +50,6 @@ async function getUserArgs() {
     return { contract, frontend, projectName, tests, install };
 }
 exports.getUserArgs = getUserArgs;
-function validateUserArgs(args) {
-    if (args === null) {
-        return 'error';
-    }
-    const { projectName, contract, frontend, tests } = args;
-    const hasAllOptions = contract !== undefined && frontend !== undefined;
-    const hasPartialOptions = contract !== undefined || frontend !== undefined;
-    const hasProjectName = projectName !== undefined;
-    const hasAllArgs = hasAllOptions && hasProjectName;
-    const hasNoArgs = !hasPartialOptions && !hasProjectName;
-    const optionsAreValid = hasAllOptions
-        && types_1.FRONTENDS.includes(frontend)
-        && types_1.CONTRACTS.includes(contract)
-        && types_1.TESTING_FRAMEWORKS.includes(tests);
-    if (hasNoArgs) {
-        return 'none';
-    }
-    else if (hasAllArgs && optionsAreValid) {
-        return 'ok';
-    }
-    else {
-        return 'error';
-    }
-}
-exports.validateUserArgs = validateUserArgs;
 const appChoices = [
     { title: 'A Near Gateway (Web App)', description: 'A multi-chain App that talks with Near contracts and Near components', value: 'gateway' },
     { title: 'A Near Smart Contract', description: 'A smart contract to be deployed in the Near Blockchain', value: 'contract' },
@@ -161,20 +136,20 @@ async function promptAndGetConfig() {
     }
     // process cli args
     let args = await getUserArgs();
-    if (args.contract && (!args.tests || args.frontend)) {
-        return show.argsError();
-    }
-    if (args.frontend && (args.tests || args.contract)) {
-        return show.argsError();
-    }
     // If no args, prompt user
-    if (!args.contract && !args.frontend) {
+    if (!args.projectName) {
         show.welcome();
         args = await getUserAnswers();
     }
+    // Homogenizing terminal args with prompt args
+    args.contract = args.contract || 'none';
+    args.frontend = args.frontend || 'none';
+    args.tests = args.tests || 'none';
+    if (!validateUserArgs(args))
+        return;
     // track user input
-    const { frontend, contract } = args;
-    (0, tracking_1.trackUsage)(frontend, contract);
+    const { frontend, contract, tests } = args;
+    (0, tracking_1.trackUsage)(frontend, contract, tests);
     let path = (0, exports.projectPath)(args.projectName);
     if (fs_1.default.existsSync(path)) {
         return show.directoryExists(path);
@@ -184,4 +159,40 @@ async function promptAndGetConfig() {
 exports.promptAndGetConfig = promptAndGetConfig;
 const projectPath = (projectName) => `${process.cwd()}/${projectName}`;
 exports.projectPath = projectPath;
+const validateUserArgs = (args) => {
+    if (!types_1.FRONTENDS.includes(args.frontend)) {
+        show.argsError(`Invalid frontend type: ${args.frontend}`);
+        return false;
+    }
+    if (!types_1.CONTRACTS.includes(args.contract)) {
+        show.argsError(`Invalid contract type: ${args.contract}`);
+        return false;
+    }
+    if (!types_1.TESTING_FRAMEWORKS.includes(args.tests)) {
+        show.argsError(`Invalid testing framework: ${args.tests}`);
+        return false;
+    }
+    if (!args.projectName) {
+        show.argsError('Please provide a project name');
+        return false;
+    }
+    if ((args.contract === 'none') === (args.frontend === 'none')) {
+        console.log(args.contract, args.frontend);
+        show.argsError('Please create a contract OR a frontend');
+        return false;
+    }
+    if (args.contract !== 'none' && args.tests === 'none') {
+        show.argsError('Please select a testing framework for your contract');
+        return false;
+    }
+    if (args.frontend !== 'none' && args.tests !== 'none') {
+        show.argsError('Remove the --tests flag when creating a frontend');
+        return false;
+    }
+    if (args.contract === 'ts' && args.tests === 'rs') {
+        show.argsError('We currently do not support creating a contract in TS with Rust tests, please create it manually');
+        return false;
+    }
+    return true;
+};
 //# sourceMappingURL=user-input.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-near-app",
-  "version": "6.0.0-beta.5",
+  "version": "6.0.1-beta.0",
   "description": "Quickly scaffold your dApp on NEAR Blockchain",
   "main": "index.js",
   "engines": {

package/templates/contracts/ts/package.json

@@ -2,6 +2,9 @@
   "name": "hello_near",
   "version": "1.0.0",
   "license": "(MIT AND Apache-2.0)",
+  "engines": {
+    "node": "16.x"
+  },
   "type": "module",
   "scripts": {
     "build": "near-sdk-js build src/contract.ts build/hello_near.wasm",

package/templates/frontend/next/package.json

@@ -2,6 +2,9 @@
   "name": "hello-near",
   "version": "1.0.0",
   "private": true,
+  "engines": {
+    "node": ">=18"
+  },
   "scripts": {
     "dev": "next dev",
     "build": "next build",

package/templates/frontend/next/src/app/hello-components/page.js

@@ -1,6 +1,6 @@
 import dynamic from 'next/dynamic';
 
-import styles from '@/app/app.module.css'
+import styles from '@/app/app.module.css';
 import { DocsCard, HelloNearCard } from '@/components/cards';
 import { NetworkId, ComponentMap } from '@/config';
 
@@ -12,33 +12,33 @@ export default function HelloComponents() {
 
   return (
     <>
-    <main className={styles.main}>
-      <div className={styles.description}>
-        <p>
-          Loading components from: &nbsp;
-          <code className={styles.code}>{socialComponents.socialDB}</code>
-        </p>
-      </div>
-      <div className={styles.center}>
-        <h1> <code>Multi-chain</code> Components Made Simple </h1>
-      </div>
-      <div className='row'>
-        <div class="col-6">
-          <Component src={socialComponents.HelloNear} />
-          <p class="my-4">&nbsp;</p>
-          <Component src={socialComponents.LoveNear} />
+      <main className={styles.main}>
+        <div className={styles.description}>
+          <p>
+            Loading components from: &nbsp;
+            <code className={styles.code}>{socialComponents.socialDB}</code>
+          </p>
         </div>
-        <div class="col-6">
-          <Component src={socialComponents.Lido} />
+        <div className={styles.center}>
+          <h1> <code>Multi-chain</code> Components Made Simple </h1>
         </div>
-      </div>
-      <hr />
+        <div className='row'>
+          <div class="col-6">
+            <Component src={socialComponents.HelloNear} />
+            <p class="my-4">&nbsp;</p>
+            <Component src={socialComponents.LoveNear} />
+          </div>
+          <div class="col-6">
+            <Component src={socialComponents.Lido} />
+          </div>
+        </div>
+        <hr />
 
-      <div className={styles.grid}>
-        <DocsCard />
-        <HelloNearCard />
-      </div>
-    </main>
+        <div className={styles.grid}>
+          <DocsCard />
+          <HelloNearCard />
+        </div>
+      </main>
     </>
   );
 }

package/templates/frontend/next/src/app/hello-near/page.js

@@ -1,35 +1,35 @@
-'use client'
+'use client';
 import { DocsCard, HelloComponentsCard } from '@/components/cards';
 import { useWallet } from '@/wallets/wallet-selector';
-import { useState, useEffect } from 'react'
+import { useState, useEffect } from 'react';
 import { HelloNearContract, NetworkId } from '../../config';
-import styles from '../app.module.css'
+import styles from '../app.module.css';
 
 // Contract that the app will interact with
 const CONTRACT = HelloNearContract[NetworkId];
 
-export default function HelloNear({ }) {
-  const { signedAccountId, viewMethod, callMethod } = useWallet()
+export default function HelloNear() {
+  const { signedAccountId, viewMethod, callMethod } = useWallet();
 
-  const [greeting, setGreeting] = useState('loading...')
-  const [loggedIn, setLoggedIn] = useState(false)
-  const [showSpinner, setShowSpinner] = useState(false)
+  const [greeting, setGreeting] = useState('loading...');
+  const [loggedIn, setLoggedIn] = useState(false);
+  const [showSpinner, setShowSpinner] = useState(false);
 
   useEffect(() => {
     viewMethod && viewMethod(CONTRACT, 'get_greeting', {}).then(
       greeting => setGreeting(greeting)
-    )
-  }, [viewMethod])
+    );
+  }, [viewMethod]);
 
   useEffect(() => {
-    setLoggedIn(!!signedAccountId)
-  }, [signedAccountId])
+    setLoggedIn(!!signedAccountId);
+  }, [signedAccountId]);
 
   const saveGreeting = async () => {
-    setShowSpinner(true)
+    setShowSpinner(true);
     await callMethod(CONTRACT, 'set_greeting', { greeting });
-    setShowSpinner(false)
-  }
+    setShowSpinner(false);
+  };
 
   return (
     <main className={styles.main}>
@@ -43,7 +43,7 @@ export default function HelloNear({ }) {
       <div className={styles.center}>
         <h1 className="w-100"> The contract says: <code>{greeting}</code> </h1>
         <div className="input-group" hidden={!loggedIn}>
-          <input type="text" className="form-control w-20" placeholder="Store a new greeting" onChange={t => { setGreeting(t.target.value) }} />
+          <input type="text" className="form-control w-20" placeholder="Store a new greeting" onChange={t => { setGreeting(t.target.value); } } />
           <div className="input-group-append">
             <button className="btn btn-secondary" onClick={saveGreeting}>
               <span hidden={showSpinner}> Save </span>
@@ -60,5 +60,5 @@ export default function HelloNear({ }) {
         <HelloComponentsCard />
       </div>
     </main>
-  )
+  );
 }

package/templates/frontend/next/src/app/layout.js

@@ -1,16 +1,15 @@
-'use client'
-import './globals.css'
+'use client';
+import './globals.css';
 import '@near-wallet-selector/modal-ui/styles.css';
 
-import { ComponentMap, NetworkId } from '@/config';
+import { NetworkId } from '@/config';
 import { Navigation } from '@/components/navigation';
-import { initWallet } from '@/wallets/wallet-selector';
+import { useInitWallet } from '@/wallets/wallet-selector';
 
 export default function RootLayout({ children }) {
 
-  const createAccessKeyFor = ComponentMap[NetworkId].socialDB;
-  initWallet({ createAccessKeyFor });
-  
+  useInitWallet({ createAccessKeyFor: '', networkId: NetworkId });
+
   return (
     <html lang="en">
       <body>
@@ -18,5 +17,5 @@ export default function RootLayout({ children }) {
         {children}
       </body>
     </html>
-  )
+  );
 }

package/templates/frontend/next/src/app/page.js

@@ -1,8 +1,8 @@
-import Image from 'next/image'
-import styles from './app.module.css'
-import { DocsCard, HelloComponentsCard, HelloNearCard } from '@/components/cards'
+import Image from 'next/image';
+import styles from './app.module.css';
+import { DocsCard, HelloComponentsCard, HelloNearCard } from '@/components/cards';
 
-export default function Home({ }) {
+export default function Home() {
   return (
     <main className={styles.main}>
       <div className={styles.description}> </div>
@@ -33,5 +33,5 @@ export default function Home({ }) {
         <DocsCard />
       </div>
     </main>
-  )
+  );
 }

package/templates/frontend/next/src/components/cards.js

@@ -13,7 +13,7 @@ export const DocsCard = () => {
       </h2>
       <p>Learn how this application works, and what you can build on Near.</p>
     </a>);
-}
+};
 
 export const HelloNearCard = () => {
   return (
@@ -28,7 +28,7 @@ export const HelloNearCard = () => {
       <p>Discover how simple it is to interact with a Near smart contract.</p>
     </a>
   );
-}
+};
 
 export const HelloComponentsCard = () => {
   return (
@@ -42,5 +42,5 @@ export const HelloComponentsCard = () => {
       </h2>
       <p>See how Web3 components can help you to create multi-chain apps.</p>
     </a>
-  )
-}
+  );
+};

package/templates/frontend/next/src/components/navigation.js

@@ -7,17 +7,17 @@ import { useWallet } from '@/wallets/wallet-selector';
 
 export const Navigation = () => {
 
-  const { signedAccountId, logOut, logIn } = useWallet()
-  const [action, setAction] = useState(() => { })
-  const [label, setLabel] = useState('Loading...')
+  const { signedAccountId, logOut, logIn } = useWallet();
+  const [action, setAction] = useState(() => { });
+  const [label, setLabel] = useState('Loading...');
 
   useEffect(() => {
     if (signedAccountId) {
-      setAction(() => logOut)
-      setLabel(`Logout ${signedAccountId}`)
+      setAction(() => logOut);
+      setLabel(`Logout ${signedAccountId}`);
     } else {
-      setAction(() => logIn)
-      setLabel('Login')
+      setAction(() => logIn);
+      setLabel('Login');
     }
   }, [signedAccountId, logOut, logIn, setAction, setLabel]);
 
@@ -33,4 +33,4 @@ export const Navigation = () => {
       </div>
     </nav>
   );
-}
+};

package/templates/frontend/next/src/wallets/wallet-selector.js

@@ -1,12 +1,11 @@
 import { create as createStore } from 'zustand';
-import { distinctUntilChanged, map } from "rxjs";
+import { distinctUntilChanged, map } from 'rxjs';
 import { providers } from 'near-api-js';
 import { setupWalletSelector } from '@near-wallet-selector/core';
 import { setupModal } from '@near-wallet-selector/modal-ui';
 import { setupMyNearWallet } from '@near-wallet-selector/my-near-wallet';
 import { setupHereWallet } from '@near-wallet-selector/here-wallet';
 
-import { NetworkId } from '@/config';
 import { useEffect, useState } from 'react';
 
 export const useWallet = createStore(set => ({
@@ -22,7 +21,7 @@ export const useWallet = createStore(set => ({
   setStoreSelector: ({ selector }) => set({ selector }),
 }));
 
-export function initWallet({ createAccessKeyFor }) {
+export function useInitWallet({ createAccessKeyFor, networkId }) {
   const setAuth = useWallet(store => store.setAuth);
   const setLogActions = useWallet(store => store.setLogActions);
   const setMethods = useWallet(store => store.setMethods);
@@ -30,22 +29,20 @@ export function initWallet({ createAccessKeyFor }) {
   const [selector, setSelector] = useState(undefined);
 
   useEffect(() => {
-    console.log('initWallet')
     const selector = setupWalletSelector({
-      network: NetworkId,
+      network: networkId,
       modules: [setupMyNearWallet(), setupHereWallet()]
-    })
+    });
 
     setSelector(selector);
     setStoreSelector({ selector });
-  }, []);
+  }, [networkId, setStoreSelector]);
 
   useEffect(() => {
-    console.log('selector then')
-    if(!selector) return;
-    
+    if (!selector) return;
+
     selector.then(walletSelector => {
-      const accounts = walletSelector.store.getState().accounts
+      const accounts = walletSelector.store.getState().accounts;
       const signedAccountId = accounts.find((account) => account.active)?.accountId || '';
       setAuth({ signedAccountId });
 
@@ -55,37 +52,32 @@ export function initWallet({ createAccessKeyFor }) {
           distinctUntilChanged()
         )
         .subscribe((accounts) => {
-          console.log("accounts", accounts)
           const signedAccountId = accounts.find((account) => account.active)?.accountId || '';
           setAuth({ signedAccountId });
         });
-    })
+    });
   }, [selector, setAuth]);
 
   useEffect(() => {
-    console.log('actions')
+    if (!selector) return;
 
-    if(!selector) return;
-  
     // defined logOut and logIn actions
     const logOut = async () => {
       const wallet = await (await selector).wallet();
       await wallet.signOut();
       setAuth({ signedAccountId: '' });
-    }
+    };
 
     const logIn = async () => {
       const modal = setupModal(await selector, { contractId: createAccessKeyFor });
       modal.show();
-    }
+    };
 
     setLogActions({ logOut, logIn });
-  }, [selector, setAuth]);
+  }, [createAccessKeyFor, selector, setAuth, setLogActions]);
 
   useEffect(() => {
-    console.log('methods')
-
-    if(!selector) return;
+    if (!selector) return;
 
     const viewMethod = async (contractId, method, args = {}) => {
       const { network } = (await selector).options;
@@ -99,7 +91,7 @@ export function initWallet({ createAccessKeyFor }) {
         finality: 'optimistic',
       });
       return JSON.parse(Buffer.from(res.result).toString());
-    }
+    };
 
     const callMethod = async (contractId, method, args = {}, gas = '30000000000000', deposit = 0) => {
       const wallet = await (await selector).wallet();
@@ -119,10 +111,10 @@ export function initWallet({ createAccessKeyFor }) {
         ],
       });
 
-      return providers.getTransactionLastResult(outcome)
-    }
+      return providers.getTransactionLastResult(outcome);
+    };
 
     setMethods({ viewMethod, callMethod });
 
-  }, [selector]);
+  }, [selector, setMethods]);
 }

package/templates/frontend/vanilla/src/components.js

@@ -3,11 +3,7 @@ import { Wallet } from './near-wallet';
 import { useInitNear, Widget } from 'near-social-vm';
 import { useEffect } from 'react';
 
-const CONTRACT_ADDRESS = 'v1.social08.testnet';
-
-// When creating the wallet you can optionally ask to create an access key
-// Having the key enables to call non-payable methods without interrupting the user to sign
-const wallet = new Wallet({createAccessKeyFor: CONTRACT_ADDRESS, network: 'testnet'});
+const wallet = new Wallet({network: 'testnet'});
 
 export default function Component({ src }) {
 
@@ -46,8 +42,8 @@ window.onload = async () => {
 };
 
 // Button clicks
-document.querySelector('#sign-in-button').onclick = () => { wallet.signIn() };
-document.querySelector('#sign-out-button').onclick = () => { wallet.signOut() };
+document.querySelector('#sign-in-button').onclick = () => { wallet.signIn(); };
+document.querySelector('#sign-out-button').onclick = () => { wallet.signOut(); };
 
 // UI: Display the signed-out container
 function signedOutUI() {

package/templates/frontend/vanilla/src/hello.js

@@ -1,22 +1,22 @@
 import { Wallet } from './near-wallet';
 
-const CONTRACT_ADDRESS = 'v1.social08.testnet';
+const HELLO_NEAR = 'hello.near-examples.testnet';
 
 // When creating the wallet you can optionally ask to create an access key
 // Having the key enables to call non-payable methods without interrupting the user to sign
-const wallet = new Wallet({createAccessKeyFor: CONTRACT_ADDRESS, network: 'testnet'});
+const wallet = new Wallet({ network: 'testnet' });
 
 // Setup on page load
 window.onload = async () => {
   let isSignedIn = await wallet.startUp();
-  isSignedIn? signedInUI(): signedOutUI();
+  isSignedIn ? signedInUI() : signedOutUI();
   getGreeting();
 };
 
 // Button clicks
 document.querySelector('form').onsubmit = setGreeting;
-document.querySelector('#sign-in-button').onclick = () => { wallet.signIn() };
-document.querySelector('#sign-out-button').onclick = () => { wallet.signOut() };
+document.querySelector('#sign-in-button').onclick = () => { wallet.signIn(); };
+document.querySelector('#sign-out-button').onclick = () => { wallet.signOut(); };
 
 async function setGreeting(event) {
   event.preventDefault();
@@ -26,7 +26,7 @@ async function setGreeting(event) {
 
   // use the wallet to send the greeting to the Smart Contract
   const { greeting } = event.target.elements;
-  await wallet.callMethod({ method: 'set_greeting', args: { greeting: greeting.value }, contractId: CONTRACT_ADDRESS });
+  await wallet.callMethod({ method: 'set_greeting', args: { greeting: greeting.value }, contractId: HELLO_NEAR });
 
   // query the new greeting
   await getGreeting();
@@ -37,7 +37,7 @@ async function setGreeting(event) {
 
 async function getGreeting() {
   // use the wallet to query the Smart Contract
-  const currentGreeting = await wallet.viewMethod({ method: 'get_greeting', contractId: CONTRACT_ADDRESS });
+  const currentGreeting = await wallet.viewMethod({ method: 'get_greeting', contractId: HELLO_NEAR });
 
   // Display it
   document.querySelector('#displayGreeting').innerText = currentGreeting;
@@ -56,6 +56,6 @@ function signedInUI() {
   });
 }
 
-function hide(id){
+function hide(id) {
   document.querySelectorAll(id).forEach(el => el.style.display = 'none');
 }

package/templates/frontend/vanilla/src/near-wallet.js

@@ -24,8 +24,8 @@ export class Wallet {
     // key, so the user skips signing non-payable transactions.
     // Omitting the accountId will result in the user being
     // asked to sign all transactions.
-    this.createAccessKeyFor = createAccessKeyFor
-    this.network = network
+    this.createAccessKeyFor = createAccessKeyFor;
+    this.network = network;
     this.selector = setupWalletSelector({
       network: this.network,
       modules: [setupMyNearWallet()],

package/templates/sandbox-tests/sandbox-ts/ava.config.cjs

@@ -1,9 +1,9 @@
-require("util").inspect.defaultOptions.depth = 5; // Increase AVA's printing depth
+require('util').inspect.defaultOptions.depth = 5; // Increase AVA's printing depth
 
 module.exports = {
-  timeout: "300000",
-  files: ["src/*.ava.ts"],
+  timeout: '300000',
+  files: ['src/*.ava.ts'],
   failWithoutAssertions: false,
-  extensions: ["ts"],
-  require: ["ts-node/register"],
+  extensions: ['ts'],
+  require: ['ts-node/register'],
 };

package/templates/frontend/next/.eslintrc.json

@@ -1,3 +0,0 @@
-{
-  "extends": "next/core-web-vitals"
-}