gmakstutis/openrag
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #289 from langflow-ai/fix/provider-design

Browse source 
fix: adds new provider design, fixes issues with auth mode
This commit is contained in:
Mike Fortman 2025-10-23 11:47:18 -05:00 • committed by GitHub
commit 883877b4e7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
7 changed files with 343 additions and 359 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
frontend/components/ui/accordion.tsx
View file

@ -14,7 +14,7 @@ const AccordionItem = React.forwardRef<
>(({ className, ...props }, ref) => (
<AccordionPrimitive.Item
ref={ref}
className={cn("border rounded-md", className)}
className={cn("border rounded-xl", className)}
{...props}
/>
));

4
frontend/components/ui/tabs.tsx
View file

@ -13,7 +13,7 @@ const TabsList = React.forwardRef<
<TabsPrimitive.List
ref={ref}
className={cn(
"inline-flex h-12 gap-3 items-center justify-center p-0 text-muted-foreground w-full",
"inline-flex h-fit gap-3 items-center justify-center p-0 text-muted-foreground w-full",
className,
)}
{...props}
@ -28,7 +28,7 @@ const TabsTrigger = React.forwardRef<
<TabsPrimitive.Trigger
ref={ref}
className={cn(
"inline-flex w-full h-full border border-border gap-1.5 items-center justify-center whitespace-nowrap rounded-lg px-3 py-1.5 text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-accent-pink-foreground data-[state=active]:text-foreground",
"flex flex-col items-start justify-between p-5 gap-4 w-full h-full border border-border whitespace-nowrap rounded-lg text-sm font-medium transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:border-muted-foreground data-[state=active]:text-foreground",
className,
)}
{...props}

14
frontend/src/app/onboarding/components/advanced.tsx
View file

@ -75,20 +75,6 @@ export function AdvancedOnboarding({
/>
</LabelWrapper>
)}
{(hasLanguageModels || hasEmbeddingModels) && !updatedOnboarding && <Separator />}
{!updatedOnboarding && (
<LabelWrapper
label="Sample dataset"
description="Load sample data to chat with immediately."
id="sample-dataset"
flex
>
<Switch
checked={sampleDataset}
onCheckedChange={setSampleDataset}
/>
</LabelWrapper>
)}
</AccordionContent>
</AccordionItem>
</Accordion>

11
frontend/src/app/onboarding/components/ollama-onboarding.tsx
View file

