You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

89 lines
2.5 KiB

import React, {useState} from 'react';
import ContactForm from './ContactForm.jsx'
import styles from './styles'
import * as api from '../../api'
export default function ({contact,onSave,chats}){
const [edit, setEdit] = useState(false)
const [pay, setPay] = useState(false)
const [amount, setAmount] = useState(0)
const [paying, setPaying] = useState(false)
if (edit) {
return (
<li style={{background:'#eee',padding:10}}>
<ContactForm contact={contact} onSave={(id, values) => {
onSave(id, values)
setEdit(false)
}} onCancel={()=>setEdit(false)} />
</li>
)
}
function payButton() {
if(pay){
confirmPay()
} else {
setPay(true)
setAmount(0)
}
}
async function confirmPay() {
const amt = parseInt(amount)
console.log(chats)
console.log(contact)
const chatz = chats && chats.filter(c=> c.contact_ids.includes(parseInt(contact.id)))
console.log(chatz)
let chat
let n = 9999999
chatz && chatz.forEach(c=>{
if(c.contact_ids.length<n) {
n = c.contact_ids.length
chat = c // smallest for this user
}
})
console.log(chat)
if(!chat) return
setPaying(true)
if(window.testPurchaseMUID) {
await api.relay.POST('purchase',{
chat_id: chat.id,
contact_id: contact.id,
amount: amt,
muid: window.testPurchaseMUID
})
} else {
await api.relay.POST('payment',{
chat_id: chat.id,
contact_id: contact.id,
amount: amt,
})
}
setPay(false)
setPaying(false)
}
return <div style={styles.contact}>
<div>
<b>{contact.alias}</b> local_id: {contact.id}; remote_id: {contact.remote_id} <br />
<a style={{color:'blue'}}>{contact.public_key}</a><br/>
{contact.is_owner && <span className="ui label green">Is Node Owner</span>}
{contact.photo_url &&
<div>
<a href={contact.photo_url} target="_blank">{contact.photo_url}</a>
</div>
}
<a onClick={() => setEdit(true)}>Edit</a>
</div>
{!contact.is_owner && <div style={styles.payer}>
{pay && <div style={styles.x} onClick={()=>setPay(false)}>x</div>}
{pay && <input type="number" style={styles.input}
value={amount} onChange={e=> setAmount(e.target.value)}
/>}
<button style={styles.pay}
disabled={(pay && !amount) || paying}
onClick={payButton}>
{pay ? 'Confirm' : `Pay ${contact.alias}`}
</button>
</div>}
</div>
}