From 3b82b14369d084690019ab0d7306838841c4805d Mon Sep 17 00:00:00 2001
From: Dayvvo <dyvvoo@gmail.com>
Date: Wed, 6 Mar 2024 14:09:47 +0100
Subject: [PATCH] chore: add information about dev setup and include link to
 dev setup page in conributing.md documentation

---
 CONTRIBUTING.md                |  6 ++++++
 src/components/BitcoinQR.tsx   | 14 +++++++++++---
 src/constants/debugFeatures.ts |  2 +-
 3 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 7fdce187c..c565e60c0 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -105,6 +105,12 @@ npm run dev:start
 
 Enjoy the test drive!
 
+## Dev Setup Page
+
+When running Jam in dev mode, Additional Jam instances are provided by default. These instances can be used to set up different wallets and simulate collaborative transactions between themselves as though between different identities. A block explorer and RPC terminal are also available for directly interacting with the regtest node that Jam uses.
+
+Information on how to access these development features can be found on the _/dev-setup_ route at port 3000
+
 ## Reporting Issues
 
 Reporting an issue is as easy as [opening one on GitHub](https://github.com/joinmarket-webui/jam/issues/new).
diff --git a/src/components/BitcoinQR.tsx b/src/components/BitcoinQR.tsx
index a033b4636..57ab8a90f 100644
--- a/src/components/BitcoinQR.tsx
+++ b/src/components/BitcoinQR.tsx
@@ -3,7 +3,6 @@ import QRCode from 'qrcode'
 
 import { satsToBtc } from '../utils'
 import { AmountSats, BitcoinAddress } from '../libs/JmWalletApi'
-
 interface BitcoinQRProps {
   address: BitcoinAddress
   amount?: AmountSats
@@ -23,7 +22,7 @@ export const BitcoinQR = ({ address, amount, errorCorrectionLevel = 'H', width =
       errorCorrectionLevel,
       width,
     })
-      .then((val) => {
+      .then(async (val) => {
         setImage(val)
         setData(uri)
       })
@@ -33,9 +32,18 @@ export const BitcoinQR = ({ address, amount, errorCorrectionLevel = 'H', width =
       })
   }, [address, amount, errorCorrectionLevel, width])
 
+  const handleFile = async () => {
+    let fileBlob = await fetch(image as string).then((img) => img.blob())
+    const file = new File([fileBlob], 'btcAddress.png', { type: 'image/png' })
+    await navigator.share({
+      text: 'Type sharing',
+      url: 'http://fileshare.com',
+    })
+  }
+
   return (
     <div>
-      <img src={image} alt={data} title={data} />
+      <img src={image} onClick={handleFile} alt={data} title={data} />
     </div>
   )
 }
diff --git a/src/constants/debugFeatures.ts b/src/constants/debugFeatures.ts
index ce284b34a..e8bc3eee0 100644
--- a/src/constants/debugFeatures.ts
+++ b/src/constants/debugFeatures.ts
@@ -11,7 +11,7 @@ interface DebugFeatures {
 }
 
 const devMode = process.env.NODE_ENV === 'development' && process.env.REACT_APP_JAM_DEV_MODE === 'true'
-
+console.log('dev mode', process.env)
 const debugFeatures: DebugFeatures = {
   allowCreatingExpiredFidelityBond: devMode,
   insecureScheduleTesting: devMode,