Bug fixes and feature addition

-- added option to accept public key request
This commit is contained in:
sairaj mote 2022-12-19 21:02:52 +05:30
parent 2b0e0b1b3b
commit 091e19c3a5
4 changed files with 86 additions and 43 deletions

View File

@ -1051,11 +1051,18 @@ ol li::before {
} }
.contact:not(.chat) { .contact:not(.chat) {
grid-template-columns: auto 1fr; grid-template-columns: auto 1fr;
grid-template-areas: "dp ."; grid-template-areas: "dp name";
} }
.contact.chat, .contact.group, .contact.pipeline { .contact.chat, .contact.group {
grid-template-columns: auto 1fr auto; grid-template-columns: auto 1fr auto;
grid-template-areas: "dp . time" "dp . ."; grid-template-areas: "dp name time" "dp . .";
}
.contact.pipeline {
grid-template-columns: auto 1fr auto;
grid-template-areas: "dp tag time" "dp name name" "dp . .";
}
.contact.pipeline .name {
margin: 0.5rem 0 0.3rem 0;
} }
.contact.admin { .contact.admin {
grid-template-columns: auto 1fr auto; grid-template-columns: auto 1fr auto;
@ -1073,7 +1080,18 @@ ol li::before {
overflow: hidden; overflow: hidden;
color: rgba(var(--text-color), 0.8); color: rgba(var(--text-color), 0.8);
} }
.contact .tag {
grid-area: tag;
font-size: 0.8rem;
padding: 0.2rem 0.4rem;
background-color: rgba(var(--text-color), 0.6);
color: rgba(var(--foreground-color), 1);
border-radius: 0.3rem;
margin-right: auto;
font-weight: 500;
}
.contact .name { .contact .name {
grid-area: name;
width: 100%; width: 100%;
font-size: 1em; font-size: 1em;
font-weight: 500; font-weight: 500;

2
css/main.min.css vendored

File diff suppressed because one or more lines are too long

View File

@ -1054,16 +1054,25 @@ ol {
&:not(.chat) { &:not(.chat) {
grid-template-columns: auto 1fr; grid-template-columns: auto 1fr;
grid-template-areas: "dp ."; grid-template-areas: "dp name";
} }
&.chat, &.chat,
&.group, &.group {
grid-template-columns: auto 1fr auto;
grid-template-areas:
"dp name time"
"dp . .";
}
&.pipeline { &.pipeline {
grid-template-columns: auto 1fr auto; grid-template-columns: auto 1fr auto;
grid-template-areas: grid-template-areas:
"dp . time" "dp tag time"
"dp name name"
"dp . ."; "dp . .";
.name {
margin: 0.5rem 0 0.3rem 0;
}
} }
&.admin { &.admin {
@ -1085,8 +1094,18 @@ ol {
overflow: hidden; overflow: hidden;
color: rgba(var(--text-color), 0.8); color: rgba(var(--text-color), 0.8);
} }
.tag {
grid-area: tag;
font-size: 0.8rem;
padding: 0.2rem 0.4rem;
background-color: rgba(var(--text-color), 0.6);
color: rgba(var(--foreground-color), 1);
border-radius: 0.3rem;
margin-right: auto;
font-weight: 500;
}
.name { .name {
grid-area: name;
width: 100%; width: 100%;
font-size: 1em; font-size: 1em;
font-weight: 500; font-weight: 500;

View File

@ -944,8 +944,8 @@
<p id="multisig_creation__warning" class="info info--warning"></p> <p id="multisig_creation__warning" class="info info--warning"></p>
<sm-form> <sm-form>
<p>Enter minimum signatures required for approval of a transaction</p> <p>Enter minimum signatures required for approval of a transaction</p>
<sm-input id="min_sign_required" placeholder="Min required" min="1" type="number" <sm-input id="min_sign_required" placeholder="Min required" min="2" type="number"
error-text="At least 1 member is required" animate required> error-text="At least 2 members are required" animate required>
</sm-input> </sm-input>
<div class="multi-state-button"> <div class="multi-state-button">
<button id="create_multisig_button" class="button button--primary" type="submit" disabled> <button id="create_multisig_button" class="button button--primary" type="submit" disabled>
@ -1828,7 +1828,7 @@
getRef('main_navbar').classList.remove('hide-on-mobile') getRef('main_navbar').classList.remove('hide-on-mobile')
} }
} }
messenger.list_request_received().then(requests => addNotificationBadge('#notification_panel_button', Object.keys(requests).length, { replace: true })) messenger.list_request_received({ completed: false }).then(requests => addNotificationBadge('#notification_panel_button', Object.keys(requests).length, { replace: true }))
removeNotificationBadge('#chat_page_button') removeNotificationBadge('#chat_page_button')
if (floGlobals.idInterval) if (floGlobals.idInterval)
clearInterval(floGlobals.idInterval) clearInterval(floGlobals.idInterval)
@ -2303,13 +2303,11 @@
getRef('private_key_field').removeAttribute('data-private-key'); getRef('private_key_field').removeAttribute('data-private-key');
getRef('private_key_field').setAttribute('placeholder', 'Password'); getRef('private_key_field').setAttribute('placeholder', 'Password');
getRef('private_key_field').customValidation = null getRef('private_key_field').customValidation = null
getRef('secure_pwd_button').closest('.card').classList.add('hidden');
} else { } else {
floGlobals.isPrivKeySecured = false; floGlobals.isPrivKeySecured = false;
getRef('private_key_field').dataset.privateKey = '' getRef('private_key_field').dataset.privateKey = ''
getRef('private_key_field').setAttribute('placeholder', 'FLO private key'); getRef('private_key_field').setAttribute('placeholder', 'FLO private key');
getRef('private_key_field').customValidation = floCrypto.getPubKeyHex; getRef('private_key_field').customValidation = floCrypto.getPubKeyHex;
getRef('secure_pwd_button').closest('.card').classList.remove('hidden');
} }
if (!generalPages.find(page => window.location.hash.includes(page))) { if (!generalPages.find(page => window.location.hash.includes(page))) {
location.hash = floGlobals.isPrivKeySecured ? '#/sign_in' : `#/landing`; location.hash = floGlobals.isPrivKeySecured ? '#/sign_in' : `#/landing`;
@ -2333,7 +2331,6 @@
floDapps.securePrivKey(password).then(() => { floDapps.securePrivKey(password).then(() => {
floGlobals.isPrivKeySecured = true; floGlobals.isPrivKeySecured = true;
notify('Password set successfully', 'success'); notify('Password set successfully', 'success');
getRef('secure_pwd_button').closest('.card').classList.add('hidden');
closePopup(); closePopup();
}).catch(err => { }).catch(err => {
notify(err, 'error'); notify(err, 'error');
@ -2465,6 +2462,7 @@
<div class="initial flex align-center"> <div class="initial flex align-center">
${initial} ${initial}
</div> </div>
${type === 'pipeline' ? html`<div class="tag">Multisig transaction</div>` : ''}
<h4 class="name">${name}</h4> <h4 class="name">${name}</h4>
</div> </div>
` `
@ -2680,16 +2678,14 @@
let { floID, message, time, type } = details let { floID, message, time, type } = details
if (message === '') if (message === '')
message = `${getContactName(floID)} wants to connect with you` message = `${getContactName(floID)} wants to connect with you`
return html` return html`
<li class="notification grid align-center" .dataset=${{ id }}> <li class="notification grid align-center" .dataset=${{ id }}>
<div class="flex align-center space-between gap-0-5"> <div class="flex align-center space-between gap-0-5">
<h4>${type}</h4> <h4>Connection request</h4>
<time class="notification__time">${getFormattedTime(time, 'relative')}</time> <time class="notification__time">${getFormattedTime(time, 'relative')}</time>
</div> </div>
<p class="notification__message">${message}</p> <p class="notification__message">${message}</p>
<div class="flex align-center gap-0-3 margin-left-auto"> <div class="flex align-center gap-0-3 margin-left-auto">
<button class="button button--small reject">Reject</button>
<button class="button button--small accept">Accept</button> <button class="button button--small accept">Accept</button>
</div> </div>
</li> </li>
@ -2697,9 +2693,10 @@
}, },
async notifications() { async notifications() {
try { try {
const notifications = await messenger.list_request_received() const notifications = await messenger.list_request_received({ completed: false })
let receivedRequests = [] let receivedRequests = []
for (const key in notifications) { for (const key in notifications) {
console.log(key, notifications[key])
receivedRequests.unshift(render.notification(key, notifications[key])) receivedRequests.unshift(render.notification(key, notifications[key]))
} }
renderElem(getRef('notifications_list'), html`${receivedRequests}`) renderElem(getRef('notifications_list'), html`${receivedRequests}`)
@ -2890,8 +2887,12 @@
} }
function updateMessageUI(messagesData, sentByMe = false) { function updateMessageUI(messagesData, sentByMe = false) {
const animOptions = {
duration: 300,
easing: 'ease',
fill: 'forwards'
}
for (let messageId in messagesData) { for (let messageId in messagesData) {
console.log(messagesData[messageId])
const { category, floID, time, message, sender, groupID, admin, name, pipeID, unconfirmed } = messagesData[messageId] const { category, floID, time, message, sender, groupID, admin, name, pipeID, unconfirmed } = messagesData[messageId]
// code to run if a chat is opened // code to run if a chat is opened
if (activeChat && activeChat.floID === (floID || groupID || pipeID)) { if (activeChat && activeChat.floID === (floID || groupID || pipeID)) {
@ -2900,24 +2901,9 @@
} else { } else {
const messageBody = render.messageBubble(messagesData[messageId]); const messageBody = render.messageBubble(messagesData[messageId]);
getRef('messages_container').append(messageBody) getRef('messages_container').append(messageBody)
if (unconfirmed) {
const messageHeight = getRef('messages_container').lastElementChild.clientHeight;
getRef('messages_container').animate([
{ transform: `translateY(${messageHeight}px)` },
{ transform: `none` },
], {
duration: 300,
easing: 'ease',
fill: 'forwards'
}).onfinish = e => {
e.target.cancel()
}
}
} }
if (chatScrollInfo['isScrolledUp']) { if (!chatScrollInfo['isScrolledUp']) {
scrollToBottom(true)
} else {
scrollToBottom()
} }
// remove encryption badge if it exists // remove encryption badge if it exists
if (!groupID && floGlobals.pubKeys[activeChat.floID] && floID !== floDapps.user.id) { if (!groupID && floGlobals.pubKeys[activeChat.floID] && floID !== floDapps.user.id) {
@ -2931,11 +2917,6 @@
chatCard.querySelector('.name').textContent = name chatCard.querySelector('.name').textContent = name
} }
if ((floID || groupID || pipeID) !== getRef('chats_list').children[0].dataset.floId) { if ((floID || groupID || pipeID) !== getRef('chats_list').children[0].dataset.floId) {
const animOptions = {
easing: 'ease',
duration: 300,
fill: 'forwards'
}
const cloneContact = chatCard.cloneNode(true) const cloneContact = chatCard.cloneNode(true)
chatCard.remove() chatCard.remove()
getRef('chats_list').animate([ getRef('chats_list').animate([
@ -3331,7 +3312,7 @@
getRef('min_sign_required').addEventListener('input', e => { getRef('min_sign_required').addEventListener('input', e => {
const { rangeOverflow, rangeUnderflow } = e.target.validity; const { rangeOverflow, rangeUnderflow } = e.target.validity;
if (rangeUnderflow) if (rangeUnderflow)
e.target.setAttribute('error-text', 'At least 1 member is required ') e.target.setAttribute('error-text', 'At least 2 members are required ')
if (rangeOverflow) if (rangeOverflow)
e.target.setAttribute('error-text', `Maximum ${selectedMembers.size + 1} allowed`) e.target.setAttribute('error-text', `Maximum ${selectedMembers.size + 1} allowed`)
}) })
@ -4433,7 +4414,6 @@
notify('Initiated transaction', 'success') notify('Initiated transaction', 'success')
closePopup(); closePopup();
getRef('send_tx').reset() getRef('send_tx').reset()
location.hash = `#/chat_page/messages?floId=${result}`
}).catch(error => { }).catch(error => {
notify(`Error intiating transaction \n ${error}`, 'error'); notify(`Error intiating transaction \n ${error}`, 'error');
}).finally(_ => { }).finally(_ => {
@ -4501,6 +4481,32 @@
document.querySelectorAll('.messenger-illustration').forEach(elem => { document.querySelectorAll('.messenger-illustration').forEach(elem => {
elem.innerHTML = messengerIllustration elem.innerHTML = messengerIllustration
}) })
delegate(getRef('notifications_list'), 'click', '.accept', e => {
getConfirmation('Are you sure you want to accept this request?').then((res) => {
if (!res) return;
const vectorClock = e.target.closest('.notification').dataset.id;
messenger.respond_pubKey(vectorClock).then(() => {
e.target.closest('.notification').remove()
notify('Request accepted', 'success')
}).catch(err => {
notify(`Error accepting request\n${err}`, 'error')
})
})
})
// delegate(getRef('notifications_list'), 'click', '.reject', e => {
// getConfirmation('Are you sure you want to reject this request?').then((res) => {
// if (!res) return;
// const vectorClock = e.target.closest('.notification').dataset.id;
// floCloudAPI.noteApplicationData(vectorClock, 'rejected').then(() => {
// e.target.closest('.notification').remove()
// notify('Request rejected', 'success')
// }).catch(err => {
// notify(`Error rejecting request\n${err}`, 'error')
// })
// })
// })
</script> </script>
</body> </body>