diff --git a/Components/Calculation/addons/currency-addon.tsx b/Components/Calculation/addons/currency-addon.tsx
index 13baa60..c81a761 100644
--- a/Components/Calculation/addons/currency-addon.tsx
+++ b/Components/Calculation/addons/currency-addon.tsx
@@ -18,27 +18,26 @@ const CurrencyAddon = observer(() => {
 
   const currencyid = $calculation.$values.getValue('supplierCurrency');
 
-  const [currencySymbol, setCurrencySymbol] = useState('');
+  const [currencySymbol, setCurrencySymbol] = useState<string | null | undefined>(null);
 
-  const apolloClient = useApolloClient();
+  const { query } = useApolloClient();
 
-  if (currencyid) {
-    apolloClient
-      .query<GetCurrencySymbol, GetCurrencySymbolVariables>({
-        query: QUERY_GET_CURRENCY_SYMBOL,
-        variables: {
-          currencyid,
-        },
-      })
-      .then(({ data }) => {
-        setCurrencySymbol(data?.transactioncurrency?.currencysymbol || '');
-      })
-      .catch(() => {
-        setCurrencySymbol('');
-      });
-  }
+  if (!currencyid) return null;
 
-  return <div>{currencySymbol}</div>;
+  query<GetCurrencySymbol, GetCurrencySymbolVariables>({
+    query: QUERY_GET_CURRENCY_SYMBOL,
+    variables: {
+      currencyid,
+    },
+  })
+    .then(({ data }) => {
+      setCurrencySymbol(data?.transactioncurrency?.currencysymbol);
+    })
+    .catch(() => {
+      setCurrencySymbol(null);
+    });
+
+  return <span>{currencySymbol}</span>;
 });
 
 export default <CurrencyAddon />;