feat: Add pagination controls to Search component for improved navigation

This commit introduces pagination functionality in the Search component, allowing users to navigate through search results more efficiently. The UI now includes "Previous" and "Next" buttons, enhancing the overall user experience. Documentation has been updated to reflect these changes.

frontend/src/pages/Search.tsx

@@ -1240,6 +1240,39 @@ export default function Search() {
             </div>
           </div>
 
+          {/* Pagination - Top */}
+          {total > pageSize && (
+            <div className="mb-4 flex items-center justify-between border-b pb-4">
+              <div className="text-sm text-gray-600">
+                Page {page} of {Math.ceil(total / pageSize)}
+              </div>
+              <div className="flex gap-2">
+                <button
+                  onClick={() => {
+                    const newPage = Math.max(1, page - 1)
+                    setPage(newPage)
+                    performSearch(newPage)
+                  }}
+                  disabled={page === 1}
+                  className="px-3 py-1 text-sm border rounded hover:bg-gray-50 disabled:bg-gray-100 disabled:text-gray-400"
+                >
+                  Previous
+                </button>
+                <button
+                  onClick={() => {
+                    const newPage = Math.min(Math.ceil(total / pageSize), page + 1)
+                    setPage(newPage)
+                    performSearch(newPage)
+                  }}
+                  disabled={page >= Math.ceil(total / pageSize)}
+                  className="px-3 py-1 text-sm border rounded hover:bg-gray-50 disabled:bg-gray-100 disabled:text-gray-400"
+                >
+                  Next
+                </button>
+              </div>
+            </div>
+          )}
+
           {/* Results Table */}
           <div className="overflow-x-auto">
             <table className="w-full text-sm">