mirror of
https://github.com/MODSetter/SurfSense.git
synced 2026-07-26 23:51:14 +02:00
refactor(chat): remove loading component and enhance footer visibility logic in ChatViewport
This commit is contained in:
parent
7b4e4792bf
commit
c415e68bfc
3 changed files with 15 additions and 66 deletions
|
|
@ -22,9 +22,19 @@ const ChatScrollToBottom: FC = () => (
|
|||
export interface ChatViewportProps {
|
||||
children: ReactNode;
|
||||
footer?: ReactNode;
|
||||
/**
|
||||
* Keep the footer (composer) pinned even when the thread has no messages —
|
||||
* needed while an existing thread's messages are still loading, so the
|
||||
* bottom composer stays visible above the loading skeleton.
|
||||
*/
|
||||
footerAlwaysVisible?: boolean;
|
||||
}
|
||||
|
||||
export const ChatViewport: FC<ChatViewportProps> = ({ children, footer }) => (
|
||||
export const ChatViewport: FC<ChatViewportProps> = ({
|
||||
children,
|
||||
footer,
|
||||
footerAlwaysVisible = false,
|
||||
}) => (
|
||||
<ThreadPrimitive.Viewport
|
||||
turnAnchor="top"
|
||||
autoScroll
|
||||
|
|
@ -40,7 +50,7 @@ export const ChatViewport: FC<ChatViewportProps> = ({ children, footer }) => (
|
|||
/>
|
||||
{children}
|
||||
{footer ? (
|
||||
<AuiIf condition={({ thread }) => !thread.isEmpty}>
|
||||
<AuiIf condition={({ thread }) => footerAlwaysVisible || !thread.isEmpty}>
|
||||
<ThreadPrimitive.ViewportFooter
|
||||
className="aui-chat-composer-footer sticky bottom-0 z-20 -mx-4 mt-auto flex flex-col items-stretch bg-gradient-to-t from-main-panel from-60% to-transparent px-4 pt-6"
|
||||
style={{ paddingBottom: "max(0.5rem, env(safe-area-inset-bottom))" }}
|
||||
|
|
|
|||
|
|
@ -169,11 +169,12 @@ const ThreadContent: FC<ThreadProps> = ({
|
|||
}}
|
||||
>
|
||||
<ChatViewport
|
||||
footerAlwaysVisible={hasActiveThread}
|
||||
footer={
|
||||
<AuiIf condition={({ thread }) => hasActiveThread || !thread.isEmpty}>
|
||||
<>
|
||||
<PremiumQuotaPinnedAlert />
|
||||
<Composer isLoadingMessages={isLoadingMessages} />
|
||||
</AuiIf>
|
||||
</>
|
||||
}
|
||||
>
|
||||
<AuiIf condition={({ thread }) => !hasActiveThread && thread.isEmpty}>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue