separate following feed's menu component from the actual filter options
This commit is contained in:
Hazelnoot
parent
4a43e1a9e9
commit
2b0a622875
|
|
@ -25,7 +25,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, Ref, ref, shallowRef } from 'vue';
|
||||
import { computed, ComputedRef, Ref, ref, shallowRef } from 'vue';
|
||||
import { getScrollContainer } from '@@/js/scroll.js';
|
||||
import { definePageMetadata } from '@/scripts/page-metadata.js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
|
|
@ -36,7 +36,7 @@ import { useRouter } from '@/router/supplier.js';
|
|||
import MkPageHeader from '@/components/global/MkPageHeader.vue';
|
||||
import SkUserRecentNotes from '@/components/SkUserRecentNotes.vue';
|
||||
import { useScrollPositionManager } from '@/nirax.js';
|
||||
import { createModel, createOptions, followersTab, followingTab, mutualsTab } from '@/scripts/following-feed-utils.js';
|
||||
import { createModel, createHeaderItem, followingFeedTabs, followingTabIcon, followingTabName, followingTab } from '@/scripts/following-feed-utils.js';
|
||||
import SkLazy from '@/components/global/SkLazy.vue';
|
||||
import SkFollowingRecentNotes from '@/components/SkFollowingRecentNotes.vue';
|
||||
import SkRemoteFollowersWarning from '@/components/SkRemoteFollowersWarning.vue';
|
||||
|
|
@ -91,32 +91,20 @@ const headerActions: PageHeaderItem[] = [
|
|||
text: i18n.ts.reload,
|
||||
handler: () => reload(),
|
||||
},
|
||||
createOptions(),
|
||||
createHeaderItem(),
|
||||
];
|
||||
|
||||
const headerTabs = computed(() => [
|
||||
{
|
||||
key: followingTab,
|
||||
icon: 'ph-user-check ph-bold ph-lg',
|
||||
title: i18n.ts.following,
|
||||
} satisfies Tab,
|
||||
{
|
||||
key: mutualsTab,
|
||||
icon: 'ph-user-switch ph-bold ph-lg',
|
||||
title: i18n.ts.mutuals,
|
||||
} satisfies Tab,
|
||||
{
|
||||
key: followersTab,
|
||||
icon: 'ph-user ph-bold ph-lg',
|
||||
title: i18n.ts.followers,
|
||||
} satisfies Tab,
|
||||
]);
|
||||
const headerTabs: ComputedRef<Tab[]> = computed(() => followingFeedTabs.map(t => ({
|
||||
key: t,
|
||||
icon: followingTabIcon(t),
|
||||
title: followingTabName(t),
|
||||
})));
|
||||
|
||||
useScrollPositionManager(() => getScrollContainer(userScroll.value?.rootEl ?? null), router);
|
||||
useScrollPositionManager(() => getScrollContainer(noteScroll.value ?? null), router);
|
||||
definePageMetadata(() => ({
|
||||
title: i18n.ts.following,
|
||||
icon: 'ph-user-check ph-bold ph-lg',
|
||||
icon: followingTabIcon(followingTab),
|
||||
}));
|
||||
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@ import { PageHeaderItem } from '@/types/page-header.js';
|
|||
import MkPageHeader from '@/components/global/MkPageHeader.vue';
|
||||
import SkUserRecentNotes from '@/components/SkUserRecentNotes.vue';
|
||||
import { acct } from '@/filters/user.js';
|
||||
import { createModel, createOptions } from '@/scripts/following-feed-utils.js';
|
||||
import { createModel, createHeaderItem } from '@/scripts/following-feed-utils.js';
|
||||
import MkStickyContainer from '@/components/global/MkStickyContainer.vue';
|
||||
|
||||
defineProps<{
|
||||
|
|
@ -44,7 +44,7 @@ const headerActions: PageHeaderItem[] = [
|
|||
text: i18n.ts.reload,
|
||||
handler: () => userRecentNotes.value?.reload(),
|
||||
},
|
||||
createOptions(),
|
||||
createHeaderItem(),
|
||||
];
|
||||
|
||||
// Based on user/index.vue
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@ import { deepMerge } from '@/scripts/merge.js';
|
|||
import { PageHeaderItem } from '@/types/page-header.js';
|
||||
import { i18n } from '@/i18n.js';
|
||||
import { popupMenu } from '@/os.js';
|
||||
import { MenuItem } from '@/types/menu.js';
|
||||
|
||||
export const followingTab = 'following' as const;
|
||||
export const mutualsTab = 'mutuals' as const;
|
||||
|
|
@ -80,43 +81,40 @@ export function createOptionsMenu(storage?: Ref<StorageInterface>): MenuItem[] {
|
|||
onlyFiles,
|
||||
} = createModel(storage);
|
||||
|
||||
return {
|
||||
icon: 'ti ti-dots',
|
||||
text: i18n.ts.options,
|
||||
handler: ev =>
|
||||
popupMenu([
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.showNonPublicNotes,
|
||||
ref: withNonPublic,
|
||||
disabled: userList.value === 'followers',
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.showQuotes,
|
||||
ref: withQuotes,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.showBots,
|
||||
ref: withBots,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.showReplies,
|
||||
ref: withReplies,
|
||||
disabled: onlyFiles,
|
||||
},
|
||||
{
|
||||
type: 'divider',
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.fileAttachedOnly,
|
||||
ref: onlyFiles,
|
||||
disabled: withReplies,
|
||||
},
|
||||
], ev.currentTarget ?? ev.target),
|
||||
return [
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.showNonPublicNotes,
|
||||
ref: withNonPublic,
|
||||
disabled: computed(() => userList.value === followersTab),
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.showQuotes,
|
||||
ref: withQuotes,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.showBots,
|
||||
ref: withBots,
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.showReplies,
|
||||
ref: withReplies,
|
||||
disabled: onlyFiles,
|
||||
},
|
||||
{
|
||||
type: 'divider',
|
||||
},
|
||||
{
|
||||
type: 'switch',
|
||||
text: i18n.ts.fileAttachedOnly,
|
||||
ref: onlyFiles,
|
||||
disabled: withReplies,
|
||||
},
|
||||
];
|
||||
}
|
||||
|
||||
export function createModel(storage?: Ref<StorageInterface>): FollowingFeedModel {
|
||||
// eslint-disable-next-line no-param-reassign
|
||||
|
|
|
|||
Loading…
Reference in New Issue