diff --git a/public/assets/qr-multipass.png b/public/assets/qr-multipass.png
deleted file mode 100644
index d5724bd3f3..0000000000
Binary files a/public/assets/qr-multipass.png and /dev/null differ
diff --git a/public/assets/qr-multipass.svg b/public/assets/qr-multipass.svg
new file mode 100644
index 0000000000..b6702a9300
--- /dev/null
+++ b/public/assets/qr-multipass.svg
@@ -0,0 +1,319 @@
+
diff --git a/src/components/WalletConnect/MultipassItem.tsx b/src/components/WalletConnect/MultipassItem.tsx
index 85ab91ae4d..cd999f9539 100644
--- a/src/components/WalletConnect/MultipassItem.tsx
+++ b/src/components/WalletConnect/MultipassItem.tsx
@@ -1,15 +1,19 @@
import styled from '@emotion/styled'
-const Multipass = () => {
+interface Props {
+ handleClick: () => void
+}
+
+const MultipassItem = ({ handleClick }: Props) => {
return (
-
+
)
@@ -44,4 +48,4 @@ const QRCodeContainer = styled.div`
}
`
-export default Multipass
+export default MultipassItem
diff --git a/src/components/WalletConnect/WalletConnect.tsx b/src/components/WalletConnect/WalletConnect.tsx
index abb8a05749..8edba7f637 100644
--- a/src/components/WalletConnect/WalletConnect.tsx
+++ b/src/components/WalletConnect/WalletConnect.tsx
@@ -132,7 +132,12 @@ const Dropdown: React.FC = () => {
{walletAddress == null ? (
showMultiPass ? (
-
+ {
+ setIsExpanded(false)
+ setShowMultiPass(false)
+ }}
+ />
) : (
options.map((option, index) => (