refactor: sync masto (#1121)

This commit is contained in:
三咲智子 Kevin Deng 2023-01-15 16:38:02 +08:00 committed by GitHub
parent eb1f769e32
commit 4422a57f49
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
81 changed files with 397 additions and 367 deletions

View file

@ -12,11 +12,11 @@ const isSelf = $(useSelfAccount(() => account))
const enable = $computed(() => !isSelf && currentUser.value)
const relationship = $computed(() => props.relationship || useRelationship(account).value)
const masto = useMasto()
const { client } = $(useMasto())
async function toggleFollow() {
relationship!.following = !relationship!.following
try {
const newRel = await masto.v1.accounts[relationship!.following ? 'follow' : 'unfollow'](account.id)
const newRel = await client.v1.accounts[relationship!.following ? 'follow' : 'unfollow'](account.id)
Object.assign(relationship!, newRel)
}
catch (err) {
@ -29,7 +29,7 @@ async function toggleFollow() {
async function unblock() {
relationship!.blocking = false
try {
const newRel = await masto.v1.accounts.unblock(account.id)
const newRel = await client.v1.accounts.unblock(account.id)
Object.assign(relationship!, newRel)
}
catch (err) {
@ -42,7 +42,7 @@ async function unblock() {
async function unmute() {
relationship!.muting = false
try {
const newRel = await masto.v1.accounts.unmute(account.id)
const newRel = await client.v1.accounts.unmute(account.id)
Object.assign(relationship!, newRel)
}
catch (err) {

View file

@ -6,7 +6,7 @@ const { account } = defineProps<{
command?: boolean
}>()
const masto = useMasto()
const { client } = $(useMasto())
const { t } = useI18n()
@ -46,7 +46,7 @@ function previewAvatar() {
async function toggleNotify() {
relationship!.notifying = !relationship!.notifying
try {
const newRel = await masto.v1.accounts.follow(account.id, { notify: relationship!.notifying })
const newRel = await client.v1.accounts.follow(account.id, { notify: relationship!.notifying })
Object.assign(relationship!, newRel)
}
catch {

View file

@ -10,7 +10,7 @@ let relationship = $(useRelationship(account))
const isSelf = $(useSelfAccount(() => account))
const { t } = useI18n()
const masto = useMasto()
const { client } = $(useMasto())
const isConfirmed = async (title: string) => {
return await openConfirmDialog(t('common.confirm_dialog.title', [title])) === 'confirm'
@ -22,10 +22,10 @@ const toggleMute = async (title: string) => {
relationship!.muting = !relationship!.muting
relationship = relationship!.muting
? await masto.v1.accounts.mute(account.id, {
? await client.v1.accounts.mute(account.id, {
// TODO support more options
})
: await masto.v1.accounts.unmute(account.id)
: await client.v1.accounts.unmute(account.id)
}
const toggleBlockUser = async (title: string) => {
@ -33,7 +33,7 @@ const toggleBlockUser = async (title: string) => {
return
relationship!.blocking = !relationship!.blocking
relationship = await masto.v1.accounts[relationship!.blocking ? 'block' : 'unblock'](account.id)
relationship = await client.v1.accounts[relationship!.blocking ? 'block' : 'unblock'](account.id)
}
const toggleBlockDomain = async (title: string) => {
@ -41,7 +41,7 @@ const toggleBlockDomain = async (title: string) => {
return
relationship!.domainBlocking = !relationship!.domainBlocking
await masto.v1.domainBlocks[relationship!.domainBlocking ? 'block' : 'unblock'](getServerName(account))
await client.v1.domainBlocks[relationship!.domainBlocking ? 'block' : 'unblock'](getServerName(account))
}
const toggleReblogs = async (title: string) => {
@ -49,7 +49,7 @@ const toggleReblogs = async (title: string) => {
return
const showingReblogs = !relationship?.showingReblogs
relationship = await masto.v1.accounts.follow(account.id, { reblogs: showingReblogs })
relationship = await client.v1.accounts.follow(account.id, { reblogs: showingReblogs })
}
</script>

View file

@ -42,7 +42,7 @@ defineSlots<{
const { t } = useI18n()
const { items, prevItems, update, state, endAnchor, error } = usePaginator(paginator, stream, eventType, preprocess)
const { items, prevItems, update, state, endAnchor, error } = usePaginator(paginator, $$(stream), eventType, preprocess)
</script>
<template>

View file

@ -31,7 +31,7 @@ defineProps<{
<div flex items-center flex-shrink-0 gap-x-2>
<slot name="actions" />
<PwaBadge lg:hidden />
<NavUser v-if="isMastoInitialised" />
<NavUser v-if="isHydrated" />
<NavUserSkeleton v-else />
</div>
</div>

View file

@ -51,7 +51,7 @@ const handleFavouritedBoostedByClose = () => {
</script>
<template>
<template v-if="isMastoInitialised">
<template v-if="isHydrated">
<ModalDialog v-model="isSigninDialogOpen" py-4 px-8 max-w-125>
<UserSignIn />
</ModalDialog>

View file

@ -10,7 +10,7 @@ const moreMenuVisible = ref(false)
class="after-content-empty after:(h-[calc(100%+0.5px)] w-0.1px pointer-events-none)"
>
<!-- These weird styles above are used for scroll locking, don't change it unless you know exactly what you're doing. -->
<template v-if="isMastoInitialised && currentUser">
<template v-if="currentUser">
<NuxtLink to="/home" :active-class="moreMenuVisible ? '' : 'text-primary'" flex flex-row items-center place-content-center h-full flex-1 @click="$scrollToTop">
<div i-ri:home-5-line />
</NuxtLink>
@ -24,7 +24,7 @@ const moreMenuVisible = ref(false)
<div i-ri:at-line />
</NuxtLink>
</template>
<template v-if="isMastoInitialised && !currentUser">
<template v-else>
<NuxtLink :to="`/${currentServer}/explore`" :active-class="moreMenuVisible ? '' : 'text-primary'" flex flex-row items-center place-content-center h-full flex-1 @click="$scrollToTop">
<div i-ri:hashtag />
</NuxtLink>

View file

@ -29,9 +29,9 @@ const { notifications } = useNotifications()
<NavSideItem :text="$t('action.compose')" to="/compose" icon="i-ri:quill-pen-line" user-only :command="command" />
<div shrink hidden sm:block mt-4 />
<NavSideItem :text="$t('nav.explore')" :to="isMastoInitialised ? `/${currentServer}/explore` : '/explore'" icon="i-ri:hashtag" :command="command" />
<NavSideItem :text="$t('nav.local')" :to="isMastoInitialised ? `/${currentServer}/public/local` : '/public/local'" icon="i-ri:group-2-line " :command="command" />
<NavSideItem :text="$t('nav.federated')" :to="isMastoInitialised ? `/${currentServer}/public` : '/public'" icon="i-ri:earth-line" :command="command" />
<NavSideItem :text="$t('nav.explore')" :to="isHydrated ? `/${currentServer}/explore` : '/explore'" icon="i-ri:hashtag" :command="command" />
<NavSideItem :text="$t('nav.local')" :to="isHydrated ? `/${currentServer}/public/local` : '/public/local'" icon="i-ri:group-2-line " :command="command" />
<NavSideItem :text="$t('nav.federated')" :to="isHydrated ? `/${currentServer}/public` : '/public'" icon="i-ri:earth-line" :command="command" />
<div shrink hidden sm:block mt-4 />
<NavSideItem :text="$t('nav.settings')" to="/settings" icon="i-ri:settings-3-line" :command="command" />

View file

@ -29,7 +29,7 @@ useCommand({
})
let activeClass = $ref('text-primary')
onMastoInit(async () => {
onHydrated(async () => {
// TODO: force NuxtLink to reevaluate, we now we are in this route though, so we should force it to active
// we don't have currentServer defined until later
activeClass = ''
@ -39,8 +39,8 @@ onMastoInit(async () => {
// Optimize rendering for the common case of being logged in, only show visual feedback for disabled user-only items
// when we know there is no user.
const noUserDisable = computed(() => !isMastoInitialised.value || (props.userOnly && !currentUser.value))
const noUserVisual = computed(() => isMastoInitialised.value && props.userOnly && !currentUser.value)
const noUserDisable = computed(() => !isHydrated.value || (props.userOnly && !currentUser.value))
const noUserVisual = computed(() => isHydrated.value && props.userOnly && !currentUser.value)
</script>
<template>

View file

@ -1,5 +1,5 @@
<template>
<VDropdown v-if="isMastoInitialised && currentUser" sm:hidden>
<VDropdown v-if="isHydrated && currentUser" sm:hidden>
<div style="-webkit-touch-callout: none;">
<AccountAvatar
ref="avatar"

View file

@ -1,6 +1,6 @@
<script setup>
const disabled = computed(() => !isMastoInitialised.value || !currentUser.value)
const disabledVisual = computed(() => isMastoInitialised.value && !currentUser.value)
const disabled = computed(() => !isHydrated.value || !currentUser.value)
const disabledVisual = computed(() => isHydrated.value && !currentUser.value)
</script>
<template>

View file

@ -110,7 +110,7 @@ defineExpose({
</script>
<template>
<div v-if="isMastoInitialised && currentUser" flex="~ col gap-4" py3 px2 sm:px4>
<div v-if="isHydrated && currentUser" flex="~ col gap-4" py3 px2 sm:px4>
<template v-if="draft.editingStatus">
<div flex="~ col gap-1">
<div id="state-editing" text-secondary self-center>

View file

@ -39,7 +39,7 @@ const toggleTranslation = async () => {
isLoading.translation = false
}
const masto = useMasto()
const { client } = $(useMasto())
const getPermalinkUrl = (status: mastodon.v1.Status) => {
const url = getStatusPermalinkRoute(status)
@ -70,7 +70,7 @@ const deleteStatus = async () => {
return
removeCachedStatus(status.id)
await masto.v1.statuses.remove(status.id)
await client.v1.statuses.remove(status.id)
if (route.name === 'status')
router.back()
@ -88,7 +88,7 @@ const deleteAndRedraft = async () => {
}
removeCachedStatus(status.id)
await masto.v1.statuses.remove(status.id)
await client.v1.statuses.remove(status.id)
await openPublishDialog('dialog', await getDraftFromStatus(status), true)
// Go to the new status, if the page is the old status
@ -214,7 +214,7 @@ const showFavoritedAndBoostedBy = () => {
@click="toggleTranslation"
/>
<template v-if="isMastoInitialised && currentUser">
<template v-if="isHydrated && currentUser">
<template v-if="isAuthor">
<CommonDropdownItem
:text="status.pinned ? $t('menu.unpin_on_profile') : $t('menu.pin_on_profile')"

View file

@ -3,8 +3,10 @@ import { favouritedBoostedByStatusId } from '~/composables/dialog'
const type = ref<'favourited-by' | 'boosted-by'>('favourited-by')
const { client } = $(useMasto())
function load() {
return useMasto().v1.statuses[type.value === 'favourited-by' ? 'listFavouritedBy' : 'listRebloggedBy'](favouritedBoostedByStatusId.value!)
return client.v1.statuses[type.value === 'favourited-by' ? 'listFavouritedBy' : 'listRebloggedBy'](favouritedBoostedByStatusId.value!)
}
const paginator = $computed(() => load())

View file

@ -15,7 +15,8 @@ const expiredTimeAgo = useTimeAgo(poll.expiresAt!, timeAgoOptions)
const expiredTimeFormatted = useFormattedDateTime(poll.expiresAt!)
const { formatPercentage } = useHumanReadableNumber()
const masto = useMasto()
const { client } = $(useMasto())
async function vote(e: Event) {
const formData = new FormData(e.target as HTMLFormElement)
const choices = formData.getAll('choices') as string[]
@ -30,7 +31,7 @@ async function vote(e: Event) {
poll.votersCount = (poll.votersCount || 0) + 1
cacheStatus({ ...status, poll }, undefined, true)
await masto.v1.polls.vote(poll.id, { choices })
await client.v1.polls.vote(poll.id, { choices })
}
const votersCount = $computed(() => poll.votersCount ?? 0)

View file

@ -6,7 +6,7 @@ const { status } = defineProps<{
status: mastodon.v1.Status
}>()
const paginator = useMasto().v1.statuses.listHistory(status.id)
const paginator = useMastoClient().v1.statuses.listHistory(status.id)
const showHistory = (edit: mastodon.v1.StatusEdit) => {
openEditHistoryDialog(edit)

View file

@ -9,13 +9,13 @@ const emit = defineEmits<{
(event: 'change'): void
}>()
const masto = useMasto()
const { client } = $(useMasto())
const toggleFollowTag = async () => {
if (tag.following)
await masto.v1.tags.unfollow(tag.name)
await client.v1.tags.unfollow(tag.name)
else
await masto.v1.tags.follow(tag.name)
await client.v1.tags.follow(tag.name)
emit('change')
}

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
const paginator = useMasto().v1.blocks.list()
const paginator = useMastoClient().v1.blocks.list()
</script>
<template>

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
const paginator = useMasto().v1.bookmarks.list()
const paginator = useMastoClient().v1.bookmarks.list()
</script>
<template>

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
const paginator = useMasto().v1.conversations.list()
const paginator = useMastoClient().v1.conversations.list()
</script>
<template>

View file

@ -1,9 +1,9 @@
<script setup lang="ts">
const masto = useMasto()
const paginator = masto.v1.domainBlocks.list()
const { client } = $(useMasto())
const paginator = client.v1.domainBlocks.list()
const unblock = async (domain: string) => {
await masto.v1.domainBlocks.unblock(domain)
await client.v1.domainBlocks.unblock(domain)
}
</script>

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
const paginator = useMasto().v1.favourites.list()
const paginator = useMastoClient().v1.favourites.list()
</script>
<template>

View file

@ -1,7 +1,6 @@
<script setup lang="ts">
const paginator = useMasto().v1.timelines.listHome({ limit: 30 })
const stream = useMasto().v1.stream.streamUser()
onBeforeUnmount(() => stream?.then(s => s.disconnect()))
const paginator = useMastoClient().v1.timelines.listHome({ limit: 30 })
const stream = $(useStreaming(client => client.v1.stream.streamUser()))
</script>
<template>

View file

@ -1,11 +1,10 @@
<script setup lang="ts">
// Default limit is 20 notifications, and servers are normally caped to 30
const paginator = useMasto().v1.notifications.list({ limit: 30, types: ['mention'] })
const paginator = useMastoClient().v1.notifications.list({ limit: 30, types: ['mention'] })
const stream = $(useStreaming(client => client.v1.stream.streamUser()))
const { clearNotifications } = useNotifications()
onActivated(clearNotifications)
const stream = useMasto().v1.stream.streamUser()
</script>
<template>

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
const paginator = useMasto().v1.mutes.list()
const paginator = useMastoClient().v1.mutes.list()
</script>
<template>

View file

@ -1,11 +1,10 @@
<script setup lang="ts">
// Default limit is 20 notifications, and servers are normally caped to 30
const paginator = useMasto().v1.notifications.list({ limit: 30 })
const paginator = useMastoClient().v1.notifications.list({ limit: 30 })
const stream = useStreaming(client => client.v1.stream.streamUser())
const { clearNotifications } = useNotifications()
onActivated(clearNotifications)
const stream = useMasto().v1.stream.streamUser()
</script>
<template>

View file

@ -1,5 +1,5 @@
<script setup lang="ts">
const paginator = useMasto().v1.accounts.listStatuses(currentUser.value!.account.id, { pinned: true })
const paginator = useMastoClient().v1.accounts.listStatuses(currentUser.value!.account.id, { pinned: true })
</script>
<template>

View file

@ -1,7 +1,6 @@
<script setup lang="ts">
const paginator = useMasto().v1.timelines.listPublic({ limit: 30 })
const stream = useMasto().v1.stream.streamPublicTimeline()
onBeforeUnmount(() => stream.then(s => s.disconnect()))
const paginator = useMastoClient().v1.timelines.listPublic({ limit: 30 })
const stream = useStreaming(client => client.v1.stream.streamPublicTimeline())
</script>
<template>

View file

@ -1,7 +1,6 @@
<script setup lang="ts">
const paginator = useMasto().v1.timelines.listPublic({ limit: 30, local: true })
const stream = useMasto().v1.stream.streamCommunityTimeline()
onBeforeUnmount(() => stream.then(s => s.disconnect()))
const paginator = useMastoClient().v1.timelines.listPublic({ limit: 30, local: true })
const stream = useStreaming(client => client.v1.stream.streamCommunityTimeline())
</script>
<template>

View file

@ -2,14 +2,13 @@
import type { UserLogin } from '~/types'
const all = useUsers()
const router = useRouter()
const masto = useMasto()
const switchUser = (user: UserLogin) => {
const clickUser = (user: UserLogin) => {
if (user.account.id === currentUser.value?.account.id)
router.push(getAccountRoute(user.account))
else
masto.loginTo(user)
switchUser(user)
}
</script>
@ -24,7 +23,7 @@ const switchUser = (user: UserLogin) => {
aria-label="Switch user"
:class="user.account.id === currentUser?.account.id ? '' : 'op25 grayscale'"
hover="filter-none op100"
@click="switchUser(user)"
@click="clickUser(user)"
>
<AccountAvatar w-13 h-13 :account="user.account" square />
</button>

View file

@ -28,7 +28,7 @@ async function oauth() {
server = server.split('/')[0]
try {
location.href = await (globalThis.$fetch as any)(`/api/${server || publicServer.value}/login`, {
const url = await (globalThis.$fetch as any)(`/api/${server || publicServer.value}/login`, {
method: 'POST',
body: {
force_login: users.value.some(u => u.server === server),
@ -36,6 +36,7 @@ async function oauth() {
lang: userSettings.value.language,
},
})
location.href = url
}
catch (err) {
console.error(err)

View file

@ -1,6 +1,6 @@
<template>
<div p8 lg:flex="~ col gap2" hidden>
<p v-if="isMastoInitialised" text-sm>
<p v-if="isHydrated" text-sm>
<i18n-t keypath="user.sign_in_notice_title">
<strong>{{ currentServer }}</strong>
</i18n-t>

View file

@ -15,12 +15,11 @@ const sorted = computed(() => {
})
const router = useRouter()
const masto = useMasto()
const switchUser = (user: UserLogin) => {
const clickUser = (user: UserLogin) => {
if (user.account.id === currentUser.value?.account.id)
router.push(getAccountRoute(user.account))
else
masto.loginTo(user)
switchUser(user)
}
</script>
@ -31,7 +30,7 @@ const switchUser = (user: UserLogin) => {
flex rounded px4 py3 text-left
hover:bg-active cursor-pointer transition-100
aria-label="Switch user"
@click="switchUser(user)"
@click="clickUser(user)"
>
<AccountInfo :account="user.account" :hover-card="false" square />
<div flex-auto />
@ -45,7 +44,7 @@ const switchUser = (user: UserLogin) => {
@click="openSigninDialog"
/>
<CommonDropdownItem
v-if="isMastoInitialised && currentUser"
v-if="isHydrated && currentUser"
:text="$t('user.sign_out_account', [getFullHandle(currentUser.account)])"
icon="i-ri:logout-box-line rtl-flip"
@click="signout"