🔖 Merge branch 'master' of github.com:CarGDev/reactwizard

src/setup/dependencies.js

@@ -26,10 +26,11 @@ function installDependencies(userInput, options) {
       default:
         break;
     }
-    if (userInput.useRedux) {
+    if (userInput.stateLibrary === 'Redux Toolkit') {
       deps.push('@reduxjs/toolkit');
       deps.push('react-redux');
-      deps.push('redux');
+    } else if (userInput.stateLibrary === 'Zustand') {
+      deps.push('zustand');
     }
     execSync(
       `npm install ${deps.join(' ')} ${options.verbose ? '--verbose' : ''}`

src/setup/init.js

@@ -6,6 +6,7 @@ const { installDependencies } = require('./dependencies');
 const { installDevDependencies } = require('./devDependencies');
 const { setupHusky } = require('./husky');
 const { setupRedux } = require('./redux');
+const { setupZustand } = require('./zustand');
 const { setupStyles } = require('./styles');
 const { setupGit } = require('./gitInit');
 const { setupTesting } = require('./testing');
@@ -48,9 +49,13 @@ async function initProject(projectDirectory, userInput, options) {
 
   // Set up additional features based on user input
   if (userInput.useHusky) setupHusky(options);
-  if (userInput.useRedux) setupRedux(userInput);
-  setupStyles(userInput, options);
-  setupTesting(userInput);
+  if (userInput.stateLibrary === 'Redux Toolkit') {
+    setupRedux(options);
+  } else if (userInput.stateLibrary === 'Zustand') {
+    setupZustand(options);
+  }
+  setupStyles(userInput.styling);
+  setupTesting(userInput.testingFramework);
 
   // Create atomic design structure
   createAtomicStructure();

src/setup/zustand.js

@@ -0,0 +1,27 @@
+const ora = require('ora');
+const fs = require('fs');
+const path = require('path');
+
+function setupZustand(options) {
+  const spinner = ora('🛠️ Setting up Zustand...').start();
+
+  // Create store folder
+  fs.mkdirSync('src/store', { recursive: true });
+
+  const extension = options.language === 'TypeScript' ? '.ts' : '.js';
+  const storeIndex = `import { create } from 'zustand';
+
+const useStore = create((set) => ({
+  count: 0,
+  increment: () => set((state) => ({ count: state.count + 1 })),
+}));
+
+export default useStore;
+`;
+
+  fs.writeFileSync(path.resolve(`src/store/index${extension}`), storeIndex);
+
+  spinner.succeed('🛠️ Zustand set up.');
+}
+
+module.exports = { setupZustand };

src/utils/prompts.js

@@ -9,7 +9,12 @@ async function askProjectDetails() {
       message: 'Choose a UI framework:',
       choices: ['Ant Design', 'Material UI', 'Chakra UI', 'Radix UI', 'None'],
     },
-    { type: 'confirm', name: 'useRedux', message: 'Use Redux?' },
+    {
+      type: 'list',
+      name: 'stateLibrary',
+      message: 'Choose state management library:',
+      choices: ['Redux Toolkit', 'Zustand', 'None'],
+    },
 
     { type: 'confirm', name: 'useModuleFederation', message: 'Use Module Federation Plugin?' },
     { type: 'list', name: 'language', message: 'Choose language:', choices: ['JavaScript', 'TypeScript'] },