From acd1c878c912348bf4eeec216847d1aff8486a71 Mon Sep 17 00:00:00 2001
From: hamed musallam <hamed.musallam@gmail.com>
Date: Wed, 23 Aug 2023 11:56:04 +0200
Subject: [PATCH] feat: customize the NMRium default empty message

close #125
---
 src/NMRiumWrapper.tsx       |  5 ++++-
 src/hooks/usePreferences.ts | 25 ++++++++++++++++++++-----
 2 files changed, 24 insertions(+), 6 deletions(-)

diff --git a/src/NMRiumWrapper.tsx b/src/NMRiumWrapper.tsx
index 9dd3ebd..82eed38 100644
--- a/src/NMRiumWrapper.tsx
+++ b/src/NMRiumWrapper.tsx
@@ -34,7 +34,7 @@ export default function NMRiumWrapper() {
   const { allowedOrigins, isFetchAllowedOriginsPending } = useWhiteList();
   const nmriumRef = useRef<NMRiumRef>(null);
   const [data, setDate] = useState<NMRiumData>();
-  const { workspace, preferences } = usePreferences();
+  const { workspace, preferences, defaultEmptyMessage } = usePreferences();
   const dataChangeHandler = useCallback<OnNMRiumChange>((state, source) => {
     events.trigger('data-change', { state, source });
   }, []);
@@ -101,6 +101,8 @@ export default function NMRiumWrapper() {
     };
   });
 
+  console.log(defaultEmptyMessage);
+
   return (
     <div style={styles.container}>
       {isLoading ||
@@ -115,6 +117,7 @@ export default function NMRiumWrapper() {
         onChange={dataChangeHandler}
         preferences={preferences}
         workspace={workspace}
+        emptyText={defaultEmptyMessage}
       />
     </div>
   );
diff --git a/src/hooks/usePreferences.ts b/src/hooks/usePreferences.ts
index 557e602..f60f62d 100644
--- a/src/hooks/usePreferences.ts
+++ b/src/hooks/usePreferences.ts
@@ -2,11 +2,21 @@ import { WorkspacePreferences } from 'nmr-load-save';
 import { NMRiumWorkspace } from 'nmrium';
 import { useLayoutEffect, useState } from 'react';
 
+interface Preferences {
+  preferences: WorkspacePreferences | undefined;
+  workspace: NMRiumWorkspace | undefined;
+  defaultEmptyMessage: string | undefined;
+}
+
+const DEFAULT_PREFERENCES = {
+  preferences: undefined,
+  workspace: undefined,
+  defaultEmptyMessage: undefined,
+};
+
 export function usePreferences() {
-  const [configuration, setConfiguration] = useState<{
-    preferences: WorkspacePreferences | undefined;
-    workspace: NMRiumWorkspace | undefined;
-  }>({ preferences: undefined, workspace: undefined });
+  const [configuration, setConfiguration] =
+    useState<Preferences>(DEFAULT_PREFERENCES);
 
   useLayoutEffect(() => {
     const { href } = window.location;
@@ -14,6 +24,7 @@ export function usePreferences() {
 
     let preferences: WorkspacePreferences | undefined;
     let workspace: NMRiumWorkspace | undefined;
+    let defaultEmptyMessage: string | undefined;
 
     if (parameters.has('workspace')) {
       workspace = parameters.get('workspace') as NMRiumWorkspace;
@@ -21,7 +32,11 @@ export function usePreferences() {
     if (parameters.has('preferences')) {
       preferences = JSON.parse(parameters.get('preferences') || '');
     }
-    setConfiguration({ preferences, workspace });
+
+    if (parameters.has('defaultEmptyMessage')) {
+      defaultEmptyMessage = parameters.get('defaultEmptyMessage') as string;
+    }
+    setConfiguration({ preferences, workspace, defaultEmptyMessage });
   }, []);
 
   return configuration;