auto create new chatStore if there any params in URL

src/app.tsx

@@ -89,31 +89,45 @@ export function App() {
     _setChatStore(getChatStoreByIndex(selectedChatIndex));
   }, [selectedChatIndex]);
 
+  const handleNewChatStore = () => {
+    const max = Math.max(...allChatStoreIndexes);
+    const next = max + 1;
+    console.log("save next chat", next);
+    localStorage.setItem(
+      `${STORAGE_NAME}-${next}`,
+      JSON.stringify(
+        newChatStore(
+          chatStore.apiKey,
+          chatStore.systemMessageContent,
+          chatStore.apiEndpoint,
+          chatStore.streamMode
+        )
+      )
+    );
+    allChatStoreIndexes.push(next);
+    setAllChatStoreIndexes([...allChatStoreIndexes]);
+    setSelectedChatIndex(next);
+  };
+
+  // if there are any params in URL, create a new chatStore
+  useEffect(() => {
+    if (
+      getDefaultParams("api", "") ||
+      getDefaultParams("key", "") ||
+      getDefaultParams("mode", "") ||
+      getDefaultParams("sys", "")
+    ) {
+      handleNewChatStore();
+    }
+  }, []);
+
   return (
     <div className="flex text-sm h-full bg-slate-200 dark:bg-slate-800 dark:text-white">
       <div className="flex flex-col h-full p-2 border-r-indigo-500 border-2 dark:border-slate-800 dark:border-r-indigo-500 dark:text-black">
         <div className="grow overflow-scroll">
           <button
             className="bg-violet-300 p-1 rounded hover:bg-violet-400"
-            onClick={() => {
+            onClick={handleNewChatStore}
-              const max = Math.max(...allChatStoreIndexes);
-              const next = max + 1;
-              console.log("save next chat", next);
-              localStorage.setItem(
-                `${STORAGE_NAME}-${next}`,
-                JSON.stringify(
-                  newChatStore(
-                    chatStore.apiKey,
-                    chatStore.systemMessageContent,
-                    chatStore.apiEndpoint,
-                    chatStore.streamMode
-                  )
-                )
-              );
-              allChatStoreIndexes.push(next);
-              setAllChatStoreIndexes([...allChatStoreIndexes]);
-              setSelectedChatIndex(next);
-            }}
           >
             NEW
           </button>
@@ -126,7 +140,7 @@ export function App() {
                 return (
                   <li>
                     <button
-                      className={`w-full my-1 p-1 rounded  hover:bg-blue-300 ${
+                      className={`w-full my-1 p-1 rounded  hover:bg-blue-500 ${
                         i === selectedChatIndex ? "bg-blue-500" : "bg-blue-200"
                       }`}
                       onClick={() => {

src/chatbox.tsx

@@ -191,6 +191,10 @@ export default function ChatBOX(props: {
           <p className="opacity-60 p-6 rounded bg-white my-3 text-left dark:text-black">
             暂无历史对话记录
             <br />
+            ⚙Key: {chatStore.apiKey}
+            <br />
+            ⚙Endpoint: {chatStore.apiEndpoint}
+            <br />
             ⬆点击上方更改此对话的参数
             <br />
             ↖点击左上角 NEW 新建对话
@@ -201,7 +205,7 @@ export default function ChatBOX(props: {
             <br />
             ⚠详细文档与源代码:{" "}
             <a
-            className="underline"
+              className="underline"
               href="https://github.com/heimoshuiyu/chatgpt-api-web"
               target="_blank"
             >