[TRI-1428] : Improve the SendGrid integration documentation

docs/integrations/apis/sendgrid-tasks.mdx

@@ -0,0 +1,96 @@
+---
+title: SendGrid tasks
+sidebarTitle: Tasks
+---
+
+Tasks are executed after the job is triggered and are the main building blocks of a job. You can string together as many tasks as you want.
+
+---
+
+## All tasks
+
+### `sendEmail`
+
+Send an email with a body. [Official SendGrid Docs](https://docs.sendgrid.com/for-developers/sending-email)
+
+```ts example.ts
+  // Using the 'io.sendgrid.sendEmail' method to send an email using SendGrid.
+  await io.sendgrid.sendEmail({
+    to: <recipient-email-address>, // Recipient's email address.
+    from: "Your-Name <your-email-address>", // Sender's email address and name.
+    subject: <email-subject>, // Email subject.
+    text: <email-body>, // Plain text content of the email.
+  });
+}
+
+```
+
+## Example usage
+
+In this example, we will send weekly summary emails to users who have `summariesEnabled = true`, at 4pm every Friday, and then posts the total numbers to Slack.
+
+```ts example.ts
+import { TriggerClient, cronTrigger } from "@trigger.dev/sdk";
+import { SendGrid } from "@trigger.dev/sendgrid";
+import { Slack } from "@trigger.dev/slack";
+import { weeklySummaryDb } from "./mocks/db";
+import { weeklySummaryEmail } from "./mocks/emails";
+
+// Creating an instance of the TriggerClient with a unique identifier "jobs-showcase."
+const client = new TriggerClient({ id: "jobs-showcase" });
+
+// Creating instances of SendGrid and Slack clients.
+const sendgrid = new SendGrid({
+  id: "sendgrid",
+  apiKey: process.env.SENDGRID_API_KEY!,
+});
+
+const slack = new Slack({ id: "slack" });
+
+// Defining a job that sends a weekly summary email to users and posts total numbers to Slack.
+client.defineJob({
+  id: "weekly-user-activity-summary", // Unique identifier for the job.
+  name: "Weekly user activity summary", // A specific name for the job.
+  version: "1.0.0", // Version number for the job.
+  integrations: { sendgrid, slack }, // Integrating SendGrid and Slack clients into this job.
+  trigger: cronTrigger({
+    // Setting a cron schedule to run the job every Friday at 4 pm.
+    cron: "0 16 * * 5",
+  }),
+  run: async (payload, io, ctx) => {
+    // Inside the 'run' function, several operations are performed to send weekly summaries and post to Slack.
+
+    // Retrieving a list of users from the weeklySummaryDb.
+    const users = await weeklySummaryDb.getUsers();
+
+    let sentCount = 0;
+    let notSentCount = 0;
+
+    // Iterating through the list of users.
+    for (const user of users) {
+      if (user.summariesEnabled) {
+        // Sending a weekly summary email to users with summaries enabled.
+        await io.sendgrid.sendEmail(`Weekly summary for ${user.id}`, {
+          to: user.email,
+          from: "hello@acme.inc", // The sender's email.
+          subject: "Your weekly summary",
+          html: weeklySummaryEmail(user), // HTML content for the email.
+        });
+        sentCount++;
+      } else {
+        notSentCount++;
+      }
+    }
+
+    // Posting a message to Slack with a summary of the sent and unsent emails.
+    await io.slack.postMessage("Notify team", {
+      text: `Weekly summary sent to ${sentCount} users and not sent to ${notSentCount} users`,
+      channel: "YOUR_CHANNEL_ID", // Specify the Slack channel ID for posting the message.
+    });
+  },
+});
+
+// If you're not using Express, you can remove these lines.
+import { createExpressServer } from "@trigger.dev/express";
+createExpressServer(client);
+```

docs/integrations/apis/sendgrid.mdx

@@ -1,10 +1,23 @@
 ---
-title: SendGrid
+title: SendGrid overview & authentication
+sidebarTitle: Overview & authentication
 ---
 
-<Snippet file="integration-getting-started.mdx" />
+## Overview
 
-## Installation
+SendGrid is a cloud-based SMTP provider that allows you to send email without having to maintain email servers. SendGrid 
+manages all of the technical details, from scaling the infrastructure to ISP outreach and reputation monitoring to whitelist 
+services and real time analytics.
+
+<Card
+  title="Jobs Showcase - SendGrid"
+  icon="rocket"
+  href="https://trigger.dev/showcase?tags=&integrations=sendgrid"
+>
+  Check out pre-built SendGrid jobs in our showcase.
+</Card>
+
+## Installing the SendGrid packages
 
 <CodeGroup>
 
@@ -24,7 +37,7 @@ yarn add @trigger.dev/sendgrid@latest
 
 ## Authentication
 
-SendGrid integration supports API Keys. To authenticate, you'll need to create an instance of the SendGrid class and provide your API key.
+SendGrid integration supports API Keys. To authenticate, you'll need to create an instance of the SendGrid class and provide your API key. You can find the official SendGrid documentation to configure an API key [here](https://docs.sendgrid.com/ui/account-and-settings/api-keys).
 
 ```ts
 import { SendGrid } from "@trigger.dev/sendgrid";
@@ -35,50 +48,13 @@ const sendgrid = new SendGrid({
 });
 ```
 
-## Example
-
-In this example we use [Zod](/documentation/guides/zod), a TypeScript-first schema declaration and validation library.
-
-```ts
-import { SendGrid } from "@trigger.dev/sendgrid";
-import { Job, eventTrigger } from "@trigger.dev/sdk";
-import { z } from "zod";
-
-// Create an instance of SendGrid
-const sendgrid = new SendGrid({
-  id: "sendgrid",
-  apiKey: process.env.SENDGRID_API_KEY!,
-});
-
-// Define a Trigger.dev job
-client.defineJob({
-  id: "send-sendgrid-email",
-  name: "Send SendGrid Email",
-  version: "0.1.0",
-  trigger: eventTrigger({
-    name: "send.email",
-    schema: z.object({
-      to: z.string(),
-      subject: z.string(),
-      text: z.string(),
-    }),
-  }),
-  integrations: {
-    sendgrid,
-  },
-  run: async (payload, io, ctx) => {
-    await io.sendgrid.sendEmail({
-      to: payload.to,
-      from: "Trigger.dev <hello@email.trigger.dev>",
-      subject: payload.subject,
-      text: payload.text,
-    });
-  },
-});
-```
 
 ## Tasks
 
-| Function Name | Description   |
-| ------------- | ------------- |
-| `sendEmail`   | Send an email |
+Once you have set up a SendGrid client, you can use it to create tasks.
+
+<CardGroup>
+  <Card title="Tasks" icon="sparkles" href="/integrations/apis/sendgrid-tasks">
+    Perform tasks such as sending emails to clients on certain trigger events.
+  </Card>
+</CardGroup>

docs/mint.json

@@ -277,14 +277,20 @@
           ]
         },
         "integrations/apis/replicate",
+        {
+          "group": "SendGrid",
+          "pages": [
+            "integrations/apis/sendgrid",
+            "integrations/apis/sendgrid-tasks"
+          ]
+        },
         {
           "group": "Resend",
           "pages": [
             "integrations/apis/resend",
             "integrations/apis/resend-tasks"
           ]
         },
-        "integrations/apis/sendgrid",
         {
           "group": "Slack",
           "pages": [