Improve friends request section
This commit is contained in:
parent
ad65a8364e
commit
18a618a15d
|
@ -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;
|
||||
|
|
|
@ -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";
|
||||
}
|
||||
};
|
||||
|
||||
|
|
|
@ -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 {
|
||||
|
|
|
@ -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>
|
||||
|
|
Loading…
Reference in New Issue