diff --git a/src/views/HomepageView.vue b/src/views/HomepageView.vue index 3385520..2baa5fd 100644 --- a/src/views/HomepageView.vue +++ b/src/views/HomepageView.vue @@ -15,8 +15,8 @@ export default { async setup() { let data = ref() let status = ref<'ok' | 'error'>() - let followingStreaming = ref() - let following = ref() + let followingStreaming = ref([]) + let following = ref([]) return { data, @@ -29,29 +29,21 @@ export default { methods: { filterSearches(toFilter: string) { const categories = this.$refs.categoryItem - const wantedTags: string[] = toFilter + const wantedTags = toFilter .toLowerCase() .split(',') - .filter((v) => v.toLowerCase()) + .map(tag => tag.trim()) + .filter(tag => tag); - for (let category of categories as any) { + for (let category of categories as HTMLElement[]) { let tagElements = category.getElementsByTagName('span') - let tags = [] + const categoryTags = Array.from(tagElements, el => el.innerText.toLowerCase()) - for (let tag of tagElements) { - tags.push(tag.innerText.toLowerCase()) - } - - // Create sets from the arrays - const [set1, set2] = [new Set(wantedTags), new Set(tags)] - const common = [...set1].filter((x) => set2.has(x)) - - if (common.length === wantedTags.length) { - category.style.display = '' - } else if (wantedTags[0] === '') { - category.style.display = '' - } else { + console.log(categoryTags) + if (!categoryTags.some(r=>wantedTags.includes(r))) { category.style.display = 'none' + } else { + category.style.display = 'block' } } }, @@ -60,8 +52,9 @@ export default { document.documentElement.scrollTop + window.innerHeight === document.documentElement.offsetHeight if (bottomOfWindow && this.data) { - const cursor = this.data[this.data.length - 1].cursor + const cursor = this.data[this.data.length - 1]?.cursor ?? null if (!cursor) return + const res = await getEndpoint('api/discover?cursor=' + cursor) for (let category of res) { @@ -69,7 +62,7 @@ export default { } } }, - async handleFollowingScroll(event: UIEvent) { + handleFollowingScroll(event: Event) { let el = event.target as HTMLUListElement let fullyScrolled = el.scrollLeft === el.scrollWidth - el.clientWidth if (!fullyScrolled) return @@ -77,8 +70,10 @@ export default { let offset = Math.floor(this.following.length / 35) console.log(offset) - let newFollowers = await followersStreaming(this.following, offset) - this.followingStreaming = [...this.following, ...newFollowers] + followersStreaming(this.following, offset).then((newFollowers) => { + this.followingStreaming = [...this.following, ...newFollowers] + }) + } }, async mounted() { @@ -112,7 +107,7 @@ export default { -
+

{{ $t('home.following') }}

@@ -139,9 +134,8 @@ export default { name="searchBar" :placeholder="$t('main.search')" v-model="filterTags" - @keypress="filterSearches(filterTags)" @keyup="filterSearches(filterTags)" - class="rounded-md p-1 pl-8 placeholder:text-white" + class="rounded-md p-1 pl-8 text-primary" />