Merge pull request gitroomhq#1 from iampearceman/notifications

Notifications

Author: iampearceman

.env.example

@@ -6,3 +6,6 @@ AUTH_TRUST_HOST=""
 MAILCHIMP_API_KEY=""
 MAILCHIMP_LIST_ID=""
 REDIS_URL=""
+NOVU_SECRET_KEY=""
+NOVU_BRIDGE_URL=""
+

.github/workflows/novu.yml

@@ -0,0 +1,15 @@
+# .github/workflows/novu.yml
+name: Novu Sync
+
+on:
+  workflow_dispatch:
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Sync State to Novu
+        uses: novuhq/actions-novu-sync@v2
+        with:
+          secret-key: ${{ secrets.NOVU_SECRET_KEY }}
+          bridge-url: <YOUR_DEPLOYED_BRIDGE_URL>

apps/frontend/src/app/api/novu/route.ts

@@ -0,0 +1,7 @@
+import { serve } from "@novu/framework/next";
+import { workflows } from "../../workflows/all-workflows";
+
+// the workflows collection can hold as many workflow definitions as you need
+export const { GET, POST, OPTIONS } = serve({
+  workflows: workflows,
+});

apps/frontend/src/app/workflows/all-workflows.ts

@@ -0,0 +1,5 @@
+import { chatNotification } from "./chat-notification/workflow";
+
+export const workflows = [
+  chatNotification,
+];

apps/frontend/src/app/workflows/chat-notification/email-template/sample-email.tsx

@@ -0,0 +1,19 @@
+import { z } from "zod";
+
+export const payloadSchema = z.object({
+  // Notification Fields
+  Subject: z.string().default("New Notification"),
+  Body: z.string().default("You have a new notification."),
+  showInAppAvatar: z.boolean().default(true),
+  Avatar: z.string().url().optional().default("https://example.com/default-avatar.png"),
+  
+  // Primary Action Fields
+  enablePrimaryAction: z.boolean().default(false),
+  inAppPrimaryActionLabel: z.string().optional().default("View"),
+  inAppPrimaryActionUrl: z.string().url().optional().default("https://example.com/action"),
+  
+  // Secondary Action Fields
+  enableSecondaryAction: z.boolean().default(false),
+  inAppSecondaryActionLabel: z.string().optional().default("Dismiss"),
+  inAppSecondaryActionUrl: z.string().url().optional().default("https://example.com/dismiss"),
+});

apps/frontend/src/app/workflows/chat-notification/payloadSchema.ts

@@ -0,0 +1,55 @@
+import { workflow } from '@novu/framework';
+import { payloadSchema } from './payloadSchema';
+// import { renderEmail } from './email-template/sample-email';
+
+// Define the name for your workflow
+const workflowName = 'chat-notification';
+
+// Define the workflow
+export const chatNotification = workflow(
+  workflowName,
+  async ({ step, payload }) => {
+    // Define the step for the workflow
+    // -----------------------------------in-app step-------------------------------------------------------------------------
+    await step.inApp('In App Step', async () => {
+      const result: {
+        subject: string;
+        body: string;
+        avatar?: string;
+        primaryAction?: {
+          label: string;
+          url: string;
+        };
+        secondaryAction?: {
+          label: string;
+          url: string;
+        };
+      } = {
+        subject: payload.Subject,
+        body: payload.Body,
+      };
+
+      if (payload.showInAppAvatar) {
+        result.avatar = payload.Avatar;
+      }
+
+      if (payload.enablePrimaryAction) {
+        result.primaryAction = {
+          label: payload.inAppPrimaryActionLabel,
+          url: payload.inAppPrimaryActionUrl,
+        };
+      }
+
+      if (payload.enableSecondaryAction) {
+        result.secondaryAction = {
+          label: payload.inAppSecondaryActionLabel,
+          url: payload.inAppSecondaryActionUrl,
+        };
+      }
+      return result;
+    });
+  },
+  {
+    payloadSchema: payloadSchema,
+  }
+);

apps/frontend/src/app/workflows/chat-notification/workflow.ts

@@ -2,6 +2,7 @@
 
 import { Button } from '@frontend/components/button';
 import { FC, useCallback, useEffect, useRef, useState } from 'react';
+import { Novu } from '@novu/node'; 
 import useSWR from 'swr';
 import dayjs from 'dayjs';
 import utc from 'dayjs/plugin/utc';
@@ -20,13 +21,35 @@ const SendMessage: FC<{ update: () => void }> = (props) => {
   const submit = useCallback(
     async (e: any) => {
       e.preventDefault();
-      await fetch('/api/dashboard/messages', {
-        method: 'POST',
-        body: JSON.stringify({ message: value }),
-      });
       if (value.length < 3) {
         return alert('You have to type at least 3 characters');
       }
+      
+      const response = await fetch('/api/dashboard/messages', {
+        method: 'POST',
+        body: JSON.stringify({ message: value }),
+      });
+      const newMessage = await response.json();
+
+      // Trigger Novu notification
+      const novu = new Novu(process.env['NOVU_SECRET_KEY']);
+      await novu.trigger('chat-notification', {
+        to: {
+          subscriberId: '<user-subscriber-id>',
+          email: '<user-email>' //optinal
+        },
+        payload: {
+          id: newMessage.id,
+          message: newMessage.message,
+          createdAt: newMessage.createdAt,
+          user: {
+            name: newMessage.user.name,
+            profilePicture: newMessage.user.profilePicture,
+            handle: newMessage.user.handle
+          }
+        }
+      });
+
       setValue('');
       props.update();
     },