Improve friends request section

This commit is contained in:
Rogerio Chaves 2020-04-12 11:10:39 +02:00
parent ad65a8364e
commit 18a618a15d
No known key found for this signature in database
GPG Key ID: E6AF5440509B1D94
4 changed files with 77 additions and 81 deletions

View File

@ -239,24 +239,43 @@ const searchPeople = (ssbServer, search) =>
const getFriends = async (ssbServer, profile) => {
debugFriends("Fetching");
let followingPromise = new Promise((resolve, reject) => {
let contacts = await new Promise((resolve, reject) => {
pull(
ssbServer.query.read({
reverse: true,
query: [
{
$filter: {
value: {
author: profile.id,
content: {
type: "contact",
// @ts-ignore
cat([
ssbServer.query.read({
reverse: true,
query: [
{
$filter: {
value: {
author: profile.id,
content: {
type: "contact",
},
},
},
},
},
],
limit: 100,
}),
],
limit: 100,
}),
ssbServer.query.read({
reverse: true,
query: [
{
$filter: {
value: {
content: {
type: "contact",
contact: profile.id,
},
},
},
},
],
limit: 100,
}),
]),
pull.collect((err, msgs) => {
const entries = msgs.map((x) => x.value);
@ -266,42 +285,8 @@ const getFriends = async (ssbServer, profile) => {
);
});
let followersPromise = new Promise((resolve, reject) => {
pull(
ssbServer.query.read({
reverse: true,
query: [
{
$filter: {
value: {
content: {
type: "contact",
contact: profile.id,
},
},
},
},
],
limit: 100,
}),
pull.collect((err, msgs) => {
const entries = msgs.map((x) => x.value);
if (err) return reject(err);
return resolve(entries);
})
);
});
const [following, followers] = await Promise.all([
followingPromise,
followersPromise,
]);
const allContacts = following.concat(followers).reverse();
let network = {};
for (let contact of allContacts) {
for (let contact of contacts.reverse()) {
if (contact.content.following) {
network[contact.author] = network[contact.author] || {};
network[contact.author][contact.content.contact] = true;

View File

@ -18,7 +18,7 @@ messages.forEach((message) => {
const parent = modal.parentElement;
parent.parentElement.removeChild(parent);
if (document.querySelectorAll(".vanishing-message").length == 0) {
document.querySelector(".vanishing-messages").style.display = "none";
document.querySelector(".js-vanishing-messages").style.display = "none";
}
};

View File

@ -170,20 +170,29 @@ h2 {
width: 300px;
}
button.vanishing-message {
.notifications {
display: flex;
align-content: flex-start;
}
a.notification-box,
button.notification-box {
background: none;
width: 84px;
text-align: center;
border: 1px solid #333;
padding: 10px;
cursor: pointer;
color: #000;
margin-right: 8px;
padding: 5px;
text-decoration: none;
display: inline-block;
border-radius: 3px;
}
button.vanishing-message:hover {
background: #ddd;
color: #5f5f5f;
a.notification-box:hover,
button.notification-box:hover {
background: #e2e2e2;
color: #000;
}
.overlay {

View File

@ -23,38 +23,40 @@
<div class="wall">
<% if (vanishingMessages.length > 0) { %>
<div class="vanishing-messages" style="padding-bottom: 20px">
<div class="js-vanishing-messages" style="padding-bottom: 20px">
<h2>Vanishing Messages</h2>
<% vanishingMessages.reverse().map(message => { %>
<span>
<button class="vanishing-message js-vanishing-message" data-key="<%= message.key %>">
<div><img src="<%= profileImageUrl(message.value.authorProfile) %>" class="post-profile-pic" /></div>
<div><%= message.value.authorProfile.name %></div>
</button>
<div class="overlay"></div>
<div class="modal">
<a href="<%= profileUrl(message.value.authorProfile.id) %>" class="modal-header">
<img src="<%= profileImageUrl(message.value.authorProfile) %>" class="post-profile-pic" style="padding-right: 10px" />
<%= message.value.authorProfile.name %>
</a>
<div class="modal-body">
<%= message.value.content.text %>
<div class="notifications">
<% vanishingMessages.reverse().map(message => { %>
<span>
<button class="notification-box js-vanishing-message" data-key="<%= message.key %>">
<div><img src="<%= profileImageUrl(message.value.authorProfile) %>" class="post-profile-pic" /></div>
<div><%= message.value.authorProfile.name %></div>
</button>
<div class="overlay"></div>
<div class="modal">
<a href="<%= profileUrl(message.value.authorProfile.id) %>" class="modal-header">
<img src="<%= profileImageUrl(message.value.authorProfile) %>" class="post-profile-pic" style="padding-right: 10px" />
<%= message.value.authorProfile.name %>
</a>
<div class="modal-body">
<%= message.value.content.text %>
</div>
<div class="modal-footer">
after you close this box the message will be gone forever
<button class="modal-close">Close</button>
</div>
</div>
<div class="modal-footer">
after you close this box the message will be gone forever
<button class="modal-close">Close</button>
</div>
</div>
</span>
<% }) %>
</span>
<% }) %>
</div>
</div>
<% } %>
<% if (friends.requests_received) { %>
<div class="vanishing-messages" style="padding-bottom: 20px">
<h2>Friend Requests</h2>
<h2>Friend Requests</h2>
<div class="notifications" style="padding-bottom: 20px">
<% friends.requests_received.map(friend => { %>
<a href="<%= profileUrl(friend.id) %>" class="vanishing-message">
<a href="<%= profileUrl(friend.id) %>" class="notification-box">
<div><img src="<%= profileImageUrl(friend) %>" class="post-profile-pic" /></div>
<div><%= friend.name %></div>
</a>