From 7b6ff3c040db3645249c69107ae204a3a2709daf Mon Sep 17 00:00:00 2001
From: DaveVodrazka <dave.vodrazka@gmail.com>
Date: Tue, 19 Nov 2024 15:57:59 +0100
Subject: [PATCH] fix: owned pail only if wallet connected

---
 src/components/ConnectWallet/Button.tsx | 15 ++++++++++++++
 src/components/PAIL/Owned.tsx           | 26 ++++++++++++++++++++++++-
 2 files changed, 40 insertions(+), 1 deletion(-)

diff --git a/src/components/ConnectWallet/Button.tsx b/src/components/ConnectWallet/Button.tsx
index 2636b44..0c32335 100644
--- a/src/components/ConnectWallet/Button.tsx
+++ b/src/components/ConnectWallet/Button.tsx
@@ -25,3 +25,18 @@ export const WalletButton = () => {
     </button>
   );
 };
+
+export const OpenWalletDialogButton = () => {
+  const { address } = useAccount();
+  const { openWalletConnectModal } = useConnectWallet();
+
+  if (address) {
+    return null;
+  }
+
+  return (
+    <button onClick={openWalletConnectModal} className="main primary active">
+      Connect Wallet
+    </button>
+  );
+};
diff --git a/src/components/PAIL/Owned.tsx b/src/components/PAIL/Owned.tsx
index 5df4d96..04db8bf 100644
--- a/src/components/PAIL/Owned.tsx
+++ b/src/components/PAIL/Owned.tsx
@@ -1,14 +1,38 @@
 import { LoadingAnimation } from "../Loading/Loading";
 import { usePailTokenIds } from "../../hooks/usePailTokenIds";
-import { useProvider, useSendTransaction } from "@starknet-react/core";
+import {
+  useAccount,
+  useProvider,
+  useSendTransaction,
+} from "@starknet-react/core";
 import { PAIL_ADDRESS, PAIL_NFT_ADDRESS } from "../../constants/amm";
 import toast from "react-hot-toast";
+import { OpenWalletDialogButton } from "../ConnectWallet/Button";
 
 export const Owned = () => {
+  const { address } = useAccount();
   const { isLoading, isError, error, data } = usePailTokenIds();
   const { sendAsync } = useSendTransaction({});
   const { provider } = useProvider();
 
+  if (!address) {
+    return (
+      <div style={{ width: "fit-content" }}>
+        <div
+          style={{
+            display: "flex",
+            flexFlow: "column",
+            alignItems: "center",
+            gap: "10px",
+          }}
+        >
+          <p>Connect wallet to see your positions</p>
+          <OpenWalletDialogButton />
+        </div>
+      </div>
+    );
+  }
+
   if (isLoading) {
     return <LoadingAnimation />;
   }