imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #1228 from matrix-org/luke/feature-auto-complete-matrixto-pills

Browse source 
Implement composer completion user/room pill insertion
This commit is contained in:
Luke Barnard 2017-07-19 17:19:47 +01:00 • committed by GitHub
commit 3a53fabb87
4 changed files with 54 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/autocomplete/Autocompleter.js
View file

@ -34,6 +34,12 @@ export type Completion = {
component: ?Component,
range: SelectionRange,
command: ?string,
// An entity applied during the replacement (using draftjs@0.8.1 Entity.create)
entity: ? {
type: string,
mutability: string,
data: ?Object,
},
};
const PROVIDERS = [

11
src/autocomplete/RoomProvider.js
View file

@ -52,9 +52,16 @@ export default class RoomProvider extends AutocompleteProvider {
};
}));
completions = this.matcher.match(command[0]).map(room => {
let displayAlias = getDisplayAliasForRoom(room.room) || room.roomId;
const displayAlias = getDisplayAliasForRoom(room.room) || room.roomId;
return {
completion: displayAlias + ' ',
completion: displayAlias,
entity: {
type: 'LINK',
mutability: 'IMMUTABLE',
data: {
url: 'https://matrix.to/#/' + displayAlias,
},
},
component: (
<PillCompletion initialComponent={<RoomAvatar width={24} height={24} room={room.room} />} title={room.name} description={displayAlias} />
),

19
src/autocomplete/UserProvider.js
View file

@ -51,16 +51,17 @@ export default class UserProvider extends AutocompleteProvider {
let completions = [];
let {command, range} = this.getCurrentCommand(query, selection, force);
if (command) {
completions = this.matcher.match(command[0]).slice(0, 4).map((user) => {
let displayName = (user.name || user.userId || '').replace(' (IRC)', ''); // FIXME when groups are done
let completion = displayName;
if (range.start === 0) {
completion += ': ';
} else {
completion += ' ';
}
completions = this.matcher.match(command[0]).map((user) => {
const displayName = (user.name || user.userId || '').replace(' (IRC)', ''); // FIXME when groups are done
return {
completion,
completion: displayName,
entity: {
type: 'LINK',
mutability: 'IMMUTABLE',
data: {
url: 'https://matrix.to/#/' + user.userId,
},
},
component: (
<PillCompletion
initialComponent={<MemberAvatar member={user} width={24} height={24}/>}