feat: Added importing of resources and selection flow

kevinwang5658 · kevinwang5658 · commit 2a20b198065d · 2025-03-05T10:33:56.000-05:00
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -14,15 +14,14 @@
     "ajv": "^8.12.0",
     "ajv-formats": "^3.0.1",
     "chalk": "^5.3.0",
-    "codify-schemas": "^1.0.73",
+    "codify-schemas": "^1.0.74",
     "debug": "^4.3.4",
     "detect-indent": "^7.0.1",
     "diff": "^7.0.0",
     "ink": "^5.1.0",
     "ink-big-text": "^2.0.0",
     "ink-gradient": "^3.0.0",
     "ink-select-input": "^6.0.0",
-    "@fforres/ink-quicksearch-input": "^1.0.1",
     "jotai": "^2.11.1",
     "js-yaml": "^4.1.0",
     "js-yaml-source-map": "^0.2.2",
diff --git a/src/commands/init.ts b/src/commands/init.ts
@@ -1,6 +1,7 @@
 import fs from 'node:fs/promises';
 
 import { BaseCommand } from '../common/base-command.js';
+import { InitializeOrchestrator } from '../orchestrators/initialize.js';
 import { ShellUtils } from '../utils/shell.js';
 
 export default class Init extends BaseCommand {
@@ -35,7 +36,7 @@ Codify will try to smartly insert new configs by following existing spacing and
   public async run(): Promise<void> {
     const { raw, flags } = await this.parse(Init)
 
-    this.reporter.displayInitBanner()
+    await InitializeOrchestrator.run(this.reporter);
 
     // if (flags.path) {
     //   this.log(`Applying Codify from: ${flags.path}`);
diff --git a/src/events/context.ts b/src/events/context.ts
@@ -22,6 +22,7 @@ export enum ProcessName {
   PLAN = 'plan',
   DESTROY = 'destroy',
   IMPORT = 'import',
+  INIT = 'init',
 }
 
 export enum SubProcessName {
diff --git a/src/orchestrators/destroy.ts b/src/orchestrators/destroy.ts
@@ -5,7 +5,7 @@ import { ProcessName, SubProcessName, ctx } from '../events/context.js';
 import { DependencyMap, PluginManager } from '../plugins/plugin-manager.js';
 import { Reporter } from '../ui/reporters/reporter.js';
 import { getTypeAndNameFromId } from '../utils/index.js';
-import { InitializeOrchestrator } from './initialize-plugins.js';
+import { PluginInitOrchestrator } from './initialize-plugins.js';
 
 export interface DestroyArgs {
   ids: string[];
@@ -23,7 +23,7 @@ export class DestroyOrchestrator {
 
     ctx.processStarted(ProcessName.DESTROY)
     
-    const { typeIdsToDependenciesMap, pluginManager, project } = await InitializeOrchestrator.run({
+    const { typeIdsToDependenciesMap, pluginManager, project } = await PluginInitOrchestrator.run({
       ...args,
       allowEmptyProject: true,
       transformProject(project) {
diff --git a/src/orchestrators/import.ts b/src/orchestrators/import.ts
@@ -12,7 +12,7 @@ import { FileUtils } from '../utils/file.js';
 import { FileModificationCalculator, ModificationType } from '../utils/file-modification-calculator.js';
 import { groupBy, sleep } from '../utils/index.js';
 import { wildCardMatch } from '../utils/wild-card-match.js';
-import { InitializationResult, InitializeOrchestrator } from './initialize-plugins.js';
+import { InitializationResult, PluginInitOrchestrator } from './initialize-plugins.js';
 
 export type ImportResult = { result: ResourceConfig[], errors: string[] }
 
@@ -47,7 +47,7 @@ export class ImportOrchestrator {
     const typeIds = args.typeIds?.filter(Boolean)
     ctx.processStarted(ProcessName.IMPORT)
 
-    const initializationResult = await InitializeOrchestrator.run(
+    const initializationResult = await PluginInitOrchestrator.run(
       { ...args, allowEmptyProject: true },
       reporter
     );
diff --git a/src/orchestrators/initialize-plugins.ts b/src/orchestrators/initialize-plugins.ts
@@ -21,12 +21,12 @@ export interface InitializationResult {
   project: Project,
 }
 
-export class InitializeOrchestrator {
+export class PluginInitOrchestrator {
   static async run(
     args: InitializeArgs,
     reporter: Reporter,
   ): Promise<InitializationResult> {
-    let project = await InitializeOrchestrator.parse(
+    let project = await PluginInitOrchestrator.parse(
       args.path,
       args.allowEmptyProject ?? false,
       reporter
@@ -51,7 +51,7 @@ export class InitializeOrchestrator {
     ctx.subprocessStarted(SubProcessName.PARSE);
 
     const pathToParse = (fileOrDir === undefined)
-      ? await InitializeOrchestrator.findCodifyJson()
+      ? await PluginInitOrchestrator.findCodifyJson()
       : fileOrDir
 
     if (!pathToParse && !allowEmptyProject) {
diff --git a/src/orchestrators/initialize.ts b/src/orchestrators/initialize.ts
@@ -0,0 +1,37 @@
+import { ProcessName, ctx } from '../events/context.js';
+import { Reporter } from '../ui/reporters/reporter.js';
+import { PluginInitOrchestrator } from './initialize-plugins.js';
+
+export const InitializeOrchestrator = {
+
+  async run(reporter: Reporter) {
+    await reporter.displayInitBanner()
+
+    ctx.processStarted(ProcessName.INIT)
+    await reporter.displayProgress();
+
+
+    const { pluginManager, typeIdsToDependenciesMap } = await PluginInitOrchestrator.run({}, reporter);
+
+    const importResults = await Promise.all([...typeIdsToDependenciesMap.keys()].map(async (typeId) => {
+      try {
+        return await pluginManager.importResource({
+          core: { type: typeId },
+          parameters: {}
+        }, true);
+      } catch {
+        return null;
+      }
+    }))
+
+    const flattenedResults = importResults.filter(Boolean).flatMap(p => p?.result).filter(Boolean)
+
+    const userSelectedTypes = await reporter.promptInitResultSelection([...new Set(flattenedResults.map((r) => r!.core.type))])
+
+    ctx.processFinished(ProcessName.INIT);
+
+    console.log(JSON.stringify(flattenedResults, null, 2));
+  },
+
+
+};
diff --git a/src/orchestrators/plan.ts b/src/orchestrators/plan.ts
@@ -1,10 +1,10 @@
 import { Plan } from '../entities/plan.js';
 import { Project } from '../entities/project.js';
 import { ProcessName, SubProcessName, ctx } from '../events/context.js';
-import { DependencyMap, PluginManager } from '../plugins/plugin-manager.js';
+import { PluginManager } from '../plugins/plugin-manager.js';
 import { Reporter } from '../ui/reporters/reporter.js';
 import { createStartupShellScriptsIfNotExists } from '../utils/file.js';
-import { InitializeOrchestrator } from './initialize-plugins.js';
+import { PluginInitOrchestrator } from './initialize-plugins.js';
 import { ValidateOrchestrator } from './validate.js';
 
 export interface PlanArgs {
@@ -22,7 +22,7 @@ export class PlanOrchestrator {
   static async run(args: PlanArgs, reporter: Reporter): Promise<PlanOrchestratorResponse> {
     ctx.processStarted(ProcessName.PLAN)
 
-    const initializationResult = await InitializeOrchestrator.run({
+    const initializationResult = await PluginInitOrchestrator.run({
       ...args,
     }, reporter);
     const { typeIdsToDependenciesMap, pluginManager, project } = initializationResult;
diff --git a/src/orchestrators/validate.ts b/src/orchestrators/validate.ts
@@ -1,6 +1,6 @@
 import { SubProcessName, ctx } from '../events/context.js';
 import { Reporter } from '../ui/reporters/reporter.js';
-import { InitializationResult, InitializeOrchestrator } from './initialize-plugins.js';
+import { InitializationResult, PluginInitOrchestrator } from './initialize-plugins.js';
 
 export interface ValidateArgs {
   existing?: InitializationResult;
@@ -17,7 +17,7 @@ export const ValidateOrchestrator = {
       project,
       typeIdsToDependenciesMap: dependencyMap,
       pluginManager,
-    } = args.existing ?? await InitializeOrchestrator.run(args, reporter)
+    } = args.existing ?? await PluginInitOrchestrator.run(args, reporter)
 
     if (args.existing) {
       ctx.subprocessStarted(SubProcessName.VALIDATE)
diff --git a/src/plugins/plugin-manager.ts b/src/plugins/plugin-manager.ts
@@ -94,7 +94,7 @@ export class PluginManager {
   }
 
 
-  async importResource(config: ResourceJson): Promise<ImportResponseData> {
+  async importResource(config: ResourceJson, autoImportAll = false): Promise<ImportResponseData> {
     const pluginName = this.resourceToPluginMapping.get(config.core.type);
     if (!pluginName) {
       throw new Error(`Unable to find plugin for resource: ${config.core.type}`);
@@ -105,7 +105,7 @@ export class PluginManager {
       throw new Error(`Unable to find plugin for resource ${config.core.type}`);
     }
 
-    return plugin.import(config);
+    return plugin.import(config, autoImportAll);
   }
 
   async plan(project: Project): Promise<Plan> {
diff --git a/src/plugins/plugin.ts b/src/plugins/plugin.ts
@@ -1,6 +1,7 @@
 import {
   GetResourceInfoResponseData,
   GetResourceInfoResponseDataSchema,
+  ImportRequestData,
   ImportResponseData,
   ImportResponseDataSchema,
   InitializeResponseData,
@@ -115,8 +116,8 @@ export class Plugin implements IPlugin {
   }
 
 
-  async import(config: ResourceJson): Promise<ImportResponseData> {
-    const result = await this.process!.sendMessageForResult('import', config);
+  async import(config: ResourceJson, autoSearchAll = false): Promise<ImportResponseData> {
+    const result = await this.process!.sendMessageForResult('import', <ImportRequestData>{ ...config, autoSearchAll });
 
     if (!result.isSuccessful()) {
       throw new Error(`Unable import resource ${config.core.type} with plugin: "${this.name}" \n\n` + result.data);
diff --git a/src/ui/components/default-component.tsx b/src/ui/components/default-component.tsx
@@ -19,6 +19,7 @@ import { ImportWarning } from './import/import-warning.js';
 import { InitBanner } from './init/InitBanner.js';
 import { PlanComponent } from './plan/plan.js';
 import { ProgressDisplay } from './progress/progress-display.js';
+import { MultiSelect } from './multi-select/multi-select.js';
 
 const spinnerEmitter = new EventEmitter();
 
@@ -133,7 +134,22 @@ export function DefaultComponent(props: {
     }
     {
       renderStatus === RenderStatus.DISPLAY_INIT_BANNER && (
-        <InitBanner/>
+        <InitBanner emitter={emitter} />
+      )
+    }
+    {
+      renderStatus === RenderStatus.PROMPT_INIT_RESULT_SELECTION && (
+        <Box flexDirection='column'>
+          <Text>Codify found the following supported resorces on your system.</Text>
+          <Text> </Text>
+          <Text bold> Select which ones to import:</Text>
+          <MultiSelect
+            limit={9}
+            items={(renderData as string[]).map((o) => ({ label: o, value: o })).sort((a, b) => a.label.localeCompare(b.label))}
+            onSubmit={(result: unknown[]) => emitter.emit(RenderEvent.PROMPT_RESULT, result)}
+            defaultSelected={(renderData as string[]).map((o) => ({ label: o, value: o }))}
+          />
+        </Box>
       )
     }
   </Box>
diff --git a/src/ui/components/init/InitBanner.tsx b/src/ui/components/init/InitBanner.tsx
@@ -1,29 +1,24 @@
 import { MultiSelect } from '@inkjs/ui';
-import { Box, Text } from 'ink';
+import { Box, Static, Text } from 'ink';
 import BigText from 'ink-big-text';
 import Gradient from 'ink-gradient';
+import EventEmitter from 'node:events';
 import React from 'react';
+import { RenderEvent } from '../../reporters/reporter.js';
 
-export function InitBanner() {
+export function InitBanner(props: { emitter: EventEmitter }) {
   return <Box flexDirection='column'>
-    <Gradient name='morning'>
-      <BigText text='Codify' font='tiny'/>
-    </Gradient>
-    <Text>Use config </Text>
-    <Text>Use this init flow to get setup quickly with Codify.</Text>
-    <Text> </Text>
-    <Text bold>Select which resources to import:</Text>
-    <MultiSelect options={[
-      { label: 'Test 1', value: 'test 1' },
-      { label: 'Test 2', value: 'test 2' },
-      { label: 'Test 3', value: 'test 3' },
-      { label: 'Test 4', value: 'test 4' },
-      { label: 'Test 5', value: 'test 5' },
-      { label: 'Test 6', value: 'test 6' },
-      { label: 'Test 7', value: 'test 7' },
-      { label: 'Test 8', value: 'test 8' },
-      { label: 'Test 9', value: 'test 9' },
-      { label: 'Test 10', value: 'test 10' },
-    ]}/>
+    <Static items={[{}]}>{
+      () => <Box flexDirection='column' key='0'>
+        <Gradient name='morning'>
+          <BigText text='Codify' font='tiny'/>
+        </Gradient>
+        <Text>Codify is a configuration-as-code tool that helps you setup and manage your system.</Text>
+        <Text>Use this init flow to get started quickly with Codify.</Text>
+        <Text> </Text>
+        <Text bold>Codify will scan your system for any supported programs or settings and automatically generate configs for you.</Text>
+      </Box>
+    }</Static>
+    <MultiSelect options={[{ label: 'Continue', value: 'Continue' }]} onSubmit={() => { props.emitter.emit(RenderEvent.PROMPT_RESULT); }}/>
   </Box>
 }
diff --git a/src/ui/components/multi-select/checkbox.tsx b/src/ui/components/multi-select/checkbox.tsx
@@ -0,0 +1,12 @@
+import { Box, Text } from 'ink';
+import React from 'react';
+
+export function CheckBox(props: { isSelected: boolean }) {
+	const isSelected = props.isSelected ?? false;
+
+	return <Box marginRight={1}>
+		<Text color="green">{isSelected ? '◉' : '◯'}</Text>
+	</Box>
+}
+
+export default CheckBox;
diff --git a/src/ui/components/multi-select/indicator.tsx b/src/ui/components/multi-select/indicator.tsx
@@ -0,0 +1,14 @@
+import { Box, Text } from 'ink';
+import React from 'react';
+
+export function Indicator(props: { isHighlighted: boolean }) {
+	const isHighlighted = props.isHighlighted ?? false;
+
+	return <Box marginRight={1}>
+		<Text color={isHighlighted ? 'blue' : undefined}>
+			{isHighlighted ? '❯' : ' '}
+		</Text>
+	</Box>
+}
+
+export default Indicator;
diff --git a/src/ui/components/multi-select/item.tsx b/src/ui/components/multi-select/item.tsx
@@ -0,0 +1,10 @@
+import { Text } from 'ink';
+import React from 'react';
+
+export function Item(props: { isHighlighted: boolean, label: string }) {
+	const isHighlighted = props.isHighlighted ?? false;
+
+	return <Text color={isHighlighted ? 'blue' : undefined}>
+		{props.label}
+	</Text>
+}
diff --git a/src/ui/components/multi-select/multi-select.test.tsx b/src/ui/components/multi-select/multi-select.test.tsx
diff --git a/src/ui/components/multi-select/multi-select.tsx b/src/ui/components/multi-select/multi-select.tsx
diff --git a/src/ui/components/multi-select/utils.ts b/src/ui/components/multi-select/utils.ts
diff --git a/src/ui/reporters/default-reporter.tsx b/src/ui/reporters/default-reporter.tsx
diff --git a/src/ui/reporters/reporter.ts b/src/ui/reporters/reporter.ts
diff --git a/src/ui/store/index.ts b/src/ui/store/index.ts
diff --git a/test/orchestrator/initialize/initialize.test.ts b/test/orchestrator/initialize/initialize.test.ts

Original file line number	Diff line number	Diff line change
`@@ -22,6 +22,7 @@ export enum ProcessName {`
`22`	`22`	`PLAN = 'plan',`
`23`	`23`	`DESTROY = 'destroy',`
`24`	`24`	`IMPORT = 'import',`
	`25`	`+ INIT = 'init',`
`25`	`26`	`}`
`26`	`27`
`27`	`28`	`export enum SubProcessName {`