From 9591ee1ccb6f61834db196c6e4319b7f6240312c Mon Sep 17 00:00:00 2001 From: maayan Date: Thu, 14 Nov 2024 11:47:24 -0500 Subject: [PATCH] add support to define an api key for the client --- src/generateDapp.ts | 1 + src/types.ts | 12 +++++++++++- src/utils/setUpEnvVariables.ts | 2 ++ src/workflow/helpers.ts | 14 ++++++++++++++ src/workflow/index.ts | 6 ++++++ src/workflow/rechoseWorkflow.ts | 17 ++++++++++++++--- src/workflow/workflowOptions.ts | 16 ++++++++++++++++ .../frontend/components/WalletProvider.tsx | 4 ++-- .../boilerplate-template/frontend/constants.ts | 1 + .../frontend/utils/aptosClient.ts | 4 ++-- .../frontend/components/WalletProvider.tsx | 3 ++- .../frontend/constants.ts | 1 + .../frontend/utils/aptosClient.ts | 4 ++-- .../src/components/WalletProvider.tsx | 4 ++-- .../custom-indexer-template/src/constants.ts | 1 + .../custom-indexer-template/src/lib/aptos.ts | 3 ++- .../src/app/layout.tsx | 2 -- .../src/app/page.tsx | 2 ++ .../src/components/WalletProvider.tsx | 4 ++-- .../src/constants.ts | 1 + .../src/utils/aptosClient.ts | 4 ++-- .../frontend/components/WalletProvider.tsx | 4 ++-- .../frontend/constants.ts | 1 + .../frontend/utils/aptosClient.ts | 4 ++-- .../frontend/components/WalletProvider.tsx | 4 ++-- .../frontend/constants.ts | 1 + .../frontend/utils/aptosClient.ts | 4 ++-- .../frontend/components/WalletProvider.tsx | 4 ++-- .../frontend/constants.ts | 1 + .../frontend/utils/aptosClient.ts | 4 ++-- 30 files changed, 101 insertions(+), 32 deletions(-) diff --git a/src/generateDapp.ts b/src/generateDapp.ts index a045ed31..7e69c549 100644 --- a/src/generateDapp.ts +++ b/src/generateDapp.ts @@ -138,6 +138,7 @@ export async function generateDapp(selection: Selections) { network: selection.network, signing_option: selection.signingOption, use_surf: selection.useSurf, + use_api_key: selection.useApiKey, }); // Log next steps diff --git a/src/types.ts b/src/types.ts index c4d06d89..ddd278d7 100644 --- a/src/types.ts +++ b/src/types.ts @@ -7,7 +7,14 @@ import { } from "./utils/constants"; export type Result = prompts.Answers< - "projectName" | "projectType" | "template" | "network" | "signingOption" | "useSurf" + | "projectName" + | "projectType" + | "template" + | "network" + | "signingOption" + | "useSurf" + | "useApiKey" + | "apiKey" >; export type Template = { @@ -40,6 +47,8 @@ export type Selections = { framework: Framework; signingOption: SigningOption; useSurf: boolean; + useApiKey: boolean; + apiKey: string; }; export type TemplateTelemetryData = { @@ -51,6 +60,7 @@ export type TemplateTelemetryData = { framework: Framework; signing_option: string; use_surf: boolean; + use_api_key: boolean; }; export type ExampleTelemetryData = { diff --git a/src/utils/setUpEnvVariables.ts b/src/utils/setUpEnvVariables.ts index 13df8eed..2ad358ec 100644 --- a/src/utils/setUpEnvVariables.ts +++ b/src/utils/setUpEnvVariables.ts @@ -15,8 +15,10 @@ export const setUpEnvVariables = ( if (selection.framework === TemplateFramework.VITE) { content += `\nVITE_APP_NETWORK=${selection.network}`; + content += `\nVITE_APTOS_API_KEY="${selection.apiKey ?? ""}"`; } else if (selection.framework === TemplateFramework.NEXTJS) { content += `\nNEXT_PUBLIC_APP_NETWORK=${selection.network}`; + content += `\nNEXT_PUBLIC_APTOS_API_KEY="${selection.apiKey ?? ""}"`; } else if (selection.projectType === TemplateProjectType.MOVE) { content += `\nAPP_NETWORK=${selection.network}`; } else { diff --git a/src/workflow/helpers.ts b/src/workflow/helpers.ts index 4a6407b0..c943779a 100644 --- a/src/workflow/helpers.ts +++ b/src/workflow/helpers.ts @@ -38,3 +38,17 @@ export const needFrameworkChoice = (values: Selections) => { return "select"; }; + +export const canUseApiKey = (values: Selections) => { + if (values.projectType === TemplateProjectType.FULLSTACK) { + return "confirm"; + } + return null; +}; + +export const needApiKey = (values: Selections) => { + if (values.useApiKey) { + return "text"; + } + return null; +}; diff --git a/src/workflow/index.ts b/src/workflow/index.ts index 3b8c61dc..6606a791 100644 --- a/src/workflow/index.ts +++ b/src/workflow/index.ts @@ -24,6 +24,8 @@ export async function startWorkflow() { workflowOptions.useSurf, workflowOptions.framework, workflowOptions.network, + workflowOptions.useApiKey, + workflowOptions.apiKey, ], { onCancel: () => { @@ -89,6 +91,8 @@ export async function startWorkflow() { useSurf, network, projectType, + useApiKey, + apiKey, } = result; return { projectName, @@ -98,5 +102,7 @@ export async function startWorkflow() { signingOption, useSurf, network, + useApiKey, + apiKey, } as Selections; } diff --git a/src/workflow/rechoseWorkflow.ts b/src/workflow/rechoseWorkflow.ts index 5f5a8e5a..503f12e8 100644 --- a/src/workflow/rechoseWorkflow.ts +++ b/src/workflow/rechoseWorkflow.ts @@ -32,13 +32,17 @@ export async function rechoseWorkflow(result: Result): Promise { { title: "Network", value: "network" }, ]; } else { - return [ + const choices = [ { title: "Project Name", value: "projectName" }, { title: "Project Type", value: "projectType" }, { title: "Template", value: "template" }, { title: "Network", value: "network" }, { title: "Use Surf", value: "useSurf" }, ]; + if (result.useApiKey) { + choices.push({ title: "API Key", value: "apiKey" }); + } + return choices; } }, }, @@ -118,8 +122,7 @@ export async function rechoseWorkflow(result: Result): Promise { break; case "useSurf": if ( - result.template.path !== - FullstackBoilerplateTemplateInfo.value.path + result.template.path !== FullstackBoilerplateTemplateInfo.value.path ) { break; } @@ -130,6 +133,14 @@ export async function rechoseWorkflow(result: Result): Promise { }) ).useSurf; break; + case "apiKey": + result.apiKey = ( + await prompts({ + ...workflowOptions.apiKey, + initial: result.apiKey, + }) + ).apiKey; + break; default: console.log("Invalid option selected"); break; diff --git a/src/workflow/workflowOptions.ts b/src/workflow/workflowOptions.ts index 9987a9b0..338c946a 100644 --- a/src/workflow/workflowOptions.ts +++ b/src/workflow/workflowOptions.ts @@ -12,10 +12,12 @@ import { } from "../utils/constants.js"; import { validateProjectName } from "../utils/index.js"; import { + needApiKey, needFrameworkChoice, needSigningOptionChoice, needSurfChoice, needTemplateChoice, + canUseApiKey, } from "./helpers.js"; /** workflow object containing all the text for the different prompt options */ @@ -181,4 +183,18 @@ export const workflowOptions = { initial: 0, hint: "- You can change this later", }, + useApiKey: { + type: (prev, values) => canUseApiKey(values), + name: "useApiKey", + message: + "Would you like to use an API key? It is highly recommended to use with the Aptos API", + initial: true, + }, + apiKey: { + type: (prev, values) => needApiKey(values), + name: "apiKey", + message: + "Enter your API key for the chosen network (you can get one at https://developers.aptoslabs.com/docs/api-access)", + initial: "", + }, }; diff --git a/templates/boilerplate-template/frontend/components/WalletProvider.tsx b/templates/boilerplate-template/frontend/components/WalletProvider.tsx index 36cda4db..0960d351 100644 --- a/templates/boilerplate-template/frontend/components/WalletProvider.tsx +++ b/templates/boilerplate-template/frontend/components/WalletProvider.tsx @@ -3,7 +3,7 @@ import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react"; // Internal components import { useToast } from "@/components/ui/use-toast"; // Internal constants -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; export function WalletProvider({ children }: PropsWithChildren) { const { toast } = useToast(); @@ -11,7 +11,7 @@ export function WalletProvider({ children }: PropsWithChildren) { return ( { toast({ diff --git a/templates/boilerplate-template/frontend/constants.ts b/templates/boilerplate-template/frontend/constants.ts index 7c189b8a..4261ec59 100644 --- a/templates/boilerplate-template/frontend/constants.ts +++ b/templates/boilerplate-template/frontend/constants.ts @@ -1,2 +1,3 @@ export const NETWORK = import.meta.env.VITE_APP_NETWORK ?? "testnet"; export const MODULE_ADDRESS = import.meta.env.VITE_MODULE_ADDRESS; +export const APTOS_API_KEY = import.meta.env.VITE_APTOS_API_KEY; diff --git a/templates/boilerplate-template/frontend/utils/aptosClient.ts b/templates/boilerplate-template/frontend/utils/aptosClient.ts index fb656a39..d9e58689 100644 --- a/templates/boilerplate-template/frontend/utils/aptosClient.ts +++ b/templates/boilerplate-template/frontend/utils/aptosClient.ts @@ -1,7 +1,7 @@ -import { NETWORK } from "@/constants"; +import { NETWORK, APTOS_API_KEY } from "@/constants"; import { Aptos, AptosConfig } from "@aptos-labs/ts-sdk"; -const aptos = new Aptos(new AptosConfig({ network: NETWORK })); +const aptos = new Aptos(new AptosConfig({ network: NETWORK, clientConfig :{ API_KEY: APTOS_API_KEY }})); // Reuse same Aptos instance to utilize cookie based sticky routing export function aptosClient() { diff --git a/templates/clicker-game-tg-mini-app-template/frontend/components/WalletProvider.tsx b/templates/clicker-game-tg-mini-app-template/frontend/components/WalletProvider.tsx index 1633c1ba..ddde407d 100644 --- a/templates/clicker-game-tg-mini-app-template/frontend/components/WalletProvider.tsx +++ b/templates/clicker-game-tg-mini-app-template/frontend/components/WalletProvider.tsx @@ -3,7 +3,7 @@ import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react"; // Internal components import { useToast } from "@/components/ui/use-toast"; // Internal constants -import { NETWORK } from "@/constants"; +import { NETWORK, APTOS_API_KEY } from "@/constants"; export function WalletProvider({ children }: PropsWithChildren) { const { toast } = useToast(); @@ -18,6 +18,7 @@ export function WalletProvider({ children }: PropsWithChildren) { appId: undefined, // Learn more https://docs.mizu.io/docs/preparation/manifest-json manifestURL: "https://assets.mz.xyz/static/config/mizuwallet-connect-manifest.json", + aptosApiKey: APTOS_API_KEY, }, }} optInWallets={["Mizu Wallet"]} diff --git a/templates/clicker-game-tg-mini-app-template/frontend/constants.ts b/templates/clicker-game-tg-mini-app-template/frontend/constants.ts index 1e0268d3..9b490ce6 100644 --- a/templates/clicker-game-tg-mini-app-template/frontend/constants.ts +++ b/templates/clicker-game-tg-mini-app-template/frontend/constants.ts @@ -1,3 +1,4 @@ export const NETWORK = import.meta.env.VITE_APP_NETWORK ?? "testnet"; export const MODULE_ADDRESS = import.meta.env.VITE_MODULE_ADDRESS; export const IS_DEV = Boolean(import.meta.env.DEV); +export const APTOS_API_KEY = import.meta.env.VITE_APTOS_API_KEY; diff --git a/templates/clicker-game-tg-mini-app-template/frontend/utils/aptosClient.ts b/templates/clicker-game-tg-mini-app-template/frontend/utils/aptosClient.ts index 559db253..b3033bac 100644 --- a/templates/clicker-game-tg-mini-app-template/frontend/utils/aptosClient.ts +++ b/templates/clicker-game-tg-mini-app-template/frontend/utils/aptosClient.ts @@ -1,8 +1,8 @@ import { Aptos, AptosConfig } from "@aptos-labs/ts-sdk"; -import { NETWORK } from "@/constants"; +import { NETWORK, APTOS_API_KEY } from "@/constants"; -const aptos = new Aptos(new AptosConfig({ network: NETWORK })); +const aptos = new Aptos(new AptosConfig({ network: NETWORK, clientConfig: { API_KEY: APTOS_API_KEY } })); // Reuse same Aptos instance to utilize cookie based sticky routing export function aptosClient() { diff --git a/templates/custom-indexer-template/src/components/WalletProvider.tsx b/templates/custom-indexer-template/src/components/WalletProvider.tsx index 818f87b5..24bb41bf 100644 --- a/templates/custom-indexer-template/src/components/WalletProvider.tsx +++ b/templates/custom-indexer-template/src/components/WalletProvider.tsx @@ -3,7 +3,7 @@ import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react"; import { PropsWithChildren } from "react"; import { useToast } from "@/components/ui/use-toast"; -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; export const WalletProvider = ({ children }: PropsWithChildren) => { const { toast } = useToast(); @@ -11,7 +11,7 @@ export const WalletProvider = ({ children }: PropsWithChildren) => { return (
{children}
- diff --git a/templates/nextjs-boilerplate-template/src/app/page.tsx b/templates/nextjs-boilerplate-template/src/app/page.tsx index 16f11f96..795f9c4b 100644 --- a/templates/nextjs-boilerplate-template/src/app/page.tsx +++ b/templates/nextjs-boilerplate-template/src/app/page.tsx @@ -4,6 +4,7 @@ import { AccountInfo } from "@/components/AccountInfo"; import { Header } from "@/components/Header"; import { MessageBoard } from "@/components/MessageBoard"; import { NetworkInfo } from "@/components/NetworkInfo"; +import { TopBanner } from "@/components/TopBanner"; import { TransferAPT } from "@/components/TransferAPT"; import { WalletDetails } from "@/components/WalletDetails"; // Internal Components @@ -15,6 +16,7 @@ function App() { return ( <> +
{connected ? ( diff --git a/templates/nextjs-boilerplate-template/src/components/WalletProvider.tsx b/templates/nextjs-boilerplate-template/src/components/WalletProvider.tsx index 741b7b16..552c4de2 100644 --- a/templates/nextjs-boilerplate-template/src/components/WalletProvider.tsx +++ b/templates/nextjs-boilerplate-template/src/components/WalletProvider.tsx @@ -3,7 +3,7 @@ // Internal components import { useToast } from "@/components/ui/use-toast"; // Internal constants -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react"; import type { PropsWithChildren } from "react"; @@ -13,7 +13,7 @@ export function WalletProvider({ children }: PropsWithChildren) { return ( { toast({ diff --git a/templates/nextjs-boilerplate-template/src/constants.ts b/templates/nextjs-boilerplate-template/src/constants.ts index b52352ff..907bed7c 100644 --- a/templates/nextjs-boilerplate-template/src/constants.ts +++ b/templates/nextjs-boilerplate-template/src/constants.ts @@ -2,3 +2,4 @@ import type { Network } from "@aptos-labs/wallet-adapter-react"; export const NETWORK: Network = (process.env.NEXT_PUBLIC_APP_NETWORK as Network) ?? "testnet"; export const MODULE_ADDRESS = process.env.NEXT_PUBLIC_MODULE_ADDRESS; +export const APTOS_API_KEY = process.env.NEXT_PUBLIC_APTOS_API_KEY; \ No newline at end of file diff --git a/templates/nextjs-boilerplate-template/src/utils/aptosClient.ts b/templates/nextjs-boilerplate-template/src/utils/aptosClient.ts index fb656a39..3b11fd6a 100644 --- a/templates/nextjs-boilerplate-template/src/utils/aptosClient.ts +++ b/templates/nextjs-boilerplate-template/src/utils/aptosClient.ts @@ -1,7 +1,7 @@ -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; import { Aptos, AptosConfig } from "@aptos-labs/ts-sdk"; -const aptos = new Aptos(new AptosConfig({ network: NETWORK })); +const aptos = new Aptos(new AptosConfig({ network: NETWORK, clientConfig: { API_KEY: APTOS_API_KEY } })); // Reuse same Aptos instance to utilize cookie based sticky routing export function aptosClient() { diff --git a/templates/nft-minting-dapp-template/frontend/components/WalletProvider.tsx b/templates/nft-minting-dapp-template/frontend/components/WalletProvider.tsx index c6723b3d..cd84281b 100644 --- a/templates/nft-minting-dapp-template/frontend/components/WalletProvider.tsx +++ b/templates/nft-minting-dapp-template/frontend/components/WalletProvider.tsx @@ -2,7 +2,7 @@ import { PropsWithChildren } from "react"; import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react"; import { useToast } from "@/components/ui/use-toast"; -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; export function WalletProvider({ children }: PropsWithChildren) { const { toast } = useToast(); @@ -10,7 +10,7 @@ export function WalletProvider({ children }: PropsWithChildren) { return ( { toast({ diff --git a/templates/nft-minting-dapp-template/frontend/constants.ts b/templates/nft-minting-dapp-template/frontend/constants.ts index 3258bacc..022858c0 100644 --- a/templates/nft-minting-dapp-template/frontend/constants.ts +++ b/templates/nft-minting-dapp-template/frontend/constants.ts @@ -4,3 +4,4 @@ export const CREATOR_ADDRESS = import.meta.env.VITE_COLLECTION_CREATOR_ADDRESS; export const COLLECTION_ADDRESS = import.meta.env.VITE_COLLECTION_ADDRESS; export const IS_DEV = Boolean(import.meta.env.DEV); export const IS_PROD = Boolean(import.meta.env.PROD); +export const APTOS_API_KEY = import.meta.env.VITE_APTOS_API_KEY; diff --git a/templates/nft-minting-dapp-template/frontend/utils/aptosClient.ts b/templates/nft-minting-dapp-template/frontend/utils/aptosClient.ts index fb656a39..3b11fd6a 100644 --- a/templates/nft-minting-dapp-template/frontend/utils/aptosClient.ts +++ b/templates/nft-minting-dapp-template/frontend/utils/aptosClient.ts @@ -1,7 +1,7 @@ -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; import { Aptos, AptosConfig } from "@aptos-labs/ts-sdk"; -const aptos = new Aptos(new AptosConfig({ network: NETWORK })); +const aptos = new Aptos(new AptosConfig({ network: NETWORK, clientConfig: { API_KEY: APTOS_API_KEY } })); // Reuse same Aptos instance to utilize cookie based sticky routing export function aptosClient() { diff --git a/templates/token-minting-dapp-template/frontend/components/WalletProvider.tsx b/templates/token-minting-dapp-template/frontend/components/WalletProvider.tsx index 36cda4db..0960d351 100644 --- a/templates/token-minting-dapp-template/frontend/components/WalletProvider.tsx +++ b/templates/token-minting-dapp-template/frontend/components/WalletProvider.tsx @@ -3,7 +3,7 @@ import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react"; // Internal components import { useToast } from "@/components/ui/use-toast"; // Internal constants -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; export function WalletProvider({ children }: PropsWithChildren) { const { toast } = useToast(); @@ -11,7 +11,7 @@ export function WalletProvider({ children }: PropsWithChildren) { return ( { toast({ diff --git a/templates/token-minting-dapp-template/frontend/constants.ts b/templates/token-minting-dapp-template/frontend/constants.ts index a61b1f97..f042f4e1 100644 --- a/templates/token-minting-dapp-template/frontend/constants.ts +++ b/templates/token-minting-dapp-template/frontend/constants.ts @@ -4,3 +4,4 @@ export const CREATOR_ADDRESS = import.meta.env.VITE_FA_CREATOR_ADDRESS; export const FA_ADDRESS = import.meta.env.VITE_FA_ADDRESS; export const IS_DEV = Boolean(import.meta.env.DEV); export const IS_PROD = Boolean(import.meta.env.PROD); +export const APTOS_API_KEY = import.meta.env.VITE_APTOS_API_KEY; diff --git a/templates/token-minting-dapp-template/frontend/utils/aptosClient.ts b/templates/token-minting-dapp-template/frontend/utils/aptosClient.ts index fb656a39..3b11fd6a 100644 --- a/templates/token-minting-dapp-template/frontend/utils/aptosClient.ts +++ b/templates/token-minting-dapp-template/frontend/utils/aptosClient.ts @@ -1,7 +1,7 @@ -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; import { Aptos, AptosConfig } from "@aptos-labs/ts-sdk"; -const aptos = new Aptos(new AptosConfig({ network: NETWORK })); +const aptos = new Aptos(new AptosConfig({ network: NETWORK, clientConfig: { API_KEY: APTOS_API_KEY } })); // Reuse same Aptos instance to utilize cookie based sticky routing export function aptosClient() { diff --git a/templates/token-staking-dapp-template/frontend/components/WalletProvider.tsx b/templates/token-staking-dapp-template/frontend/components/WalletProvider.tsx index 36cda4db..0960d351 100644 --- a/templates/token-staking-dapp-template/frontend/components/WalletProvider.tsx +++ b/templates/token-staking-dapp-template/frontend/components/WalletProvider.tsx @@ -3,7 +3,7 @@ import { AptosWalletAdapterProvider } from "@aptos-labs/wallet-adapter-react"; // Internal components import { useToast } from "@/components/ui/use-toast"; // Internal constants -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; export function WalletProvider({ children }: PropsWithChildren) { const { toast } = useToast(); @@ -11,7 +11,7 @@ export function WalletProvider({ children }: PropsWithChildren) { return ( { toast({ diff --git a/templates/token-staking-dapp-template/frontend/constants.ts b/templates/token-staking-dapp-template/frontend/constants.ts index 8d22136b..79a0fd94 100644 --- a/templates/token-staking-dapp-template/frontend/constants.ts +++ b/templates/token-staking-dapp-template/frontend/constants.ts @@ -3,3 +3,4 @@ export const MODULE_ADDRESS = import.meta.env.VITE_MODULE_ADDRESS; export const REWARD_CREATOR_ADDRESS = import.meta.env.VITE_REWARD_CREATOR_ADDRESS; export const FA_ADDRESS = import.meta.env.VITE_FA_ADDRESS; export const IS_DEV = Boolean(import.meta.env.DEV); +export const APTOS_API_KEY = import.meta.env.VITE_APTOS_API_KEY; diff --git a/templates/token-staking-dapp-template/frontend/utils/aptosClient.ts b/templates/token-staking-dapp-template/frontend/utils/aptosClient.ts index fb656a39..3b11fd6a 100644 --- a/templates/token-staking-dapp-template/frontend/utils/aptosClient.ts +++ b/templates/token-staking-dapp-template/frontend/utils/aptosClient.ts @@ -1,7 +1,7 @@ -import { NETWORK } from "@/constants"; +import { APTOS_API_KEY, NETWORK } from "@/constants"; import { Aptos, AptosConfig } from "@aptos-labs/ts-sdk"; -const aptos = new Aptos(new AptosConfig({ network: NETWORK })); +const aptos = new Aptos(new AptosConfig({ network: NETWORK, clientConfig: { API_KEY: APTOS_API_KEY } })); // Reuse same Aptos instance to utilize cookie based sticky routing export function aptosClient() {