fix: highlight rejected certificate text

packages/lib/server-only/pdf/render-certificate.ts

@@ -78,6 +78,7 @@ const getDevice = (userAgent?: string | null): string => {
 const textMutedForegroundLight = '#929DAE';
 const textForeground = '#000';
 const textMutedForeground = '#64748B';
+const textRejectedRed = '#dc2626';
 const textBase = 10;
 const textSm = 9;
 const textXs = 8;
@@ -97,6 +98,8 @@ type RenderLabelAndTextOptions = {
   text: string;
   width: number;
   y?: number;
+  labelFill?: string;
+  valueFill?: string;
 };
 
 const renderLabelAndText = (options: RenderLabelAndTextOptions) => {
@@ -106,13 +109,16 @@ const renderLabelAndText = (options: RenderLabelAndTextOptions) => {
     y,
   });
 
+  const labelFill = options.labelFill ?? textMutedForeground;
+  const valueFill = options.valueFill ?? textMutedForeground;
+
   const label = new Konva.Text({
     x: 0,
     y: 0,
     text: `${options.label}: `,
     fontStyle: fontMedium,
     fontFamily: 'Inter',
-    fill: textMutedForeground,
+    fill: labelFill,
     fontSize: textSm,
   });
 
@@ -124,7 +130,7 @@ const renderLabelAndText = (options: RenderLabelAndTextOptions) => {
     width: width - label.width(),
     fontFamily: 'Inter',
     text: options.text,
-    fill: textMutedForeground,
+    fill: valueFill,
     wrap: 'char',
     fontSize: textSm,
   });
@@ -269,6 +275,8 @@ const renderColumnTwo = (options: RenderColumnOptions) => {
 
   const columnWidth = width - columnPadding;
 
+  const isRejected = Boolean(recipient.logs.rejected);
+
   if (recipient.signatureField?.secondaryId) {
     // Signature container with green border
     const signatureContainer = new Konva.Group({ x: 0, y: 0 });
@@ -313,7 +321,10 @@ const renderColumnTwo = (options: RenderColumnOptions) => {
       signatureContainer.add(typedSig);
     }
 
-    column.add(signatureContainer);
+    // Do not add the signature container for rejected recipients.
+    if (!isRejected) {
+      column.add(signatureContainer);
+    }
 
     const signatureHeight = Math.max(signatureContainer.getClientRect().height, minSignatureHeight);
 
@@ -342,7 +353,7 @@ const renderColumnTwo = (options: RenderColumnOptions) => {
     // Signature ID
     const sigIdLabel = new Konva.Text({
       x: 0,
-      y: signatureHeight + 10,
+      y: isRejected ? 0 : signatureHeight + 10,
       text: `${i18n._(msg`Signature ID`)}:`,
       fill: textMutedForeground,
       width: columnWidth,
@@ -400,7 +411,14 @@ const renderColumnThree = (options: RenderColumnOptions) => {
 
   const column = new Konva.Group();
 
-  const itemsToRender = [
+  type DetailItem = {
+    label: string;
+    value: string;
+    labelFill?: string;
+    valueFill?: string;
+  };
+
+  const itemsToRender: DetailItem[] = [
     {
       label: i18n._(msg`Sent`),
       value: recipient.logs.emailed
@@ -429,6 +447,8 @@ const renderColumnThree = (options: RenderColumnOptions) => {
       value: DateTime.fromJSDate(recipient.logs.rejected.createdAt)
         .setLocale(APP_I18N_OPTIONS.defaultLocale)
         .toFormat('yyyy-MM-dd hh:mm:ss a (ZZZZ)'),
+      labelFill: textRejectedRed,
+      valueFill: textRejectedRed,
     });
   } else {
     itemsToRender.push({
@@ -459,6 +479,8 @@ const renderColumnThree = (options: RenderColumnOptions) => {
       text: item.value,
       width,
       y: column.getClientRect().height + (index === 0 ? 0 : 8),
+      labelFill: item.labelFill,
+      valueFill: item.valueFill,
     });
     column.add(labelAndText);
   }