simplify timeline vibility checks

This commit is contained in:
FloatingGhost 2023-03-18 20:22:47 +00:00 committed by hynet-mel
parent b552d8116a
commit c3208db28d
9 changed files with 59 additions and 26 deletions

View file

@ -1,6 +1,11 @@
import SearchBar from 'components/search_bar/search_bar.vue' import SearchBar from 'components/search_bar/search_bar.vue'
import ConfirmModal from '../confirm_modal/confirm_modal.vue' import ConfirmModal from '../confirm_modal/confirm_modal.vue'
import { library } from '@fortawesome/fontawesome-svg-core' import { library } from '@fortawesome/fontawesome-svg-core'
import {
publicTimelineVisible,
federatedTimelineVisible,
bubbleTimelineVisible,
} from '../../lib/timeline_visibility'
import { import {
faSignInAlt, faSignInAlt,
faSignOutAlt, faSignOutAlt,
@ -106,8 +111,9 @@ export default {
return this.$store.state.instance.localBubbleInstances.length > 0 return this.$store.state.instance.localBubbleInstances.length > 0
}, },
...mapState({ ...mapState({
publicTimelineVisibility: state => state.instance.publicTimelineVisibility, publicTimelineVisible,
federatedTimelineAvailable: state => state.instance.federatedTimelineAvailable, federatedTimelineVisible,
bubbleTimelineVisible,
}) })
}, },
methods: { methods: {

View file

@ -46,7 +46,7 @@
<router-link <router-link
:to="{ name: 'public-timeline' }" :to="{ name: 'public-timeline' }"
class="nav-icon" class="nav-icon"
v-if="(currentUser || (publicTimelineVisibility?.local ?? true))" v-if="publicTimelineVisible"
> >
<FAIcon <FAIcon
fixed-width fixed-width
@ -56,7 +56,7 @@
/> />
</router-link> </router-link>
<router-link <router-link
v-if="(currentUser || publicTimelineVisibility?.bubble) && showBubbleTimeline" v-if="bubbleTimelineVisible"
:to="{ name: 'bubble-timeline' }" :to="{ name: 'bubble-timeline' }"
class="nav-icon" class="nav-icon"
> >
@ -70,7 +70,7 @@
<router-link <router-link
:to="{ name: 'public-external-timeline' }" :to="{ name: 'public-external-timeline' }"
class="nav-icon" class="nav-icon"
v-if="federatedTimelineAvailable && (currentUser || (publicTimelineVisibility?.federated ?? true))" v-if="federatedTimelineVisible"
> >
<FAIcon <FAIcon
fixed-width fixed-width

View file

@ -8,6 +8,7 @@ import {
faHome, faHome,
faCircle faCircle
} from '@fortawesome/free-solid-svg-icons' } from '@fortawesome/free-solid-svg-icons'
import { federatedTimelineVisible, publicTimelineVisible, bubbleTimelineVisible } from '../../lib/timeline_visibility'
library.add( library.add(
faUsers, faUsers,
@ -24,9 +25,9 @@ const TimelineMenuContent = {
currentUser: state => state.users.currentUser, currentUser: state => state.users.currentUser,
privateMode: state => state.instance.private, privateMode: state => state.instance.private,
federating: state => state.instance.federating, federating: state => state.instance.federating,
showBubbleTimeline: state => (state.instance.localBubbleInstances.length > 0), publicTimelineVisible,
publicTimelineVisibility: state => state.instance.publicTimelineVisibility, federatedTimelineVisible,
federatedTimelineAvailable: state => state.instance.federatedTimelineAvailable, bubbleTimelineVisible,
}) })
} }
} }

View file

@ -16,7 +16,7 @@
>{{ $t("nav.home_timeline") }}</span> >{{ $t("nav.home_timeline") }}</span>
</router-link> </router-link>
</li> </li>
<li v-if="(currentUser || publicTimelineVisibility?.bubble) && showBubbleTimeline"> <li v-if="bubbleTimelineVisible">
<router-link <router-link
class="menu-item" class="menu-item"
:to="{ name: 'bubble-timeline' }" :to="{ name: 'bubble-timeline' }"
@ -32,7 +32,7 @@
>{{ $t("nav.bubble_timeline") }}</span> >{{ $t("nav.bubble_timeline") }}</span>
</router-link> </router-link>
</li> </li>
<li v-if="(currentUser || !privateMode) && (currentUser || (publicTimelineVisibility?.local ?? true))"> <li v-if="publicTimelineVisible">
<router-link <router-link
class="menu-item" class="menu-item"
:to="{ name: 'public-timeline' }" :to="{ name: 'public-timeline' }"
@ -48,7 +48,7 @@
>{{ $t("nav.public_tl") }}</span> >{{ $t("nav.public_tl") }}</span>
</router-link> </router-link>
</li> </li>
<li v-if="federating && federatedTimelineAvailable && (currentUser || !privateMode) && (currentUser || (publicTimelineVisibility?.federated ?? true))"> <li v-if="federatedTimelineVisible">
<router-link <router-link
class="menu-item" class="menu-item"
:to="{ name: 'public-external-timeline' }" :to="{ name: 'public-external-timeline' }"

View file