@ -7,7 +7,6 @@ import type { OnboardingVariables } from "../../api/mutations/useOnboardingMutat
import { useGetOllamaModelsQuery } from "../../api/queries/useGetModelsQuery";
import { useModelSelection } from "../hooks/useModelSelection";
import { useUpdateSettings } from "../hooks/useUpdateSettings";
import { AdvancedOnboarding } from "./advanced";
import { ModelSelector } from "./model-selector";
export function OllamaOnboarding({
@ -61,10 +60,6 @@ export function OllamaOnboarding({
};
}, [debouncedEndpoint, isLoadingModels]);
const handleSampleDatasetChange = (dataset: boolean) => {
setSampleDataset(dataset);
};
// Update settings when values change
useUpdateSettings(
"ollama",
@ -84,7 +79,6 @@ export function OllamaOnboarding({
!modelsData.embedding_models?.length;
return (
<>
<div className="space-y-4">
<div className="space-y-1">
<LabelInput
@ -151,10 +145,5 @@ export function OllamaOnboarding({
/>
</LabelWrapper>
</div>
<AdvancedOnboarding
sampleDataset={sampleDataset}
setSampleDataset={handleSampleDatasetChange}
/>
</>
);
}

49
frontend/src/app/onboarding/components/onboarding-card.tsx
View file

@ -25,6 +25,7 @@ import {
TooltipContent,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { cn } from "@/lib/utils";
import { AnimatedProviderSteps } from "./animated-provider-steps";
import { IBMOnboarding } from "./ibm-onboarding";
import { OllamaOnboarding } from "./ollama-onboarding";
@ -165,32 +166,42 @@ const OnboardingCard = ({ onComplete }: OnboardingCardProps) => {
exit={{ opacity: 0, y: -24 }}
transition={{ duration: 0.4, ease: "easeInOut" }}
>
<Card
className={`w-full max-w-[600px] ${
updatedOnboarding ? "border-none" : ""
}`}
>
<div className={`w-full max-w-[600px] flex flex-col gap-6`}>
<Tabs
defaultValue={modelProvider}
onValueChange={handleSetModelProvider}
>
<CardHeader className={`${updatedOnboarding ? "px-0" : ""}`}>
<TabsList>
<TabsTrigger value="openai">
<OpenAILogo className="w-4 h-4" />
<TabsList className="mb-4">
<TabsTrigger
value="openai"
>
<div className={cn("flex items-center justify-center gap-2 w-8 h-8 rounded-md", modelProvider === "openai" ? "bg-white" : "bg-muted")}>
<OpenAILogo className={cn("w-4 h-4 shrink-0", modelProvider === "openai" ? "text-black" : "text-muted-foreground")} />
</div>
OpenAI
</TabsTrigger>
<TabsTrigger value="watsonx">
<IBMLogo className="w-4 h-4" />
<TabsTrigger
value="watsonx"
>
<div className={cn("flex items-center justify-center gap-2 w-8 h-8 rounded-md", modelProvider === "watsonx" ? "bg-[#1063FE]" : "bg-muted")}>
<IBMLogo className={cn("w-4 h-4 shrink-0", modelProvider === "watsonx" ? "text-white" : "text-muted-foreground")} />
</div>
IBM watsonx.ai
</TabsTrigger>
<TabsTrigger value="ollama">
<OllamaLogo className="w-4 h-4" />
<TabsTrigger
value="ollama"
>
<div className={cn("flex items-center justify-center gap-2 w-8 h-8 rounded-md", modelProvider === "ollama" ? "bg-white" : "bg-muted")}>
<OllamaLogo
className={cn(
"w-4 h-4 shrink-0",
modelProvider === "ollama" ? "text-black" : "text-muted-foreground",
)}
/>
</div>
Ollama
</TabsTrigger>
</TabsList>
</CardHeader>
<CardContent className={`${updatedOnboarding ? "px-0" : ""}`}>
<TabsContent value="openai">
<OpenAIOnboarding
setSettings={setSettings}
@ -212,11 +223,8 @@ const OnboardingCard = ({ onComplete }: OnboardingCardProps) => {
setSampleDataset={setSampleDataset}
/>
</TabsContent>
</CardContent>
</Tabs>
<CardFooter
className={`flex ${updatedOnboarding ? "px-0" : "justify-end"}`}
>
<Tooltip>
<TooltipTrigger asChild>
<div>
@ -240,8 +248,7 @@ const OnboardingCard = ({ onComplete }: OnboardingCardProps) => {
</TooltipContent>
)}
</Tooltip>
</CardFooter>
</Card>
</div>
</motion.div>
) : (
<motion.div

5
frontend/src/components/chat-renderer.tsx
View file

@ -28,7 +28,7 @@ export function ChatRenderer({
settings,
children,
}: {
settings: Settings;
settings: Settings | undefined;
children: React.ReactNode;
}) {
const pathname = usePathname();
@ -51,7 +51,8 @@ export function ChatRenderer({
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 isEdited = settings?.edited ?? true;
return isEdited ? savedStep === null : false;
});
// Only fetch conversations on chat page

3
frontend/src/components/layout-wrapper.tsx
View file

@ -35,9 +35,10 @@ export function LayoutWrapper({ children }: { children: React.ReactNode }) {
const isUnhealthy = health?.status === "unhealthy" || isError;
const isBannerVisible = !isHealthLoading && isUnhealthy;
const isSettingsLoadingOrError = isSettingsLoading || !settings;
// Show loading state when backend isn't ready
if (isLoading || isSettingsLoading || !settings) {
if (isLoading || (isSettingsLoadingOrError && (isNoAuthMode || isAuthenticated))) {
return (
<div className="min-h-screen flex items-center justify-center bg-background">
<div className="flex flex-col items-center gap-4">