From 031bdcfeb52f37f717b87e5de79502a80da6f2a2 Mon Sep 17 00:00:00 2001
From: Adria Navarro <adria@budibase.com>
Date: Thu, 26 Sep 2024 13:41:54 +0200
Subject: [PATCH] Display signatures

---
 .../src/components/grid/cells/AttachmentCell.svelte | 13 ++++++++++++-
 .../src/components/grid/stores/rows.js              |  2 +-
 2 files changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/frontend-core/src/components/grid/cells/AttachmentCell.svelte b/packages/frontend-core/src/components/grid/cells/AttachmentCell.svelte
index 285577a71c..029fdfd726 100644
--- a/packages/frontend-core/src/components/grid/cells/AttachmentCell.svelte
+++ b/packages/frontend-core/src/components/grid/cells/AttachmentCell.svelte
@@ -2,6 +2,7 @@
   import { onMount, getContext } from "svelte"
   import { Dropzone } from "@budibase/bbui"
   import GridPopover from "../overlays/GridPopover.svelte"
+  import { FieldType } from "@budibase/types"
 
   export let value
   export let focused = false
@@ -82,7 +83,12 @@
   {#each value || [] as attachment}
     {#if attachment}
       {#if isImage(attachment.extension)}
-        <img src={attachment.url} alt={attachment.extension} />
+        <img
+          class:light={!$props?.darkMode &&
+            schema.type === FieldType.SIGNATURE_SINGLE}
+          src={attachment.url}
+          alt={attachment.extension}
+        />
       {:else}
         <div class="file" title={attachment.name}>
           {attachment.extension}
@@ -142,4 +148,9 @@
     width: 320px;
     padding: var(--cell-padding);
   }
+
+  .attachment-cell img.light {
+    -webkit-filter: invert(100%);
+    filter: invert(100%);
+  }
 </style>
diff --git a/packages/frontend-core/src/components/grid/stores/rows.js b/packages/frontend-core/src/components/grid/stores/rows.js
index 7317611b5e..25acad6520 100644
--- a/packages/frontend-core/src/components/grid/stores/rows.js
+++ b/packages/frontend-core/src/components/grid/stores/rows.js
@@ -5,7 +5,7 @@ import { getCellID, parseCellID } from "../lib/utils"
 import { tick } from "svelte"
 import { Helpers } from "@budibase/bbui"
 import { sleep } from "../../../utils/utils"
-import { FieldType, RelationshipType } from "@budibase/types"
+import { FieldType } from "@budibase/types"
 import { getRelatedTableValues } from "../../../utils"
 
 export const createStores = () => {