diff --git a/src/chatbox.tsx b/src/chatbox.tsx
index 905be02..4c5db37 100644
--- a/src/chatbox.tsx
+++ b/src/chatbox.tsx
@@ -316,63 +316,64 @@ export default function ChatBOX(props: {
             请先在上方设置 API Endpoint
           </p>
         )}
-        {(chatStore.history.filter((msg) => !msg.example).length == 0 ||
-          !chatStore.apiEndpoint ||
-          !chatStore.apiKey) && (
-          <p className="break-all opacity-80 p-3 rounded bg-white my-3 text-left dark:text-black">
-            <h2>已保存的 API 模板</h2>
-            <hr className="my-2" />
-            <div className="flex flex-wrap">
-              {templateAPIs.map((t, index) => (
-                <div
-                  className={`cursor-pointer rounded ${
-                    chatStore.apiEndpoint === t.endpoint &&
-                    chatStore.apiKey === t.key
-                      ? "bg-red-600"
-                      : "bg-red-400"
-                  } w-fit p-2 m-1 flex flex-col`}
-                  onClick={() => {
-                    chatStore.apiEndpoint = t.endpoint;
-                    chatStore.apiKey = t.key;
-                    setChatStore({ ...chatStore });
-                  }}
-                >
-                  <span className="w-full text-center">{t.name}</span>
-                  <hr className="mt-2" />
-                  <span className="flex justify-between">
-                    <button
-                      onClick={() => {
-                        const name = prompt("Give **API** template a name");
-                        if (!name) {
-                          return;
-                        }
-                        t.name = name;
-                        setTemplateAPIs(structuredClone(templateAPIs));
-                      }}
-                    >
-                      🖋
-                    </button>
-                    <button
-                      onClick={() => {
-                        if (
-                          !confirm(
-                            "Are you sure to delete this **API** template?"
-                          )
-                        ) {
-                          return;
-                        }
-                        templateAPIs.splice(index, 1);
-                        setTemplateAPIs(structuredClone(templateAPIs));
-                      }}
-                    >
-                      ❌
-                    </button>
-                  </span>
-                </div>
-              ))}
-            </div>
-          </p>
-        )}
+        {templateAPIs.length > 0 &&
+          (chatStore.history.filter((msg) => !msg.example).length == 0 ||
+            !chatStore.apiEndpoint ||
+            !chatStore.apiKey) && (
+            <p className="break-all opacity-80 p-3 rounded bg-white my-3 text-left dark:text-black">
+              <h2>已保存的 API 模板</h2>
+              <hr className="my-2" />
+              <div className="flex flex-wrap">
+                {templateAPIs.map((t, index) => (
+                  <div
+                    className={`cursor-pointer rounded ${
+                      chatStore.apiEndpoint === t.endpoint &&
+                      chatStore.apiKey === t.key
+                        ? "bg-red-600"
+                        : "bg-red-400"
+                    } w-fit p-2 m-1 flex flex-col`}
+                    onClick={() => {
+                      chatStore.apiEndpoint = t.endpoint;
+                      chatStore.apiKey = t.key;
+                      setChatStore({ ...chatStore });
+                    }}
+                  >
+                    <span className="w-full text-center">{t.name}</span>
+                    <hr className="mt-2" />
+                    <span className="flex justify-between">
+                      <button
+                        onClick={() => {
+                          const name = prompt("Give **API** template a name");
+                          if (!name) {
+                            return;
+                          }
+                          t.name = name;
+                          setTemplateAPIs(structuredClone(templateAPIs));
+                        }}
+                      >
+                        🖋
+                      </button>
+                      <button
+                        onClick={() => {
+                          if (
+                            !confirm(
+                              "Are you sure to delete this **API** template?"
+                            )
+                          ) {
+                            return;
+                          }
+                          templateAPIs.splice(index, 1);
+                          setTemplateAPIs(structuredClone(templateAPIs));
+                        }}
+                      >
+                        ❌
+                      </button>
+                    </span>
+                  </div>
+                ))}
+              </div>
+            </p>
+          )}
         {templates.length > 0 &&
           chatStore.history.filter((msg) => !msg.example).length == 0 && (
             <p className="break-all opacity-80 p-3 rounded bg-white my-3 text-left dark:text-black">