-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Loading status checks…
Init command (#5)
* rename cli package * rename cli * creates init command * cleanup * adds changeset * fix missing types * fix dependencies * test different bun version * tries disabling macro * tries with bun canary * hardcode template in a string because of bun's macro bug
1 parent
5fdeead
commit 52bf8c3
Showing
26 changed files
with
447 additions
and
139 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,7 @@ | ||
--- | ||
"dappstore": patch | ||
"@evmos/dappstore-sdk": patch | ||
"@evmos/dev-wrapper": patch | ||
--- | ||
|
||
Creates init command |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
--- | ||
"dappstore": patch | ||
--- | ||
|
||
Rename dappstore cli package |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,81 +1,84 @@ | ||
# Turborepo starter | ||
# DAppStore SDK client | ||
|
||
This is an official starter Turborepo. | ||
## Standalone usage: | ||
|
||
## Using this example | ||
```ts | ||
import { createDAppStoreClient } from "@evmos/dappstore-sdk"; | ||
|
||
Run the following command: | ||
// Waits for the client to establish a connection to the DAppStore | ||
await dappstore.initialized; | ||
|
||
```sh | ||
npx create-turbo@latest | ||
console.log( | ||
`DAppStore client initialized.`, | ||
`Chain ID: ${dappstore.chainId}, Accounts: ${dappstore.accounts}` | ||
); // -> DAppStore client initialized. Chain ID: evmos:1, Accounts: ["0x..."] | ||
``` | ||
|
||
## What's inside? | ||
|
||
This Turborepo includes the following packages/apps: | ||
|
||
### Apps and Packages | ||
|
||
- `docs`: a [Next.js](https://nextjs.org/) app | ||
- `web`: another [Next.js](https://nextjs.org/) app | ||
- `@repo/ui`: a stub React component library shared by both `web` and `docs` applications | ||
- `@repo/eslint-config`: `eslint` configurations (includes `eslint-config-next` and `eslint-config-prettier`) | ||
- `@repo/typescript-config`: `tsconfig.json`s used throughout the monorepo | ||
|
||
Each package/app is 100% [TypeScript](https://www.typescriptlang.org/). | ||
|
||
### Utilities | ||
|
||
This Turborepo has some additional tools already setup for you: | ||
|
||
- [TypeScript](https://www.typescriptlang.org/) for static type checking | ||
- [ESLint](https://eslint.org/) for code linting | ||
- [Prettier](https://prettier.io) for code formatting | ||
|
||
### Build | ||
|
||
To build all apps and packages, run the following command: | ||
|
||
``` | ||
cd my-turborepo | ||
pnpm build | ||
``` | ||
|
||
### Develop | ||
|
||
To develop all apps and packages, run the following command: | ||
|
||
## Subscribe to account and chain id changes: | ||
|
||
```ts | ||
// Shorthand for dappstore.provider.on("accountsChanged", (accounts) => { ... }) | ||
dappstore.onAccountsChange((accounts) => { | ||
console.log(`Accounts changed: ${accounts}`); // -> Accounts changed: ["0x..."] | ||
}); | ||
* | ||
// Shorthand for dappstore.provider.on("chainChanged", (chainId) => { ... }) | ||
dappstore.onChainChange((chainId) => { | ||
console.log(`Chain changed: ${chainId}`); // -> Chain changed: evmos:1 | ||
}); | ||
|
||
// Or interact directly with the provider | ||
dappstore.provider.request({ method: "eth_requestAccounts" }).then((accounts) => { | ||
console.log(`Accounts: ${accounts}`); // -> Accounts: ["0x..."] | ||
}); | ||
``` | ||
cd my-turborepo | ||
pnpm dev | ||
``` | ||
|
||
### Remote Caching | ||
|
||
Turborepo can use a technique known as [Remote Caching](https://turbo.build/repo/docs/core-concepts/remote-caching) to share cache artifacts across machines, enabling you to share build caches with your team and CI/CD pipelines. | ||
|
||
By default, Turborepo will cache locally. To enable Remote Caching you will need an account with Vercel. If you don't have an account you can [create one](https://vercel.com/signup), then enter the following commands: | ||
|
||
``` | ||
cd my-turborepo | ||
npx turbo login | ||
## Usage with React: | ||
|
||
```tsx | ||
const dappstore = createDAppStoreClient(); | ||
import { useEffect, useState } from "react"; | ||
|
||
const useAccounts = () => { | ||
const [accounts, setAccounts] = useState<`0x${string}`[]>(dappstore.accounts); | ||
useEffect(() => { | ||
return dappstore.onAccountsChange(setAccounts); // <- returns cleanup function | ||
}, []); | ||
return acccounts; | ||
}; | ||
|
||
const useChainId = () => { | ||
const [chainId, setChainId] = useState(dappstore.chainId); | ||
useEffect(() => { | ||
return dappstore.onChainChange(setChainId); | ||
}, []); | ||
return chainId; | ||
}; | ||
|
||
const App = () => { | ||
const accounts = useAccounts(); | ||
return <div>Accounts: {accounts.join(", ")}</div>; | ||
}; | ||
``` | ||
|
||
This will authenticate the Turborepo CLI with your [Vercel account](https://vercel.com/docs/concepts/personal-accounts/overview). | ||
|
||
Next, you can link your Turborepo to your Remote Cache by running the following command from the root of your Turborepo: | ||
|
||
``` | ||
npx turbo link | ||
## Send a transaction: | ||
|
||
```ts | ||
const sendTransaction = async (to: `0x${string}`) => { | ||
const [from] = dappstore.accounts; | ||
if (!from) { | ||
throw new Error("No account connected"); | ||
} | ||
|
||
return await dappstore.provider.request({ | ||
method: "eth_sendTransaction", | ||
params: [ | ||
{ | ||
from, | ||
to, | ||
value: "0x1", // We recommend using a library like ethers.js or viem to handle amounts | ||
}, | ||
], | ||
}); | ||
}; | ||
``` | ||
|
||
## Useful Links | ||
|
||
Learn more about the power of Turborepo: | ||
|
||
- [Tasks](https://turbo.build/repo/docs/core-concepts/monorepos/running-tasks) | ||
- [Caching](https://turbo.build/repo/docs/core-concepts/caching) | ||
- [Remote Caching](https://turbo.build/repo/docs/core-concepts/remote-caching) | ||
- [Filtering](https://turbo.build/repo/docs/core-concepts/monorepos/filtering) | ||
- [Configuration Options](https://turbo.build/repo/docs/reference/configuration) | ||
- [CLI Usage](https://turbo.build/repo/docs/reference/command-line-reference) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,5 +1,6 @@ | ||
#!/usr/bin/env node | ||
import "./dev"; | ||
|
||
import "./init/init"; | ||
import { program } from "@commander-js/extra-typings"; | ||
program.parseAsync(process.argv); | ||
|
||
program.parse(process.argv); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,43 @@ | ||
import { readPackageJson } from "./read-package-json.js"; | ||
|
||
export const detectRunningPort = async (dir: string = ".") => { | ||
const pkg = await readPackageJson(dir); | ||
|
||
const startScript = pkg.scripts?.start ?? ""; | ||
const devScript = pkg.scripts?.dev ?? ""; | ||
let explicitPort: null | number = parseInt( | ||
startScript.match(/(--port|-p) (\d+)/)?.[1] ?? "" | ||
); | ||
|
||
if (isNaN(explicitPort)) { | ||
explicitPort = null; | ||
} | ||
|
||
if (startScript.includes("next") || devScript.includes("next")) { | ||
return { | ||
framework: "next" as const, | ||
port: explicitPort ?? 3000, | ||
}; | ||
} | ||
if (startScript.includes("vite") || devScript.includes("vite")) { | ||
return { | ||
framework: "vite" as const, | ||
port: explicitPort ?? 5173, | ||
}; | ||
} | ||
|
||
if ( | ||
startScript.includes("react-scripts") || | ||
devScript.includes("react-scripts") | ||
) { | ||
return { | ||
framework: "react-scripts" as const, | ||
port: explicitPort ?? 3000, | ||
}; | ||
} | ||
|
||
return { | ||
framework: "unknown" as const, | ||
port: explicitPort ?? null, | ||
}; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
export type PackageManager = "npm" | "pnpm" | "yarn" | "bun"; | ||
|
||
export function getPkgManager(): PackageManager { | ||
const userAgent = process.env.npm_config_user_agent || ""; | ||
|
||
if (userAgent.startsWith("yarn")) { | ||
return "yarn"; | ||
} | ||
|
||
if (userAgent.startsWith("pnpm")) { | ||
return "pnpm"; | ||
} | ||
|
||
if (userAgent.startsWith("bun")) { | ||
return "bun"; | ||
} | ||
|
||
return "npm"; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,26 @@ | ||
const TEMPLATE = ` | ||
import { createDAppStoreClient } from "@evmos/dappstore-sdk"; | ||
export const dappstore = createDAppStoreClient(); | ||
/** | ||
* EIP-1193 provider | ||
*/ | ||
export const provider = dappstore.provider; | ||
`; | ||
// const __dirname = path.dirname(fileURLToPath(import.meta.url)); | ||
export const readTemplate = () => { | ||
// try { | ||
// return await readFile( | ||
// path.join(__dirname, `./templates/dappstore-client.ts`), | ||
// "utf-8" | ||
// ); | ||
// } catch (e) { | ||
// console.error("Template not found"); | ||
// process.exit(1); | ||
// } | ||
|
||
// TODO: I was actually reading this file with a Bun macro but it's not working on github CI | ||
// let's try again in the future | ||
return TEMPLATE; | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,92 @@ | ||
import { program } from "@commander-js/extra-typings"; | ||
import inquirer from "inquirer"; | ||
import { PackageManager, getPkgManager } from "./get-package-manager.js"; | ||
import { installDependencies } from "./install-dependencies.js"; | ||
import { readPackageJson, writePackageJson } from "./read-package-json.js"; | ||
import chalk from "chalk"; | ||
import { detectRunningPort } from "./detect-port.js"; | ||
import { stat } from "fs/promises"; | ||
import { writeTemplate } from "./write-template.js"; | ||
|
||
program | ||
.command("init") | ||
.description("Initialize DAppStore widget in your project") | ||
|
||
.option("--skip-install", "Skip installing dependencies") | ||
|
||
.action(async ({ skipInstall }) => { | ||
const detectedPackageManager = getPkgManager(); | ||
let pkgJson: Awaited<ReturnType<typeof readPackageJson>>; | ||
try { | ||
pkgJson = await readPackageJson(); | ||
} catch (e) { | ||
console.log( | ||
"\n", | ||
chalk.bgRed("package.json not found"), | ||
"\n\n", | ||
"Make sure you run this command in the root of your project,", | ||
"\n", | ||
`or you initialize a new project with ${chalk.yellow( | ||
`'${detectedPackageManager} init'` | ||
)} first.`, | ||
"\n" | ||
); | ||
process.exit(1); | ||
} | ||
|
||
const defaultPort = await detectRunningPort(); | ||
const { packageManager, port } = await inquirer.prompt<{ | ||
packageManager: PackageManager; | ||
port: number; | ||
}>([ | ||
{ | ||
type: "list", | ||
name: "packageManager", | ||
message: `Which package manager do you want to use?`, | ||
|
||
choices: ["npm", "pnpm", "bun", "yarn"].map((pm) => ({ | ||
name: pm === detectedPackageManager ? `${pm} (detected)` : pm, | ||
value: pm, | ||
})), | ||
default: detectedPackageManager, | ||
}, | ||
{ | ||
type: "number", | ||
name: "port", | ||
|
||
message: `What port or url of your development server will run on?`, | ||
default: defaultPort.port ?? 3000, | ||
}, | ||
]); | ||
if (!skipInstall) { | ||
await installDependencies(packageManager, ["@evmos/dappstore-sdk"]); | ||
await installDependencies(packageManager, ["dappstore"], "dev"); | ||
} | ||
const packageJson = await readPackageJson(); | ||
packageJson.scripts = { | ||
...packageJson.scripts, | ||
"dev:dappstore": `dappstore dev --target ${port}`, | ||
}; | ||
await writePackageJson(".", packageJson); | ||
let templateDest = "./dappstore-client.ts"; | ||
try { | ||
const srcDir = await stat("src"); | ||
if (srcDir.isDirectory()) { | ||
templateDest = "./src/dappstore-client.ts"; | ||
} | ||
} catch (e) { | ||
// noop | ||
} | ||
|
||
await writeTemplate(templateDest); | ||
|
||
console.log( | ||
"\n", | ||
chalk.green(`🚀 DAppStore Widget Setup is completed`), | ||
"\n", | ||
`To start the development, start your development server, and then run:`, | ||
"\n\n", | ||
|
||
chalk.yellow(`\t${packageManager} run dev:dappstore`) | ||
); | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
import spawn from "cross-spawn"; | ||
import { PackageManager } from "./get-package-manager.js"; | ||
import { readPackageJson } from "./read-package-json.js"; | ||
|
||
/** | ||
* Spawn a package manager installation based on user preference. | ||
* | ||
* @returns A Promise that resolves once the installation is finished. | ||
*/ | ||
export async function installDependencies( | ||
/** Indicate which package manager to use. */ | ||
packageManager: PackageManager, | ||
dependencies: string[] = [], | ||
as: "dev" | "prod" = "dev" | ||
): Promise<void> { | ||
readPackageJson.cache.clear?.(); | ||
const args: string[] = ["install"]; | ||
if (as === "dev") { | ||
args.push("--save-dev"); | ||
} | ||
args.push(...dependencies); | ||
|
||
/** | ||
* Return a Promise that resolves once the installation is finished. | ||
*/ | ||
return new Promise((resolve, reject) => { | ||
/** | ||
* Spawn the installation process. | ||
*/ | ||
const child = spawn(packageManager, args, { | ||
stdio: "inherit", | ||
env: { | ||
...process.env, | ||
ADBLOCK: "1", | ||
// we set NODE_ENV to development as pnpm skips dev | ||
// dependencies when production | ||
NODE_ENV: "development", | ||
DISABLE_OPENCOLLECTIVE: "1", | ||
}, | ||
}); | ||
child.on("close", (code) => { | ||
if (code !== 0) { | ||
reject({ command: `${packageManager} ${args.join(" ")}` }); | ||
return; | ||
} | ||
resolve(); | ||
}); | ||
}); | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,33 @@ | ||
import { readFile, writeFile } from "fs/promises"; | ||
import { join } from "path"; | ||
import { memoize } from "lodash-es"; | ||
const readJson = async <T>(path: string): Promise<T> => { | ||
const content = await readFile(path, "utf-8"); | ||
return JSON.parse(content); | ||
}; | ||
|
||
export const readPackageJson = memoize(async (dir: string = ".") => { | ||
const pkgPath = join(process.cwd(), dir, "package.json"); | ||
|
||
return await readJson<{ | ||
name?: string; | ||
dependencies?: Record<string, string>; | ||
devDependencies?: Record<string, string>; | ||
scripts?: Record<string, string>; | ||
}>(pkgPath); | ||
}); | ||
|
||
export const writePackageJson = async ( | ||
dir: string = ".", | ||
pkg: { | ||
name?: string; | ||
dependencies?: Record<string, string>; | ||
devDependencies?: Record<string, string>; | ||
scripts?: Record<string, string>; | ||
} | ||
) => { | ||
readPackageJson.cache.clear?.(); | ||
const pkgPath = join(process.cwd(), dir, "package.json"); | ||
|
||
await writeFile(pkgPath, JSON.stringify(pkg, null, 2)); | ||
}; |
8 changes: 8 additions & 0 deletions
8
packages/dappstore-cli/src/init/templates/dappstore-client.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
import { createDAppStoreClient } from "@evmos/dappstore-sdk"; | ||
|
||
export const dappstore = createDAppStoreClient(); | ||
|
||
/** | ||
* EIP-1193 provider | ||
*/ | ||
export const provider = dappstore.provider; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
import { writeFile } from "fs/promises"; | ||
import { readTemplate } from "./get-template" with { type: "macro" }; | ||
|
||
export const writeTemplate = async (destination: string) => { | ||
const templatePath = await readTemplate(); | ||
|
||
await writeFile(destination, templatePath, "utf-8"); | ||
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,2 +1,2 @@ | ||
export { createDAppStoreClient as createDAppstoreClient } from "./client"; | ||
export { createDAppStoreClient, type DAppStoreClient } from "./client"; | ||
export * from "./types/EIP1193Provider"; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters