From ae15ec8b36ee09c3f930dc4e9cd95f0e121111c2 Mon Sep 17 00:00:00 2001 From: Lucas Oliveira Date: Tue, 21 Oct 2025 18:13:03 -0300 Subject: [PATCH] made overflow be hidden on main --- frontend/src/components/chat-renderer.tsx | 336 +++++++++++----------- 1 file changed, 168 insertions(+), 168 deletions(-) diff --git a/frontend/src/components/chat-renderer.tsx b/frontend/src/components/chat-renderer.tsx index df39c52d..83e59661 100644 --- a/frontend/src/components/chat-renderer.tsx +++ b/frontend/src/components/chat-renderer.tsx @@ -4,8 +4,8 @@ import { motion } from "framer-motion"; import { usePathname } from "next/navigation"; import { useEffect, useState } from "react"; import { - type ChatConversation, - useGetConversationsQuery, + type ChatConversation, + useGetConversationsQuery, } from "@/app/api/queries/useGetConversationsQuery"; import type { Settings } from "@/app/api/queries/useGetSettingsQuery"; import { OnboardingContent } from "@/app/new-onboarding/components/onboarding-content"; @@ -16,187 +16,187 @@ import { Navigation } from "@/components/navigation"; import { useAuth } from "@/contexts/auth-context"; import { useChat } from "@/contexts/chat-context"; import { - ANIMATION_DURATION, - HEADER_HEIGHT, - ONBOARDING_STEP_KEY, - SIDEBAR_WIDTH, - TOTAL_ONBOARDING_STEPS, + ANIMATION_DURATION, + HEADER_HEIGHT, + ONBOARDING_STEP_KEY, + SIDEBAR_WIDTH, + TOTAL_ONBOARDING_STEPS, } from "@/lib/constants"; import { cn } from "@/lib/utils"; export function ChatRenderer({ - settings, - children, + settings, + children, }: { - settings: Settings; - children: React.ReactNode; + settings: Settings; + children: React.ReactNode; }) { - const pathname = usePathname(); - const { isAuthenticated, isNoAuthMode } = useAuth(); - const { - endpoint, - refreshTrigger, - refreshConversations, - startNewConversation, - } = useChat(); + const pathname = usePathname(); + const { isAuthenticated, isNoAuthMode } = useAuth(); + const { + endpoint, + refreshTrigger, + refreshConversations, + startNewConversation, + } = useChat(); - // Initialize onboarding state based on local storage and settings - const [currentStep, setCurrentStep] = useState(() => { - if (typeof window === "undefined") return 0; - const savedStep = localStorage.getItem(ONBOARDING_STEP_KEY); - return savedStep !== null ? parseInt(savedStep, 10) : 0; - }); + // Initialize onboarding state based on local storage and settings + const [currentStep, setCurrentStep] = useState(() => { + if (typeof window === "undefined") return 0; + const savedStep = localStorage.getItem(ONBOARDING_STEP_KEY); + return savedStep !== null ? parseInt(savedStep, 10) : 0; + }); - const [showLayout, setShowLayout] = useState(() => { - if (typeof window === "undefined") return false; - const savedStep = localStorage.getItem(ONBOARDING_STEP_KEY); - // Show layout if settings.edited is true and if no onboarding step is saved - return !!settings?.edited && savedStep === null; - }); + const [showLayout, setShowLayout] = useState(() => { + if (typeof window === "undefined") return false; + const savedStep = localStorage.getItem(ONBOARDING_STEP_KEY); + // Show layout if settings.edited is true and if no onboarding step is saved + return !!settings?.edited && savedStep === null; + }); - // Only fetch conversations on chat page - const isOnChatPage = pathname === "/" || pathname === "/chat"; - const { data: conversations = [], isLoading: isConversationsLoading } = - useGetConversationsQuery(endpoint, refreshTrigger, { - enabled: isOnChatPage && (isAuthenticated || isNoAuthMode), - }) as { data: ChatConversation[]; isLoading: boolean }; + // Only fetch conversations on chat page + const isOnChatPage = pathname === "/" || pathname === "/chat"; + const { data: conversations = [], isLoading: isConversationsLoading } = + useGetConversationsQuery(endpoint, refreshTrigger, { + enabled: isOnChatPage && (isAuthenticated || isNoAuthMode), + }) as { data: ChatConversation[]; isLoading: boolean }; - const handleNewConversation = () => { - refreshConversations(); - startNewConversation(); - }; + const handleNewConversation = () => { + refreshConversations(); + startNewConversation(); + }; - // Save current step to local storage whenever it changes - useEffect(() => { - if (typeof window !== "undefined" && !showLayout) { - localStorage.setItem(ONBOARDING_STEP_KEY, currentStep.toString()); - } - }, [currentStep, showLayout]); + // Save current step to local storage whenever it changes + useEffect(() => { + if (typeof window !== "undefined" && !showLayout) { + localStorage.setItem(ONBOARDING_STEP_KEY, currentStep.toString()); + } + }, [currentStep, showLayout]); - const handleStepComplete = () => { - if (currentStep < TOTAL_ONBOARDING_STEPS - 1) { - setCurrentStep(currentStep + 1); - } else { - // Onboarding is complete - remove from local storage and show layout - if (typeof window !== "undefined") { - localStorage.removeItem(ONBOARDING_STEP_KEY); - } - setShowLayout(true); - } - }; + const handleStepComplete = () => { + if (currentStep < TOTAL_ONBOARDING_STEPS - 1) { + setCurrentStep(currentStep + 1); + } else { + // Onboarding is complete - remove from local storage and show layout + if (typeof window !== "undefined") { + localStorage.removeItem(ONBOARDING_STEP_KEY); + } + setShowLayout(true); + } + }; - // List of paths with smaller max-width - const smallWidthPaths = ["/settings/connector/new"]; - const isSmallWidthPath = smallWidthPaths.includes(pathname); + // List of paths with smaller max-width + const smallWidthPaths = ["/settings/connector/new"]; + const isSmallWidthPath = smallWidthPaths.includes(pathname); - const x = showLayout ? "0px" : `calc(-${SIDEBAR_WIDTH / 2}px + 50vw)`; - const y = showLayout ? "0px" : `calc(-${HEADER_HEIGHT / 2}px + 50vh)`; - const translateY = showLayout ? "0px" : `-50vh`; - const translateX = showLayout ? "0px" : `-50vw`; + const x = showLayout ? "0px" : `calc(-${SIDEBAR_WIDTH / 2}px + 50vw)`; + const y = showLayout ? "0px" : `calc(-${HEADER_HEIGHT / 2}px + 50vh)`; + const translateY = showLayout ? "0px" : `-50vh`; + const translateX = showLayout ? "0px" : `-50vw`; - // For all other pages, render with Langflow-styled navigation and task menu - return ( - <> - -
- + // For all other pages, render with Langflow-styled navigation and task menu + return ( + <> + +
+ - {/* Sidebar Navigation */} - - - + {/* Sidebar Navigation */} + + + - {/* Main Content */} -
- -
- -
- {children} -
- {!showLayout && ( - - )} - -
- - - - -
- - ); + {/* Main Content */} +
+ +
+ +
+ {children} +
+ {!showLayout && ( + + )} + +
+ + + + +
+ + ); }