From ba06f3043f284a1bbeb631a2301167993b966948 Mon Sep 17 00:00:00 2001
From: ekzyis <ek@stacker.news>
Date: Tue, 22 Oct 2024 21:07:09 +0200
Subject: [PATCH] Color send & recv badges

---
 components/wallet-card.js          | 16 ++++++++++++----
 styles/wallet.module.css           |  8 ++++++++
 wallets/blink/index.js             |  2 +-
 wallets/cln/index.js               |  2 +-
 wallets/lightning-address/index.js |  2 +-
 wallets/lnbits/index.js            |  2 +-
 wallets/lnc/index.js               |  2 +-
 wallets/lnd/index.js               |  2 +-
 wallets/nwc/index.js               |  2 +-
 wallets/phoenixd/index.js          |  2 +-
 wallets/webln/index.js             |  2 +-
 11 files changed, 29 insertions(+), 13 deletions(-)

diff --git a/components/wallet-card.js b/components/wallet-card.js
index aedd792c..e1ae443c 100644
--- a/components/wallet-card.js
+++ b/components/wallet-card.js
@@ -51,10 +51,18 @@ export default function WalletCard ({ wallet, draggable, onDragStart, onDragEnte
         <Card.Title>{title}</Card.Title>
         <Card.Subtitle className='mt-2'>
           {badges?.map(
-            badge =>
-              <Badge className={styles.badge} key={badge} bg={null}>
-                {badge}
-              </Badge>)}
+            badge => {
+              let style = ''
+              switch (badge) {
+                case 'receive': style = styles.receive; break
+                case 'send': style = styles.send; break
+              }
+              return (
+                <Badge className={`${styles.badge} ${style}`} key={badge} bg={null}>
+                  {badge}
+                </Badge>
+              )
+            })}
         </Card.Subtitle>
       </Card.Body>
       <Link href={`/settings/wallets/${wallet.name}`}>
diff --git a/styles/wallet.module.css b/styles/wallet.module.css
index e4e8744a..133734d4 100644
--- a/styles/wallet.module.css
+++ b/styles/wallet.module.css
@@ -40,6 +40,14 @@
   margin-right: 0.2rem;
 }
 
+.receive {
+  color: #20c997 !important;
+}
+
+.send {
+  color: var(--bs-primary) !important;
+}
+
 .attach {
   color: var(--bs-body-color) !important;
   text-align: center;
diff --git a/wallets/blink/index.js b/wallets/blink/index.js
index 6cbc3ff8..dc93d042 100644
--- a/wallets/blink/index.js
+++ b/wallets/blink/index.js
@@ -28,7 +28,7 @@ export const fields = [
 export const card = {
   title: 'Blink',
   subtitle: 'use [Blink](https://blink.sv/) for payments',
-  badges: ['send only']
+  badges: ['send']
 }
 
 export const fieldValidation = blinkSchema
diff --git a/wallets/cln/index.js b/wallets/cln/index.js
index 644b7748..31e05606 100644
--- a/wallets/cln/index.js
+++ b/wallets/cln/index.js
@@ -36,7 +36,7 @@ export const fields = [
 export const card = {
   title: 'CLN',
   subtitle: 'autowithdraw to your Core Lightning node via [CLNRest](https://docs.corelightning.org/docs/rest)',
-  badges: ['receive only']
+  badges: ['receive']
 }
 
 export const fieldValidation = CLNAutowithdrawSchema
diff --git a/wallets/lightning-address/index.js b/wallets/lightning-address/index.js
index ff502a3a..9a881d03 100644
--- a/wallets/lightning-address/index.js
+++ b/wallets/lightning-address/index.js
@@ -15,7 +15,7 @@ export const fields = [
 export const card = {
   title: 'lightning address',
   subtitle: 'autowithdraw to a lightning address',
-  badges: ['receive only']
+  badges: ['receive']
 }
 
 export const fieldValidation = lnAddrAutowithdrawSchema
diff --git a/wallets/lnbits/index.js b/wallets/lnbits/index.js
index 3473f47e..a4425911 100644
--- a/wallets/lnbits/index.js
+++ b/wallets/lnbits/index.js
@@ -29,7 +29,7 @@ export const fields = [
 export const card = {
   title: 'LNbits',
   subtitle: 'use [LNbits](https://lnbits.com/) for payments',
-  badges: ['send & receive']
+  badges: ['send', 'receive']
 }
 
 export const fieldValidation = lnbitsSchema
diff --git a/wallets/lnc/index.js b/wallets/lnc/index.js
index e349b6dd..b86153da 100644
--- a/wallets/lnc/index.js
+++ b/wallets/lnc/index.js
@@ -33,7 +33,7 @@ export const fields = [
 export const card = {
   title: 'LNC',
   subtitle: 'use Lightning Node Connect for LND payments',
-  badges: ['send only', 'budgetable']
+  badges: ['send', 'budgetable']
 }
 
 export const fieldValidation = lncSchema
diff --git a/wallets/lnd/index.js b/wallets/lnd/index.js
index c884b909..21123cb5 100644
--- a/wallets/lnd/index.js
+++ b/wallets/lnd/index.js
@@ -37,7 +37,7 @@ export const fields = [
 export const card = {
   title: 'LND',
   subtitle: 'autowithdraw to your Lightning Labs node',
-  badges: ['receive only']
+  badges: ['receive']
 }
 
 export const fieldValidation = LNDAutowithdrawSchema
diff --git a/wallets/nwc/index.js b/wallets/nwc/index.js
index fe443968..cd125769 100644
--- a/wallets/nwc/index.js
+++ b/wallets/nwc/index.js
@@ -27,7 +27,7 @@ export const fields = [
 export const card = {
   title: 'NWC',
   subtitle: 'use Nostr Wallet Connect for payments',
-  badges: ['send & receive', 'budgetable']
+  badges: ['send', 'receive', 'budgetable']
 }
 
 export const fieldValidation = nwcSchema
diff --git a/wallets/phoenixd/index.js b/wallets/phoenixd/index.js
index 51625937..5a24e304 100644
--- a/wallets/phoenixd/index.js
+++ b/wallets/phoenixd/index.js
@@ -33,7 +33,7 @@ export const fields = [
 export const card = {
   title: 'phoenixd',
   subtitle: 'use [phoenixd](https://phoenix.acinq.co/server) for payments',
-  badges: ['send & receive']
+  badges: ['send', 'receive']
 }
 
 // phoenixd::TODO
diff --git a/wallets/webln/index.js b/wallets/webln/index.js
index 6bfb26d5..75ca3dd8 100644
--- a/wallets/webln/index.js
+++ b/wallets/webln/index.js
@@ -20,7 +20,7 @@ export const fieldValidation = ({ enabled }) => {
 export const card = {
   title: 'WebLN',
   subtitle: 'use a [WebLN provider](https://www.webln.guide/ressources/webln-providers) for payments',
-  badges: ['send only']
+  badges: ['send']
 }
 
 export default function WebLnProvider ({ children }) {