From ec3d3396d48c4e51b1520cc9aaf41eb0f100113f Mon Sep 17 00:00:00 2001 From: monica Date: Sat, 28 May 2022 10:25:59 -0500 Subject: [PATCH] tweaked mentions, feed, following --- package.json | 1 + src/components/BaseButtonFollow.vue | 7 - src/components/BaseEmojiPicker.vue | 3 + src/components/BaseMarkdown.vue | 7 +- src/components/BasePostEntry.vue | 215 +++++++++++++++------------- src/components/TheSearchMenu.vue | 68 +++++++-- src/components/TheUserMenu.vue | 8 +- src/pages/Feed.vue | 108 ++++++++------ src/pages/Messages.vue | 131 ++++++++++------- src/pages/Notifications.vue | 4 +- src/store/actions.js | 39 +++-- src/store/eventize.js | 1 + src/store/mutations.js | 4 + src/utils/helpers.js | 2 +- src/utils/mixin.js | 2 +- src/worker-db.js | 2 +- yarn.lock | 12 ++ 17 files changed, 391 insertions(+), 223 deletions(-) diff --git a/package.json b/package.json index 4f7d1fd..0c1a1ae 100644 --- a/package.json +++ b/package.json @@ -35,6 +35,7 @@ "tributejs": "^5.1.3", "vue": "^3.0.0", "vue-router": "^4.0.0", + "vuedraggable": "^4.1.0", "vuex": "^4.0.1" }, "devDependencies": { diff --git a/src/components/BaseButtonFollow.vue b/src/components/BaseButtonFollow.vue index 0380e3d..5d47170 100644 --- a/src/components/BaseButtonFollow.vue +++ b/src/components/BaseButtonFollow.vue @@ -15,13 +15,6 @@ {{isFollowing ? "unfollow" : "follow" }} - - - {{isFollowing ? "unfollow" : "follow" }} - diff --git a/src/components/BaseEmojiPicker.vue b/src/components/BaseEmojiPicker.vue index 2ed1932..4c3d4d7 100644 --- a/src/components/BaseEmojiPicker.vue +++ b/src/components/BaseEmojiPicker.vue @@ -127,6 +127,9 @@ div#emoji-mart-list section:first-of-type h3:first-of-type { .emoji-mart-emoji { padding: .3rem; } +.emoji-mart-emoji:hover:before { + display: none; +} button.emoji-mart-emoji { align-items: center; justify-content: flex-start; diff --git a/src/components/BaseMarkdown.vue b/src/components/BaseMarkdown.vue index 70a4cfd..7e11d0e 100644 --- a/src/components/BaseMarkdown.vue +++ b/src/components/BaseMarkdown.vue @@ -205,12 +205,18 @@ ul { padding-inline-start: 1rem; text-align: left; } +.post-highlighted ul { + padding-inline-start: 1.5rem; +} ol { list-style-type: decimal; list-style-position: outside; padding-inline-start: 1rem; text-align: left; } +.post-highlighted ol { + padding-inline-start: 1.5rem; +} ul ul, ol ul { list-style-type: circle; @@ -226,7 +232,6 @@ ul ol { p { display: inline; } - .break-word-wrap { overflow-wrap: break-word; word-wrap: break-word; diff --git a/src/components/BasePostEntry.vue b/src/components/BasePostEntry.vue index ae22973..0d5a075 100644 --- a/src/components/BasePostEntry.vue +++ b/src/components/BasePostEntry.vue @@ -30,14 +30,15 @@ /> - + - -
tags{{' **NOTE TAGS ARE NOT PRIVATE**'}}
-
- {{ "#[" + mention.index + "] "+ (mention.tag[0] === "e" ? " event: " : "") + (mention.tag[0] === "p" ? " profile: " : "")}} - - {{ `[&${shorten(mention.tag[1])}](/event/${mention.tag[1]})` }} + +
tagged{{' **NOTE TAGS ARE NOT PRIVATE**'}}
+
+
{{ "#[" + index + "] " }}
+
{{ (tag[0] === "e" ? " event: " : "") + (tag[0] === "p" ? " user: " : "")}}
+ + {{ `[&${shorten(tag[1])}](/event/${tag[1]})` }}
@@ -167,6 +163,7 @@ @@ -597,7 +611,16 @@ export default { + + diff --git a/src/components/TheSearchMenu.vue b/src/components/TheSearchMenu.vue index 440a3fe..324a47c 100644 --- a/src/components/TheSearchMenu.vue +++ b/src/components/TheSearchMenu.vue @@ -52,15 +52,46 @@
-

following

+
+

following

+
+ + reorder following list + + + cancel + +
+
- - - +
+ + + + + + + + + +
When you follow someone they will show up here.
@@ -71,6 +102,7 @@ diff --git a/src/pages/Notifications.vue b/src/pages/Notifications.vue index 7a9f1f5..c8e2581 100644 --- a/src/pages/Notifications.vue +++ b/src/pages/Notifications.vue @@ -90,9 +90,11 @@ export default { if (loadedNotifications.length < 40) { this.reachedEnd = true } - loadedNotifications = loadedNotifications.filter(event => !this.notificationsSet.has(event.id)) + // loadedNotifications = loadedNotifications.filter(event => !this.notificationsSet.has(event.id)) this.interpolateEventMentions(loadedNotifications) loadedNotifications.forEach(event => { + if (this.notificationsSet.has(event.id)) return + this.notificationsSet.add(event.id) this.addNotificationEvent(event) this.$store.dispatch('useProfile', {pubkey: event.pubkey, request: true}) diff --git a/src/store/actions.js b/src/store/actions.js index 5e78827..9247899 100644 --- a/src/store/actions.js +++ b/src/store/actions.js @@ -376,27 +376,50 @@ export async function publishContactList(store) { var tags = event?.tags || [] // remove contacts that we're not following anymore - tags = tags.filter( - ([t, v]) => t === 'p' && store.state.following.find(f => f === v) - ) + // tags = tags.filter( + // ([t, v]) => t === 'p' && store.state.following.find(f => f === v) + // ) - // now we merely add to the existing event because it might contain more data in the - // tags that we don't want to replace + // check existing event because it might contain more data in the + // tags that we don't want to replace, if so push existing event tag, + // else push state.following tag + let newTags = [] await Promise.all( store.state.following.map(async pubkey => { - if (!tags.find(([t, v]) => t === 'p' && v === pubkey)) { - tags.push(await getPubKeyTagWithRelay(pubkey)) + let index = tags.findIndex(([t, v]) => t === 'p' && v === pubkey) + if (index >= 0) { + newTags.push(tags[index]) + } else { + newTags.push(await getPubKeyTagWithRelay(pubkey)) } }) ) + // now we merely add to the existing event because it might contain more data in the + // tags that we don't want to replace + // await Promise.all( + // store.state.following.map(async pubkey => { + // if (!tags.find(([t, v]) => t === 'p' && v === pubkey)) { + // tags.push(await getPubKeyTagWithRelay(pubkey)) + // } + // }) + // ) + // event = { + // pubkey: store.state.keys.pub, + // created_at: Math.floor(Date.now() / 1000), + // kind: 3, + // tags, + // newTags, + // content: JSON.stringify(store.state.relays) + // } event = await pool.publish({ pubkey: store.state.keys.pub, created_at: Math.floor(Date.now() / 1000), kind: 3, - tags, + tags: newTags, content: JSON.stringify(store.state.relays) }) + console.log(event) await store.dispatch('addEvent', {event}) diff --git a/src/store/eventize.js b/src/store/eventize.js index 35ce5b6..39642fc 100644 --- a/src/store/eventize.js +++ b/src/store/eventize.js @@ -9,6 +9,7 @@ export default function (store) { case 'setRelayOpt': case 'follow': case 'unfollow': + case 'reorderFollows': // make an event kind3 and publish it store.dispatch('publishContactList') break diff --git a/src/store/mutations.js b/src/store/mutations.js index 2f16e25..57bd2a8 100644 --- a/src/store/mutations.js +++ b/src/store/mutations.js @@ -66,6 +66,10 @@ export function unfollow(state, key) { if (idx >= 0) state.following.splice(idx, 1) } +export function reorderFollows(state, following) { + state.following = following +} + export function addProfileToCache( state, {pubkey, name, about, picture, nip05} diff --git a/src/utils/helpers.js b/src/utils/helpers.js index f47fd22..816f09a 100644 --- a/src/utils/helpers.js +++ b/src/utils/helpers.js @@ -66,7 +66,7 @@ export async function processMentions(event) { export async function extractMentions(text, tags) { // const mentionRegex = /\B@(?

[a-f0-9]{64})\b/g // const mentionRegex = /@((?[a-z]{1}):{1})?(?

[a-f0-9]{64})\b/g - const mentionRegex = /(?[@&]{1})(?

[a-f0-9]{64})/g + const mentionRegex = /(?[@&]{1})(?

[a-f0-9]{64})\b/g let tagIndexMap = {} // event.tags.filter(([t, v]) => (t === 'p' || t === 'e') && v).forEach(([t, v], index) => tagIndexMap[v] = index) diff --git a/src/utils/mixin.js b/src/utils/mixin.js index 540d784..55c84c4 100644 --- a/src/utils/mixin.js +++ b/src/utils/mixin.js @@ -144,7 +144,7 @@ export default { menuItemTemplate: item => { return ` -

+
diff --git a/src/worker-db.js b/src/worker-db.js index 6ca7ff0..2a1f30c 100644 --- a/src/worker-db.js +++ b/src/worker-db.js @@ -350,7 +350,7 @@ const methods = { startkey: [ourPubKey, {}], endkey: [ourPubKey, since] }) - return result.rows.length + return result.rows.filter((v, i, a) => a.indexOf(v) === i).length }, async dbGetUnreadMessages(pubkey, since) { diff --git a/yarn.lock b/yarn.lock index 84b47a0..e56810e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6141,6 +6141,11 @@ sockjs@^0.3.21: uuid "^8.3.2" websocket-driver "^0.7.4" +sortablejs@1.14.0: + version "1.14.0" + resolved "https://registry.yarnpkg.com/sortablejs/-/sortablejs-1.14.0.tgz#6d2e17ccbdb25f464734df621d4f35d4ab35b3d8" + integrity sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w== + source-list-map@^2.0.0: version "2.0.1" resolved "https://registry.yarnpkg.com/source-list-map/-/source-list-map-2.0.1.tgz#3993bd873bfc48479cca9ea3a547835c7c154b34" @@ -6785,6 +6790,13 @@ vue@^3.0.0: "@vue/server-renderer" "3.2.36" "@vue/shared" "3.2.36" +vuedraggable@^4.1.0: + version "4.1.0" + resolved "https://registry.yarnpkg.com/vuedraggable/-/vuedraggable-4.1.0.tgz#edece68adb8a4d9e06accff9dfc9040e66852270" + integrity sha512-FU5HCWBmsf20GpP3eudURW3WdWTKIbEIQxh9/8GE806hydR9qZqRRxRE3RjqX7PkuLuMQG/A7n3cfj9rCEchww== + dependencies: + sortablejs "1.14.0" + vuex@^4.0.1: version "4.0.2" resolved "https://registry.yarnpkg.com/vuex/-/vuex-4.0.2.tgz#f896dbd5bf2a0e963f00c67e9b610de749ccacc9"