🪲 Add missing ref option to native OFT adapter example in create-lz-o…

…app (#999)

.changeset/big-seals-collect.md

@@ -0,0 +1,5 @@
+---
+"create-lz-oapp": patch
+---
+
+Fix ref option for native-oft-adapter example

packages/create-lz-oapp/src/config.ts

@@ -1,78 +1,81 @@
 import type { Example, PackageManager } from '@/types'
 import { isPackageManagerAvailable } from './utilities/installation'
 
-/**
- * To enable example development in a custom repository
- * we open the repository URL field to be taken from the environment
- */
-const repository = process.env['LAYERZERO_EXAMPLES_REPOSITORY_URL'] || 'https://github.com/LayerZero-Labs/devtools.git'
+export const getExamples = (): Example[] => {
+    /**
+     * To enable example development in a custom repository
+     * we open the repository URL field to be taken from the environment
+     */
+    const repository = process.env.LAYERZERO_EXAMPLES_REPOSITORY_URL || 'https://github.com/LayerZero-Labs/devtools.git'
 
-/**
- * To enable example development in a custom branch,
- * we open up the ref field to be taken from the environment
- *
- * `LAYERZERO_EXAMPLES_REPOSITORY_REF` can then be set to something like `#develop` or `#my-custom-branch`
- * to take the examples from a tag, a branch or a commit hash
- */
-const ref = process.env['LAYERZERO_EXAMPLES_REPOSITORY_REF'] || ''
+    /**
+     * To enable example development in a custom branch,
+     * we open up the ref field to be taken from the environment
+     *
+     * `LAYERZERO_EXAMPLES_REPOSITORY_REF` can then be set to something like `#develop` or `#my-custom-branch`
+     * to take the examples from a tag, a branch or a commit hash
+     */
+    const ref = process.env.LAYERZERO_EXAMPLES_REPOSITORY_REF || ''
 
-export const EXAMPLES: Example[] = [
-    {
-        id: 'oft',
-        label: 'OFT',
-        repository,
-        directory: 'examples/oft',
-        ref,
-    },
-    {
-        id: 'oapp',
-        label: 'OApp',
-        repository,
-        directory: 'examples/oapp',
-        ref,
-    },
-    {
-        id: 'onft721',
-        label: 'ONFT721',
-        repository,
-        directory: 'examples/onft721',
-        ref,
-    },
-    {
-        id: 'oft-adapter',
-        label: 'OFTAdapter',
-        repository,
-        directory: 'examples/oft-adapter',
-        ref,
-    },
-    {
-        id: 'native-oft-adapter',
-        label: 'NativeOFTAdapter',
-        repository,
-        directory: 'examples/native-oft-adapter',
-    },
-    {
-        id: 'oft-upgradeable',
-        label: 'Upgradeable OFT',
-        repository,
-        directory: 'examples/oft-upgradeable',
-        ref,
-    },
-    // The Solana OFT example is feature flagged for the time being
-    ...(process.env.LZ_ENABLE_EXPERIMENTAL_SOLANA_OFT_EXAMPLE
-        ? [
-              {
-                  id: 'oft-solana',
-                  label: 'OFT (Solana)',
-                  repository,
-                  directory: 'examples/oft-solana',
-                  ref,
-              },
-          ]
-        : []),
-]
+    return [
+        {
+            id: 'oft',
+            label: 'OFT',
+            repository,
+            directory: 'examples/oft',
+            ref,
+        },
+        {
+            id: 'oapp',
+            label: 'OApp',
+            repository,
+            directory: 'examples/oapp',
+            ref,
+        },
+        {
+            id: 'onft721',
+            label: 'ONFT721',
+            repository,
+            directory: 'examples/onft721',
+            ref,
+        },
+        {
+            id: 'oft-adapter',
+            label: 'OFTAdapter',
+            repository,
+            directory: 'examples/oft-adapter',
+            ref,
+        },
+        {
+            id: 'native-oft-adapter',
+            label: 'NativeOFTAdapter',
+            repository,
+            directory: 'examples/native-oft-adapter',
+            ref,
+        },
+        {
+            id: 'oft-upgradeable',
+            label: 'Upgradeable OFT',
+            repository,
+            directory: 'examples/oft-upgradeable',
+            ref,
+        },
+        // The Solana OFT example is feature flagged for the time being
+        ...(process.env.LZ_ENABLE_EXPERIMENTAL_SOLANA_OFT_EXAMPLE
+            ? [
+                  {
+                      id: 'oft-solana',
+                      label: 'OFT (Solana)',
+                      repository,
+                      directory: 'examples/oft-solana',
+                      ref,
+                  },
+              ]
+            : []),
+    ]
+}
 
-export const PACKAGE_MANAGERS: PackageManager[] = [
+const PACKAGE_MANAGERS: PackageManager[] = [
     {
         id: 'pnpm',
         executable: 'pnpm',
@@ -99,4 +102,4 @@ export const PACKAGE_MANAGERS: PackageManager[] = [
     },
 ]
 
-export const AVAILABLE_PACKAGE_MANAGERS = PACKAGE_MANAGERS.filter(isPackageManagerAvailable)
+export const getAvailablePackageManagers = () => PACKAGE_MANAGERS.filter(isPackageManagerAvailable)

packages/create-lz-oapp/src/index.tsx

@@ -13,10 +13,10 @@ import { printLogo } from "@layerzerolabs/io-devtools/swag";
 import { version } from "../package.json";
 import {
   ciOption,
+  createExampleOption,
+  createPackageManagerOption,
   destinationOption,
-  exampleOption,
   logLevelOption,
-  packageManagerOption,
 } from "./options";
 import type { Config, Example, PackageManager } from "./types";
 import { DefaultErrorMessage } from "./components/error";
@@ -34,9 +34,9 @@ new Command("create-lz-oapp")
   .version(version)
   .addOption(ciOption)
   .addOption(destinationOption)
-  .addOption(exampleOption)
+  .addOption(createExampleOption())
   .addOption(logLevelOption)
-  .addOption(packageManagerOption)
+  .addOption(createPackageManagerOption())
   .action(async (args: Args) => {
     printLogo();
 

packages/create-lz-oapp/src/options.ts

@@ -1,23 +1,24 @@
 import { InvalidOptionArgumentError, Option } from 'commander'
-import { AVAILABLE_PACKAGE_MANAGERS, EXAMPLES } from './config'
+import { getAvailablePackageManagers, getExamples } from './config'
 import { LogLevel, isDirectory, isFile } from '@layerzerolabs/io-devtools'
 import { resolve } from 'path'
-
-export const packageManagerOption = new Option('-p,--package-manager <name>', 'Node package manager to use')
-    .choices(AVAILABLE_PACKAGE_MANAGERS.map(({ id }) => id))
-    .argParser((id) => {
-        const manager = AVAILABLE_PACKAGE_MANAGERS.find((p) => p.id === id)
-        if (manager == null) {
-            throw new InvalidOptionArgumentError(`Package manager ${id} not found`)
-        }
-
-        return manager
-    })
-
-export const exampleOption = new Option('-e,--example <name>', 'Example project')
-    .choices(EXAMPLES.map(({ id }) => id))
-    .argParser((id) => {
-        const example = EXAMPLES.find((e) => e.id === id)
+import type { Example } from './types'
+
+export const createPackageManagerOption = (packageManagers = getAvailablePackageManagers()) =>
+    new Option('-p,--package-manager <name>', 'Node package manager to use')
+        .choices(packageManagers.map(({ id }) => id))
+        .argParser((id) => {
+            const manager = packageManagers.find((p) => p.id === id)
+            if (manager == null) {
+                throw new InvalidOptionArgumentError(`Package manager ${id} not found`)
+            }
+
+            return manager
+        })
+
+export const createExampleOption = (examples: Example[] = getExamples()) =>
+    new Option('-e,--example <name>', 'Example project').choices(examples.map(({ id }) => id)).argParser((id) => {
+        const example = examples.find((e) => e.id === id)
         if (example == null) {
             throw new InvalidOptionArgumentError(`Example ${id} not found`)
         }

packages/create-lz-oapp/src/utilities/prompts.ts

@@ -1,10 +1,13 @@
-import { EXAMPLES, AVAILABLE_PACKAGE_MANAGERS } from '@/config'
+import { getExamples, getAvailablePackageManagers } from '@/config'
 import prompts, { type Choice } from 'prompts'
 import { handlePromptState, isDirectory, isFile } from '@layerzerolabs/io-devtools'
 import { resolve } from 'path'
 import type { Config } from '@/types'
 
 export const promptForConfig = (config: Partial<Config> = {}): Promise<Config> => {
+    const examples = getExamples()
+    const packageManagers = getAvailablePackageManagers()
+
     return prompts([
         {
             onState: handlePromptState,
@@ -24,21 +27,25 @@ export const promptForConfig = (config: Partial<Config> = {}): Promise<Config> =
             type: 'select',
             name: 'example',
             message: 'Which example would you like to use as a starting point?',
-            choices: EXAMPLES.map((example) => ({
-                title: example.label,
-                value: example,
-                selected: example.id === config.example?.id,
-            })).sort(sortBySelected),
+            choices: examples
+                .map((example) => ({
+                    title: example.label,
+                    value: example,
+                    selected: example.id === config.example?.id,
+                }))
+                .sort(sortBySelected),
         },
         {
             onState: handlePromptState,
             type: 'select',
             name: 'packageManager',
-            choices: AVAILABLE_PACKAGE_MANAGERS.map((packageManager) => ({
-                title: packageManager.label,
-                value: packageManager,
-                selected: packageManager.id === config.packageManager?.id,
-            })).sort(sortBySelected),
+            choices: packageManagers
+                .map((packageManager) => ({
+                    title: packageManager.label,
+                    value: packageManager,
+                    selected: packageManager.id === config.packageManager?.id,
+                }))
+                .sort(sortBySelected),
             message: 'What package manager would you like to use in your project?',
         },
     ])

packages/create-lz-oapp/test/config.test.ts

@@ -0,0 +1,55 @@
+import { getExamples } from '@/config'
+
+describe('config', () => {
+    describe('getExamples()', () => {
+        it('should use the default repository if LAYERZERO_EXAMPLES_REPOSITORY_URL is empty', () => {
+            process.env.LAYERZERO_EXAMPLES_REPOSITORY_URL = ''
+
+            const examples = getExamples()
+            expect(examples).not.toEqual([])
+
+            examples.forEach((example) =>
+                expect(example).toMatchObject({ repository: 'https://github.com/LayerZero-Labs/devtools.git' })
+            )
+        })
+
+        it('should use LAYERZERO_EXAMPLES_REPOSITORY_URL if LAYERZERO_EXAMPLES_REPOSITORY_URL is defined', () => {
+            process.env.LAYERZERO_EXAMPLES_REPOSITORY_URL = 'my://little.devtools'
+
+            const examples = getExamples()
+            expect(examples).not.toEqual([])
+
+            examples.forEach((example) => expect(example).toMatchObject({ repository: 'my://little.devtools' }))
+        })
+
+        it('should use the default ref if LAYERZERO_EXAMPLES_REPOSITORY_REF is empty', () => {
+            process.env.LAYERZERO_EXAMPLES_REPOSITORY_REF = ''
+
+            const examples = getExamples()
+            expect(examples).not.toEqual([])
+
+            examples.forEach((example) => expect(example).toMatchObject({ ref: '' }))
+        })
+
+        it('should use LAYERZERO_EXAMPLES_REPOSITORY_REF if LAYERZERO_EXAMPLES_REPOSITORY_REF is defined', () => {
+            process.env.LAYERZERO_EXAMPLES_REPOSITORY_REF = 'ohhello'
+
+            const examples = getExamples()
+            expect(examples).not.toEqual([])
+
+            examples.forEach((example) => expect(example).toMatchObject({ ref: 'ohhello' }))
+        })
+
+        it('should not include Solana OFT example if LZ_ENABLE_EXPERIMENTAL_SOLANA_OFT_EXAMPLE is empty', () => {
+            process.env.LZ_ENABLE_EXPERIMENTAL_SOLANA_OFT_EXAMPLE = ''
+
+            expect(getExamples()).not.toContainEqual(expect.objectContaining({ id: 'oft-solana' }))
+        })
+
+        it('should include Solana OFT example if LZ_ENABLE_EXPERIMENTAL_SOLANA_OFT_EXAMPLE is defined', () => {
+            process.env.LZ_ENABLE_EXPERIMENTAL_SOLANA_OFT_EXAMPLE = 'yes'
+
+            expect(getExamples()).toContainEqual(expect.objectContaining({ id: 'oft-solana' }))
+        })
+    })
+})

packages/create-lz-oapp/tsconfig.json

@@ -3,6 +3,7 @@
   "compilerOptions": {
     "outDir": "dist",
     "declaration": false,
+    "declarationMap": false,
     "jsx": "react",
     "lib": ["dom", "dom.Iterable", "es2022"],
     "resolveJsonModule": true,