// web/src/components/sidebar/LeftSidebar.tsx
import React from "react";
import { Separator } from "../ui/separator";

import { CourseInfoSection } from "./CourseInfoSection";
import { SavedChatSection } from "./SavedChatSection";

import type {
  SavedChat,
  Workspace,
  LearningMode,
  Language,
  SpaceType,
  GroupMember,
  User,
  SavedItem,
} from "../../App";

type Props = {
  learningMode: LearningMode;
  language: Language;
  onLearningModeChange: (m: LearningMode) => void;
  onLanguageChange: (l: Language) => void;

  spaceType: SpaceType;
  groupMembers: GroupMember[];

  user: User | null;
  onLogin: (u: any) => void;
  onLogout: () => void;
  isLoggedIn: boolean;

  onEditProfile: () => void;

  savedItems: SavedItem[];
  recentlySavedId: string | null;
  onUnsave: (id: string) => void;
  onSave: (
    content: string,
    type: "export" | "quiz" | "summary",
    saveAsChat?: boolean,
    format?: "pdf" | "text",
    workspaceId?: string
  ) => void;

  savedChats: SavedChat[];
  onLoadChat: (chat: SavedChat) => void;
  onDeleteSavedChat: (id: string) => void;
  onRenameSavedChat: (id: string, newTitle: string) => void;

  currentWorkspaceId: string;
  workspaces: Workspace[];

  selectedCourse: string;
  availableCourses: any[];
};

export function LeftSidebar(props: Props) {
  const {
    isLoggedIn,
    savedChats,
    onLoadChat,
    onDeleteSavedChat,
    onRenameSavedChat,
    currentWorkspaceId,
    workspaces,
    selectedCourse,
    availableCourses,
  } = props;

  return (
    <div className="h-full w-full flex flex-col min-h-0">

      {/* Course info（不滚动） */}
      <div className="flex-shrink-0">
        <CourseInfoSection
          currentWorkspaceId={currentWorkspaceId}
          workspaces={workspaces}
          selectedCourse={selectedCourse}
          availableCourses={availableCourses as any}
        />
      </div>

      <Separator className="flex-shrink-0 bg-[#ECECF1]" />

      {/* Saved chats（唯一滚动区） */}
      <div className="flex-1 min-h-0 overflow-hidden">
        <div className="h-full min-h-0 panelScroll">
          <SavedChatSection
            isLoggedIn={isLoggedIn}
            savedChats={savedChats}
            onLoadChat={onLoadChat}
            onDeleteSavedChat={onDeleteSavedChat}
            onRenameSavedChat={onRenameSavedChat}
          />
        </div>
      </div>
    </div>
  );
}