Repte final:Sistema de notificacions al correu

Per fer això vam fer ús de Resend i Supabase, que es poden connectar a través de l’api, només cal connectar l’api de Resend a Rupabase, un cop això està fet, ja podem començar a fer les funcions i els webhooks que detecten els canvis i envien el senyal a Resend d’enviar el mail a tots els usuaris.

Per fer els webhooks has de fer una configuració, indicant el nom que vols posar-li, a quina taula està mirant, que esdeveniment ha de passar en aquesta taula, quin tipus de webhook faràs servir, en aquest cas com està tot dintre de Supabase dona igual quina de les dues utilitzes, ja que una sol·licitud HTTP interna és el mateix que fer ús de les edge functions, després li dius quina Edge function farà servir, i els headers:

Un cop aixo ja queda fet podem pasar a les functions:

import { serve } from "https://deno.land/std@0.168.0/http/server.ts"
import { createClient } from "https://esm.sh/@supabase/supabase-js@2"

const supabaseClient = createClient(
  Deno.env.get('SUPABASE_URL') ?? '',
  Deno.env.get('SUPABASE_SERVICE_ROLE_KEY') ?? ''
)

const RESEND_API_KEY = Deno.env.get('RESEND_API_KEY')
const EMAIL_FROM = Deno.env.get('EMAIL_FROM') || 'andres.lozano@inscastellbisbal.net'

serve(async (req) => {
  try {
    const { record } = await req.json()
    
    const { data: alumne, error: alumneError } = await supabaseClient
      .from('alumnes')
      .select('nom')
      .eq('id', record.alumne_id)
      .single()
    
    if (alumneError) throw alumneError
    
    const { data: convocatoria, error: convError } = await supabaseClient
      .from('convocatories')
      .select('titol, empresa_id')
      .eq('id', record.convocatoria_id)
      .single()
    
    if (convError) throw convError
    
    const { data: empresa, error: empresaError } = await supabaseClient
      .from('empreses')
      .select('persona_contacte')
      .eq('id', convocatoria.empresa_id)
      .single()
    
    if (empresaError) throw empresaError
    
    const res = await fetch('https://api.resend.com/emails', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
        'Authorization': `Bearer ${RESEND_API_KEY}`,
      },
      body: JSON.stringify({
        from: EMAIL_FROM,
        to: empresa.persona_contacte,
        subject: `Nova sol·licitud de pràctiques per: ${convocatoria.titol}`,
        html: `
          <h2>Nova Sol·licitud de Pràctiques</h2>
          <p>Hola,</p>
          <p><strong>${alumne.nom}</strong> ha sol·licitat les pràctiques per a la convocatòria:</p>
          <h3>${convocatoria.titol}</h3>
          <p>Inicia sessió a la plataforma per veure el perfil de l'alumne i gestionar la sol·licitud.</p>
          <p>Salutacions,<br>Institut Castellbisbal</p>
        `,
      }),
    })
    
    const data = await res.json()
    console.log('Email enviat:', data)
    
    return new Response(
      JSON.stringify({ success: true }),
      { headers: { 'Content-Type': 'application/json' } }
    )
  } catch (error) {
    return new Response(
      JSON.stringify({ error: error.message }),
      { status: 500, headers: { 'Content-Type': 'application/json' } }
    )
  }
})

Un cop aixo queda llest, ja podem posar a prova els correus:

Com podem veure, només 1 correu arriba, i aquest és el que m’envien a mi, ja que com no tenim accés al domini de l’institut no podem fer un enviament massiu:

Amb aixo ja quedaria fet.