feat: add remote cache provider setup to the create-app command

Author: adhorodyski

packages/create-app/src/lib/bin.ts

@@ -9,14 +9,14 @@ import {
   RockError,
   spawn,
   spinner,
-  type SupportedRemoteCacheProviders,
 } from '@rock-js/tools';
 import { gitInitStep, hasGitClient, isGitRepo } from './steps/git-init.js';
-import type { TemplateInfo } from './templates.js';
+import type { RemoteCacheTemplateInfo, TemplateInfo } from './templates.js';
 import {
   BUNDLERS,
   PLATFORMS,
   PLUGINS,
+  REMOTE_CACHE_PROVIDERS,
   resolveTemplate,
   TEMPLATES,
 } from './templates.js';
@@ -47,6 +47,7 @@ import {
   promptPlugins,
   promptProjectName,
   promptRemoteCacheProvider,
+  promptRemoteCacheProvidersConfig,
   promptTemplate,
 } from './utils/prompts.js';
 import {
@@ -145,7 +146,11 @@ export async function run() {
     options.remoteCacheProvider !== undefined ||
     options.remoteCacheProvider === false
       ? null
-      : await promptRemoteCacheProvider();
+      : await promptRemoteCacheProvider(REMOTE_CACHE_PROVIDERS);
+
+  const remoteCacheProviderConfig = remoteCacheProvider
+    ? await promptRemoteCacheProvidersConfig(remoteCacheProvider.name)
+    : null;
 
   const shouldInstallDependencies =
     options.install || isInteractive()
@@ -173,7 +178,12 @@ export async function run() {
     platforms,
     plugins,
     bundler,
-    remoteCacheProvider,
+    remoteCacheProvider && remoteCacheProviderConfig
+      ? {
+          provider: remoteCacheProvider,
+          args: remoteCacheProviderConfig,
+        }
+      : null,
   );
   loader.stop('Applied template, platforms and plugins.');
 
@@ -293,7 +303,10 @@ function createConfig(
   platforms: TemplateInfo[],
   plugins: TemplateInfo[] | null,
   bundler: TemplateInfo,
-  remoteCacheProvider: SupportedRemoteCacheProviders | null,
+  remoteCacheProvider: {
+    provider: RemoteCacheTemplateInfo;
+    args: Record<string, unknown>;
+  } | null,
 ) {
   const rockConfig = path.join(absoluteTargetDir, 'rock.config.mjs');
   fs.writeFileSync(
@@ -306,15 +319,23 @@ export function formatConfig(
   platforms: TemplateInfo[],
   plugins: TemplateInfo[] | null,
   bundler: TemplateInfo,
-  remoteCacheProvider: SupportedRemoteCacheProviders | null,
+  remoteCacheProvider: {
+    provider: RemoteCacheTemplateInfo;
+    args: Record<string, unknown>;
+  } | null,
 ) {
   const platformsWithImports = platforms.filter(
     (template) => template.importName,
   );
   const pluginsWithImports = plugins
     ? plugins.filter((template) => template.importName)
     : null;
-  return `${[...platformsWithImports, ...(pluginsWithImports ?? []), bundler]
+  return `${[
+    ...platformsWithImports,
+    ...(pluginsWithImports ?? []),
+    bundler,
+    ...(remoteCacheProvider ? [remoteCacheProvider.provider] : []),
+  ]
     .map(
       (template) =>
         `import { ${template.importName} } from '${template.packageName}';`,
@@ -338,7 +359,16 @@ export default {${
       .join('\n    ')}
   },
   remoteCacheProvider: ${
-    remoteCacheProvider === null ? null : `'${remoteCacheProvider}'`
+    remoteCacheProvider === null
+      ? null
+      : `${remoteCacheProvider.provider.importName}({\n${Object.entries(
+          remoteCacheProvider.args,
+        )
+          .map(
+            ([key, value]) =>
+              `    ${JSON.stringify(key)}: ${JSON.stringify(value)},`,
+          )
+          .join('\n')}\n  })`
   },
 };
 `;

packages/create-app/src/lib/templates.ts

@@ -1,5 +1,5 @@
 import * as path from 'node:path';
-import { resolveAbsolutePath } from '@rock-js/tools';
+import { resolveAbsolutePath, type SupportedRemoteCacheProviders } from '@rock-js/tools';
 
 export type TemplateInfo = NpmTemplateInfo | LocalTemplateInfo;
 
@@ -22,6 +22,13 @@ export type LocalTemplateInfo = {
   importName?: string;
 };
 
+export type RemoteCacheTemplateInfo = {
+  name: SupportedRemoteCacheProviders;
+  displayName: string;
+  packageName: string;
+  importName: string;
+}
+
 export const TEMPLATES: TemplateInfo[] = [
   {
     type: 'npm',
@@ -89,6 +96,21 @@ export const PLATFORMS: TemplateInfo[] = [
   },
 ];
 
+export const REMOTE_CACHE_PROVIDERS: RemoteCacheTemplateInfo[] = [
+  {
+    name: 'github-actions',
+    displayName: 'GitHub Actions',
+    packageName: '@rock-js/provider-github-actions',
+    importName: 'providerGithubActions',
+  },
+  {
+    name: 's3',
+    displayName: 'S3',
+    packageName: '@rock-js/provider-s3',
+    importName: 'providerS3',
+  },
+];
+
 export function resolveTemplate(
   templates: TemplateInfo[],
   name: string,

packages/create-app/src/lib/utils/prompts.ts

@@ -5,15 +5,17 @@ import {
   note,
   outro,
   promptConfirm,
+  promptGroup,
   promptMultiselect,
+  promptPassword,
   promptSelect,
   promptText,
   relativeToCwd,
   RockError,
   type SupportedRemoteCacheProviders,
 } from '@rock-js/tools';
 import { vice } from 'gradient-string';
-import type { TemplateInfo } from '../templates.js';
+import type { RemoteCacheTemplateInfo, TemplateInfo } from '../templates.js';
 import { validateProjectName } from './project-name.js';
 import { getRockVersion } from './version.js';
 
@@ -23,9 +25,9 @@ export function printHelpMessage(
 ) {
   console.log(`
      Usage: create-rock [options]
-  
+
      Options:
-     
+
        -h, --help                 Display help for command
        -v, --version              Output the version number
        -d, --dir                  Create project in specified directory
@@ -36,7 +38,7 @@ export function printHelpMessage(
        --remote-cache-provider    Specify remote cache provider
        --override                 Override files in target directory
        --install                  Install Node.js dependencies
-     
+
      Available templates:
        ${templates.map((t) => t.name).join(', ')}
 
@@ -158,19 +160,39 @@ export function promptBundlers(
   });
 }
 
-export function promptRemoteCacheProvider(): Promise<SupportedRemoteCacheProviders | null> {
+export function promptRemoteCacheProvider(
+  providers: RemoteCacheTemplateInfo[],
+): Promise<RemoteCacheTemplateInfo | null> {
   return promptSelect({
     message: 'Which remote cache provider do you want to use?',
-    initialValue: 'github-actions',
-    options: [
-      {
-        value: 'github-actions',
-        label: 'GitHub Actions',
-        hint: 'Enable builds on your CI',
-      },
-      { value: null, label: 'None', hint: 'Local builds only' },
-    ],
-  }) as Promise<SupportedRemoteCacheProviders | null>;
+    initialValue: providers[0],
+    options: providers.map((provider) => ({
+      value: provider,
+      label: provider.displayName,
+    })),
+  });
+}
+
+export function promptRemoteCacheProvidersConfig(
+  provider: SupportedRemoteCacheProviders,
+) {
+  switch (provider) {
+    case 'github-actions':
+      return promptGroup({
+        owner: () => promptText({ message: 'GitHub owner' }),
+        repo: () => promptText({ message: 'GitHub repo' }),
+        token: () =>
+          promptPassword({ message: 'GitHub Personal Access Token (PAT)' }),
+      });
+    case 's3':
+      return promptGroup({
+        bucket: () => promptText({ message: 'S3 bucket' }),
+        region: () => promptText({ message: 'S3 region' }),
+        accessKeyId: () => promptText({ message: 'S3 access key ID' }),
+        secretAccessKey: () =>
+          promptPassword({ message: 'S3 secret access key' }),
+      });
+  }
 }
 
 export function confirmOverrideFiles(targetDir: string) {

packages/tools/src/lib/build-cache/common.ts

@@ -10,7 +10,7 @@ import { spinner } from '../prompts.js';
 
 export const BUILD_CACHE_DIR = 'remote-build';
 
-export type SupportedRemoteCacheProviders = 'github-actions';
+export type SupportedRemoteCacheProviders = 'github-actions' | 's3';
 
 export type RemoteArtifact = {
   name: string;