hotfix import

This commit is contained in:
Mckay Wrigley 2023-03-23 19:05:47 -06:00
parent f5118e3037
commit 1f31cc5507
5 changed files with 41 additions and 21 deletions

View File

@ -1,9 +1,9 @@
import { Conversation } from "@/types"; import { ChatFolder, Conversation } from "@/types";
import { IconFileImport } from "@tabler/icons-react"; import { IconFileImport } from "@tabler/icons-react";
import { FC } from "react"; import { FC } from "react";
interface Props { interface Props {
onImport: (conversations: Conversation[]) => void; onImport: (data: { conversations: Conversation[]; folders: ChatFolder[] }) => void;
} }
export const Import: FC<Props> = ({ onImport }) => { export const Import: FC<Props> = ({ onImport }) => {
@ -19,8 +19,13 @@ export const Import: FC<Props> = ({ onImport }) => {
const file = e.target.files[0]; const file = e.target.files[0];
const reader = new FileReader(); const reader = new FileReader();
reader.onload = (e) => { reader.onload = (e) => {
const conversations: Conversation[] = JSON.parse(e.target?.result as string); let json = JSON.parse(e.target?.result as string);
onImport(conversations);
if (!json.folders) {
json = { history: json, folders: [] };
}
onImport({ conversations: json.history, folders: json.folders });
}; };
reader.readAsText(file); reader.readAsText(file);
}} }}

View File

