diff --git a/src/components/walletconnect/WcConnectionState/index.tsx b/src/components/walletconnect/WcConnectionState/index.tsx
index 1d1b194ce9..d3f4284e72 100644
--- a/src/components/walletconnect/WcConnectionState/index.tsx
+++ b/src/components/walletconnect/WcConnectionState/index.tsx
@@ -14,14 +14,17 @@ const WcConnectionState = ({ metadata, isDelete }: { metadata?: CoreTypes.Metada
+
+
+
{isDelete ? `${name} disconnected` : `${name} successfully connected!`}
diff --git a/src/components/walletconnect/WcConnectionState/styles.module.css b/src/components/walletconnect/WcConnectionState/styles.module.css
index 48ecf3ba5e..2eefac6993 100644
--- a/src/components/walletconnect/WcConnectionState/styles.module.css
+++ b/src/components/walletconnect/WcConnectionState/styles.module.css
@@ -19,3 +19,29 @@
.errorDots circle:nth-of-type(4) {
fill: var(--color-error-light);
}
+
+@keyframes blink {
+ 0% {
+ opacity: 0.2;
+ }
+ 100% {
+ transform: 1;
+ }
+}
+
+.dots circle {
+ animation: blink 1.5s ease-in-out infinite;
+}
+
+.dots circle:nth-of-type(1) {
+ animation-delay: 0;
+}
+.dots circle:nth-of-type(2),
+.dots circle:nth-of-type(5) {
+ animation-delay: 0.2s;
+}
+
+.dots circle:nth-of-type(3),
+.dots circle:nth-of-type(4) {
+ animation-delay: 0.3s;
+}