feat: redo/undo btns not working

Author: optimalcharb

components/pdf-container/toolbar.tsx

@@ -1,13 +1,15 @@
 import { useExportCapability } from "@embedpdf/plugin-export/react"
+import { useHistoryCapability } from "@embedpdf/plugin-history/react"
 import { useZoom } from "@embedpdf/plugin-zoom/react"
-import { Download, Highlighter, Trash2, Underline, ZoomIn, ZoomOut } from "lucide-react"
+import { Download, Highlighter, Redo, Trash2, Underline, Undo, ZoomIn, ZoomOut } from "lucide-react"
 import { useEffect, useState } from "react"
 import { useAnnotationCapability } from "./plugin-annotation-2"
 
 export const Toolbar = () => {
   const { provides: annotationApi } = useAnnotationCapability()
   const { provides: exportApi } = useExportCapability()
   const { provides: zoom } = useZoom()
+  const { provides: history } = useHistoryCapability()
   const [activeTool, setActiveTool] = useState<string | null>(null)
   const [canDelete, setCanDelete] = useState(false)
 
@@ -53,6 +55,21 @@ export const Toolbar = () => {
         </button>
       ))}
       <div className="h-6 w-px bg-gray-200"></div>
+      <button
+        onClick={() => history?.undo}
+        disabled={!history}
+        className="rounded-md bg-purple-500 px-3 py-1 text-sm font-medium text-white transition-colors hover:bg-purple-600 disabled:cursor-not-allowed disabled:bg-purple-300"
+      >
+        <Undo size={18} />
+      </button>
+      <button
+        onClick={() => history?.redo()}
+        disabled={!history}
+        className="rounded-md bg-purple-500 px-3 py-1 text-sm font-medium text-white transition-colors hover:bg-purple-600 disabled:cursor-not-allowed disabled:bg-purple-300"
+      >
+        <Redo size={18} />
+      </button>
+      <div className="h-6 w-px bg-gray-200"></div>
       <button
         onClick={() => zoom?.zoomOut()}
         disabled={!zoom}