feat(mfi-v2-ui): spinner when refreshing quotes

apps/marginfi-v2-ui/src/components/Spinner.tsx

@@ -0,0 +1,13 @@
+export const Spinner = () => (              <svg
+  className="animate-spin ml-1 mr-3 h-5 w-5 text-white"
+  xmlns="http://www.w3.org/2000/svg"
+  fill="none"
+  viewBox="0 0 24 24"
+>
+  <circle width="opacity-10" cx="12" cy="12" r="10" stroke="#aaa" strokeWidth="4"></circle>
+  <path
+    width="opacity-100"
+    fill="#DCE85D"
+    d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+  ></path>
+</svg>) 

apps/marginfi-v2-ui/src/components/Staking/StakingCard/StakingCard.tsx

@@ -42,6 +42,7 @@ import { SettingsIcon } from "./SettingsIcon";
 import { SOL_MINT, TokenData, TokenDataMap } from "~/store/lstStore";
 import { RefreshIcon } from "./RefreshIcon";
 import { StakePoolProxyProgram } from "~/utils/stakePoolProxy";
+import { Spinner } from "~/components/Spinner";
 
 const QUOTE_EXPIRY_MS = 30_000;
 
@@ -458,7 +459,15 @@ export const StakingCard: FC = () => {
             loading={connected && !!ongoingAction}
             onClick={connected ? onMint : openWalletSelector}
           >
-            {!connected ? "connect" : ongoingAction ? `${ongoingAction}...` : "mint"}
+            {!connected ? (
+              "connect"
+            ) : ongoingAction ? (
+              `${ongoingAction}...`
+            ) : refreshingQuotes ? (
+              <Spinner />
+            ) : (
+              "mint"
+            )}
           </PrimaryButton>
         </div>
         <div className="flex flex-row justify-between w-full my-auto">