From c01a191f3a4b8119b8b1bab4bbd205e3d449f698 Mon Sep 17 00:00:00 2001
From: Brian McGee <brian@bmcgee.ie>
Date: Wed, 20 Aug 2025 11:02:38 +0100
Subject: [PATCH 1/2] feat(ui): history stack for stepper

---
 pkgs/clan-app/ui/src/hooks/stepper.tsx | 30 +++++++++++++++-----------
 1 file changed, 17 insertions(+), 13 deletions(-)

diff --git a/pkgs/clan-app/ui/src/hooks/stepper.tsx b/pkgs/clan-app/ui/src/hooks/stepper.tsx
index 14740adb0..09d420c93 100644
--- a/pkgs/clan-app/ui/src/hooks/stepper.tsx
+++ b/pkgs/clan-app/ui/src/hooks/stepper.tsx
@@ -28,9 +28,13 @@ export function createStepper<
   s: { steps: T },
   stepOpts: StepOptions<StepId, StoreType>,
 ): StepperReturn<T, T[number]["id"]> {
-  const [activeStep, setActiveStep] = createSignal<T[number]["id"]>(
-    stepOpts.initialStep,
-  );
+  const [history, setHistory] = createSignal<T[number]["id"][]>(["init"]);
+
+  const activeStep = () => history()[history().length - 1];
+
+  const setActiveStep = (id: T[number]["id"]) => {
+    setHistory((prev) => [...prev, id]);
+  };
 
   const store: StoreTuple<StoreType> = createStore<StoreType>(
     stepOpts.initialStoreData ?? ({} as StoreType),
@@ -66,19 +70,19 @@ export function createStepper<
       setActiveStep(s.steps[currentIndex + 1].id);
     },
     previous: () => {
-      const currentIndex = s.steps.findIndex(
-        (step) => step.id === activeStep(),
-      );
-      if (currentIndex <= 0) {
+      const hist = history();
+      if (hist.length <= 1) {
         throw new Error("No previous step available");
       }
-      setActiveStep(s.steps[currentIndex - 1].id);
+
+      setHistory((prev) => {
+        const update = prev.slice(0, -1);
+        setActiveStep(update[update.length - 1]);
+        return update;
+      });
     },
     hasPrevious: () => {
-      const currentIndex = s.steps.findIndex(
-        (step) => step.id === activeStep(),
-      );
-      return currentIndex > 0;
+      return history().length > 1;
     },
     hasNext: () => {
       const currentIndex = s.steps.findIndex(
@@ -96,7 +100,7 @@ export interface StepperReturn<
 > {
   _store: never;
   activeStep: Accessor<StepId>;
-  setActiveStep: Setter<StepId>;
+  setActiveStep: (id: StepId) => void;
   currentStep: () => T[number];
   next: () => void;
   previous: () => void;

From 6de431df2cdb9ebd3c342a7beb86f9b4113a2625 Mon Sep 17 00:00:00 2001
From: Johannes Kirschbauer <hsjobeki@gmail.com>
Date: Thu, 21 Aug 2025 18:12:06 +0200
Subject: [PATCH 2/2] ui/stepper: use initial step from opts

---
 pkgs/clan-app/ui/src/hooks/stepper.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/pkgs/clan-app/ui/src/hooks/stepper.tsx b/pkgs/clan-app/ui/src/hooks/stepper.tsx
index 09d420c93..ac6cb489e 100644
--- a/pkgs/clan-app/ui/src/hooks/stepper.tsx
+++ b/pkgs/clan-app/ui/src/hooks/stepper.tsx
@@ -3,7 +3,6 @@ import {
   createContext,
   createSignal,
   JSX,
-  Setter,
   useContext,
 } from "solid-js";
 import { createStore, SetStoreFunction, Store } from "solid-js/store";
@@ -28,7 +27,9 @@ export function createStepper<
   s: { steps: T },
   stepOpts: StepOptions<StepId, StoreType>,
 ): StepperReturn<T, T[number]["id"]> {
-  const [history, setHistory] = createSignal<T[number]["id"][]>(["init"]);
+  const [history, setHistory] = createSignal<T[number]["id"][]>([
+    stepOpts.initialStep,
+  ]);
 
   const activeStep = () => history()[history().length - 1];