mirror of
https://github.com/IT4Change/Ocelot-Social.git
synced 2025-12-13 07:45:56 +00:00
fix: 🍰 Suggestion List Filter (#4296)
* Fix suggestion list filter * fix tests after MAPBOX changed their IDs again * Add spacebar selection functionality for mentions * Add tests * Fix linting Co-authored-by: Moriz Wahl <moriz.wahl@gmx.de> Co-authored-by: Wolfgang Huß <wolle.huss@pjannto.com>
This commit is contained in:
parent
b1dec55449
commit
ff50273f94
@ -114,10 +114,22 @@ describe('Location Service', () => {
|
||||
const result = await query({ query: queryLocations, variables })
|
||||
expect(result.data.queryLocations).toEqual([
|
||||
{ id: 'place.14094307404564380', place_name: 'Berlin, Germany' },
|
||||
{ id: 'place.15095411613564380', place_name: 'Berlin, Maryland, United States' },
|
||||
{ id: 'place.5225018734564380', place_name: 'Berlin, Connecticut, United States' },
|
||||
{ id: 'place.16922023226564380', place_name: 'Berlin, New Jersey, United States' },
|
||||
{ id: 'place.4035845612564380', place_name: 'Berlin Township, New Jersey, United States' },
|
||||
{
|
||||
id: expect.stringMatching(/^place\.[0-9]+$/),
|
||||
place_name: 'Berlin, Maryland, United States',
|
||||
},
|
||||
{
|
||||
id: expect.stringMatching(/^place\.[0-9]+$/),
|
||||
place_name: 'Berlin, Connecticut, United States',
|
||||
},
|
||||
{
|
||||
id: expect.stringMatching(/^place\.[0-9]+$/),
|
||||
place_name: 'Berlin, New Jersey, United States',
|
||||
},
|
||||
{
|
||||
id: expect.stringMatching(/^place\.[0-9]+$/),
|
||||
place_name: 'Berlin Township, New Jersey, United States',
|
||||
},
|
||||
])
|
||||
})
|
||||
|
||||
@ -128,11 +140,23 @@ describe('Location Service', () => {
|
||||
}
|
||||
const result = await query({ query: queryLocations, variables })
|
||||
expect(result.data.queryLocations).toEqual([
|
||||
{ id: 'place.14094307404564380', place_name: 'Berlin, Deutschland' },
|
||||
{ id: 'place.15095411613564380', place_name: 'Berlin, Maryland, Vereinigte Staaten' },
|
||||
{ id: 'place.16922023226564380', place_name: 'Berlin, New Jersey, Vereinigte Staaten' },
|
||||
{ id: 'place.10735893248465990', place_name: 'Berlin Heights, Ohio, Vereinigte Staaten' },
|
||||
{ id: 'place.1165756679564380', place_name: 'Berlin, Massachusetts, Vereinigte Staaten' },
|
||||
{ id: expect.stringMatching(/^place\.[0-9]+$/), place_name: 'Berlin, Deutschland' },
|
||||
{
|
||||
id: expect.stringMatching(/^place\.[0-9]+$/),
|
||||
place_name: 'Berlin, Maryland, Vereinigte Staaten',
|
||||
},
|
||||
{
|
||||
id: expect.stringMatching(/^place\.[0-9]+$/),
|
||||
place_name: 'Berlin, New Jersey, Vereinigte Staaten',
|
||||
},
|
||||
{
|
||||
id: expect.stringMatching(/^place\.[0-9]+$/),
|
||||
place_name: 'Berlin Heights, Ohio, Vereinigte Staaten',
|
||||
},
|
||||
{
|
||||
id: expect.stringMatching(/^place\.[0-9]+$/),
|
||||
place_name: 'Berlin, Massachusetts, Vereinigte Staaten',
|
||||
},
|
||||
])
|
||||
})
|
||||
|
||||
|
||||
@ -99,6 +99,37 @@ describe('Editor.vue', () => {
|
||||
})
|
||||
})
|
||||
|
||||
it('suggestion list returns results prefixed by query', () => {
|
||||
const manyUsersList = []
|
||||
for (let i = 0; i < 10; i++) {
|
||||
manyUsersList.push({ id: `user${i}` })
|
||||
manyUsersList.push({ id: `admin${i}` })
|
||||
manyUsersList.push({ id: `moderator${i}` })
|
||||
}
|
||||
propsData.users = manyUsersList
|
||||
wrapper = Wrapper()
|
||||
const suggestionList = wrapper.vm.editor.extensions.options.mention.onFilter(
|
||||
propsData.users,
|
||||
'moderator',
|
||||
)
|
||||
expect(suggestionList).toHaveLength(10)
|
||||
for (var i = 0; i < suggestionList.length; i++) {
|
||||
expect(suggestionList[i].id).toMatch(/^moderator.*/)
|
||||
}
|
||||
})
|
||||
|
||||
it('exact match appears at the top of suggestion list', () => {
|
||||
const manyUsersList = []
|
||||
for (let i = 0; i < 25; i++) {
|
||||
manyUsersList.push({ id: `user${i}` })
|
||||
}
|
||||
propsData.users = manyUsersList
|
||||
wrapper = Wrapper()
|
||||
expect(
|
||||
wrapper.vm.editor.extensions.options.mention.onFilter(propsData.users, 'user7')[0].id,
|
||||
).toMatch('user7')
|
||||
})
|
||||
|
||||
it('sets the Hashtag items to the hashtags', () => {
|
||||
propsData.hashtags = [
|
||||
{
|
||||
|
||||
@ -185,6 +185,9 @@ export default {
|
||||
if (this.suggestionType === HASHTAG && this.query !== '') {
|
||||
this.selectItem({ id: this.query })
|
||||
}
|
||||
if (this.suggestionType === MENTION && item) {
|
||||
this.selectItem(item)
|
||||
}
|
||||
return true
|
||||
|
||||
default:
|
||||
@ -199,9 +202,14 @@ export default {
|
||||
|
||||
const filteredList = items.filter((item) => {
|
||||
const itemString = item.slug || item.id
|
||||
return itemString.toLowerCase().includes(query.toLowerCase())
|
||||
return itemString.toLowerCase().startsWith(query.toLowerCase())
|
||||
})
|
||||
return filteredList.slice(0, 15)
|
||||
const sortedList = filteredList.sort((itemA, itemB) => {
|
||||
const aString = itemA.slug || itemA.id
|
||||
const bString = itemB.slug || itemB.id
|
||||
return aString.length - bString.length
|
||||
})
|
||||
return sortedList.slice(0, 15)
|
||||
},
|
||||
sanitizeQuery(query) {
|
||||
if (this.suggestionType === HASHTAG) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user