-
- {currentStep.id === story.firstStepId ? (
-
Dies ist deine Titelfolie.
- ) : !currentStep?.feature ? (
-
Klicke auf die Karte um deinen Marker hinzuzufügen
- ) : (
-
- Verschiebe den roten Marker um dessen Position zu ändern
-
- )}
+
+
diff --git a/src/lib/store/CombinedState.ts b/src/lib/store/CombinedState.ts
new file mode 100644
index 00000000..3b5ad14c
--- /dev/null
+++ b/src/lib/store/CombinedState.ts
@@ -0,0 +1,5 @@
+import { UIState } from './ui'
+import { TutorialState } from './tutorial'
+import { StoryState } from './story'
+
+export type CombinedState = UIState & TutorialState & StoryState
diff --git a/src/lib/store/store.ts b/src/lib/store/store.ts
index ce31c32e..87ef78ac 100644
--- a/src/lib/store/store.ts
+++ b/src/lib/store/store.ts
@@ -1,13 +1,16 @@
import { create } from 'zustand'
-import { StoryState, useStoryStore } from './story'
-import { UIState, useUIStore } from './ui'
+import { useStoryStore } from './story'
+import { useUIStore } from './ui'
import { persist } from 'zustand/middleware'
+import { useTutorialStore } from './tutorial'
+import { CombinedState } from './CombinedState'
export const useBoundStore = create(
- persist
(
+ persist(
(set, get, api) => ({
...useStoryStore(set, get, api),
...useUIStore(set, get, api),
+ ...useTutorialStore(set, get, api),
}),
{
name: 'bound-store',
diff --git a/src/lib/store/story.ts b/src/lib/store/story.ts
index 497b36ce..9907d549 100644
--- a/src/lib/store/story.ts
+++ b/src/lib/store/story.ts
@@ -1,5 +1,5 @@
import { StateCreator } from 'zustand'
-import { UIState } from './ui'
+import { CombinedState } from './CombinedState'
export interface StoryState {
storyID: string
@@ -13,7 +13,7 @@ export interface StoryState {
}
export const useStoryStore: StateCreator<
- StoryState & UIState,
+ CombinedState,
[],
[],
StoryState
diff --git a/src/lib/store/tutorial.ts b/src/lib/store/tutorial.ts
new file mode 100644
index 00000000..85fda1c4
--- /dev/null
+++ b/src/lib/store/tutorial.ts
@@ -0,0 +1,26 @@
+import { StateCreator } from 'zustand'
+import { UIState } from './ui'
+import { StoryState } from './story'
+
+export interface TutorialState {
+ titleslide: boolean
+ noMarkerOnSlide: boolean
+ dragMarker: boolean
+ setTitleSlide: (titleslide: boolean) => void
+ setNoMarkerOnSlide: (noMarkerOnSlide: boolean) => void
+ setDragMarker: (dragMarker: boolean) => void
+}
+
+export const useTutorialStore: StateCreator<
+ StoryState & UIState & TutorialState,
+ [],
+ [],
+ TutorialState
+> = set => ({
+ titleslide: true,
+ setTitleSlide: (titleslide: boolean) => set({ titleslide }),
+ noMarkerOnSlide: true,
+ setNoMarkerOnSlide: (noMarkerOnSlide: boolean) => set({ noMarkerOnSlide }),
+ dragMarker: true,
+ setDragMarker: (dragMarker: boolean) => set({ dragMarker }),
+})
diff --git a/src/lib/store/ui.ts b/src/lib/store/ui.ts
index 9c39e548..ad3734af 100644
--- a/src/lib/store/ui.ts
+++ b/src/lib/store/ui.ts
@@ -1,5 +1,5 @@
import { StateCreator } from 'zustand'
-import { StoryState } from './story'
+import { CombinedState } from './CombinedState'
export interface UIState {
language: string
@@ -7,7 +7,7 @@ export interface UIState {
}
export const useUIStore: StateCreator<
- StoryState & UIState,
+ CombinedState,
[],
[],
UIState