legends810/testingnew

1import type { Message } from 'ai';2import { toast } from 'react-toastify';3import { ImportFolderButton } from '~/components/chat/ImportFolderButton';4import { Button } from '~/components/ui/Button';5import { classNames } from '~/utils/classNames';6 7type ChatData = {8  messages?: Message[]; // Standard Bolt format9  description?: string; // Optional description10};11 12export function ImportButtons(importChat: ((description: string, messages: Message[]) => Promise<void>) | undefined) {13  return (14    <div className="flex flex-col items-center justify-center w-auto">15      <input16        type="file"17        id="chat-import"18        className="hidden"19        accept=".json"20        onChange={async (e) => {21          const file = e.target.files?.[0];22 23          if (file && importChat) {24            try {25              const reader = new FileReader();26 27              reader.onload = async (e) => {28                try {29                  const content = e.target?.result as string;30                  const data = JSON.parse(content) as ChatData;31 32                  // Standard format33                  if (Array.isArray(data.messages)) {34                    await importChat(data.description || 'Imported Chat', data.messages);35                    toast.success('Chat imported successfully');36 37                    return;38                  }39 40                  toast.error('Invalid chat file format');41                } catch (error: unknown) {42                  if (error instanceof Error) {43                    toast.error('Failed to parse chat file: ' + error.message);44                  } else {45                    toast.error('Failed to parse chat file');46                  }47                }48              };49              reader.onerror = () => toast.error('Failed to read chat file');50              reader.readAsText(file);51            } catch (error) {52              toast.error(error instanceof Error ? error.message : 'Failed to import chat');53            }54            e.target.value = ''; // Reset file input55          } else {56            toast.error('Something went wrong');57          }58        }}59      />60      <div className="flex flex-col items-center gap-4 max-w-2xl text-center">61        <div className="flex gap-2">62          <Button63            onClick={() => {64              const input = document.getElementById('chat-import');65              input?.click();66            }}67            variant="outline"68            size="lg"69            className={classNames(70              'gap-2 bg-[#F5F5F5] dark:bg-[#252525]',71              'text-bolt-elements-textPrimary dark:text-white',72              'hover:bg-[#E5E5E5] dark:hover:bg-[#333333]',73              'border-[#E5E5E5] dark:border-[#333333]',74              'h-10 px-4 py-2 min-w-[120px] justify-center',75              'transition-all duration-200 ease-in-out',76            )}77          >78            <span className="i-ph:upload-simple w-4 h-4" />79            Import Chat80          </Button>81          <ImportFolderButton82            importChat={importChat}83            className={classNames(84              'gap-2 bg-[#F5F5F5] dark:bg-[#252525]',85              'text-bolt-elements-textPrimary dark:text-white',86              'hover:bg-[#E5E5E5] dark:hover:bg-[#333333]',87              'border border-[#E5E5E5] dark:border-[#333333]',88              'h-10 px-4 py-2 min-w-[120px] justify-center',89              'transition-all duration-200 ease-in-out rounded-lg',90            )}91          />92        </div>93      </div>94    </div>95  );96}97