add install ollama models , fixes

app/components/ui/Card.tsx

@@ -0,0 +1,44 @@
+import { forwardRef } from 'react';
+import { cn } from '~/lib/utils';
+
+export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {}
+
+const Card = forwardRef<HTMLDivElement, CardProps>(({ className, ...props }, ref) => {
+  return (
+    <div
+      ref={ref}
+      className={cn(
+        'rounded-lg border border-bolt-elements-borderColor bg-bolt-elements-background-depth-1 text-bolt-elements-textPrimary shadow-sm',
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+Card.displayName = 'Card';
+
+const CardHeader = forwardRef<HTMLDivElement, CardProps>(({ className, ...props }, ref) => {
+  return <div ref={ref} className={cn('flex flex-col space-y-1.5 p-6', className)} {...props} />;
+});
+CardHeader.displayName = 'CardHeader';
+
+const CardTitle = forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  ({ className, ...props }, ref) => {
+    return <h3 ref={ref} className={cn('text-2xl font-semibold leading-none tracking-tight', className)} {...props} />;
+  },
+);
+CardTitle.displayName = 'CardTitle';
+
+const CardDescription = forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(
+  ({ className, ...props }, ref) => {
+    return <p ref={ref} className={cn('text-sm text-bolt-elements-textSecondary', className)} {...props} />;
+  },
+);
+CardDescription.displayName = 'CardDescription';
+
+const CardContent = forwardRef<HTMLDivElement, CardProps>(({ className, ...props }, ref) => {
+  return <div ref={ref} className={cn('p-6 pt-0', className)} {...props} />;
+});
+CardContent.displayName = 'CardContent';
+
+export { Card, CardHeader, CardTitle, CardDescription, CardContent };

app/components/ui/Input.tsx

@@ -0,0 +1,25 @@
+import { forwardRef } from 'react';
+import { cn } from '~/lib/utils';
+
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {}
+
+const Input = forwardRef<HTMLInputElement, InputProps>(({ className, type, ...props }, ref) => {
+  return (
+    <input
+      type={type}
+      className={cn(
+        'flex h-10 w-full rounded-md border border-bolt-elements-borderColor bg-bolt-elements-background-depth-1 px-3 py-2 text-sm',
+        'ring-offset-bolt-elements-background-depth-1 file:border-0 file:bg-transparent file:text-sm file:font-medium',
+        'placeholder:text-bolt-elements-textTertiary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-purple-500/30',
+        'focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50',
+        className,
+      )}
+      ref={ref}
+      {...props}
+    />
+  );
+});
+
+Input.displayName = 'Input';
+
+export { Input };

app/components/ui/Label.tsx

@@ -0,0 +1,22 @@
+import { forwardRef } from 'react';
+import { cn } from '~/lib/utils';
+
+export interface LabelProps extends React.LabelHTMLAttributes<HTMLLabelElement> {}
+
+const Label = forwardRef<HTMLLabelElement, LabelProps>(({ className, ...props }, ref) => {
+  return (
+    <label
+      ref={ref}
+      className={cn(
+        'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70',
+        'text-bolt-elements-textPrimary',
+        className,
+      )}
+      {...props}
+    />
+  );
+});
+
+Label.displayName = 'Label';
+
+export { Label };

app/components/ui/Tabs.tsx

@@ -0,0 +1,56 @@
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import { forwardRef } from 'react';
+import { cn } from '~/lib/utils';
+
+const Tabs = TabsPrimitive.Root;
+
+const TabsList = forwardRef<
+  React.ElementRef<typeof TabsPrimitive.List>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.List
+    ref={ref}
+    className={cn(
+      'inline-flex h-10 items-center justify-center rounded-md bg-bolt-elements-background-depth-2 p-1',
+      'text-bolt-elements-textSecondary',
+      className,
+    )}
+    {...props}
+  />
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
+
+const TabsTrigger = forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.Trigger
+    ref={ref}
+    className={cn(
+      'inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-bolt-elements-background-depth-1',
+      'transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-purple-500/30 focus-visible:ring-offset-2',
+      'disabled:pointer-events-none disabled:opacity-50',
+      'data-[state=active]:bg-bolt-elements-background-depth-1 data-[state=active]:text-bolt-elements-textPrimary data-[state=active]:shadow-sm',
+      className,
+    )}
+    {...props}
+  />
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+
+const TabsContent = forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
+>(({ className, ...props }, ref) => (
+  <TabsPrimitive.Content
+    ref={ref}
+    className={cn(
+      'mt-2 ring-offset-bolt-elements-background-depth-1 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-purple-500/30 focus-visible:ring-offset-2',
+      className,
+    )}
+    {...props}
+  />
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+export { Tabs, TabsList, TabsTrigger, TabsContent };

app/components/ui/use-toast.ts

@@ -0,0 +1,40 @@
+import { useCallback } from 'react';
+import { toast as toastify } from 'react-toastify';
+
+interface ToastOptions {
+  type?: 'success' | 'error' | 'info' | 'warning';
+  duration?: number;
+}
+
+export function useToast() {
+  const toast = useCallback((message: string, options: ToastOptions = {}) => {
+    const { type = 'info', duration = 3000 } = options;
+
+    toastify[type](message, {
+      position: 'bottom-right',
+      autoClose: duration,
+      hideProgressBar: false,
+      closeOnClick: true,
+      pauseOnHover: true,
+      draggable: true,
+      progress: undefined,
+      theme: 'dark',
+    });
+  }, []);
+
+  const success = useCallback(
+    (message: string, options: Omit<ToastOptions, 'type'> = {}) => {
+      toast(message, { ...options, type: 'success' });
+    },
+    [toast],
+  );
+
+  const error = useCallback(
+    (message: string, options: Omit<ToastOptions, 'type'> = {}) => {
+      toast(message, { ...options, type: 'error' });
+    },
+    [toast],
+  );
+
+  return { toast, success, error };
+}