keith/barkey
0
0
Fork 0
mirror of https://codeberg.org/yeentown/barkey synced 2024-12-31 12:01:33 +00:00
Code Issues Projects Releases Packages Wiki Activity

add warning about incomplete remote data on following feed

Browse source
This commit is contained in:
Hazelnoot 2024-10-21 17:57:54 -04:00
parent 04654b2f84
commit bc45ff2103
4 changed files with 25 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
locales/index.d.ts vendored
View file

@ -11334,6 +11334,10 @@ export interface Locale extends ILocale {
*/
"trustThisDomain": string;
};
/**
* Remote followers may have incomplete or outdated activity
*/
"remoteFollowersWarning": string;
}
declare const locales: {
[lang: string]: Locale;

20
packages/frontend/src/pages/following-feed.vue
View file

@ -5,7 +5,10 @@ SPDX-License-Identifier: AGPL-3.0-only
<template>
<div :class="$style.root">
<MkPageHeader v-model:tab="userList" :class="$style.header" :tabs="headerTabs" :actions="headerActions" :displayBackButton="true" @update:tab="onChangeTab"/>
<div :class="$style.header">
<MkPageHeader v-model:tab="userList" :tabs="headerTabs" :actions="headerActions" :displayBackButton="true" @update:tab="onChangeTab"/>
<MkInfo v-if="showRemoteWarning" :class="$style.remoteWarning" warn closable @close="remoteWarningDismissed = true">{{ i18n.ts.remoteFollowersWarning }}</MkInfo>
</div>
<div ref="noteScroll" :class="$style.notes">
<MkHorizontalSwipe v-model:tab="userList" :tabs="headerTabs">
@ -66,6 +69,7 @@ import { useScrollPositionManager } from '@/nirax.js';
import { defaultStore } from '@/store.js';
import { deepMerge } from '@/scripts/merge.js';
import MkPagination, { Paging } from '@/components/MkPagination.vue';
import MkInfo from '@/components/MkInfo.vue';
const withNonPublic = computed({
get: () => {
@ -94,6 +98,10 @@ const userList = computed({
get: () => defaultStore.reactiveState.followingFeed.value.userList,
set: value => saveFollowingFilter('userList', value),
});
const remoteWarningDismissed = computed({
get: () => defaultStore.reactiveState.followingFeed.value.remoteWarningDismissed,
set: value => saveFollowingFilter('remoteWarningDismissed', value),
});
// Based on timeline.saveTlFilter()
function saveFollowingFilter<Key extends keyof typeof defaultStore.state.followingFeed>(key: Key, value: (typeof defaultStore.state.followingFeed)[Key]) {
@ -107,6 +115,8 @@ const userRecentNotes = shallowRef<InstanceType<typeof SkUserRecentNotes>>();
const userScroll = shallowRef<HTMLElement>();
const noteScroll = shallowRef<HTMLElement>();
const showRemoteWarning = computed(() => userList.value === 'followers' && !remoteWarningDismissed.value);
// We have to disable the per-user feed on small displays, and it must be done through JS instead of CSS.
// Otherwise, the second column will waste resources in the background.
const wideViewportQuery = window.matchMedia('(min-width: 750px)');
@ -314,6 +324,10 @@ definePageMetadata(() => ({
overflow-y: auto;
}
.remoteWarning {
margin: 12px 12px 0 12px;
}
.userInfo {
margin-bottom: 12px;
}
@ -328,6 +342,10 @@ definePageMetadata(() => ({
gap: 24px;
}
.remoteWarning {
margin: 24px 24px 0 24px;
}
.userInfo {
margin-bottom: 24px;
}

1
packages/frontend/src/store.ts
View file

@ -251,6 +251,7 @@ export const defaultStore = markRaw(new Storage('base', {
withReplies: false,
onlyFiles: false,
userList: 'following' as FollowingFeedTab,
remoteWarningDismissed: false,
},
},

1
sharkey-locales/en-US.yml
View file

@ -383,3 +383,4 @@ _externalNavigationWarning:
title: "Navigate to an external site"
description: "Leave {host} and go to an external site"
trustThisDomain: "Trust this domain on this device in the future"
remoteFollowersWarning: "Remote followers may have incomplete or outdated activity"