diff --git a/src/chatbox.tsx b/src/chatbox.tsx
index 65a1a13..e5f3ec1 100644
--- a/src/chatbox.tsx
+++ b/src/chatbox.tsx
@@ -346,6 +346,7 @@ export default function ChatBOX(props: {
             chatStore={chatStore}
             setChatStore={setChatStore}
             messageIndex={messageIndex}
+            update_total_tokens={update_total_tokens}
           />
         ))}
         {chatStore.develop_mode && (
diff --git a/src/message.tsx b/src/message.tsx
index 8c99740..d85b854 100644
--- a/src/message.tsx
+++ b/src/message.tsx
@@ -6,6 +6,7 @@ interface Props {
   messageIndex: number;
   chatStore: ChatStore;
   setChatStore: (cs: ChatStore) => void;
+  update_total_tokens: () => void;
 }
 export default function Message(props: Props) {
   const { chatStore, messageIndex, setChatStore } = props;
@@ -70,7 +71,16 @@ export default function Message(props: Props) {
           </div>
           {chatStore.develop_mode && (
             <div>
-              token {chatStore.history[messageIndex].token}
+              token{" "}
+              <input
+                value={chat.token}
+                className='w-20'
+                onChange={(event: any) => {
+                  chat.token = parseInt(event.target.value);
+                  props.update_total_tokens();
+                  setChatStore({ ...chatStore });
+                }}
+              />
               <button
                 onClick={() => {
                   chatStore.history.splice(messageIndex, 1);