diff --git a/src/components/ContextMenu.tsx b/src/components/ContextMenu.tsx index 855cac27..120576b0 100644 --- a/src/components/ContextMenu.tsx +++ b/src/components/ContextMenu.tsx @@ -29,6 +29,7 @@ export const ContextMenu = ({ options, showEllipsis }: ContextMenuType) => { }, menuRelative: { position: 'relative', + visibility: isOpen ? 'visible' : 'hidden', }, menuAbsolute: { display: 'flex', @@ -71,6 +72,7 @@ export const ContextMenu = ({ options, showEllipsis }: ContextMenuType) => { }; const ref = useRef(null); + const menuRef = useRef(null); useEffect(() => { const handleClickOutside = (event: Event) => { @@ -86,6 +88,14 @@ export const ContextMenu = ({ options, showEllipsis }: ContextMenuType) => { if (!showEllipsis) return null; + if (isOpen) { + const rect = menuRef?.current?.getBoundingClientRect(); + const scrollTop = document.documentElement.scrollTop; + const top = rect.top + scrollTop; + if (top < 0) { + menuRef.current.style.bottom = `-${rect.height}px`; + } + } return ( - {isOpen && ( - - - {options.map( - ({ icon, name, onClick, args }: ContextMenuOptionsType) => ( - - ), - )} - + + + {options.map( + ({ icon, name, onClick, args }: ContextMenuOptionsType) => ( + + ), + )} - )} + ); }; diff --git a/src/providers/Project/projectDefault.ts b/src/providers/Project/projectDefault.ts index f495b27e..4d797a4b 100644 --- a/src/providers/Project/projectDefault.ts +++ b/src/providers/Project/projectDefault.ts @@ -5,136 +5,59 @@ import { ScriptTemplate, TransactionTemplate, } from 'api/apollo/generated/graphql'; +import { accountIndexes } from 'util/accounts'; import { strToSeed, uuid } from 'util/rng'; import { LOCAL_PROJECT_ID } from 'util/url'; -const DEFAULT_CONTRACT_1 = `// HelloWorld.cdc +const HelloWorldContract = `// HelloWorld.cdc // // Welcome to Cadence! This is one of the simplest programs you can deploy on Flow. // // The HelloWorld contract contains a single string field and a public getter function. // // Follow the "Hello, World!" tutorial to learn more: https://docs.onflow.org/cadence/tutorial/02-hello-world/ - -access(all) contract HelloWorld { - - // Declare a public field of type String. - // - // All fields must be initialized in the init() function. - access(all) let greeting: String - - // The init() function is required if the contract contains any fields. - init() { - self.greeting = "Hello, World!" - } - - // Public function that returns our friendly greeting! - access(all) fun hello(): String { - return self.greeting - } -} -`; - -const DEFAULT_CONTRACT_2 = `access(all) contract HelloWorld { - +pub contract HelloWorld { // Declare a public field of type String. // // All fields must be initialized in the init() function. - access(all) let greeting: String - - // The init() function is required if the contract contains any fields. - init() { - self.greeting = "Hello from account 2!" - } + pub var greeting: String // Public function that returns our friendly greeting! - access(all) fun hello(): String { - return self.greeting - } -} -`; - -const DEFAULT_CONTRACT_3 = `access(all) contract HelloWorld { - - // Declare a public field of type String. - // - // All fields must be initialized in the init() function. - access(all) let greeting: String - - // The init() function is required if the contract contains any fields. - init() { - self.greeting = "Hello from account 3!" + access(all) fun changeGreeting(newGreeting: String) { + self.greeting = newGreeting } // Public function that returns our friendly greeting! access(all) fun hello(): String { return self.greeting } -} -`; - -const DEFAULT_CONTRACT_4 = `access(all) contract HelloWorld { - - // Declare a public field of type String. - // - // All fields must be initialized in the init() function. - access(all) let greeting: String // The init() function is required if the contract contains any fields. init() { - self.greeting = "Hello from account 4!" - } - - // Public function that returns our friendly greeting! - access(all) fun hello(): String { - return self.greeting - } -} -`; - -const DEFAULT_CONTRACT_5 = `access(all) contract HelloWorld { - - // Declare a public field of type String. - // - // All fields must be initialized in the init() function. - access(all) let greeting: String - - // The init() function is required if the contract contains any fields. - init() { - self.greeting = "Hello from account 5!" - } - - // Public function that returns our friendly greeting! - access(all) fun hello(): String { - return self.greeting + self.greeting = "Hello, World!" } } `; export const DEFAULT_ACCOUNT_STATE = '{}'; -const DEFAULT_CONTRACTS = [ - DEFAULT_CONTRACT_1, - DEFAULT_CONTRACT_2, - DEFAULT_CONTRACT_3, - DEFAULT_CONTRACT_4, - DEFAULT_CONTRACT_5, -]; - const DEFAULT_TRANSACTION = `import HelloWorld from 0x05 -transaction { +transaction(greeting: String) { - prepare(acct: AuthAccount) {} + prepare(acct: AuthAccount) { + log(acct.address) + } execute { - log(HelloWorld.hello()) + HelloWorld.changeGreeting(newGreeting: greeting) } } `; -const DEFAULT_SCRIPT = `pub fun main(): Int { - return 1 +const DEFAULT_SCRIPT = `import HelloWorld from 0x05 +pub fun main() { + log(HelloWorld.hello()) } `; @@ -155,13 +78,15 @@ export function createDefaultProject(): Project { SEED_TITLE, SEED_DESCRIPTION, SEED_README, - DEFAULT_CONTRACTS.map((contract) => contract), - DEFAULT_CONTRACTS.map((contract, i) => ({ - title: `Contract ${i + 1}`, - code: contract, - })), - [{ title: 'Transaction', code: DEFAULT_TRANSACTION }], - [{ title: 'Script', code: DEFAULT_SCRIPT }], + accountIndexes(), + [ + { + title: `HelloWorld`, + code: HelloWorldContract, + }, + ], + [{ title: 'ChangeGreeting', code: DEFAULT_TRANSACTION }], + [{ title: 'GetGreeting', code: DEFAULT_SCRIPT }], ); } @@ -181,10 +106,10 @@ export function createLocalProject( transactionTemplates: Array, scriptTemplates: Array, ): Project { - const accountEntities: Account[] = accounts.map((_account, i) => { + const accountEntities: Account[] = accounts.map((_account) => { return { __typename: 'Account', - address: `000000000000000${i + 1}`, + address: `000000000000000${_account}`, deployedContracts: [], state: DEFAULT_ACCOUNT_STATE, }; diff --git a/src/util/accounts.ts b/src/util/accounts.ts index e9021893..6661a359 100644 --- a/src/util/accounts.ts +++ b/src/util/accounts.ts @@ -1,3 +1,4 @@ +const accountAddressIndexes = ['5', '6', '7', '8', '9']; const accountAddresses = ['0x05', '0x06', '0x07', '0x08', '0x09']; export const storageMapByIndex = (index: number): string => { if (index < 0) return null; @@ -13,3 +14,7 @@ export const addressToAccount = (address: string): string => { const acctNum = address.charAt(address.length - 1); return `0x0${acctNum}`; }; + +export const accountIndexes = (): string[] => { + return accountAddressIndexes; +};