143 lines
3.6 KiB
Python
143 lines
3.6 KiB
Python
# -*- coding: utf-8 -*-
|
|
"""
|
|
导航栏组件
|
|
"""
|
|
|
|
from reflex import (
|
|
Component,
|
|
badge as Badge,
|
|
button as Button,
|
|
color as Color,
|
|
dialog as Dialog,
|
|
divider as Divider,
|
|
drawer as Drawer,
|
|
foreach as Foreach,
|
|
form as Form,
|
|
heading as Heading,
|
|
hstack as HStack,
|
|
icon as Icon,
|
|
input as Input,
|
|
tooltip as Tooltip,
|
|
vstack as VStack,
|
|
)
|
|
|
|
from ..state import State
|
|
|
|
|
|
def sidebar_session(session_name: str) -> Component:
|
|
"""
|
|
侧边栏会话组件
|
|
:param session_name: 会话名称
|
|
:return: Component
|
|
"""
|
|
return Drawer.close(
|
|
HStack(
|
|
Button(
|
|
session_name,
|
|
on_click=lambda: State.set_current_session(session_name),
|
|
width="80%",
|
|
variant="surface",
|
|
),
|
|
Button(
|
|
Icon(
|
|
tag="trash",
|
|
on_click=lambda: State.delete_session(session_name),
|
|
stroke_width=1,
|
|
),
|
|
width="20%",
|
|
variant="surface",
|
|
color_scheme="red",
|
|
),
|
|
width="100%",
|
|
),
|
|
key=session_name,
|
|
)
|
|
|
|
|
|
def sidebar(trigger) -> Component:
|
|
"""
|
|
侧边栏组件
|
|
"""
|
|
return Drawer.root(
|
|
Drawer.trigger(trigger),
|
|
Drawer.overlay(),
|
|
Drawer.portal(
|
|
Drawer.content(
|
|
VStack(
|
|
Heading("Chats", color=Color("mauve", 11)),
|
|
Divider(),
|
|
Foreach(
|
|
State.get_session_names,
|
|
lambda session_name: sidebar_session(session_name),
|
|
),
|
|
align_items="stretch",
|
|
width="100%",
|
|
),
|
|
top="auto",
|
|
right="auto",
|
|
height="100%",
|
|
width="20em",
|
|
padding="2em",
|
|
background_color=Color("mauve", 2),
|
|
outline="none",
|
|
)
|
|
),
|
|
direction="left",
|
|
)
|
|
|
|
|
|
def modal(trigger) -> Component:
|
|
"""A modal to create a new chat."""
|
|
return Dialog.root(
|
|
Dialog.trigger(trigger),
|
|
Dialog.content(
|
|
Form(
|
|
HStack(
|
|
Input(
|
|
placeholder="Chat name",
|
|
name="session_name",
|
|
flex="1",
|
|
min_width="20ch",
|
|
),
|
|
Button("Create chat"),
|
|
spacing="2",
|
|
wrap="wrap",
|
|
width="100%",
|
|
),
|
|
on_submit=State.create_session,
|
|
),
|
|
background_color=Color("mauve", 1),
|
|
),
|
|
open=State.create_session_modal_is_open,
|
|
on_open_change=State.toggle_create_session_modal,
|
|
)
|
|
|
|
|
|
def navbar():
|
|
return HStack(
|
|
Badge(
|
|
State.current_session_name,
|
|
Tooltip(
|
|
Icon("info", size=14),
|
|
content="The current selected chat.",
|
|
),
|
|
size="3",
|
|
variant="soft",
|
|
margin_inline_end="auto",
|
|
),
|
|
modal(
|
|
Icon("message-square-plus"),
|
|
),
|
|
sidebar(
|
|
Icon(
|
|
"messages-square",
|
|
background_color=Color("mauve", 6),
|
|
)
|
|
),
|
|
justify_content="space-between",
|
|
align_items="center",
|
|
padding="12px",
|
|
border_bottom=f"1px solid {Color('mauve', 3)}",
|
|
background_color=Color("mauve", 2),
|
|
)
|