Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
24
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

AutoComplete: added converse-autocomplete suggestion to group chat query

Browse Source 
this commit introduces autocomplete feature to the muc-list group chat dialog,
previously there was only an input field which displayed hardcoded servers.
This commit is contained in:
Sanskar Bajpai 2022-04-28 13:12:19 +05:30 committed by JC Brand
parent 795a9a7e3e
commit 1ad6de2dd6
3 changed files with 21 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/plugins/muc-views/templates/add-muc.js
View File

@ -4,6 +4,7 @@ import { api } from '@converse/headless/core.js';
import { html } from "lit";
import { modal_header_close_button } from "plugins/modal/templates/buttons.js"
import { unsafeHTML } from "lit/directives/unsafe-html.js";
import { getAutoCompleteList } from "../utils.js";
const nickname_input = (o) => {
@ -34,7 +35,10 @@ export default (o) => {
<div class="form-group">
<label for="chatroom">${o.label_room_address}:</label>
${ (o.muc_roomid_policy_error_msg) ? html`<label class="roomid-policy-error">${o.muc_roomid_policy_error_msg}</label>` : '' }
<input type="text" required="required" name="chatroom" class="form-control roomjid-input" placeholder="${o.chatroom_placeholder}"/>
<converse-autocomplete
.getAutoCompleteList="${getAutoCompleteList}"
placeholder="${o.chatroom_placeholder}"
name="chatroom"/>
</div>
${ o.muc_roomid_policy_hint ? html`<div class="form-group">${unsafeHTML(DOMPurify.sanitize(o.muc_roomid_policy_hint, {'ALLOWED_TAGS': ['b', 'br', 'em']}))}</div>` : '' }
${ !api.settings.get('locked_muc_nickname') ? nickname_input(o) : '' }

3
src/plugins/muc-views/tests/muc-add-modal.js
View File

@ -37,8 +37,7 @@ describe('The "Groupchats" Add modal', function () {
roomspanel.querySelector('.show-add-muc-modal').click();
label_name = modal.el.querySelector('label[for="chatroom"]');
expect(label_name.textContent.trim()).toBe('Groupchat address:');
name_input = modal.el.querySelector('input[name="chatroom"]');
expect(name_input.placeholder).toBe('name@muc.example.org');
await u.waitUntil(() => modal.el.querySelector('input[name="chatroom"]')?.placeholder === 'name@muc.example.org');
})
);

18
src/plugins/muc-views/utils.js
View File

@ -127,10 +127,22 @@ export function getAutoCompleteListItem (text, input) {
return element;
}
let fetched_room_jids = [];
let timestamp = null;
async function fetchListOfRooms () {
const response = await fetch('https://search.jabber.network/api/1.0/rooms');
const data = await response.json();
const popular_mucs = data.items.map(item => item.address);
fetched_room_jids = [...new Set(popular_mucs)];
}
export async function getAutoCompleteList () {
const models = [...(await api.rooms.get()), ...(await api.contacts.get())];
const jids = [...new Set(models.map(o => Strophe.getDomainFromJid(o.get('jid'))))];
return jids;
if (!timestamp || converse.env.dayjs().isAfter(timestamp, 'day')) {
await fetchListOfRooms();
timestamp = (new Date()).toISOString();
}
return fetched_room_jids;
}
export async function fetchCommandForm (command) {