From 6f9e4a959aa50a040efab4de2c6d6500d0b33b30 Mon Sep 17 00:00:00 2001
From: Miles Johnson <mileswjohnson@gmail.com>
Date: Wed, 16 Dec 2020 18:07:53 -0800
Subject: [PATCH] fix: Fix init crashing and submitting too early.

---
 src/commands/Init.tsx               | 12 ++++--------
 src/components/Init/PackageForm.tsx | 27 ++++++++++++++++++---------
 src/components/Init/index.tsx       | 15 ++++++++-------
 3 files changed, 30 insertions(+), 24 deletions(-)

diff --git a/src/commands/Init.tsx b/src/commands/Init.tsx
index 2905fc91e..695b339c7 100644
--- a/src/commands/Init.tsx
+++ b/src/commands/Init.tsx
@@ -5,7 +5,7 @@ import Command from './Base';
 import Package from '../Package';
 import Init from '../components/Init';
 import { PackemonPackage, PackemonPackageConfig } from '../types';
-import { DEFAULT_FORMAT, DEFAULT_INPUT, DEFAULT_PLATFORM, DEFAULT_SUPPORT } from '../constants';
+import { DEFAULT_FORMAT, DEFAULT_INPUT, DEFAULT_SUPPORT } from '../constants';
 
 export interface InitOptions {
   force: boolean;
@@ -39,9 +39,7 @@ export class InitCommand extends Command<InitOptions> {
     return (
       <Init
         packageNames={unconfiguredPackages.map((pkg) => pkg.package.name)}
-        onComplete={(configs) => {
-          void this.writeConfigsToPackageJsons(unconfiguredPackages, configs);
-        }}
+        onComplete={(configs) => this.writeConfigsToPackageJsons(unconfiguredPackages, configs)}
       />
     );
   }
@@ -78,9 +76,7 @@ export class InitCommand extends Command<InitOptions> {
 
     if (platform) {
       if (Array.isArray(platform) && platform.length === 1) {
-        if (platform[0] !== DEFAULT_PLATFORM) {
-          [config.platform] = platform;
-        }
+        [config.platform] = platform;
       } else {
         config.platform = platform;
       }
@@ -97,7 +93,7 @@ export class InitCommand extends Command<InitOptions> {
     packages: WorkspacePackage<PackemonPackage>[],
     configs: Record<string, PackemonPackageConfig>,
   ) {
-    return Promise.all(
+    await Promise.all(
       packages.map((item) => {
         const pkg = new Package(this.packemon.project, new Path(item.metadata.packagePath), {
           ...item.package,
diff --git a/src/components/Init/PackageForm.tsx b/src/components/Init/PackageForm.tsx
index 7b8fbd664..85aa655d0 100644
--- a/src/components/Init/PackageForm.tsx
+++ b/src/components/Init/PackageForm.tsx
@@ -30,19 +30,28 @@ export default function PackageForm({ onSubmit }: PackageFormProps) {
       input &&
       ((hasUMD && namespace) || (!hasUMD && !namespace))
     ) {
-      // Delay or focus API crashes
+      const result = {
+        format,
+        inputs: { index: input },
+        namespace,
+        platform,
+        support,
+      };
+
+      // Delay submission or focus API crashes
       // https://github.com/vadimdemedes/ink/pull/404
       setTimeout(() => {
-        onSubmit({
-          format,
-          inputs: { index: input },
-          namespace,
-          platform,
-          support,
-        });
+        onSubmit(result);
       }, 100);
+
+      // Reset state for the next package
+      setPlatform([]);
+      setSupport(DEFAULT_SUPPORT);
+      setFormat([]);
+      setInput('');
+      setNamespace('');
     }
-  });
+  }, [format, input, namespace, onSubmit, platform, support]);
 
   // PLATFORM
 
diff --git a/src/components/Init/index.tsx b/src/components/Init/index.tsx
index 221ad1abe..edd308ebe 100644
--- a/src/components/Init/index.tsx
+++ b/src/components/Init/index.tsx
@@ -1,6 +1,6 @@
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { Box, Text } from 'ink';
-import { Header, Style } from '@boost/cli';
+import { Header, Style, useProgram } from '@boost/cli';
 import PackageForm from './PackageForm';
 import { PackemonPackageConfig } from '../../types';
 
@@ -8,13 +8,14 @@ export type InitPackageConfigs = Record<string, PackemonPackageConfig>;
 
 export interface InitProps {
   packageNames: string[];
-  onComplete: (configs: InitPackageConfigs) => void;
+  onComplete: (configs: InitPackageConfigs) => Promise<unknown>;
 }
 
 export default function Init({ packageNames, onComplete }: InitProps) {
+  const { exit } = useProgram();
   const [pkgsToConfigure, setPkgsToConfigure] = useState(() => packageNames);
   const [pkgConfigs, setPkgConfigs] = useState<InitPackageConfigs>({});
-  const currentPkg = pkgsToConfigure[0];
+  const currentPkg = useMemo(() => pkgsToConfigure[0], [pkgsToConfigure]);
 
   // Save config and move to next package
   const handleSubmit = useCallback(
@@ -32,9 +33,9 @@ export default function Init({ packageNames, onComplete }: InitProps) {
   // Complete once all packages have been configured
   useEffect(() => {
     if (pkgsToConfigure.length === 0) {
-      onComplete(pkgConfigs);
+      void onComplete(pkgConfigs).finally(exit);
     }
-  }, [pkgsToConfigure, pkgConfigs, onComplete]);
+  }, [pkgsToConfigure, pkgConfigs, onComplete, exit]);
 
   // Exit when theres no packages
   if (pkgsToConfigure.length === 0) {
@@ -54,7 +55,7 @@ export default function Init({ packageNames, onComplete }: InitProps) {
       </Box>
 
       <Box marginTop={1} flexDirection="column">
-        <PackageForm onSubmit={handleSubmit} />
+        <PackageForm key={currentPkg} onSubmit={handleSubmit} />
       </Box>
     </Box>
   );