Commit 1c54b79b5ab38e97cc88860bb05c5820ed84ec85
make the suggest mentioner awesome and extendable
mix irving committed on 1/31/2018, 11:05:58 AMParent: f4097436ca51813b562fc191008b76f8bcb6c71b
Files changed
| app/html/comments.js | changed |
| app/page/addressBook.js | changed |
| app/page/blogShow.js | changed |
| app/page/threadShow.js | changed |
| message/html/compose.js | changed |
| styles/patchSuggest.mcss | changed |
| app/html/comments.js | ||
|---|---|---|
| @@ -21,10 +21,10 @@ | ||
| 21 | 21 | exports.create = (api) => { |
| 22 | 22 | return nest('app.html.comments', comments) |
| 23 | 23 | |
| 24 | 24 | function comments (thread) { |
| 25 | + const strings = api.translations.sync.strings() | |
| 25 | 26 | const { messages, channel, lastId: branch } = thread |
| 26 | - const strings = api.translations.sync.strings() | |
| 27 | 27 | |
| 28 | 28 | // TODO - move this up into Patchcore |
| 29 | 29 | const messagesTree = computed(throttle(messages, 200), msgs => { |
| 30 | 30 | return msgs |
| @@ -48,13 +48,16 @@ | ||
| 48 | 48 | // return messages.length > 5 |
| 49 | 49 | // }) |
| 50 | 50 | const { compose } = api.message.html |
| 51 | 51 | |
| 52 | + const feedIdsInThread = computed(thread.messages, msgs => { | |
| 53 | + return msgs.map(m => m.value.author) | |
| 54 | + }) | |
| 52 | 55 | |
| 53 | 56 | return h('Comments', [ |
| 54 | 57 | // when(twoComposers, compose({ meta, shrink: true, canAttach: false })), |
| 55 | 58 | map(messagesTree, msg => Comment(msg, root, branch)), |
| 56 | - compose({ meta, shrink: false, canAttach: true, placeholder: strings.writeComment }), | |
| 59 | + compose({ meta, feedIdsInThread, shrink: false, canAttach: true, placeholder: strings.writeComment }), | |
| 57 | 60 | ]) |
| 58 | 61 | } |
| 59 | 62 | |
| 60 | 63 | function Comment (msgObs, root, branch) { |
| app/page/addressBook.js | ||
|---|---|---|
| @@ -44,13 +44,17 @@ | ||
| 44 | 44 | if (section === SEARCH) |
| 45 | 45 | return suggester(input) |
| 46 | 46 | else { |
| 47 | 47 | const sectionRels = relationships[section] |
| 48 | - if (!input) return sectionRels // show all e.g. friends | |
| 49 | - .reverse() | |
| 50 | - .map(id => { return { id, title: api.about.obs.name(id) } }) | |
| 51 | - else // show suggestions, and filter just the ones we want e.g. friends | |
| 52 | - return suggester(input).filter(user => sectionRels.includes(user.id)) | |
| 48 | + if (!input) { | |
| 49 | + return sectionRels // show all e.g. friends | |
| 50 | + .reverse() | |
| 51 | + .map(id => { return { id, title: api.about.obs.name(id) } }) | |
| 52 | + } | |
| 53 | + else { // show suggestions, and filter just the ones we want e.g. friends | |
| 54 | + return suggester(input, relationships.followers) // add extraIds to suggester | |
| 55 | + .filter(user => sectionRels.includes(user.id)) | |
| 56 | + } | |
| 53 | 57 | } |
| 54 | 58 | }) |
| 55 | 59 | |
| 56 | 60 | const goTo = (loc) => () => api.history.sync.push(loc) |
| app/page/blogShow.js | ||
|---|---|---|
| @@ -36,9 +36,9 @@ | ||
| 36 | 36 | const thread = api.feed.obs.thread(blogMsg.key) |
| 37 | 37 | const comments = api.app.html.comments(thread) |
| 38 | 38 | const branch = thread.lastId |
| 39 | 39 | |
| 40 | - const { timeago, channel, markdown, compose } = api.message.html | |
| 40 | + const { timeago, channel, markdown } = api.message.html | |
| 41 | 41 | |
| 42 | 42 | return h('Page -blogShow', [ |
| 43 | 43 | api.app.html.sideNav({ page: 'blogShow' }), // HACK to highlight discover |
| 44 | 44 | h('Scroller.content', [ |
| app/page/threadShow.js | ||
|---|---|---|
| @@ -29,11 +29,11 @@ | ||
| 29 | 29 | type: 'post', |
| 30 | 30 | root, |
| 31 | 31 | branch: thread.lastId, |
| 32 | 32 | channel, |
| 33 | - recps: get(location, 'value.content.recps') | |
| 33 | + recps: get(location, 'value.content.recps'), | |
| 34 | 34 | } |
| 35 | - const composer = api.message.html.compose({ meta, shrink: false }) | |
| 35 | + const composer = api.message.html.compose({ meta, thread, shrink: false }) | |
| 36 | 36 | |
| 37 | 37 | return h('Page -threadShow', [ |
| 38 | 38 | api.app.html.sideNav(location), |
| 39 | 39 | h('div.content', [ |
| message/html/compose.js | ||
|---|---|---|
| @@ -1,6 +1,6 @@ | ||
| 1 | 1 | const nest = require('depnest') |
| 2 | -const { h, when, send, resolve, Value, computed } = require('mutant') | |
| 2 | +const { h, when, send, resolve, Value, computed, map } = require('mutant') | |
| 3 | 3 | const assign = require('lodash/assign') |
| 4 | 4 | const ssbMentions = require('ssb-mentions') |
| 5 | 5 | const addSuggest = require('suggest-box') |
| 6 | 6 | |
| @@ -24,16 +24,17 @@ | ||
| 24 | 24 | |
| 25 | 25 | function compose (options, cb) { |
| 26 | 26 | var { |
| 27 | 27 | meta, // required |
| 28 | + feedIdsInThread = [], | |
| 28 | 29 | placeholder, |
| 29 | 30 | shrink = true, |
| 30 | 31 | canAttach = true, canPreview = true, |
| 31 | - prepublish | |
| 32 | + prepublish, | |
| 32 | 33 | } = options |
| 33 | 34 | |
| 34 | 35 | const strings = api.translations.sync.strings() |
| 35 | - const getProfileSuggestions = api.about.async.suggest() | |
| 36 | + const getUserSuggestions = api.about.async.suggest() | |
| 36 | 37 | const getChannelSuggestions = api.channel.async.suggest() |
| 37 | 38 | const getEmojiSuggestions = api.emoji.async.suggest() |
| 38 | 39 | |
| 39 | 40 | placeholder = placeholder || strings.writeMessage |
| @@ -71,11 +72,11 @@ | ||
| 71 | 72 | fileInput = api.blob.html.input(file => { |
| 72 | 73 | files.push(file) |
| 73 | 74 | filesById[file.link] = file |
| 74 | 75 | |
| 75 | - var embed = file.type.match(/^image/) ? '!' : '' | |
| 76 | - var spacer = embed ? '\n' : ' ' | |
| 77 | - var insertLink = spacer + embed + '[' + file.name + ']' + '(' + file.link + ')' + spacer | |
| 76 | + var imgPrefix = file.type.match(/^image/) ? '!' : '' | |
| 77 | + var spacer = imgPrefix ? '\n' : ' ' | |
| 78 | + var insertLink = spacer + imgPrefix + '[' + file.name + ']' + '(' + file.link + ')' + spacer | |
| 78 | 79 | |
| 79 | 80 | var pos = textArea.selectionStart |
| 80 | 81 | var newText = textRaw().slice(0, pos) + insertLink + textRaw().slice(pos) |
| 81 | 82 | textArea.value = newText |
| @@ -90,16 +91,20 @@ | ||
| 90 | 91 | // and we don't want that. |
| 91 | 92 | else |
| 92 | 93 | fileInput = h('input', { style: {visibility: 'hidden'} }) |
| 93 | 94 | |
| 94 | - var showPreview = Value(false) | |
| 95 | - var previewBtn = h('Button', | |
| 96 | - { | |
| 97 | - className: when(showPreview, '-strong', '-subtle'), | |
| 98 | - 'ev-click': () => showPreview.set(!showPreview()) | |
| 99 | - }, | |
| 100 | - when(showPreview, strings.blogNew.actions.edit, strings.blogNew.actions.preview) | |
| 101 | - ) | |
| 95 | + function PreviewSetup (strings) { | |
| 96 | + var showPreview = Value(false) | |
| 97 | + var previewBtn = h('Button', | |
| 98 | + { | |
| 99 | + className: when(showPreview, '-strong', '-subtle'), | |
| 100 | + 'ev-click': () => showPreview.set(!showPreview()) | |
| 101 | + }, | |
| 102 | + when(showPreview, strings.blogNew.actions.edit, strings.blogNew.actions.preview) | |
| 103 | + ) | |
| 104 | + return { previewBtn, showPreview } | |
| 105 | + } | |
| 106 | + var { previewBtn, showPreview } = PreviewSetup(strings) | |
| 102 | 107 | var preview = computed(textRaw, text => api.message.html.markdown(text)) |
| 103 | 108 | |
| 104 | 109 | var publishBtn = h('Button -primary', { 'ev-click': publish }, strings.sendMessage) |
| 105 | 110 | |
| @@ -119,9 +124,9 @@ | ||
| 119 | 124 | addSuggest(textArea, (inputText, cb) => { |
| 120 | 125 | const char = inputText[0] |
| 121 | 126 | const wordFragment = inputText.slice(1) |
| 122 | 127 | |
| 123 | - if (char === '@') cb(null, getProfileSuggestions(wordFragment)) | |
| 128 | + if (char === '@') cb(null, getUserSuggestions(wordFragment, feedIdsInThread)) | |
| 124 | 129 | if (char === '#') cb(null, getChannelSuggestions(wordFragment)) |
| 125 | 130 | if (char === ':') cb(null, getEmojiSuggestions(wordFragment)) |
| 126 | 131 | }, {cls: 'PatchSuggest'}) |
| 127 | 132 | |
Built with git-ssb-web