@hed-hog/lms 0.0.306 → 0.0.310

package/hedhog/frontend/app/courses/[id]/structure/_components/store.ts.ejs

@@ -0,0 +1,948 @@
+/**
+ * Course Structure — Zustand Store
+ *
+ * Responsibility split:
+ *
+ *  ┌───────────────────────────────────────────────────────────────────┐
+ *  │  DATA FIELDS (course / sessions / lessons)                       │
+ *  │  Currently seeded from mock-data.ts.                             │
+ *  │                                                                  │
+ *  │  TODO[API]: Once `useCourseStructure` switches to React Query,   │
+ *  │  remove these three fields from the store and derive them from   │
+ *  │  the query cache instead. The store then becomes UI-only.        │
+ *  ├───────────────────────────────────────────────────────────────────┤
+ *  │  UI-ONLY FIELDS (keep forever)                                   │
+ *  │  • activeItemId / activeItemType   — detail panel selection      │
+ *  │  • expandedIds                     — tree accordion state        │
+ *  │  • filterQuery                     — search bar value            │
+ *  │  • selectedIds / lastClickedId     — multi-select                │
+ *  │  • copiedIds / copiedType          — clipboard                   │
+ *  │  • inlineRenamingId                — inline edit                 │
+ *  │  • mobileSheetOpen                 — mobile sheet                │
+ *  │  • confirmDialog / sessionPickerDialog — dialog state            │
+ *  └───────────────────────────────────────────────────────────────────┘
+ */
+import { create } from 'zustand';
+
+import type {
+  Course,
+  CourseFormValues,
+  FlatItem,
+  Lesson,
+  LessonFormValues,
+  Session,
+  SessionFormValues,
+} from './types';
+
+// ─────────────────────────────────────────────────────────────────────────────
+// State interface
+// ─────────────────────────────────────────────────────────────────────────────
+
+interface StructureState {
+  // Data
+  courseId: string;
+  course: Course;
+  sessions: Session[];
+  lessons: Lesson[];
+
+  // Active detail
+  activeItemId: string | null;
+  activeItemType: 'course' | 'session' | 'lesson' | null;
+
+  // Tree UI
+  expandedIds: Set<string>;
+  filterQuery: string;
+
+  // Multi-select
+  selectedIds: Set<string>;
+  lastClickedId: string | null;
+
+  // Clipboard (mock)
+  copiedIds: string[];
+  copiedType: 'session' | 'lesson' | null;
+
+  // Inline rename
+  inlineRenamingId: string | null;
+
+  // Mobile
+  mobileSheetOpen: boolean;
+
+  // Confirm dialog state
+  confirmDialog: {
+    open: boolean;
+    title: string;
+    description: string;
+    onConfirm: (() => void) | null;
+  };
+
+  // Session picker dialog state
+  sessionPickerDialog: {
+    open: boolean;
+    title: string;
+    excludeSessionId: string | null;
+    onPick: ((sessionId: string) => void) | null;
+  };
+
+  // ── Selection ──────────────────────────────────────────────────────────────
+  selectItem: (
+    id: string,
+    type: 'course' | 'session' | 'lesson',
+    modifiers?: { ctrl?: boolean; shift?: boolean },
+    visibleItems?: FlatItem[]
+  ) => void;
+  clearSelection: () => void;
+
+  // ── Clipboard ──────────────────────────────────────────────────────────────
+  copyItems: (ids: string[], type: 'session' | 'lesson') => void;
+  clearClipboard: () => void;
+
+  // ── Expand / collapse ──────────────────────────────────────────────────────
+  toggleExpand: (sessionId: string) => void;
+  expandAll: () => void;
+  collapseAll: () => void;
+
+  // ── Filter ─────────────────────────────────────────────────────────────────
+  setFilter: (query: string) => void;
+
+  // ── Mobile ─────────────────────────────────────────────────────────────────
+  setMobileSheetOpen: (open: boolean) => void;
+
+  // ── CRUD: Course ───────────────────────────────────────────────────────────
+  updateCourse: (data: CourseFormValues) => void;
+
+  // ── CRUD: Session ──────────────────────────────────────────────────────────
+  addSession: () => Session;
+  updateSession: (id: string, data: SessionFormValues) => void;
+  deleteSession: (id: string) => void;
+
+  // ── CRUD: Lesson ───────────────────────────────────────────────────────────
+  addLesson: (sessionId: string) => Lesson;
+  updateLesson: (
+    id: string,
+    data: Partial<
+      LessonFormValues & {
+        transcription?: string;
+        resources?: Lesson['resources'];
+      }
+    >
+  ) => void;
+  deleteLesson: (id: string) => void;
+
+  // ── Bulk delete ────────────────────────────────────────────────────────────
+  deleteSelected: () => void;
+
+  // ── Inline rename ──────────────────────────────────────────────────────────
+  startRename: (id: string) => void;
+  commitRename: (id: string, newTitle: string) => void;
+  cancelRename: () => void;
+  renameItem: (id: string, newTitle: string) => void;
+
+  // ── Duplicate ──────────────────────────────────────────────────────────────
+  duplicateSession: (id: string) => void;
+  duplicateLesson: (id: string) => void;
+  duplicateSelected: () => void;
+
+  // ── Paste ──────────────────────────────────────────────────────────────────
+  pasteSessions: () => void;
+  pasteLessons: (toSessionId: string) => void;
+
+  // ── Move multiple ──────────────────────────────────────────────────────────
+  moveLessons: (lessonIds: string[], toSessionId: string) => void;
+
+  // ── DnD reorder ────────────────────────────────────────────────────────────
+  reorderSessions: (fromIndex: number, toIndex: number) => void;
+  moveLesson: (lessonId: string, toSessionId: string, toIndex: number) => void;
+
+  // ── API integration ────────────────────────────────────────────────────────
+  /** Set the active course ID (called by page.tsx on mount). */
+  setCourseId: (id: string) => void;
+  /** Set the course metadata received from the API. */
+  setCourse: (course: Course) => void;
+  /** Replace sessions+lessons in the store with data received from the API. */
+  setStructureFromApi: (data: {
+    course?: Course | null;
+    sessions: Session[];
+    lessons: Lesson[];
+  }) => void;
+  /** Append a newly-created session (from API response) and select it. */
+  addSessionFromApi: (session: Session) => void;
+  /** Append a newly-created lesson (from API response) and select it. */
+  addLessonFromApi: (lesson: Lesson) => void;
+  /**
+   * Append a batch of lessons (from API duplicate/paste response).
+   * Selects the last lesson in the batch and expands its session.
+   */
+  addLessonsFromApi: (lessons: Lesson[]) => void;
+  /**
+   * Append a session + its cloned lessons (from duplicateSession API response).
+   * Selects the new session.
+   */
+  addSessionWithLessonsFromApi: (session: Session, lessons: Lesson[]) => void;
+
+  // ── Confirm dialog ─────────────────────────────────────────────────────────
+  showConfirm: (opts: {
+    title: string;
+    description: string;
+    onConfirm: () => void;
+  }) => void;
+  closeConfirm: () => void;
+
+  // ── Session picker dialog ──────────────────────────────────────────────────
+  showSessionPicker: (opts: {
+    title: string;
+    excludeSessionId?: string | null;
+    onPick: (sessionId: string) => void;
+  }) => void;
+  closeSessionPicker: () => void;
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Helpers
+// ─────────────────────────────────────────────────────────────────────────────
+
+function getNextCode(items: Array<{ code: string }>, prefix: string): string {
+  const regex = new RegExp(`^${prefix}(\\d+)$`, 'i');
+  const max = items.reduce((m, item) => {
+    const match = item.code?.trim().match(regex);
+    if (!match) return m;
+    const n = Number(match[1]);
+    return Number.isFinite(n) ? Math.max(m, n) : m;
+  }, 0);
+  return `${prefix}${String(max + 1).padStart(2, '0')}`;
+}
+
+function newId(): string {
+  if (
+    typeof crypto !== 'undefined' &&
+    typeof crypto.randomUUID === 'function'
+  ) {
+    return crypto.randomUUID();
+  }
+  return `${Date.now()}-${Math.random().toString(36).slice(2)}`;
+}
+
+function getExpandedIdsStorageKey(courseId: string): string {
+  return `lms:course-structure:${courseId}:expanded-ids`;
+}
+
+function loadExpandedIds(courseId: string): Set<string> {
+  if (typeof window === 'undefined' || !courseId) return new Set();
+  try {
+    const saved = JSON.parse(
+      localStorage.getItem(getExpandedIdsStorageKey(courseId)) ?? '[]'
+    );
+    if (!Array.isArray(saved)) return new Set();
+    return new Set(saved.filter((id): id is string => typeof id === 'string'));
+  } catch {
+    return new Set();
+  }
+}
+
+function saveExpandedIds(courseId: string, expandedIds: Set<string>): void {
+  if (typeof window === 'undefined' || !courseId) return;
+  try {
+    localStorage.setItem(
+      getExpandedIdsStorageKey(courseId),
+      JSON.stringify([...expandedIds])
+    );
+  } catch {
+    // Ignore storage quota/privacy errors.
+  }
+}
+
+// ─────────────────────────────────────────────────────────────────────────────
+// Store
+// ─────────────────────────────────────────────────────────────────────────────
+
+export const useStructureStore = create<StructureState>((set, get) => ({
+  courseId: '',
+  course: {
+    id: '',
+    name: '',
+    title: 'Carregando...',
+    description: '',
+    slug: '',
+    published: false,
+  },
+  sessions: [],
+  lessons: [],
+
+  activeItemId: null,
+  activeItemType: null,
+  expandedIds: new Set<string>(),
+  filterQuery: '',
+  selectedIds: new Set<string>(),
+  lastClickedId: null as string | null,
+  copiedIds: [] as string[],
+  copiedType: null as 'session' | 'lesson' | null,
+  inlineRenamingId: null as string | null,
+  mobileSheetOpen: false,
+  confirmDialog: {
+    open: false,
+    title: '',
+    description: '',
+    onConfirm: null as (() => void) | null,
+  },
+  sessionPickerDialog: {
+    open: false,
+    title: '',
+    excludeSessionId: null as string | null,
+    onPick: null as ((sessionId: string) => void) | null,
+  },
+
+  selectItem: (id, type, modifiers = {}, visibleItems = []) =>
+    set((s) => {
+      // SHIFT: extend range based on visible order
+      if (modifiers.shift && s.lastClickedId && visibleItems.length > 0) {
+        const lastIdx = visibleItems.findIndex((i) => i.id === s.lastClickedId);
+        const currIdx = visibleItems.findIndex((i) => i.id === id);
+        if (lastIdx !== -1 && currIdx !== -1) {
+          const [from, to] =
+            lastIdx <= currIdx ? [lastIdx, currIdx] : [currIdx, lastIdx];
+          const next = new Set(s.selectedIds);
+          for (let i = from; i <= to; i++) {
+            const node = visibleItems[i];
+            if (node) next.add(`${node.type}:${node.id}`);
+          }
+          return { selectedIds: next, activeItemId: id, activeItemType: type };
+        }
+      }
+      // CTRL/CMD: toggle individual item
+      if (modifiers.ctrl) {
+        const key = `${type}:${id}`;
+        const next = new Set(s.selectedIds);
+        if (next.has(key)) next.delete(key);
+        else next.add(key);
+        return {
+          selectedIds: next,
+          activeItemId: id,
+          activeItemType: type,
+          lastClickedId: id,
+        };
+      }
+      // Plain click: single selection
+      return {
+        selectedIds: new Set([`${type}:${id}`]),
+        activeItemId: id,
+        activeItemType: type,
+        lastClickedId: id,
+      };
+    }),
+
+  clearSelection: () =>
+    set((s) => ({
+      selectedIds: new Set(
+        s.activeItemId && s.activeItemType
+          ? [`${s.activeItemType}:${s.activeItemId}`]
+          : []
+      ),
+    })),
+
+  copyItems: (ids, type) => set({ copiedIds: ids, copiedType: type }),
+  clearClipboard: () => set({ copiedIds: [], copiedType: null }),
+
+  toggleExpand: (sessionId) =>
+    set((s) => {
+      const next = new Set(s.expandedIds);
+      if (next.has(sessionId)) next.delete(sessionId);
+      else next.add(sessionId);
+      saveExpandedIds(s.courseId, next);
+      return { expandedIds: next };
+    }),
+
+  expandAll: () =>
+    set((s) => {
+      const next = new Set(s.sessions.map((ss) => ss.id));
+      saveExpandedIds(s.courseId, next);
+      return { expandedIds: next };
+    }),
+
+  collapseAll: () =>
+    set((s) => {
+      const next = new Set<string>();
+      saveExpandedIds(s.courseId, next);
+      return { expandedIds: next };
+    }),
+
+  setFilter: (query) => set({ filterQuery: query }),
+
+  setMobileSheetOpen: (open) => set({ mobileSheetOpen: open }),
+
+  updateCourse: (data) => set((s) => ({ course: { ...s.course, ...data } })),
+
+  addSession: () => {
+    const { sessions } = get();
+    const code = getNextCode(sessions, 'S');
+    const newSession: Session = {
+      id: newId(),
+      code,
+      title: `Nova Sessão ${code}`,
+      duration: 30,
+      order: sessions.length,
+    };
+    set((s) => {
+      const nextExpandedIds = new Set([...s.expandedIds, newSession.id]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        sessions: [...s.sessions, newSession],
+        expandedIds: nextExpandedIds,
+        activeItemId: newSession.id,
+        activeItemType: 'session',
+        selectedIds: new Set([`session:${newSession.id}`]),
+        lastClickedId: newSession.id,
+      };
+    });
+    return newSession;
+  },
+
+  updateSession: (id, data) =>
+    set((s) => ({
+      sessions: s.sessions.map((ss) =>
+        ss.id === id ? { ...ss, ...data } : ss
+      ),
+    })),
+
+  deleteSession: (id) =>
+    set((s) => {
+      const nextExpandedIds = new Set(s.expandedIds);
+      nextExpandedIds.delete(id);
+      const isActive = s.activeItemId === id && s.activeItemType === 'session';
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        sessions: s.sessions.filter((ss) => ss.id !== id),
+        lessons: s.lessons.filter((l) => l.sessionId !== id),
+        expandedIds: nextExpandedIds,
+        selectedIds: new Set([`course:${s.course.id}`]),
+        activeItemId: isActive ? s.course.id : s.activeItemId,
+        activeItemType: isActive ? 'course' : s.activeItemType,
+      };
+    }),
+
+  addLesson: (sessionId) => {
+    const { lessons } = get();
+    const sessionLessons = lessons.filter((l) => l.sessionId === sessionId);
+    const code = getNextCode(lessons, 'A');
+    const newLesson: Lesson = {
+      id: newId(),
+      code,
+      title: `Nova Aula ${code}`,
+      publicDescription: '',
+      privateDescription: '',
+      type: 'video',
+      duration: 10,
+      sessionId,
+      order: sessionLessons.length,
+      resources: [],
+    };
+    set((s) => {
+      const nextExpandedIds = new Set([...s.expandedIds, sessionId]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        lessons: [...s.lessons, newLesson],
+        expandedIds: nextExpandedIds,
+        activeItemId: newLesson.id,
+        activeItemType: 'lesson',
+        selectedIds: new Set([`lesson:${newLesson.id}`]),
+        lastClickedId: newLesson.id,
+      };
+    });
+    return newLesson;
+  },
+
+  updateLesson: (id, data) =>
+    set((s) => ({
+      lessons: s.lessons.map((l) => (l.id === id ? { ...l, ...data } : l)),
+    })),
+
+  deleteLesson: (id) =>
+    set((s) => {
+      const isActive = s.activeItemId === id && s.activeItemType === 'lesson';
+      const nextSelected = new Set(s.selectedIds);
+      nextSelected.delete(`lesson:${id}`);
+      if (nextSelected.size === 0) nextSelected.add(`course:${s.course.id}`);
+      return {
+        lessons: s.lessons.filter((l) => l.id !== id),
+        selectedIds: nextSelected,
+        activeItemId: isActive ? s.course.id : s.activeItemId,
+        activeItemType: isActive ? 'course' : s.activeItemType,
+      };
+    }),
+
+  deleteSelected: () =>
+    set((s) => {
+      const sessionIds = new Set(
+        s.sessions.filter((ss) => s.selectedIds.has(ss.id)).map((ss) => ss.id)
+      );
+      const lessonIds = new Set(
+        s.lessons
+          .filter((l) => s.selectedIds.has(l.id) || sessionIds.has(l.sessionId))
+          .map((l) => l.id)
+      );
+      const nextExpandedIds = new Set(
+        [...s.expandedIds].filter((id) => !sessionIds.has(id))
+      );
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        sessions: s.sessions.filter((ss) => !sessionIds.has(ss.id)),
+        lessons: s.lessons.filter((l) => !lessonIds.has(l.id)),
+        selectedIds: new Set([`course:${s.course.id}`]),
+        activeItemId: s.course.id,
+        activeItemType: 'course' as const,
+        expandedIds: nextExpandedIds,
+      };
+    }),
+
+  startRename: (id) => set({ inlineRenamingId: id }),
+  cancelRename: () => set({ inlineRenamingId: null }),
+
+  renameItem: (id, newTitle) => {
+    const trimmed = newTitle.trim();
+    if (!trimmed) return;
+    set((s) => {
+      const isSession = s.sessions.some((ss) => ss.id === id);
+      if (isSession) {
+        return {
+          sessions: s.sessions.map((ss) =>
+            ss.id === id ? { ...ss, title: trimmed } : ss
+          ),
+        };
+      }
+      return {
+        lessons: s.lessons.map((l) =>
+          l.id === id ? { ...l, title: trimmed } : l
+        ),
+      };
+    });
+  },
+
+  commitRename: (id, newTitle) => {
+    get().renameItem(id, newTitle);
+    set({ inlineRenamingId: null });
+  },
+
+  duplicateSession: (id) => {
+    const { sessions, lessons } = get();
+    const session = sessions.find((ss) => ss.id === id);
+    if (!session) return;
+
+    const newSessionId = newId();
+    const newSession: Session = {
+      ...session,
+      id: newSessionId,
+      title: `Cópia de ${session.title}`,
+      order: sessions.length,
+    };
+
+    const sessionLessons = lessons
+      .filter((l) => l.sessionId === id)
+      .sort((a, b) => a.order - b.order);
+
+    const newLessons: Lesson[] = sessionLessons.map((l) => ({
+      ...l,
+      id: newId(),
+      sessionId: newSessionId,
+    }));
+
+    set((s) => {
+      const nextExpandedIds = new Set([...s.expandedIds, newSessionId]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        sessions: [...s.sessions, newSession],
+        lessons: [...s.lessons, ...newLessons],
+        activeItemId: newSessionId,
+        activeItemType: 'session',
+        selectedIds: new Set([`session:${newSessionId}`]),
+        expandedIds: nextExpandedIds,
+      };
+    });
+  },
+
+  duplicateLesson: (id) => {
+    const { lessons } = get();
+    const lesson = lessons.find((l) => l.id === id);
+    if (!lesson) return;
+
+    const sessionLessons = lessons
+      .filter((l) => l.sessionId === lesson.sessionId)
+      .sort((a, b) => a.order - b.order);
+
+    const insertAt = lesson.order + 1;
+    const newLesson: Lesson = {
+      ...lesson,
+      id: newId(),
+      title: `Cópia de ${lesson.title}`,
+      order: insertAt,
+      resources: [...lesson.resources],
+    };
+
+    // Shift all lessons at or after insertAt
+    const updatedSession = sessionLessons.map((l) =>
+      l.order >= insertAt ? { ...l, order: l.order + 1 } : l
+    );
+
+    const unchanged = lessons.filter((l) => l.sessionId !== lesson.sessionId);
+
+    set((s) => {
+      const nextExpandedIds = new Set([...s.expandedIds, lesson.sessionId]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        lessons: [...unchanged, ...updatedSession, newLesson],
+        activeItemId: newLesson.id,
+        activeItemType: 'lesson',
+        selectedIds: new Set([`lesson:${newLesson.id}`]),
+        expandedIds: nextExpandedIds,
+      };
+    });
+  },
+
+  duplicateSelected: () => {
+    const { selectedIds, sessions, lessons, activeItemType } = get();
+    const selectedSessionIds = sessions
+      .filter((ss) => selectedIds.has(ss.id))
+      .map((ss) => ss.id);
+    const selectedLessonIds = lessons
+      .filter((l) => selectedIds.has(l.id))
+      .map((l) => l.id);
+
+    if (selectedSessionIds.length > 0) {
+      // Duplicate each selected session
+      for (const id of selectedSessionIds) {
+        get().duplicateSession(id);
+      }
+    } else if (selectedLessonIds.length > 0) {
+      for (const id of selectedLessonIds) {
+        get().duplicateLesson(id);
+      }
+    } else if (activeItemType === 'session' && get().activeItemId) {
+      get().duplicateSession(get().activeItemId!);
+    } else if (activeItemType === 'lesson' && get().activeItemId) {
+      get().duplicateLesson(get().activeItemId!);
+    }
+  },
+
+  pasteSessions: () => {
+    const { copiedIds, sessions, lessons } = get();
+    if (!copiedIds.length) return;
+
+    const newSessions: Session[] = [];
+    const newLessons: Lesson[] = [];
+    let nextOrder = sessions.length;
+
+    for (const copiedId of copiedIds) {
+      const session = sessions.find((ss) => ss.id === copiedId);
+      if (!session) continue;
+
+      const newSessionId = newId();
+      newSessions.push({
+        ...session,
+        id: newSessionId,
+        title: `Cópia de ${session.title}`,
+        order: nextOrder++,
+      });
+
+      const sessionLessons = lessons
+        .filter((l) => l.sessionId === copiedId)
+        .sort((a, b) => a.order - b.order);
+
+      for (const l of sessionLessons) {
+        newLessons.push({
+          ...l,
+          id: newId(),
+          sessionId: newSessionId,
+        });
+      }
+    }
+
+    if (!newSessions.length) return;
+    const lastNew = newSessions[newSessions.length - 1];
+
+    set((s) => {
+      const nextExpandedIds = new Set([
+        ...s.expandedIds,
+        ...newSessions.map((ss) => ss.id),
+      ]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        sessions: [...s.sessions, ...newSessions],
+        lessons: [...s.lessons, ...newLessons],
+        activeItemId: lastNew!.id,
+        activeItemType: 'session',
+        selectedIds: new Set(newSessions.map((ss) => `session:${ss.id}`)),
+        expandedIds: nextExpandedIds,
+      };
+    });
+  },
+
+  pasteLessons: (toSessionId) => {
+    const { copiedIds, lessons } = get();
+    if (!copiedIds.length) return;
+
+    const destLessons = lessons
+      .filter((l) => l.sessionId === toSessionId)
+      .sort((a, b) => a.order - b.order);
+    let nextOrder = destLessons.length;
+
+    const newLessons: Lesson[] = [];
+
+    for (const copiedId of copiedIds) {
+      const lesson = lessons.find((l) => l.id === copiedId);
+      if (!lesson) continue;
+      newLessons.push({
+        ...lesson,
+        id: newId(),
+        sessionId: toSessionId,
+        title: `Cópia de ${lesson.title}`,
+        order: nextOrder++,
+        resources: [...lesson.resources],
+      });
+    }
+
+    if (!newLessons.length) return;
+    const lastNew = newLessons[newLessons.length - 1];
+
+    set((s) => {
+      const nextExpandedIds = new Set([...s.expandedIds, toSessionId]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        lessons: [...s.lessons, ...newLessons],
+        activeItemId: lastNew!.id,
+        activeItemType: 'lesson',
+        selectedIds: new Set(newLessons.map((l) => `lesson:${l.id}`)),
+        expandedIds: nextExpandedIds,
+      };
+    });
+  },
+
+  moveLessons: (lessonIds, toSessionId) =>
+    set((s) => {
+      const moving = s.lessons
+        .filter((l) => lessonIds.includes(l.id))
+        .sort((a, b) => a.order - b.order);
+      if (!moving.length) return {};
+
+      const fromSessionIds = new Set(moving.map((l) => l.sessionId));
+
+      // Lessons not being moved
+      const staying = s.lessons.filter((l) => !lessonIds.includes(l.id));
+
+      // Reindex source sessions (skip toSessionId — handled with dest)
+      const reindexedSource: Lesson[] = [];
+      for (const fromId of fromSessionIds) {
+        if (fromId === toSessionId) continue;
+        const srcLessons = staying
+          .filter((l) => l.sessionId === fromId)
+          .sort((a, b) => a.order - b.order)
+          .map((l, i) => ({ ...l, order: i }));
+        reindexedSource.push(...srcLessons);
+      }
+
+      // Current dest lessons (not being moved)
+      const destExisting = staying
+        .filter((l) => l.sessionId === toSessionId)
+        .sort((a, b) => a.order - b.order);
+
+      const movedToNewSession: Lesson[] = moving.map((l, i) => ({
+        ...l,
+        sessionId: toSessionId,
+        order: destExisting.length + i,
+      }));
+
+      // Unchanged lessons (not in any affected session)
+      const unchanged = staying.filter(
+        (l) => !fromSessionIds.has(l.sessionId) && l.sessionId !== toSessionId
+      );
+
+      const nextExpandedIds = new Set([...s.expandedIds, toSessionId]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+
+      return {
+        lessons: [
+          ...unchanged,
+          ...reindexedSource,
+          ...destExisting,
+          ...movedToNewSession,
+        ],
+        expandedIds: nextExpandedIds,
+        selectedIds: new Set(movedToNewSession.map((l) => `lesson:${l.id}`)),
+        activeItemId:
+          movedToNewSession[movedToNewSession.length - 1]?.id ?? s.activeItemId,
+        activeItemType: 'lesson',
+      };
+    }),
+
+  reorderSessions: (fromIndex, toIndex) =>
+    set((s) => {
+      const sorted = [...s.sessions].sort((a, b) => a.order - b.order);
+      const [moved] = sorted.splice(fromIndex, 1);
+      if (!moved) return {};
+      sorted.splice(toIndex, 0, moved);
+      const reindexed = sorted.map((ss, i) => ({ ...ss, order: i }));
+      return { sessions: reindexed };
+    }),
+
+  moveLesson: (lessonId, toSessionId, toIndex) =>
+    set((s) => {
+      const lesson = s.lessons.find((l) => l.id === lessonId);
+      if (!lesson) return {};
+
+      const fromSessionId = lesson.sessionId;
+      const sameSession = fromSessionId === toSessionId;
+
+      const destLessons = s.lessons
+        .filter((l) => l.sessionId === toSessionId && l.id !== lessonId)
+        .sort((a, b) => a.order - b.order);
+
+      destLessons.splice(toIndex, 0, { ...lesson, sessionId: toSessionId });
+      const updatedDest = destLessons.map((l, i) => ({ ...l, order: i }));
+
+      let updatedSrc: Lesson[] = [];
+      if (!sameSession) {
+        updatedSrc = s.lessons
+          .filter((l) => l.sessionId === fromSessionId && l.id !== lessonId)
+          .sort((a, b) => a.order - b.order)
+          .map((l, i) => ({ ...l, order: i }));
+      }
+
+      const unchanged = s.lessons.filter(
+        (l) =>
+          l.id !== lessonId &&
+          l.sessionId !== toSessionId &&
+          (sameSession || l.sessionId !== fromSessionId)
+      );
+
+      return {
+        lessons: [
+          ...unchanged,
+          ...(sameSession ? [] : updatedSrc),
+          ...updatedDest,
+        ],
+      };
+    }),
+
+  setCourseId: (id) => set({ courseId: id, expandedIds: loadExpandedIds(id) }),
+
+  setCourse: (course) => set({ course }),
+
+  setStructureFromApi: (data) => {
+    const courseId = get().courseId || data.course?.id || '';
+    const validSessionIds = new Set(data.sessions.map((session) => session.id));
+    const nextExpandedIds = new Set(
+      [...get().expandedIds].filter((id) => validSessionIds.has(id))
+    );
+    saveExpandedIds(courseId, nextExpandedIds);
+
+    const patch: Partial<StructureState> = {
+      sessions: data.sessions,
+      lessons: data.lessons,
+      expandedIds: nextExpandedIds,
+    };
+    if (data.course) {
+      patch.course = data.course;
+      // Set initial active item to the course node when loading for the first time
+      if (!get().activeItemId) {
+        patch.activeItemId = data.course.id;
+        patch.activeItemType = 'course';
+        patch.selectedIds = new Set([`course:${data.course.id}`]);
+        patch.lastClickedId = data.course.id;
+      }
+    }
+    set(patch);
+  },
+
+  addSessionFromApi: (session) =>
+    set((s) => {
+      const nextExpandedIds = new Set([...s.expandedIds, session.id]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        sessions: [...s.sessions, session],
+        expandedIds: nextExpandedIds,
+        activeItemId: session.id,
+        activeItemType: 'session',
+        selectedIds: new Set([`session:${session.id}`]),
+        lastClickedId: session.id,
+      };
+    }),
+
+  addLessonFromApi: (lesson) =>
+    set((s) => {
+      const nextExpandedIds = new Set([...s.expandedIds, lesson.sessionId]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        lessons: [...s.lessons, lesson],
+        expandedIds: nextExpandedIds,
+        activeItemId: lesson.id,
+        activeItemType: 'lesson',
+        selectedIds: new Set([`lesson:${lesson.id}`]),
+        lastClickedId: lesson.id,
+      };
+    }),
+
+  addLessonsFromApi: (lessons) => {
+    if (!lessons.length) return;
+    const last = lessons[lessons.length - 1]!;
+    set((s) => {
+      const nextExpandedIds = new Set([
+        ...s.expandedIds,
+        ...lessons.map((l) => l.sessionId),
+      ]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        lessons: [...s.lessons, ...lessons],
+        expandedIds: nextExpandedIds,
+        activeItemId: last.id,
+        activeItemType: 'lesson',
+        selectedIds: new Set(lessons.map((l) => `lesson:${l.id}`)),
+        lastClickedId: last.id,
+      };
+    });
+  },
+
+  addSessionWithLessonsFromApi: (session, lessons) =>
+    set((s) => {
+      const nextExpandedIds = new Set([...s.expandedIds, session.id]);
+      saveExpandedIds(s.courseId, nextExpandedIds);
+      return {
+        sessions: [...s.sessions, session],
+        lessons: [...s.lessons, ...lessons],
+        expandedIds: nextExpandedIds,
+        activeItemId: session.id,
+        activeItemType: 'session',
+        selectedIds: new Set([`session:${session.id}`]),
+        lastClickedId: session.id,
+      };
+    }),
+
+  showConfirm: (opts) =>
+    set({
+      confirmDialog: {
+        open: true,
+        title: opts.title,
+        description: opts.description,
+        onConfirm: opts.onConfirm,
+      },
+    }),
+
+  closeConfirm: () =>
+    set((s) => ({
+      confirmDialog: { ...s.confirmDialog, open: false, onConfirm: null },
+    })),
+
+  showSessionPicker: (opts) =>
+    set({
+      sessionPickerDialog: {
+        open: true,
+        title: opts.title,
+        excludeSessionId: opts.excludeSessionId ?? null,
+        onPick: opts.onPick,
+      },
+    }),
+
+  closeSessionPicker: () =>
+    set((s) => ({
+      sessionPickerDialog: {
+        ...s.sessionPickerDialog,
+        open: false,
+        onPick: null,
+      },
+    })),
+}));