Update page.tsx

src/app/info/[[...slug]]/page.tsx

@@ -23,32 +23,45 @@ async function getPageViews(path: string) {
   });
 
   const viewsOverTime = await prisma.pageView.groupBy({
-    by: ["timestamp"],
+    by: [
+      {
+        year: {
+          extract: {
+            datepart: 'year',
+            from: 'timestamp',
+          },
+        },
+      },
+      {
+        month: {
+          extract: {
+            datepart: 'month',
+            from: 'timestamp',
+          },
+        },
+      },
+    ],
     where: {
       pagePath: path,
       filtered: false,
     },
     _count: {
       id: true,
     },
-    orderBy: {
-      timestamp: "asc",
-    },
-    take: 30,
+    orderBy: [
+      { year: 'desc' },
+      { month: 'desc' },
+    ],
+    take: 12, // Show last 12 months
   });
 
   return {
     totalPageViews,
     last30DaysViews,
-    viewsOverTime: viewsOverTime.map(
-      (view: {
-        timestamp: { toISOString: () => any };
-        _count: { id: any };
-      }) => ({
-        date: view.timestamp.toISOString(),
-        count: view._count.id,
-      }),
-    ),
+    viewsOverTime: viewsOverTime.map((view: any) => ({
+      date: new Date(view.year, view.month - 1, 1),
+      count: view._count.id,
+    })),
   };
 }
 
@@ -88,12 +101,12 @@ export default async function InfoPage({
         <>
           <p>Total Views: {pageViews.totalPageViews}</p>
           <p>Views in last 30 days: {pageViews.last30DaysViews}</p>
-          <h2>Views over time</h2>
+          <h2 className="text-2xl mt-4 mb-2">Views by Month</h2>
           <ul>
             {pageViews.viewsOverTime.map(
-              ({ date, count }: { date: string; count: number }) => (
-                <li key={date}>
-                  {new Date(date).toLocaleDateString()}: {count} views
+              ({ date, count }: { date: Date; count: number }) => (
+                <li key={date.toISOString()}>
+                  {date.toLocaleString('default', { month: 'long', year: 'numeric' })}: {count} views
                 </li>
               ),
             )}
@@ -102,4 +115,4 @@ export default async function InfoPage({
       )}
     </div>
   );
-}
+}