CLI Generate feature remote configs (#363)

Resolves: BUC-3398, BUC-3387

## Copilot Summary

This pull request introduces several enhancements and changes to the
`packages/cli` module, focusing on improving the configuration options,
command-line interface, and type generation processes. The most
important changes include updating the `typesOutput` configuration,
modifying command options, and adding new utility functions.

### Configuration and Command Updates:

*
[`packages/cli/README.md`](diffhunk://#diff-15986190ef9581ab59bcd5483b2c09e7fd0bd439d6f6cddbc94b0b1de094ee51L73-R89):
Updated the `typesOutput` configuration to support an array of objects
with `path` and `format` properties, and modified related command
options (`--overwrite`, `--format`) to reflect these changes.
[[1]](diffhunk://#diff-15986190ef9581ab59bcd5483b2c09e7fd0bd439d6f6cddbc94b0b1de094ee51L73-R89)
[[2]](diffhunk://#diff-15986190ef9581ab59bcd5483b2c09e7fd0bd439d6f6cddbc94b0b1de094ee51L96-R106)
[[3]](diffhunk://#diff-15986190ef9581ab59bcd5483b2c09e7fd0bd439d6f6cddbc94b0b1de094ee51L110-R115)
[[4]](diffhunk://#diff-15986190ef9581ab59bcd5483b2c09e7fd0bd439d6f6cddbc94b0b1de094ee51R124)
[[5]](diffhunk://#diff-15986190ef9581ab59bcd5483b2c09e7fd0bd439d6f6cddbc94b0b1de094ee51L173-R186)

### Command Implementation Changes:

*
[`packages/cli/commands/features.ts`](diffhunk://#diff-62cb1138f98fd9620a8f451d3171b4558f8690fa8fad668d98cd60a507f04315L8-R17):
Refactored the `generateTypesAction` to handle multiple `typesOutput`
configurations, generating types for each specified format and path.
Added new option `typesFormatOption` for specifying the format.
[[1]](diffhunk://#diff-62cb1138f98fd9620a8f451d3171b4558f8690fa8fad668d98cd60a507f04315L8-R17)
[[2]](diffhunk://#diff-62cb1138f98fd9620a8f451d3171b4558f8690fa8fad668d98cd60a507f04315L83-R96)
[[3]](diffhunk://#diff-62cb1138f98fd9620a8f451d3171b4558f8690fa8fad668d98cd60a507f04315L104-R123)
[[4]](diffhunk://#diff-62cb1138f98fd9620a8f451d3171b4558f8690fa8fad668d98cd60a507f04315R156-R166)
*
[`packages/cli/commands/init.ts`](diffhunk://#diff-76aae8c1424cc73067ec33d08cef49f3f8745b2827c72ed4d1e408b1141ed2d8L8-R14):
Replaced `--force` with `--overwrite` option and added a prompt for
selecting the output format during initialization.
[[1]](diffhunk://#diff-76aae8c1424cc73067ec33d08cef49f3f8745b2827c72ed4d1e408b1141ed2d8L8-R14)
[[2]](diffhunk://#diff-76aae8c1424cc73067ec33d08cef49f3f8745b2827c72ed4d1e408b1141ed2d8L24-R26)
[[3]](diffhunk://#diff-76aae8c1424cc73067ec33d08cef49f3f8745b2827c72ed4d1e408b1141ed2d8R77-R96)
[[4]](diffhunk://#diff-76aae8c1424cc73067ec33d08cef49f3f8745b2827c72ed4d1e408b1141ed2d8L100-R110)
*
[`packages/cli/commands/new.ts`](diffhunk://#diff-afaf24e9c51fdcf6d151a9d6a6ac53c50de2e6cc274fd860fa34a6473e91f988R11):
Added `typesFormatOption` to the `new` command and updated the
configuration handling to support the new `typesOutput` format.
[[1]](diffhunk://#diff-afaf24e9c51fdcf6d151a9d6a6ac53c50de2e6cc274fd860fa34a6473e91f988R11)
[[2]](diffhunk://#diff-afaf24e9c51fdcf6d151a9d6a6ac53c50de2e6cc274fd860fa34a6473e91f988R43-R55)

### Utility and Schema Changes:

*
[`packages/cli/stores/config.ts`](diffhunk://#diff-0c6bdf2dfe67c672cea5959d6db4ea9117d53e302e9f4410508a599cb0b6689dR2):
Added `typeFormats` and `TypesOutput` types, and a helper function
`normalizeTypesOutput` to standardize the `typesOutput` configuration.
[[1]](diffhunk://#diff-0c6bdf2dfe67c672cea5959d6db4ea9117d53e302e9f4410508a599cb0b6689dR2)
[[2]](diffhunk://#diff-0c6bdf2dfe67c672cea5959d6db4ea9117d53e302e9f4410508a599cb0b6689dR17)
[[3]](diffhunk://#diff-0c6bdf2dfe67c672cea5959d6db4ea9117d53e302e9f4410508a599cb0b6689dL26-R43)
[[4]](diffhunk://#diff-0c6bdf2dfe67c672cea5959d6db4ea9117d53e302e9f4410508a599cb0b6689dL43-R66)
*
[`packages/cli/schema.json`](diffhunk://#diff-1ce328445e6bae65ca6b80ba4983acad1e6a8df9062eea0aac912326f53799b5L16-R24):
Updated the schema to reflect the new `typesOutput` structure, allowing
an array of objects with `path` and `format` properties.

### Miscellaneous:

*
[`packages/cli/package.json`](diffhunk://#diff-6e2e2a1851648938b325ba84de634407a4e69a644ea61102df15ca4a8a7a9758L3-R3):
Bumped the version to `0.1.3`, added new scripts for testing and
coverage, and included additional dependencies.
[[1]](diffhunk://#diff-6e2e2a1851648938b325ba84de634407a4e69a644ea61102df15ca4a8a7a9758L3-R3)
[[2]](diffhunk://#diff-6e2e2a1851648938b325ba84de634407a4e69a644ea61102df15ca4a8a7a9758R34-R49)
[[3]](diffhunk://#diff-6e2e2a1851648938b325ba84de634407a4e69a644ea61102df15ca4a8a7a9758L57-R63)
*
[`packages/cli/index.ts`](diffhunk://#diff-ce752ce36be970cbc0110dae521e82462b9ee7dbca55f45b51648c82998da18dR14):
Added a utility function `stripTrailingSlash` to clean up URLs before
setting the configuration.
[[1]](diffhunk://#diff-ce752ce36be970cbc0110dae521e82462b9ee7dbca55f45b51648c82998da18dR14)
[[2]](diffhunk://#diff-ce752ce36be970cbc0110dae521e82462b9ee7dbca55f45b51648c82998da18dR29-R34)
*
[`packages/cli/services/features.ts`](diffhunk://#diff-2475cdaadabf46b6c77ce79efe6909efb569949ed9d0aba37c9be2ebf7e7c73bL3-R48):
Enhanced the `listFeatures` function to include remote configurations
and added new types for handling remote config variants.

Author: Swiftwork

packages/cli/README.md

@@ -70,19 +70,24 @@ Here's a comprehensive list of configuration options available in the `bucket.co
   "baseUrl": "https://app.bucket.co",
   "apiUrl": "https://app.bucket.co/api",
   "appId": "ap123456789",
-  "typesOutput": "gen/features.ts",
+  "typesOutput": [
+    {
+      "path": "gen/features.ts",
+      "format": "react"
+    }
+  ],
   "keyFormat": "camelCase"
 }
 ```
 
-| Option        | Description                                                                                                                       | Default                                              |
-| ------------- | --------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------- |
-| `$schema`     | Autocompletion for the config. `latest` can be replaced with a specific version.                                                  | "https://unpkg.com/@bucketco/cli@latest/schema.json" |
-| `baseUrl`     | Base URL for Bucket services.                                                                                                     | "https://app.bucket.co"                              |
-| `apiUrl`      | API URL for Bucket services (overrides baseUrl for API calls).                                                                    | "https://app.bucket.co/api"                          |
-| `appId`       | Your Bucket application ID.                                                                                                       | Required                                             |
-| `typesOutput` | Path where TypeScript types will be generated.                                                                                    | "gen/features.ts"                                    |
-| `keyFormat`   | Format for feature keys (options: custom, pascalCase, camelCase, snakeCaseUpper, snakeCaseLower, kebabCaseUpper, kebabCaseLower). | "custom"                                             |
+| Option        | Description                                                                                                                                                          | Default                                              |
+| ------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------- |
+| `$schema`     | Autocompletion for the config. `latest` can be replaced with a specific version.                                                                                     | "https://unpkg.com/@bucketco/cli@latest/schema.json" |
+| `baseUrl`     | Base URL for Bucket services.                                                                                                                                        | "https://app.bucket.co"                              |
+| `apiUrl`      | API URL for Bucket services (overrides baseUrl for API calls).                                                                                                       | "https://app.bucket.co/api"                          |
+| `appId`       | Your Bucket application ID.                                                                                                                                          | Required                                             |
+| `typesOutput` | Path(s) where TypeScript types will be generated. Can be a string or an array of objects with `path` and `format` properties. Available formats: `react` and `node`. | "gen/features.ts" with format "react"                |
+| `keyFormat`   | Format for feature keys (options: custom, pascalCase, camelCase, snakeCaseUpper, snakeCaseLower, kebabCaseUpper, kebabCaseLower).                                    | "custom"                                             |
 
 You can override these settings using command-line options for individual commands.
 
@@ -93,12 +98,12 @@ You can override these settings using command-line options for individual comman
 Initialize a new Bucket configuration in your project. This creates a `bucket.config.json` file with your settings and prompts for any required information not provided via options.
 
 ```bash
-bucket init [--force]
+bucket init [--overwrite]
 ```
 
 Options:
 
-- `--force`: Overwrite existing configuration file if one exists
+- `--overwrite`: Overwrite existing configuration file if one exists
 - `--app-id <id>`: Set the application ID
 - `--key-format <format>`: Set the key format for features
 
@@ -107,7 +112,7 @@ Options:
 All-in-one command to get started quickly. This command combines `init`, feature creation, and type generation in a single step. Use this for the fastest way to get up and running with Bucket.
 
 ```bash
-bucket new "My Feature" [--key my-feature] [--app-id ap123456789] [--key-format custom] [--out gen/features.ts]
+bucket new "My Feature" [--key my-feature] [--app-id ap123456789] [--key-format custom] [--out gen/features.ts] [--format react]
 ```
 
 Options:
@@ -116,6 +121,7 @@ Options:
 - `--app-id`: App ID to use
 - `--key-format`: Format for feature keys (custom, snake, camel, etc.)
 - `--out`: Path to generate TypeScript types
+- `--format`: Format of the generated types (react or node)
 
 If you prefer more control over each step, you can use the individual commands (`init`, `features create`, `features types`) instead.
 
@@ -170,13 +176,14 @@ Options:
 Generate TypeScript types for your features. This ensures type safety when using Bucket features in your TypeScript/JavaScript applications.
 
 ```bash
-bucket features types [--app-id ap123456789] [--out gen/features.ts]
+bucket features types [--app-id ap123456789] [--out gen/features.ts] [--format react]
 ```
 
 Options:
 
 - `--app-id`: App ID to use
 - `--out`: Path to generate TypeScript types
+- `--format`: Format of the generated types (react or node)
 
 ### `bucket apps`
 

packages/cli/commands/features.ts

@@ -5,15 +5,16 @@ import { mkdir, writeFile } from "node:fs/promises";
 import { dirname, isAbsolute, join, relative } from "node:path";
 import ora, { Ora } from "ora";
 
-import { createFeature, listFeatures } from "../services/features.js";
+import { createFeature, Feature, listFeatures } from "../services/features.js";
 import { configStore } from "../stores/config.js";
 import { handleError, MissingAppIdError } from "../utils/errors.js";
-import { genDTS, genFeatureKey, KeyFormatPatterns } from "../utils/gen.js";
+import { genFeatureKey, genTypes, KeyFormatPatterns } from "../utils/gen.js";
 import {
   appIdOption,
   featureKeyOption,
   featureNameArgument,
   keyFormatOption,
+  typesFormatOption,
   typesOutOption,
 } from "../utils/options.js";
 
@@ -80,16 +81,19 @@ export const listFeaturesAction = async () => {
 };
 
 export const generateTypesAction = async () => {
-  const { baseUrl, appId, typesOutput } = configStore.getConfig();
+  const { baseUrl, appId } = configStore.getConfig();
+  const typesOutput = configStore.getConfig("typesOutput");
 
   let spinner: Ora | undefined;
-  let featureKeys: string[] = [];
+  let features: Feature[] = [];
   try {
     if (!appId) throw new MissingAppIdError();
     spinner = ora(
       `Loading features of app ${chalk.cyan(appId)} at ${chalk.cyan(baseUrl)}...`,
     ).start();
-    featureKeys = (await listFeatures(appId)).map(({ key }) => key);
+    features = await listFeatures(appId, {
+      includeRemoteConfigs: true,
+    });
     spinner.succeed(
       `Loaded features of app ${chalk.cyan(appId)} at ${chalk.cyan(baseUrl)}`,
     );
@@ -101,15 +105,22 @@ export const generateTypesAction = async () => {
 
   try {
     spinner = ora("Generating feature types...").start();
-    const types = genDTS(featureKeys);
     const projectPath = configStore.getProjectPath();
-    const outPath = isAbsolute(typesOutput)
-      ? typesOutput
-      : join(projectPath, typesOutput);
-    await mkdir(dirname(outPath), { recursive: true });
-    await writeFile(outPath, types);
+
+    // Generate types for each output configuration
+    for (const output of typesOutput) {
+      const types = await genTypes(features, output.format);
+      const outPath = isAbsolute(output.path)
+        ? output.path
+        : join(projectPath, output.path);
+
+      await mkdir(dirname(outPath), { recursive: true });
+      await writeFile(outPath, types);
+      spinner.text = `Generated ${output.format} types for ${chalk.cyan(appId)} in ${chalk.cyan(relative(projectPath, outPath))}.`;
+    }
+
     spinner.succeed(
-      `Generated types for ${chalk.cyan(appId)} in ${chalk.cyan(relative(projectPath, outPath))}.`,
+      `Generated types for ${chalk.cyan(appId)} in ${typesOutput.length} location(s).`,
     );
   } catch (error) {
     spinner?.fail("Type generation failed");
@@ -142,12 +153,17 @@ export function registerFeatureCommands(cli: Command) {
     .description("Generate feature types")
     .addOption(appIdOption)
     .addOption(typesOutOption)
+    .addOption(typesFormatOption)
     .action(generateTypesAction);
 
   // Update the config with the cli override values
   featuresCommand.hook("preAction", (_, command) => {
-    const { appId, keyFormat, out } = command.opts();
-    configStore.setConfig({ appId, keyFormat, typesOutput: out });
+    const { appId, keyFormat, out, format } = command.opts();
+    configStore.setConfig({
+      appId,
+      keyFormat,
+      typesOutput: out ? [{ path: out, format: format || "react" }] : undefined,
+    });
   });
 
   cli.addCommand(featuresCommand);

packages/cli/commands/init.ts

@@ -5,13 +5,13 @@ import { relative } from "node:path";
 import ora, { Ora } from "ora";
 
 import { App, listApps } from "../services/bootstrap.js";
-import { configStore } from "../stores/config.js";
+import { configStore, typeFormats } from "../stores/config.js";
 import { chalkBrand, DEFAULT_TYPES_OUTPUT } from "../utils/constants.js";
 import { handleError } from "../utils/errors.js";
-import { initOverrideOption } from "../utils/options.js";
+import { overwriteOption } from "../utils/options.js";
 
 type InitArgs = {
-  force?: boolean;
+  overwrite?: boolean;
 };
 
 export const initAction = async (args: InitArgs = {}) => {
@@ -21,9 +21,9 @@ export const initAction = async (args: InitArgs = {}) => {
   try {
     // Check if config already exists
     const configPath = configStore.getConfigPath();
-    if (configPath && !args.force) {
+    if (configPath && !args.overwrite) {
       throw new Error(
-        "Bucket is already initialized. Use --force to overwrite.",
+        "Bucket is already initialized. Use --overwrite to overwrite.",
       );
     }
 
@@ -74,16 +74,26 @@ export const initAction = async (args: InitArgs = {}) => {
       default: DEFAULT_TYPES_OUTPUT,
     });
 
+    // Get types output format
+    const typesFormat = await select({
+      message: "What is the output format?",
+      choices: typeFormats.map((format) => ({
+        name: format,
+        value: format,
+      })),
+      default: "react",
+    });
+
     // Update config
     configStore.setConfig({
       appId,
       keyFormat,
-      typesOutput,
+      typesOutput: [{ path: typesOutput, format: typesFormat }],
     });
 
     // Create config file
     spinner = ora("Creating configuration...").start();
-    await configStore.saveConfigFile(args.force);
+    await configStore.saveConfigFile(args.overwrite);
     spinner.succeed(
       `Configuration created at ${chalk.cyan(relative(process.cwd(), configStore.getConfigPath()!))}`,
     );
@@ -97,6 +107,6 @@ export function registerInitCommand(cli: Command) {
   cli
     .command("init")
     .description("Initialize a new Bucket configuration")
-    .addOption(initOverrideOption)
+    .addOption(overwriteOption)
     .action(initAction);
 }

packages/cli/commands/new.ts

@@ -8,6 +8,7 @@ import {
   featureKeyOption,
   featureNameArgument,
   keyFormatOption,
+  typesFormatOption,
   typesOutOption,
 } from "../utils/options.js";
 
@@ -39,13 +40,18 @@ export function registerNewCommand(cli: Command) {
     .addOption(appIdOption)
     .addOption(keyFormatOption)
     .addOption(typesOutOption)
+    .addOption(typesFormatOption)
     .addOption(featureKeyOption)
     .addArgument(featureNameArgument)
     .action(newAction);
 
   // Update the config with the cli override values
   cli.hook("preAction", (command) => {
-    const { appId, keyFormat, out } = command.opts();
-    configStore.setConfig({ appId, keyFormat, typesOutput: out });
+    const { appId, keyFormat, out, format } = command.opts();
+    configStore.setConfig({
+      appId,
+      keyFormat,
+      typesOutput: out ? [{ path: out, format: format || "react" }] : undefined,
+    });
   });
 }

packages/cli/index.ts

@@ -11,6 +11,7 @@ import { registerNewCommand } from "./commands/new.js";
 import { authStore } from "./stores/auth.js";
 import { configStore } from "./stores/config.js";
 import { apiUrlOption, baseUrlOption, debugOption } from "./utils/options.js";
+import { stripTrailingSlash } from "./utils/path.js";
 
 async function main() {
   // Must load tokens and config before anything else
@@ -25,9 +26,12 @@ async function main() {
   // Pre-action hook
   program.hook("preAction", () => {
     const { debug, baseUrl, apiUrl } = program.opts();
+    const cleanedBaseUrl = stripTrailingSlash(baseUrl?.trim());
     configStore.setConfig({
-      baseUrl,
-      apiUrl: apiUrl || (baseUrl && `${baseUrl}/api`),
+      baseUrl: cleanedBaseUrl,
+      apiUrl:
+        stripTrailingSlash(apiUrl) ||
+        (cleanedBaseUrl && `${cleanedBaseUrl}/api`),
     });
 
     if (debug) {

packages/cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bucketco/cli",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "packageManager": "yarn@4.1.1",
   "description": "CLI for Bucket service",
   "main": "./dist/index.js",
@@ -31,17 +31,22 @@
   "scripts": {
     "build": "tsc && shx chmod +x dist/index.js",
     "bucket": "yarn build && ./dist/index.js",
+    "test": "vitest -c vite.config.js",
+    "test:ci": "vitest run -c vite.config.js --reporter=default --reporter=junit --outputFile=junit.xml",
+    "coverage": "vitest run --coverage",
     "lint": "eslint .",
     "lint:ci": "eslint --output-file eslint-report.json --format json .",
     "prettier": "prettier --check .",
-    "format": "yarn lint --fix && yarn prettier --write"
+    "format": "yarn lint --fix && yarn prettier --write",
+    "preversion": "yarn lint && yarn prettier && yarn vitest run -c vite.config.js && yarn build"
   },
   "dependencies": {
     "@inquirer/prompts": "^5.3.8",
     "ajv": "^8.17.1",
     "chalk": "^5.3.0",
     "change-case": "^5.4.4",
     "commander": "^12.1.0",
+    "fast-deep-equal": "^3.1.3",
     "find-up": "^7.0.0",
     "json5": "^2.2.3",
     "open": "^10.1.0",
@@ -54,6 +59,7 @@
     "eslint": "^9.21.0",
     "prettier": "^3.5.2",
     "shx": "^0.3.4",
-    "typescript": "^5.5.4"
+    "typescript": "^5.5.4",
+    "vitest": "^3.0.8"
   }
 }

packages/cli/schema.json

@@ -13,7 +13,15 @@
       "type": "string"
     },
     "typesOutput": {
-      "type": "string"
+      "type": "array",
+      "items": {
+        "type": "object",
+        "properties": {
+          "path": { "type": "string" },
+          "format": { "type": "string", "enum": ["react", "node"] }
+        },
+        "required": ["path"]
+      }
     },
     "keyFormat": {
       "type": "string",