style: Tweak external link style.

laina-defi · Feb 5, 2025 · 2da6ff6 · 2da6ff6
1 parent 561f248
commit 2da6ff6
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 14 deletions.
diff --git a/src/components/Link.tsx b/src/components/Link.tsx
@@ -1,4 +1,4 @@
-import { GoLinkExternal } from 'react-icons/go';
+import { MdOutlineArrowOutward } from 'react-icons/md';
 
 export interface LinkProps {
   className?: string;
@@ -9,9 +9,9 @@ export interface LinkProps {
 export const StellarExpertLink = ({ className = '', text = 'View contract', contractId }: LinkProps) => {
   const href = `https://stellar.expert/explorer/testnet/contract/${contractId}`;
   return (
-    <a className={`link flex flex-row ${className}`} href={href} target="_blank" rel="noreferrer">
+    <a className={`link flex flex-row hover:text-grey transition ${className}`} href={href} target="_blank" rel="noreferrer">
       {text}
-      <GoLinkExternal className="ml-1 mt-1" size=".9rem" />
+      <MdOutlineArrowOutward className="mt-1" size=".9rem" />
     </a>
   );
 };
diff --git a/src/pages/_borrow/BorrowModal/BorrowModal.tsx b/src/pages/_borrow/BorrowModal/BorrowModal.tsx
@@ -12,7 +12,9 @@ export interface BorrowModalProps {
 }
 
 export const BorrowModal = ({ modalId, onClose, currency }: BorrowModalProps) => {
-  const { walletBalances, refetchBalances } = useWallet();
+  const { walletBalances } = useWallet();
+  // state to keep the user in the trustline step until they click ok.
+  const [isSettingTrustline, setIsSettingTrustline] = useState(false);
 
   if (!currency) {
     // Return an empty dialog if no currency set to make displaying the modal still work.
@@ -21,13 +23,6 @@ export const BorrowModal = ({ modalId, onClose, currency }: BorrowModalProps) =>
 
   const { ticker } = currency;
   const isTrustline = walletBalances?.[ticker].trustLine;
-  // state to keep the user in the trustline step until they click ok.
-  const [isSettingTrustline, setIsSettingTrustline] = useState(false);
-
-  const closeModal = () => {
-    refetchBalances();
-    onClose();
-  };
 
   const handleAddTrustline = () => {
     setIsSettingTrustline(true);
@@ -38,16 +33,16 @@ export const BorrowModal = ({ modalId, onClose, currency }: BorrowModalProps) =>
   };
 
   return (
-    <Dialog modalId={modalId} onClose={closeModal}>
+    <Dialog modalId={modalId} onClose={onClose}>
       {!isTrustline || isSettingTrustline ? (
         <TrustLineStep
-          onClose={closeModal}
+          onClose={onClose}
           currency={currency}
           onAddTrustline={handleAddTrustline}
           onTrustlineAdded={handleTrustlineAdded}
         />
       ) : (
-        <BorrowStep onClose={closeModal} currency={currency} />
+        <BorrowStep onClose={onClose} currency={currency} />
       )}
     </Dialog>
   );

diff --git a/src/pages/_borrow/BorrowPage.tsx b/src/pages/_borrow/BorrowPage.tsx
@@ -4,6 +4,8 @@ import { Card } from '@components/Card';
 import { StellarExpertLink } from '@components/Link';
 import { Table } from '@components/Table';
 import WalletCard from '@components/WalletCard/WalletCard';
+import { usePools } from '@contexts/pool-context';
+import { useWallet } from '@contexts/wallet-context';
 import { contractId } from '@contracts/loan_manager';
 import { CURRENCY_BINDINGS_ARR, type CurrencyBinding } from 'src/currency-bindings';
 import { BorrowModal } from './BorrowModal/BorrowModal';
@@ -15,6 +17,8 @@ const links = [
 ];
 
 const BorrowPage = () => {
+  const { refetchBalances } = useWallet();
+  const { refetchPools } = usePools();
   const [selectedCurrency, setSelectedCurrency] = useState<CurrencyBinding | null>(null);
 
   const modalId = 'borrow-modal';
@@ -29,6 +33,8 @@ const BorrowPage = () => {
     const modalEl = document.getElementById(modalId) as HTMLDialogElement;
     modalEl.close();
     setSelectedCurrency(null);
+    refetchBalances();
+    refetchPools();
   };
 
   return (