Update post views

Author: w3labkr

app/[username]/[slug]/page.tsx

@@ -108,7 +108,7 @@ export default async function PostPage({
  />
  </div>
  <div className="flex space-x-4">
- <PostViews meta={post?.meta} />
+ <PostViews post={post} />
  <FavoriteButton post={post} />
  </div>
  </div>

app/[username]/[slug]/post-views.tsx

@@ -2,16 +2,28 @@
 
 import * as React from 'react'
 
+import { createClient } from '@/supabase/client'
 import { LucideIcon } from '@/lib/lucide-icon'
 import { getMetaValue } from '@/lib/utils'
-import { type PostMeta } from '@/types/database'
+import { type Post } from '@/types/database'
 
 interface PostViewsProps extends React.HTMLAttributes<HTMLDivElement> {
- meta?: PostMeta[]
+ post?: Post
 }
 
-const PostViews = ({ meta, ...props }: PostViewsProps) => {
- const views = getMetaValue(meta, 'views', '0')
+const PostViews = ({ post, ...props }: PostViewsProps) => {
+ const views = getMetaValue(post?.meta, 'views', '0')
+ const setPostViews = React.useCallback(async (postid: number) => {
+ const supabase = createClient()
+ const result = await supabase.rpc('set_post_views', { postid })
+ // console.log(result)
+ }, [])
+
+ React.useEffect(() => {
+ if (typeof window !== 'undefined' && post?.id) {
+ setPostViews(post?.id)
+ }
+ }, [post?.id, setPostViews])
 
  return (
  <div className="flex items-center" {...props}>