refactor(onboarding): replace 50-prop drilling with OnboardingContext
OnboardingStepPanel previously forwarded ~50 props to seven step components, so adding a single wizard field meant touching four layers. Introduce a renderer-local React Context (OnboardingProvider / useOnboarding) that carries all wizard state and actions (connectors, node status, company inputs, model selection, execution mode, mission, launch summary, locale, t, error/loading). Step panels now receive only their navigation callbacks (onContinue / onBack / onLaunch / onFinish) and read everything else via useOnboarding(). CompanyOnboarding wraps the step panel tree in OnboardingProvider with a memoised value. Business logic is unchanged: each onContinueFrom* transition, the bootstrap call, and the welcome-step branch remain exactly as before; this refactor only moves the data-passing mechanism.
This commit is contained in:
1 parent
f3816c6115
commit
de77f5f38e
10 files changed
+256
-333
No files matched your search
@@ -1,23 +1,16 @@
|
||||
import { motion } from "framer-motion";
|
||||
import { ArrowRight, Brain, UserCircle, type Icon } from "@phosphor-icons/react";
|
||||
import type { ExecutionMode } from "@shared/types";
|
||||
import { getStepNumber, TOTAL_STEPS } from "./OnboardingHero";
|
||||
import { useOnboarding } from "./OnboardingContext";
|
||||
|
||||
interface ExecutionModeStepProps {
|
||||
executionMode: ExecutionMode;
|
||||
setExecutionMode: (mode: ExecutionMode) => void;
|
||||
onContinue: () => void;
|
||||
onBack: () => void;
|
||||
t: (key: string) => string;
|
||||
}
|
||||
|
||||
export function ExecutionModeStep({
|
||||
executionMode,
|
||||
setExecutionMode,
|
||||
onContinue,
|
||||
onBack,
|
||||
t,
|
||||
}: ExecutionModeStepProps) {
|
||||
export function ExecutionModeStep({ onContinue, onBack }: ExecutionModeStepProps) {
|
||||
const { executionMode, setExecutionMode, t } = useOnboarding();
|
||||
|
||||
return (
|
||||
<motion.div
|
||||
key="executionmode"
|
||||
|
||||
Reference in new issue
Block a user