refactored get started flow & code

src/hooks/useDeploymentConfig.js

@@ -0,0 +1,103 @@
+import { useState, useCallback } from 'react';
+
+/**
+ * Custom hook for managing deployment configuration state
+ * @param {Object} initialConfig - Initial deployment configuration
+ * @returns {Object} - Deployment configuration state and updater functions
+ */
+const useDeploymentConfig = (initialConfig = {}) => {
+  const [config, setConfig] = useState({
+    type: 'app',
+    appType: 'wordpress',
+    sampleWebAppType: 'developer',
+    sourceType: 'public',
+    repoUrl: '',
+    deploymentKey: '',
+    fileName: '',
+    ...initialConfig
+  });
+
+  // Extract values for easier access
+  const {
+    type,
+    appType,
+    sampleWebAppType,
+    sourceType,
+    repoUrl,
+    deploymentKey,
+    fileName
+  } = config;
+
+  // Update a single field
+  const updateField = useCallback((field, value) => {
+    setConfig(prev => ({
+      ...prev,
+      [field]: value
+    }));
+  }, []);
+
+  // Handler for deployment type change
+  const handleDeploymentTypeChange = useCallback((e) => {
+    updateField('type', e.target.value);
+  }, [updateField]);
+
+  // Handler for app type change
+  const handleAppTypeChange = useCallback((e) => {
+    updateField('appType', e.target.value);
+  }, [updateField]);
+
+  // Handler for sample web app type change
+  const handleSampleWebAppTypeChange = useCallback((e) => {
+    updateField('sampleWebAppType', e.target.value);
+  }, [updateField]);
+
+  // Handler for source type change
+  const handleSourceTypeChange = useCallback((e) => {
+    updateField('sourceType', e.target.value);
+  }, [updateField]);
+
+  // Handler for repo URL change
+  const handleRepoUrlChange = useCallback((e) => {
+    updateField('repoUrl', e.target.value);
+  }, [updateField]);
+
+  // Handler for deployment key change
+  const handleDeploymentKeyChange = useCallback((e) => {
+    updateField('deploymentKey', e.target.value);
+  }, [updateField]);
+
+  // Handler for file change
+  const handleFileChange = useCallback((e) => {
+    if (e.target.files.length > 0) {
+      updateField('fileName', e.target.files[0].name);
+    } else {
+      updateField('fileName', '');
+    }
+  }, [updateField]);
+
+  return {
+    // State values
+    config,
+    type,
+    appType,
+    sampleWebAppType,
+    sourceType,
+    repoUrl,
+    deploymentKey,
+    fileName,
+
+    // Update functions
+    updateField,
+
+    // Event handlers
+    handleDeploymentTypeChange,
+    handleAppTypeChange,
+    handleSampleWebAppTypeChange,
+    handleSourceTypeChange,
+    handleRepoUrlChange,
+    handleDeploymentKeyChange,
+    handleFileChange
+  };
+};
+
+export default useDeploymentConfig;