Move user count

app/learn-more/page.tsx

@@ -2,8 +2,22 @@
 
 import Link from "next/link";
 import {aColor} from "@/lib/client/constants";
+import {useEffect, useState} from "react";
 
 export default function LearnMorePage() {
+
+  const [totalUsers, setTotalUsers] = useState<number>(0);
+  useEffect(() => {
+    const getCount = async () => {
+      const countResponse = await fetch('/api/profiles/count');
+      if (countResponse.ok) {
+        const {count} = await countResponse.json();
+        setTotalUsers(count);
+      }
+    };
+
+    getCount();
+  }, []); // <- runs once after initial mount
   return (
     <div className="text-gray-600 dark:text-white min-h-screen p-6">
       {aColor}
@@ -46,6 +60,8 @@ export default function LearnMorePage() {
           <h5 id="github-repo">Source Code</h5>
           <p>The source code and instructions for development are available on <a href="https://github.com/BayesBond/BayesBond">GitHub</a>.</p>
         </div>
+        <h3 id="how-to-help">Statistics</h3>
+        <p>{totalUsers} total users</p>
       </div>
     </div>
   );

app/profiles/page.tsx

@@ -32,23 +32,9 @@ export default function ProfilePage() {
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState('');
   const [_, setShowFilters] = useState(true);
-  const [totalUsers, setTotalUsers] = useState<number>(0);
   const [images, setImages] = useState<string[]>([])
   const [filters, setFilters] = useState(initialState);
 
-
-  useEffect(() => {
-    const getCount = async () => {
-      const countResponse = await fetch('/api/profiles/count');
-      if (countResponse.ok) {
-        const {count} = await countResponse.json();
-        setTotalUsers(count);
-      }
-    };
-
-    getCount();
-  }, []); // <- runs once after initial mount
-
   const fetchProfiles = useCallback(async () => {
     try {
       setLoading(true);