diff --git a/next_app/src/components/views/components/editor/components/history.tsx b/next_app/src/components/views/components/editor/components/history.tsx
new file mode 100644
index 0000000..d049a45
--- /dev/null
+++ b/next_app/src/components/views/components/editor/components/history.tsx
@@ -0,0 +1,38 @@
+import { useGlobalState } from "@/hooks";
+import { MsgHistory } from "@/hooks/useGlobalState";
+import { ExternalLink } from "lucide-react";
+import Link from "next/link";
+import { useEffect } from "react";
+import { useLocalStorage } from "usehooks-ts";
+
+export default function History() {
+    const globalState = useGlobalState();
+
+    useEffect(() => {
+        console.log(globalState.history)
+    }, [globalState.history])
+
+    return (
+        <div>
+            {
+                !globalState.history[globalState.activeProject] && <div className="text-center text-sm text-gray-400 p-4">No history available</div>
+            }
+            {
+                globalState.history[globalState.activeProject] && globalState.history[globalState.activeProject].toReversed().map((msg: MsgHistory) => {
+                    return (
+                        <div key={msg.id} className="flex items-start space-x-6 font-btr-code p-4 border-b">
+                            <div className="flex flex-col gap-1">
+                                <div className="flex gap-2 items-center">
+                                    <div className="text-sm text-gray-400 ">{new Date(msg.timestamp).toLocaleString()}</div>
+                                    <Link href={`https://www.ao.link/#/message/${msg.id}`} target="_blank" className="flex items-center text-primary text-sm">ao.link <ExternalLink size={16} className="ml-1" /></Link>
+                                </div>
+                                <div className="text-xs">{msg.id}</div>
+                            </div>
+                            <pre className="text-xs max-h-[200px] overflow-scroll">{msg.code}</pre>
+                        </div>
+                    )
+                })
+            }
+        </div>
+    )
+}
\ No newline at end of file
diff --git a/next_app/src/components/views/components/editor/components/notebook-editor.tsx b/next_app/src/components/views/components/editor/components/notebook-editor.tsx
index 3d65bf6..3fe2636 100644
--- a/next_app/src/components/views/components/editor/components/notebook-editor.tsx
+++ b/next_app/src/components/views/components/editor/components/notebook-editor.tsx
@@ -170,6 +170,7 @@ const CodeCell = ({
             { name: "File-Type", value: "Notebook" }
         ]);
         console.log(result);
+        globalState.appendHistory(project.name, { id: (result as any).id!, code: cell.code, timestamp: Date.now() })
 
         // const fileContent = {...manager.getProject(project.name).getFile(file.name).content};
 
diff --git a/next_app/src/components/views/components/editor/index.tsx b/next_app/src/components/views/components/editor/index.tsx
index 11f7882..5851ec4 100644
--- a/next_app/src/components/views/components/editor/index.tsx
+++ b/next_app/src/components/views/components/editor/index.tsx
@@ -18,6 +18,7 @@ import Output from "./components/output";
 import PackageView from "./components/package";
 import TableView from "./components/table";
 import Interact from "./components/interact";
+import History from "./components/history";
 
 function Editor() {
     const globalState = useGlobalState();
@@ -173,7 +174,7 @@ function Editor() {
                         <Output />
                     </TabsContent>
                     <TabsContent value="history" className="h-[calc(100%-30px)] overflow-scroll m-0">
-                        Command History
+                        <History />
                     </TabsContent>
                     {/* <TabsContent value="interact" className="h-[calc(100%-30px)] overflow-scroll m-0">
                         <Interact />
diff --git a/next_app/src/hooks/useGlobalState.ts b/next_app/src/hooks/useGlobalState.ts
index fffde84..c7ec9f1 100644
--- a/next_app/src/hooks/useGlobalState.ts
+++ b/next_app/src/hooks/useGlobalState.ts
@@ -4,6 +4,11 @@ import { TViewOptions } from "@/components/views/components";
 import { TPackage } from "@/lib/ao-vars";
 import { Dispatch, SetStateAction } from "react";
 
+export interface MsgHistory {
+    code: string;
+    id: string;
+    timestamp: number;
+}
 
 interface State {
     activeSidebarItem: TSidebarOptions;
@@ -15,6 +20,7 @@ interface State {
     openedPackages: TPackage[];
     prompt: string;
     setTerminalOutputs: Dispatch<SetStateAction<string[]>>;
+    history: { [pname: string]: MsgHistory[] };
     setActiveSidebarItem: (item: TSidebarOptions) => void;
     setActiveView: (view: TViewOptions) => void;
     setActiveProject: (project: string) => void;
@@ -26,6 +32,7 @@ interface State {
     addOpenedPackage: (pkg: TPackage) => void;
     setPrompt: (prompt: string) => void;
     setSetTerminalOutputsFunction: (func: Dispatch<SetStateAction<string[]>>) => void;
+    appendHistory: (pname: string, msg: MsgHistory) => void;
 }
 
 export const useGlobalState = create<State>((set) => ({
@@ -38,6 +45,7 @@ export const useGlobalState = create<State>((set) => ({
     openedPackages: [],
     prompt: "",
     setTerminalOutputs: null,
+    history: {},
     setActiveSidebarItem: (item: TSidebarOptions) => set({ activeSidebarItem: item }),
     setActiveView: (view: TViewOptions) => set({ activeView: view }),
     setActiveProject: (project: string) => set({
@@ -69,5 +77,11 @@ export const useGlobalState = create<State>((set) => ({
         openedPackages: state.openedPackages.find((p) => p.PkgID == pkg.PkgID) ? state.openedPackages.map((p) => p.PkgID == pkg.PkgID ? pkg : p) : [...state.openedPackages, pkg]
     })),
     setPrompt: (prompt: string) => set({ prompt }),
-    setSetTerminalOutputsFunction: (func: Dispatch<SetStateAction<string[]>>) => set({ setTerminalOutputs: func })
+    setSetTerminalOutputsFunction: (func: Dispatch<SetStateAction<string[]>>) => set({ setTerminalOutputs: func }),
+    appendHistory: (pname: string, msg: MsgHistory) => set((state) => ({
+        history: {
+            ...state.history,
+            [pname]: state.history[pname] ? [...state.history[pname], msg] : [msg]
+        }
+    }))
 }));
\ No newline at end of file