Add article title to comment notifications

app/actions/comments.ts

@@ -9,10 +9,10 @@ export async function loginWithGitHub() {
     await signIn('github')
 }
 
-const notificationBody = (comment: { id: number, content: string }, user: { name: string }) => {
+const notificationBody = (comment: { id: number, content: string }, user: { name: string }, article: { title: string }) => {
     return {
-        topic: 'comments',
-        message: `You've got a new comment from ${user.name}:\n${comment.content}`,
+        topic: 'portfolio',
+        message: `New comment on ${article.title} from ${user.name}:\n${comment.content}`,
         actions: [
             {
                 action: 'http',
@@ -60,7 +60,7 @@ export async function addComment(prevState: { message: string }, formData: FormD
 
         const [{data: user}, {data: article}] = await Promise.all([
             supabase.from('users').upsert({name, email, image}, {onConflict: 'email'}).select('*').single(),
-            supabase.from('articles').select('id').eq('slug', slug).single()
+            supabase.from('articles').select('*').eq('slug', slug).single()
         ])
 
         const {data: newComment, error} = await supabase
@@ -73,7 +73,7 @@ export async function addComment(prevState: { message: string }, formData: FormD
             return {message: general_error}
         }
 
-        await sendNotification(notificationBody(newComment, user))
+        await sendNotification(notificationBody(newComment, user, article))
 
         return {message: success_message}
     } catch (error) {

app/actions/views.ts

@@ -2,9 +2,9 @@
 
 import {createClient} from '@/lib/supabase/server'
 
-export async function incrementViews(slug: string) {
+export async function incrementViews(slug: string, title: string) {
     if (slug !== null) {
         const supabase = await createClient()
-        await supabase.rpc('increment_views', {param_slug: slug})
+        await supabase.rpc('increment_views', {param_slug: slug, param_title: title})
     }
 }

app/api/comments/moderate/[id]/route.ts

@@ -14,7 +14,7 @@ export async function PATCH(request: Request, {params}: { params: Promise<{ id:
                 .update({published: true})
                 .eq('id', id)
 
-            return new Response(null, {status: 204})
+            return new Response(JSON.stringify({}), {status: 200})
         }
         return new Response(JSON.stringify({status: 'Not Found'}), {status: 404})
     }

app/page.tsx

@@ -49,6 +49,7 @@ function Article(article: Article) {
                     </Card.Eyebrow>
                     <Views
                         slug={article.slug}
+                        title={article.title}
                         className="text-sm text-zinc-500 dark:text-zinc-400"
                         shouldUpdateViews={false}
                     />

app/writing/page.tsx

@@ -46,6 +46,7 @@ function Article({article}: { article: Article }) {
                     </Card.Eyebrow>
                     <Views
                         slug={article.slug}
+                        title={article.title}
                         className="text-sm text-zinc-500 dark:text-zinc-400"
                         shouldUpdateViews={false}
                     />

components/layouts/ArticleLayout.tsx

@@ -54,7 +54,7 @@ export function ArticleLayout({
                                 <time dateTime={date}>
                                     <span>{formatDate(date)}</span>
                                 </time>
-                                <Views slug={slug} shouldUpdateViews={true}/>
+                                <Views slug={slug} title={title} shouldUpdateViews={true}/>
                             </p>
                         </header>
                         <Prose className="mt-8" data-mdx-content>{children}</Prose>

components/ui/Views.tsx

@@ -9,11 +9,12 @@ import {incrementViews} from '@/app/actions/views'
 type ViewsProps = {
     as?: ElementType
     slug: string
+    title: string
     className?: string
     shouldUpdateViews?: boolean
 }
 
-export function Views({as: Component = 'span', slug, className, shouldUpdateViews = true}: ViewsProps) {
+export function Views({as: Component = 'span', slug, title, className, shouldUpdateViews = true}: ViewsProps) {
     const {data} = useSWR(`/api/views/${slug}`, fetcher) as { data: { views: number } }
     const {mutate} = useSWRConfig()
 
@@ -22,7 +23,7 @@ export function Views({as: Component = 'span', slug, className, shouldUpdateView
             const updateViews = async () => {
                 const hasViewed = sessionStorage.getItem(`has-viewed-${slug}`)
                 if (!hasViewed) {
-                    await incrementViews(slug)
+                    await incrementViews(slug, title)
 
                     sessionStorage.setItem(`has-viewed-${slug}`, 'true')
                 }