From 8926a9d7deeca6534014e3a3b1477c88295ce40a Mon Sep 17 00:00:00 2001
From: Muhammed Mustafa <mustafa@nocodb.com>
Date: Tue, 26 Sep 2023 15:25:06 +0000
Subject: [PATCH] fix: Fixed issue with icon font with safari

---
 packages/nc-gui/plugins/font.ts | 30 ++++++++++++++++++++++++++++--
 1 file changed, 28 insertions(+), 2 deletions(-)

diff --git a/packages/nc-gui/plugins/font.ts b/packages/nc-gui/plugins/font.ts
index 281a5bbc6b..1ba33dd2cc 100644
--- a/packages/nc-gui/plugins/font.ts
+++ b/packages/nc-gui/plugins/font.ts
@@ -10,12 +10,12 @@ export default defineNuxtPlugin(() => {
     const fontFaces = [...document.fonts.values()]
     const materialFont = fontFaces.find((fontFace) => fontFace.family === 'Material Symbols')
 
-    if (!materialFont || !materialFont?.loaded) {
+    if (!materialFont || !materialFont.loaded) {
       document.documentElement?.classList.remove('nc-fonts-not-loaded')
       return
     }
 
-    materialFont?.loaded
+    materialFont.loaded
       .then(function () {
         document.documentElement?.classList.remove('nc-fonts-not-loaded')
       })
@@ -23,6 +23,32 @@ export default defineNuxtPlugin(() => {
         document.documentElement?.classList.remove('nc-fonts-not-loaded')
         console.error(error)
       })
+
+    // Safari issue where loaded promise is always in pending state.
+    // So we need to poll for font status to be 'unloaded'
+    let intervalId: any
+
+    function poll() {
+      const fontFaces = [...document.fonts.values()]
+      const materialFont = fontFaces.find((fontFace) => fontFace.family === 'Material Symbols')
+
+      if (materialFont?.status === 'unloaded') {
+        document.documentElement?.classList.remove('nc-fonts-not-loaded')
+        stopPolling()
+      } else if (materialFont?.status === 'loaded') {
+        stopPolling()
+      }
+    }
+
+    function startPolling(interval: number) {
+      intervalId = setInterval(poll, interval)
+    }
+
+    function stopPolling() {
+      clearInterval(intervalId)
+    }
+
+    startPolling(200)
   } catch (error) {
     document.documentElement?.classList.remove('nc-fonts-not-loaded')
     console.error(error)