+ {/* Fallback mode indicator */}
+ {isFallbackMode && (
+ tags and their content
+ displayContent = displayContent.replace(/[\s\S]*?<\/think>/g, '');
+
+ // Remove any other XML-like tags
+ displayContent = displayContent.replace(/<[^>]*>/g, '');
+
+ // Clean up any excessive whitespace
+ displayContent = displayContent.replace(/^\s+|\s+$/g, '');
+ displayContent = displayContent.replace(/\n{3,}/g, '\n\n');
+ }
+
+ return (
+
+ );
+};
+
+export default ChatHistory;
diff --git a/OpenAIChatAssistant/client/src/components/ChatInputForm.tsx b/OpenAIChatAssistant/client/src/components/ChatInputForm.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..683e1fbadf8834c6e2a7748fa0510d045bc56e56
--- /dev/null
+++ b/OpenAIChatAssistant/client/src/components/ChatInputForm.tsx
@@ -0,0 +1,72 @@
+import React, { useState, useRef, useEffect } from 'react';
+import { ChatInputFormProps } from '@/lib/types';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+
+const ChatInputForm: React.FC
+
+ )}
+
+ {messages.map((message, index) => {
+ // Check if this is a fallback message directly from the content
+ const isMessageFallback = message.role === 'assistant' &&
+ (message.content.includes('fallback mode') ||
+ message.content.includes('Qwen model'));
+
+ // Determine if this message appears to be a fallback response
+ const isAssistantFallbackMessage = message.role === 'assistant' &&
+ (currentModel === 'qwen' || isMessageFallback);
+
+ // Clean up fallback message for display
+ let displayContent = isAssistantFallbackMessage
+ ? message.content.replace(/\n\n\(Note: I'm currently operating in fallback mode.*\)$/, '')
+ : message.content;
+
+ // Remove any thinking process sections for Qwen responses
+ if (isAssistantFallbackMessage) {
+ // Remove
+
+
+
+
+
+ + Qwen Fallback Mode Active: The OpenAI API is currently unavailable. + Responses are being generated by the Qwen model instead. +
+
+ {message.role !== 'user' && (
+
+ );
+ })}
+
+
+
+ )}
+
+
+
+
+
+
+
+ {message.role === 'user' && (
+ {displayContent}
+ + {isAssistantFallbackMessage && isMessageFallback && ( ++ (This response was generated using the Qwen fallback model) +
+ )} +
+
+ )}
+
+
+
+
+
+
+ {isConnected ? 'Connected' : 'Disconnected'}
+
+
+
+
+
+ {getModelBadge()}
+
+
+
+
+
+
+ );
+};
+
+export default ConnectionStatus;
diff --git a/OpenAIChatAssistant/client/src/components/ConversationSidebar.tsx b/OpenAIChatAssistant/client/src/components/ConversationSidebar.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..0208ad04d6e3cc7e3015f0b9d475c393fdec1dfd
--- /dev/null
+++ b/OpenAIChatAssistant/client/src/components/ConversationSidebar.tsx
@@ -0,0 +1,315 @@
+import React, { useState, useEffect } from 'react';
+import { PlusCircle, MessageSquare, Trash2, Edit2, Save, X, User, LogOut } from 'lucide-react';
+import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { apiRequest } from '@/lib/queryClient';
+import { Conversation } from '@/lib/types';
+import { useAuth } from '@/hooks/use-auth';
+import { useLocation } from 'wouter';
+
+interface ConversationSidebarProps {
+ isOpen: boolean;
+ onClose: () => void;
+ selectedConversationId: string;
+ onSelectConversation: (conversationId: string) => void;
+ onNewConversation: () => void;
+}
+
+const ConversationSidebar: React.FC+ {currentModel === 'openai' + ? 'Using OpenAI GPT-4o model' + : currentModel === 'qwen' + ? 'Using Qwen fallback model due to OpenAI unavailability' + : 'All AI models are currently unavailable'} +
+
+
+ );
+}
\ No newline at end of file
diff --git a/OpenAIChatAssistant/client/src/components/TypingIndicator.tsx b/OpenAIChatAssistant/client/src/components/TypingIndicator.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..336fa26736e12c8decc9ed6aa7311278aa7b1cf1
--- /dev/null
+++ b/OpenAIChatAssistant/client/src/components/TypingIndicator.tsx
@@ -0,0 +1,30 @@
+import React from 'react';
+import { TypingIndicatorProps } from '@/lib/types';
+
+const TypingIndicator: React.FC
+
+
+ Image Generator
+ {isLoading &&
+
+
+
+
+
+
+
+ {imageUrl ? (
+
+
+ )}
+
+
+ 
+
+ ) : (
+
+
+
+
+
+
+ + Your generated image will appear here +
+
+
+ );
+};
+
+export default TypingIndicator;
diff --git a/OpenAIChatAssistant/client/src/components/UserSettingsModal.tsx b/OpenAIChatAssistant/client/src/components/UserSettingsModal.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..bb499c9f43d0119333942e76126d5dee4b51d0fc
--- /dev/null
+++ b/OpenAIChatAssistant/client/src/components/UserSettingsModal.tsx
@@ -0,0 +1,348 @@
+import React, { useEffect } from "react";
+import { useForm } from "react-hook-form";
+import { zodResolver } from "@hookform/resolvers/zod";
+import { z } from "zod";
+import { useMutation } from "@tanstack/react-query";
+import { apiRequest, queryClient } from "@/lib/queryClient";
+import { useAuth } from "@/hooks/use-auth";
+import { useToast } from "@/hooks/use-toast";
+import { updateUserProfileSchema } from "@shared/schema";
+
+import {
+ Dialog,
+ DialogContent,
+ DialogDescription,
+ DialogHeader,
+ DialogTitle,
+ DialogFooter,
+} from "@/components/ui/dialog";
+import {
+ Form,
+ FormControl,
+ FormDescription,
+ FormField,
+ FormItem,
+ FormLabel,
+ FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { Textarea } from "@/components/ui/textarea";
+import { Button } from "@/components/ui/button";
+import { Loader2 } from "lucide-react";
+
+// Create a form schema
+const profileFormSchema = z.object({
+ fullName: z.string().optional(),
+ location: z.string().optional(),
+ interests: z.array(z.string()).optional(),
+ interestsInput: z.string().optional(), // For input field value only, not submitted
+ profession: z.string().optional(),
+ pets: z.string().optional(),
+ systemContext: z.string().optional(),
+});
+
+type ProfileFormValues = z.infer
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {error && (
+
+ );
+}
\ No newline at end of file
diff --git a/OpenAIChatAssistant/client/src/components/ui/accordion.tsx b/OpenAIChatAssistant/client/src/components/ui/accordion.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..e6a723d06574ee5cec8b00759b98f3fbe1ac7cc9
--- /dev/null
+++ b/OpenAIChatAssistant/client/src/components/ui/accordion.tsx
@@ -0,0 +1,56 @@
+import * as React from "react"
+import * as AccordionPrimitive from "@radix-ui/react-accordion"
+import { ChevronDown } from "lucide-react"
+
+import { cn } from "@/lib/utils"
+
+const Accordion = AccordionPrimitive.Root
+
+const AccordionItem = React.forwardRef<
+ React.ElementRef
+ {error}
+
+ )}
+
+
+ {videoUrl ? (
+
+
+ )}
+
+
+
+
+ ) : (
+
+
+
+
+
+
+ + Your generated video will appear here +
+{children}
+
+ {children}
+
+
+
+
+ )
+})
+CarouselContent.displayName = "CarouselContent"
+
+const CarouselItem = React.forwardRef<
+ HTMLDivElement,
+ React.HTMLAttributes
+
+ {children}
+
+
+