refactor: moved some types to a single file

gabitoesmiapodo · gabitoesmiapodo · commit 4420af7145bf · 2025-05-27T16:29:24.000-03:00
diff --git a/source/import/components/steps/CloneRepo/Commands.tsx b/source/import/components/steps/CloneRepo/Commands.tsx
@@ -16,7 +16,7 @@ interface Props {
  * @param onCompletion
  */
 const Commands: FC<Props> = ({ projectName, onCompletion }) => {
-  const projectDir = join(process.cwd(), projectName)
+  const projectFolder = join(process.cwd(), projectName)
 
   return (
     <Box
@@ -40,7 +40,7 @@ const Commands: FC<Props> = ({ projectName, onCompletion }) => {
         <Text color={'whiteBright'}>Fetching tags</Text>
         <Spawn
           shell
-          cwd={projectDir}
+          cwd={projectFolder}
           silent
           command={'git'}
           args={['fetch', '--tags']}
@@ -51,7 +51,7 @@ const Commands: FC<Props> = ({ projectName, onCompletion }) => {
         <Text color={'whiteBright'}>Checking out latest tag</Text>
         <Spawn
           shell
-          cwd={projectDir}
+          cwd={projectFolder}
           command="git"
           args={['checkout $(git describe --tags `git rev-list --tags --max-count=1`)']}
           successText="Done!"
@@ -60,7 +60,7 @@ const Commands: FC<Props> = ({ projectName, onCompletion }) => {
         <Text color={'whiteBright'}>Removing .git folder</Text>
         <Spawn
           shell
-          cwd={projectDir}
+          cwd={projectFolder}
           command="rm"
           args={['-rf', '.git']}
           successText="Done!"
@@ -69,7 +69,7 @@ const Commands: FC<Props> = ({ projectName, onCompletion }) => {
         <Text color={'whiteBright'}>Initializing Git repository</Text>
         <Spawn
           shell
-          cwd={projectDir}
+          cwd={projectFolder}
           command="git"
           args={['init']}
           successText="Done!"
diff --git a/source/import/components/steps/Install/CustomInstallation.tsx b/source/import/components/steps/Install/CustomInstallation.tsx
@@ -1,35 +1,34 @@
-import { join } from 'node:path'
-import process from 'node:process'
 import { Box, Text } from 'ink'
 import { Script, Spawn } from 'ink-spawn'
 import React, { type FC } from 'react'
 import { featurePackages, homeFolder } from '../../../constants/config.js'
-import type { Item as CustomOptionsItem } from '../OptionalPackages.js'
+import type { MultiSelectItem } from '../../../types/types.js'
 import InstallAllPackages from './InstallAllPackages.js'
 
 interface Props {
-  customOptions?: Array<CustomOptionsItem>
+  customOptions?: Array<MultiSelectItem>
   onCompletion: () => void
-  projectDir: string
+  projectFolder: string
 }
 
 /**
  * Performs a custom installation based on the selected features: basically we tell `pnpm` what
  * features to remove (everything's included in package.json by default to simplify things)
  * @param onCompletion
  * @param customOptions
- * @param projectDir
+ * @param projectFolder
  */
-const CustomInstallation: FC<Props> = ({ onCompletion, customOptions, projectDir }) => {
-  const demosFolder = join(process.cwd(), homeFolder)
+const CustomInstallation: FC<Props> = ({ onCompletion, customOptions, projectFolder }) => {
+  const currentHomeFolder = `${projectFolder}${homeFolder}`
+  const cleanHomeFile = `${projectFolder}/.install-files/home/index.tsx`
 
   /**
    * Selected features won't be removed, unselected features will be.
    * @param feature
    * @param featuresList
    */
-  const featureSelected = (feature: string, featuresList: Array<CustomOptionsItem> | undefined) => {
-    return !!featuresList?.find((item: CustomOptionsItem) => item.value === feature)
+  const featureSelected = (feature: string, featuresList: Array<MultiSelectItem> | undefined) => {
+    return !!featuresList?.find((item: MultiSelectItem) => item.value === feature)
   }
 
   /**
@@ -63,7 +62,7 @@ const CustomInstallation: FC<Props> = ({ onCompletion, customOptions, projectDir
         <Script>
           {/* If there are no packages to remove simply install everything... */}
           <InstallAllPackages
-            projectDir={projectDir}
+            projectFolder={projectFolder}
             onCompletion={onCompletion}
           />
         </Script>
@@ -73,7 +72,7 @@ const CustomInstallation: FC<Props> = ({ onCompletion, customOptions, projectDir
           <Text color={'whiteBright'}>Installing packages</Text>
           <Spawn
             shell
-            cwd={projectDir}
+            cwd={projectFolder}
             silent
             command={'pnpm'}
             args={['remove', packagesToRemove]}
@@ -85,29 +84,51 @@ const CustomInstallation: FC<Props> = ({ onCompletion, customOptions, projectDir
           <Text color={'whiteBright'}>Executing post-install scripts</Text>
           <Spawn
             shell
-            cwd={projectDir}
+            cwd={projectFolder}
             silent
             command={'pnpm'}
             args={['run', 'postinstall']}
             runningText={'Working...'}
             successText={'Done!'}
             failureText={'Error...'}
+            onCompletion={onCompletion}
           />
           {!featureSelected('demo', customOptions) && (
-            <>
+            <Script>
               <Text color={'whiteBright'}>Removing component demos</Text>
               <Spawn
                 shell
-                cwd={projectDir}
-                silent
-                command={'pnpm'}
-                args={['run', 'postinstall']}
-                runningText={'Working...'}
-                successText={'Done!'}
-                failureText={'Error...'}
-                // onCompletion={onCompletion}
+                cwd={projectFolder}
+                // silent
+                command="rm"
+                args={['-rf', currentHomeFolder]}
+                // runningText={'Working...'}
+                // successText={'Done!'}
+                // failureText={'Error...'}
+              />
+              <Text color={'whiteBright'}>Creating new home folder</Text>
+              <Spawn
+                shell
+                cwd={projectFolder}
+                // silent
+                command="mkdir"
+                args={['-p', currentHomeFolder]}
+                // runningText={'Working...'}
+                // successText={'Done!'}
+                // failureText={'Error...'}
+              />
+              <Text color={'whiteBright'}>Creating new home page</Text>
+              <Spawn
+                shell
+                cwd={projectFolder}
+                // silent
+                command="cp"
+                args={[cleanHomeFile, currentHomeFolder]}
+                // runningText={'Working...'}
+                // successText={'Done!'}
+                // failureText={'Error...'}
               />
-            </>
+            </Script>
           )}
         </Script>
       )}
diff --git a/source/import/components/steps/Install/FullInstallation.tsx b/source/import/components/steps/Install/FullInstallation.tsx
@@ -4,19 +4,19 @@ import React, { type FC } from 'react'
 import InstallAllPackages from './InstallAllPackages.js'
 
 interface Props {
-  projectDir: string
+  projectFolder: string
   onCompletion?: () => void
 }
 
-const FullInstallation: FC<Props> = ({ onCompletion, projectDir }) => {
+const FullInstallation: FC<Props> = ({ onCompletion, projectFolder }) => {
   return (
     <Box
       flexDirection={'column'}
       gap={0}
     >
       <Script>
         <InstallAllPackages
-          projectDir={projectDir}
+          projectFolder={projectFolder}
           onCompletion={onCompletion}
         />
       </Script>
diff --git a/source/import/components/steps/Install/Install.tsx b/source/import/components/steps/Install/Install.tsx
@@ -3,28 +3,27 @@ import process from 'node:process'
 import { Box, Text } from 'ink'
 import { Script, Spawn } from 'ink-spawn'
 import React, { type FC } from 'react'
+import type { InstallationType, MultiSelectItem } from '../../../types/types.js'
 import Divider from '../../Divider.js'
-import type { Installation } from '../InstallationType.js'
-import type { Item as CustomOptionsItem } from '../OptionalPackages.js'
 import CustomInstallation from './CustomInstallation.js'
 import FullInstallation from './FullInstallation.js'
 
 interface Props {
   installation: {
-    installationType: Installation | undefined
-    customOptions?: Array<CustomOptionsItem>
+    installationType: InstallationType | undefined
+    customOptions?: Array<MultiSelectItem>
   }
   projectName: string
   onCompletion: () => void
 }
 
 const Install: FC<Props> = ({ projectName, onCompletion, installation }) => {
-  const projectDir = join(process.cwd(), projectName)
+  const projectFolder = join(process.cwd(), projectName)
   const { installationType, customOptions } = installation
 
   return (
     <>
-      <Divider title={`Performing ${installation.installationType ?? 'full'} installation`} />
+      <Divider title={`Executing ${installation.installationType ?? 'full'} installation`} />
       <Box
         flexDirection={'column'}
         gap={0}
@@ -44,7 +43,7 @@ const Install: FC<Props> = ({ projectName, onCompletion, installation }) => {
           </Box>
           <Spawn
             shell
-            cwd={projectDir}
+            cwd={projectFolder}
             silent
             command={'cp'}
             args={['.env.example', '.env.local']}
@@ -55,14 +54,14 @@ const Install: FC<Props> = ({ projectName, onCompletion, installation }) => {
           {installationType === 'full' && (
             <FullInstallation
               onCompletion={onCompletion}
-              projectDir={projectDir}
+              projectFolder={projectFolder}
             />
           )}
           {installationType === 'custom' && (
             <CustomInstallation
               customOptions={customOptions}
               onCompletion={onCompletion}
-              projectDir={projectDir}
+              projectFolder={projectFolder}
             />
           )}
         </Script>
diff --git a/source/import/components/steps/Install/InstallAllPackages.tsx b/source/import/components/steps/Install/InstallAllPackages.tsx
@@ -4,16 +4,16 @@ import React, { type FC } from 'react'
 
 interface Props {
   onCompletion?: () => void
-  projectDir: string
+  projectFolder: string
 }
 
-const InstallAllPackages: FC<Props> = ({ projectDir, onCompletion }) => {
+const InstallAllPackages: FC<Props> = ({ projectFolder, onCompletion }) => {
   return (
     <>
       <Text color={'whiteBright'}>Installing packages</Text>
       <Spawn
         shell
-        cwd={projectDir}
+        cwd={projectFolder}
         silent
         command={'pnpm'}
         args={['i']}
diff --git a/source/import/components/steps/InstallationMode.tsx b/source/import/components/steps/InstallationMode.tsx
@@ -2,21 +2,15 @@ import figures from 'figures'
 import { Text } from 'ink'
 import SelectInput from 'ink-select-input'
 import React, { useState, type FC } from 'react'
+import type { InstallationSelectItem } from '../../types/types.js'
 import Divider from '../Divider.js'
 
-export type Installation = 'full' | 'custom'
-
-export interface Item {
-  label: string
-  value: Installation
-}
-
 interface Props {
   onCompletion: () => void
-  onSelect: (item: Item) => void
+  onSelect: (item: InstallationSelectItem) => void
 }
 
-const installationTypeItems: Array<Item> = [
+const installationTypeItems: Array<InstallationSelectItem> = [
   {
     label: 'Full',
     value: 'full',
@@ -27,10 +21,10 @@ const installationTypeItems: Array<Item> = [
   },
 ]
 
-const InstallationType: FC<Props> = ({ onCompletion, onSelect }) => {
+const InstallationMode: FC<Props> = ({ onCompletion, onSelect }) => {
   const [isFocused, setIsFocused] = useState(true)
 
-  const handleSelect = (item: Item) => {
+  const handleSelect = (item: InstallationSelectItem) => {
     onSelect(item)
     onCompletion()
     setIsFocused(false)
@@ -60,4 +54,4 @@ const InstallationType: FC<Props> = ({ onCompletion, onSelect }) => {
   )
 }
 
-export default InstallationType
+export default InstallationMode
diff --git a/source/import/components/steps/OptionalPackages.tsx b/source/import/components/steps/OptionalPackages.tsx
@@ -1,21 +1,15 @@
 import { Text } from 'ink'
-import MultiSelect from '../Multiselect/index.js'
-
 import React, { useState, type FC, useEffect } from 'react'
-import type { Installation } from './InstallationType.js'
-
-export interface Item {
-  label: string
-  value: string
-}
+import type { InstallationType, MultiSelectItem } from '../../types/types.js'
+import MultiSelect from '../Multiselect/index.js'
 
 interface Props {
-  installation: Installation | undefined
+  installation: InstallationType | undefined
   onCompletion: () => void
-  onSubmit: (selectedItems: Array<Item>) => void
+  onSubmit: (selectedItems: Array<MultiSelectItem>) => void
 }
 
-const customPackages: Array<Item> = [
+const customPackages: Array<MultiSelectItem> = [
   {
     label: 'Component Demos',
     value: 'demo',
@@ -56,7 +50,7 @@ const OptionalPackages: FC<Props> = ({ onCompletion, onSubmit, installation }) =
     }
   }, [])
 
-  const onHandleSubmit = (selectedItems: Array<Item>) => {
+  const onHandleSubmit = (selectedItems: Array<MultiSelectItem>) => {
     onSubmit(selectedItems)
     setIsFocused(false)
     onCompletion()
diff --git a/source/import/types/types.ts b/source/import/types/types.ts
@@ -0,0 +1,7 @@
+export type SelectItem = { label: string; value: string }
+
+export type MultiSelectItem = SelectItem
+
+export type InstallationType = 'full' | 'custom'
+
+export type InstallationSelectItem = { label: string; value: InstallationType }
diff --git a/source/import/utils/utils.ts b/source/import/utils/utils.ts