@ -25,7 +25,7 @@ interface Props {
onApiKeyChange: (apiKey: string) => void; onApiKeyChange: (apiKey: string) => void;
onClearConversations: () => void; onClearConversations: () => void;
onExportConversations: () => void; onExportConversations: () => void;
onImportConversations: (conversations: Conversation[]) => void; onImportConversations: (data: { conversations: Conversation[]; folders: ChatFolder[] }) => void;
} }
export const Sidebar: FC<Props> = ({ loading, conversations, lightMode, selectedConversation, apiKey, folders, onCreateFolder, onDeleteFolder, onUpdateFolder, onNewConversation, onToggleLightMode, onSelectConversation, onDeleteConversation, onToggleSidebar, onUpdateConversation, onApiKeyChange, onClearConversations, onExportConversations, onImportConversations }) => { export const Sidebar: FC<Props> = ({ loading, conversations, lightMode, selectedConversation, apiKey, folders, onCreateFolder, onDeleteFolder, onUpdateFolder, onNewConversation, onToggleLightMode, onSelectConversation, onDeleteConversation, onToggleSidebar, onUpdateConversation, onApiKeyChange, onClearConversations, onExportConversations, onImportConversations }) => {

View File

@ -1,4 +1,4 @@
import { Conversation } from "@/types"; import { ChatFolder, Conversation } from "@/types";
import { IconFileExport, IconMoon, IconSun } from "@tabler/icons-react"; import { IconFileExport, IconMoon, IconSun } from "@tabler/icons-react";
import { FC } from "react"; import { FC } from "react";
import { ClearConversations } from "./ClearConversations"; import { ClearConversations } from "./ClearConversations";
@ -13,7 +13,7 @@ interface Props {
onApiKeyChange: (apiKey: string) => void; onApiKeyChange: (apiKey: string) => void;
onClearConversations: () => void; onClearConversations: () => void;
onExportConversations: () => void; onExportConversations: () => void;
onImportConversations: (conversations: Conversation[]) => void; onImportConversations: (data: { conversations: Conversation[]; folders: ChatFolder[] }) => void;
} }
export const SidebarSettings: FC<Props> = ({ lightMode, apiKey, onToggleLightMode, onApiKeyChange, onClearConversations, onExportConversations, onImportConversations }) => { export const SidebarSettings: FC<Props> = ({ lightMode, apiKey, onToggleLightMode, onApiKeyChange, onClearConversations, onExportConversations, onImportConversations }) => {

View File

@ -6,7 +6,7 @@ import { cleanConversationHistory, cleanSelectedConversation } from "@/utils/app
import { DEFAULT_SYSTEM_PROMPT } from "@/utils/app/const"; import { DEFAULT_SYSTEM_PROMPT } from "@/utils/app/const";
import { saveConversation, saveConversations, updateConversation } from "@/utils/app/conversation"; import { saveConversation, saveConversations, updateConversation } from "@/utils/app/conversation";
import { saveFolders } from "@/utils/app/folders"; import { saveFolders } from "@/utils/app/folders";
import { exportConversations, importConversations } from "@/utils/app/importExport"; import { exportData, importData } from "@/utils/app/importExport";
import { IconArrowBarLeft, IconArrowBarRight } from "@tabler/icons-react"; import { IconArrowBarLeft, IconArrowBarRight } from "@tabler/icons-react";
import Head from "next/head"; import Head from "next/head";
import { useEffect, useRef, useState } from "react"; import { useEffect, useRef, useState } from "react";
@ -210,14 +210,16 @@ export default function Home() {
localStorage.setItem("isUsingEnv", isUsingEnv.toString()); localStorage.setItem("isUsingEnv", isUsingEnv.toString());
}; };
const handleExportConversations = () => { const handleExportData = () => {
exportConversations(); exportData();
}; };
const handleImportConversations = (conversations: Conversation[]) => { const handleImportConversations = (data: { conversations: Conversation[]; folders: ChatFolder[] }) => {
importConversations(conversations); console.log(data);
setConversations(conversations); importData(data.conversations, data.folders);
setSelectedConversation(conversations[conversations.length - 1]); setConversations(data.conversations);
setSelectedConversation(data.conversations[data.conversations.length - 1]);
setFolders(data.folders);
}; };
const handleSelectConversation = (conversation: Conversation) => { const handleSelectConversation = (conversation: Conversation) => {
@ -461,7 +463,7 @@ export default function Home() {
onUpdateConversation={handleUpdateConversation} onUpdateConversation={handleUpdateConversation}
onApiKeyChange={handleApiKeyChange} onApiKeyChange={handleApiKeyChange}
onClearConversations={handleClearConversations} onClearConversations={handleClearConversations}
onExportConversations={handleExportConversations} onExportConversations={handleExportData}
onImportConversations={handleImportConversations} onImportConversations={handleImportConversations}
/> />

View File

@ -1,11 +1,23 @@
import { Conversation } from "@/types"; import { ChatFolder, Conversation } from "@/types";
export const exportConversations = () => { export const exportData = () => {
const history = localStorage.getItem("conversationHistory"); let history = localStorage.getItem("conversationHistory");
let folders = localStorage.getItem("folders");
if (!history) return; if (history) {
history = JSON.parse(history);
}
const blob = new Blob([history], { type: "application/json" }); if (folders) {
folders = JSON.parse(folders);
}
const data = {
history,
folders
};
const blob = new Blob([JSON.stringify(data)], { type: "application/json" });
const url = URL.createObjectURL(blob); const url = URL.createObjectURL(blob);
const link = document.createElement("a"); const link = document.createElement("a");
link.download = "chatbot_ui_history.json"; link.download = "chatbot_ui_history.json";
@ -17,7 +29,8 @@ export const exportConversations = () => {
URL.revokeObjectURL(url); URL.revokeObjectURL(url);
}; };
export const importConversations = (conversations: Conversation[]) => { export const importData = (conversations: Conversation[], folders: ChatFolder[]) => {
localStorage.setItem("conversationHistory", JSON.stringify(conversations)); localStorage.setItem("conversationHistory", JSON.stringify(conversations));
localStorage.setItem("selectedConversation", JSON.stringify(conversations[conversations.length - 1])); localStorage.setItem("selectedConversation", JSON.stringify(conversations[conversations.length - 1]));
localStorage.setItem("folders", JSON.stringify(folders));
}; };