Merge branch 'master' into UGN-353-v2

# Conflicts:
#	package-lock.json

Author: masiulis

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "react-spreadsheet-import",
-  "version": "3.0.0",
+  "version": "3.0.1",
   "description": "React spreadsheet import for xlsx and csv files with column matching and validation",
   "main": "./dist-commonjs/index.js",
   "module": "./dist/index.js",

package.json

@@ -0,0 +1,25 @@
+import { useMemo } from "react"
+import { StepType } from "../steps/UploadFlow"
+
+export const useRsiInitialStep = (initialStep?: StepType) => {
+  const steps = ["uploadStep", "selectHeaderStep", "matchColumnsStep", "validationStep"] as const
+
+  const initialStepNumber = useMemo(() => {
+    switch (initialStep) {
+      case StepType.upload:
+        return 0
+      case StepType.selectSheet:
+        return 0
+      case StepType.selectHeader:
+        return 1
+      case StepType.matchColumns:
+        return 2
+      case StepType.validateData:
+        return 3
+      default:
+        return 0
+    }
+  }, [initialStep])
+
+  return { steps, initialStep: initialStepNumber }
+}

src/hooks/useRsiInitialStep.ts

@@ -3,15 +3,17 @@ import { ModalHeader } from "@chakra-ui/react"
 import { useSteps, Step, Steps as Stepper } from "chakra-ui-steps"
 import { CgCheck } from "react-icons/cg"
 import { useRsi } from "../hooks/useRsi"
+import { useRsiInitialStep } from "../hooks/useRsiInitialStep"
 
 const CheckIcon = ({ color }: { color: string }) => <CgCheck size="2.25rem" color={color} />
 
-const steps = ["uploadStep", "selectHeaderStep", "matchColumnsStep", "validationStep"] as const
-
 export const Steps = () => {
-  const { translations } = useRsi()
+  const { initialStepState, translations } = useRsi()
+
+  const { steps, initialStep } = useRsiInitialStep(initialStepState?.type)
+
   const { nextStep, activeStep } = useSteps({
-    initialStep: 0,
+    initialStep,
   })
 
   return (