@ -8,6 +8,7 @@ import {
faHome faHome
} from '@fortawesome/free-solid-svg-icons' } from '@fortawesome/free-solid-svg-icons'
import { faCircle } from '@fortawesome/free-regular-svg-icons' import { faCircle } from '@fortawesome/free-regular-svg-icons'
import { federatedTimelineVisible, publicTimelineVisible, bubbleTimelineVisible } from '../../lib/timeline_visibility'
library.add( library.add(
faUsers, faUsers,
faGlobe, faGlobe,
@ -23,9 +24,9 @@ const TimelineMenuContent = {
currentUser: state => state.users.currentUser, currentUser: state => state.users.currentUser,
privateMode: state => state.instance.private, privateMode: state => state.instance.private,
federating: state => state.instance.federating, federating: state => state.instance.federating,
showBubbleTimeline: state => (state.instance.localBubbleInstances.length > 0), publicTimelineVisible,
publicTimelineVisibility: state => state.instance.publicTimelineVisibility, federatedTimelineVisible,
federatedTimelineAvailable: state => state.instance.federatedTimelineAvailable, bubbleTimelineVisible,
}) })
} }
} }

View file

@ -16,7 +16,7 @@
>{{ $t("nav.home_timeline") }}</span> >{{ $t("nav.home_timeline") }}</span>
</router-link> </router-link>
</li> </li>
<li v-if="(currentUser || publicTimelineVisibility?.bubble) && showBubbleTimeline"> <li v-if="bubbleTimelineVisible">
<router-link <router-link
class="menu-item" class="menu-item"
:to="{ name: 'bubble-timeline' }" :to="{ name: 'bubble-timeline' }"
@ -32,7 +32,7 @@
>{{ $t("nav.bubble_timeline") }}</span> >{{ $t("nav.bubble_timeline") }}</span>
</router-link> </router-link>
</li> </li>
<li v-if="currentUser || !privateMode"> <li v-if="publicTimelineVisible">
<router-link <router-link
class="menu-item" class="menu-item"
:to="{ name: 'public-timeline' }" :to="{ name: 'public-timeline' }"
@ -48,7 +48,7 @@
>{{ $t("nav.public_tl") }}</span> >{{ $t("nav.public_tl") }}</span>
</router-link> </router-link>
</li> </li>
<li v-if="federating && federatedTimelineAvailable && (currentUser || !privateMode || publicTimelineVisibility?.federated)"> <li v-if="federatedTimelineVisible">
<router-link <router-link
class="menu-item" class="menu-item"
:to="{ name: 'public-external-timeline' }" :to="{ name: 'public-external-timeline' }"

View file

@ -5,6 +5,11 @@ import {
faChevronDown faChevronDown
} from '@fortawesome/free-solid-svg-icons' } from '@fortawesome/free-solid-svg-icons'
import { mapState } from 'vuex' import { mapState } from 'vuex'
import {
publicTimelineVisible,
federatedTimelineVisible,
bubbleTimelineVisible,
} from '../../lib/timeline_visibility'
library.add(faChevronDown) library.add(faChevronDown)
@ -37,17 +42,14 @@ const TimelineMenuTabs = {
} }
}, },
computed: { computed: {
currentUser () {
return this.$store.state.users.currentUser
},
privateMode () { privateMode () {
return this.$store.state.instance.private return this.$store.state.instance.private
}, },
...mapState({ ...mapState({
currentUser: state => state.users.currentUser, currentUser: state => state.users.currentUser,
publicTimelineVisibility: state => state.instance.publicTimelineVisibility, publicTimelineVisible,
federatedTimelineAvailable: state => state.instance.federatedTimelineAvailable, federatedTimelineVisible,
showBubbleTimeline: state => (state.instance.localBubbleInstances.length > 0), bubbleTimelineVisible,
}) })
}, },
methods: { methods: {

View file

@ -18,7 +18,7 @@
<router-link <router-link
:to="{ name: 'public-timeline' }" :to="{ name: 'public-timeline' }"
class="nav-icon" class="nav-icon"
v-if="currentUser || (publicTimelineVisibility?.local ?? true)" v-if="publicTimelineVisible"
> >
<FAIcon <FAIcon
fixed-width fixed-width
@ -28,7 +28,7 @@
/> />
</router-link> </router-link>
<router-link <router-link
v-if="(currentUser || publicTimelineVisibility?.bubble) && showBubbleTimeline" v-if="bubbleTimelineVisible"
:to="{ name: 'bubble-timeline' }" :to="{ name: 'bubble-timeline' }"
class="nav-icon" class="nav-icon"
> >
@ -42,7 +42,7 @@
<router-link <router-link
:to="{ name: 'public-external-timeline' }" :to="{ name: 'public-external-timeline' }"
class="nav-icon" class="nav-icon"
v-if="(currentUser || (publicTimelineVisibility?.federated ?? true)) && federatedTimelineAvailable" v-if="federatedTimelineVisible"
> >
<FAIcon <FAIcon
fixed-width fixed-width

View file

@ -0,0 +1,23 @@
const timelineVisibleUnauthenticated = (state, timeline) => (
state.instance.publicTimelineVisibility[timeline] ?? false
);
const currentUser = (state) => state.users.currentUser;
const currentUserOrTimelineVisibleUnauthenticated = (state, timeline) => (
currentUser(state) || timelineVisibleUnauthenticated(state, timeline)
);
const federatedTimelineAvailable = (state) => state.instance.federatedTimelineAvailable;
export const federatedTimelineVisible = (state) => (
federatedTimelineAvailable(state) && currentUserOrTimelineVisibleUnauthenticated(state, 'federated')
);
export const publicTimelineVisible = (state) => (
currentUserOrTimelineVisibleUnauthenticated(state, 'local')
);
export const bubbleTimelineVisible = (state) => (
state.instance.localBubbleInstances.length > 0 && currentUserOrTimelineVisibleUnauthenticated(state, 'bubble')
);