add new design (#70)

* add new design stuff

* add more ui things

* add more ui changes

* more ui changes

* add more design

* update emoji

apps/web/src/server/api/routers/campaign.ts

@@ -1,5 +1,6 @@
-import { Prisma } from "@prisma/client";
+import { CampaignStatus, Prisma } from "@prisma/client";
 import { TRPCError } from "@trpc/server";
+import { EmailRenderer } from "@unsend/email-editor/src/renderer";
 import { z } from "zod";
 import { env } from "~/env";
 import {
@@ -20,11 +21,14 @@ import {
   isStorageConfigured,
 } from "~/server/service/storage-service";
 
+const statuses = Object.values(CampaignStatus) as [CampaignStatus];
+
 export const campaignRouter = createTRPCRouter({
   getCampaigns: teamProcedure
     .input(
       z.object({
         page: z.number().optional(),
+        status: z.enum(statuses).optional().nullable(),
       })
     )
     .query(async ({ ctx: { db, team }, input }) => {
@@ -36,6 +40,10 @@ export const campaignRouter = createTRPCRouter({
         teamId: team.id,
       };
 
+      if (input.status) {
+        whereConditions.status = input.status;
+      }
+
       const countP = db.campaign.count({ where: whereConditions });
 
       const campaignsP = db.campaign.findMany({
@@ -48,6 +56,7 @@ export const campaignRouter = createTRPCRouter({
           createdAt: true,
           updatedAt: true,
           status: true,
+          html: true,
         },
         orderBy: {
           createdAt: "desc",
@@ -92,6 +101,7 @@ export const campaignRouter = createTRPCRouter({
         previewText: z.string().optional(),
         content: z.string().optional(),
         contactBookId: z.string().optional(),
+        replyTo: z.string().array().optional(),
       })
     )
     .mutation(async ({ ctx: { db, team, campaign: campaignOld }, input }) => {
@@ -113,10 +123,21 @@ export const campaignRouter = createTRPCRouter({
         const domain = await validateDomainFromEmail(data.from, team.id);
         domainId = domain.id;
       }
+
+      let html: string | null = null;
+
+      if (data.content) {
+        const jsonContent = data.content ? JSON.parse(data.content) : null;
+
+        const renderer = new EmailRenderer(jsonContent);
+        html = await renderer.render();
+      }
+
       const campaign = await db.campaign.update({
         where: { id: campaignId },
         data: {
           ...data,
+          html,
           domainId,
         },
       });

apps/web/src/server/api/routers/contacts.ts

@@ -1,4 +1,4 @@
-import { Prisma } from "@prisma/client";
+import { CampaignStatus, Prisma } from "@prisma/client";
 import { z } from "zod";
 
 import {
@@ -43,19 +43,31 @@ export const contactsRouter = createTRPCRouter({
 
   getContactBookDetails: contactBookProcedure.query(
     async ({ ctx: { contactBook, db } }) => {
-      const [totalContacts, unsubscribedContacts] = await Promise.all([
-        db.contact.count({
-          where: { contactBookId: contactBook.id },
-        }),
-        db.contact.count({
-          where: { contactBookId: contactBook.id, subscribed: false },
-        }),
-      ]);
+      const [totalContacts, unsubscribedContacts, campaigns] =
+        await Promise.all([
+          db.contact.count({
+            where: { contactBookId: contactBook.id },
+          }),
+          db.contact.count({
+            where: { contactBookId: contactBook.id, subscribed: false },
+          }),
+          db.campaign.findMany({
+            where: {
+              contactBookId: contactBook.id,
+              status: CampaignStatus.SENT,
+            },
+            orderBy: {
+              createdAt: "desc",
+            },
+            take: 2,
+          }),
+        ]);
 
       return {
         ...contactBook,
         totalContacts,
         unsubscribedContacts,
+        campaigns,
       };
     }
   ),
@@ -66,6 +78,7 @@ export const contactsRouter = createTRPCRouter({
         contactBookId: z.string(),
         name: z.string().optional(),
         properties: z.record(z.string()).optional(),
+        emoji: z.string().optional(),
       })
     )
     .mutation(async ({ ctx: { db }, input }) => {

apps/web/src/server/api/routers/email.ts

@@ -177,7 +177,7 @@ export const emailRouter = createTRPCRouter({
         select: {
           emailEvents: {
             orderBy: {
-              status: "asc",
+              status: "desc",
             },
           },
           id: true,