kglt/fyne-on
1
0
Fork 0
Code Pull requests 1 Activity Actions

refactor: no reactivity transform (#2600)

Browse source
This commit is contained in:
patak 2024-02-21 16:20:08 +01:00 • committed by GitHub
parent b9394c2fa5
commit ccfa7a8d10
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
102 changed files with 649 additions and 652 deletions
Download patch file Download diff file Expand all files Collapse all files

12
pages/[[server]]/@[account]/[status].vue
View file

@ -11,18 +11,18 @@ definePageMeta({
})
const route = useRoute()
const id = $(computedEager(() => route.params.status as string))
const id = computedEager(() => route.params.status as string)
const main = ref<ComponentPublicInstance | null>(null)
const { data: status, pending, refresh: refreshStatus } = useAsyncData(
`status:${id}`,
() => fetchStatus(id, true),
`status:${id.value}`,
() => fetchStatus(id.value, true),
{ watch: [isHydrated], immediate: isHydrated.value, default: () => shallowRef() },
)
const { client } = $(useMasto())
const { client } = useMasto()
const { data: context, pending: pendingContext, refresh: refreshContext } = useAsyncData(
`context:${id}`,
async () => client.v1.statuses.$select(id).context.fetch(),
async () => client.value.v1.statuses.$select(id.value).context.fetch(),
{ watch: [isHydrated], immediate: isHydrated.value, lazy: true, default: () => shallowRef() },
)
@ -54,7 +54,7 @@ watch(publishWidget, () => {
focusEditor()
})
const replyDraft = $computed(() => status.value ? getReplyDraft(status.value) : null)
const replyDraft = computed(() => status.value ? getReplyDraft(status.value) : null)
onReactivated(() => {
// Silently update data when reentering the page

6
pages/[[server]]/@[account]/index.vue
View file

@ -4,12 +4,12 @@ definePageMeta({
})
const params = useRoute().params
const accountName = $(computedEager(() => toShortHandle(params.account as string)))
const accountName = computedEager(() => toShortHandle(params.account as string))
const { t } = useI18n()
const { data: account, pending, refresh } = $(await useAsyncData(() => fetchAccountByHandle(accountName).catch(() => null), { immediate: process.client, default: () => shallowRef() }))
const relationship = $computed(() => account ? useRelationship(account).value : undefined)
const { data: account, pending, refresh } = await useAsyncData(() => fetchAccountByHandle(accountName.value).catch(() => null), { immediate: process.client, default: () => shallowRef() })
const relationship = computed(() => account ? useRelationship(account.value).value : undefined)
const userSettings = useUserSettings()

4
pages/[[server]]/@[account]/index/followers.vue
View file

@ -1,11 +1,11 @@
<script setup lang="ts">
const { t } = useI18n()
const params = useRoute().params
const handle = $(computedEager(() => params.account as string))
const handle = computedEager(() => params.account as string)
definePageMeta({ name: 'account-followers' })
const account = await fetchAccountByHandle(handle)
const account = await fetchAccountByHandle(handle.value)
const paginator = account ? useMastoClient().v1.accounts.$select(account.id).followers.list() : null
const isSelf = useSelfAccount(account)

4
pages/[[server]]/@[account]/index/following.vue
View file

@ -1,11 +1,11 @@
<script setup lang="ts">
const { t } = useI18n()
const params = useRoute().params
const handle = $(computedEager(() => params.account as string))
const handle = computedEager(() => params.account as string)
definePageMeta({ name: 'account-following' })
const account = await fetchAccountByHandle(handle)
const account = await fetchAccountByHandle(handle.value)
const paginator = account ? useMastoClient().v1.accounts.$select(account.id).following.list() : null
const isSelf = useSelfAccount(account)

4
pages/[[server]]/@[account]/index/index.vue
View file

@ -2,13 +2,13 @@
import type { mastodon } from 'masto'
const params = useRoute().params
const handle = $(computedEager(() => params.account as string))
const handle = computedEager(() => params.account as string)
definePageMeta({ name: 'account-index' })
const { t } = useI18n()
const account = await fetchAccountByHandle(handle)
const account = await fetchAccountByHandle(handle.value)
function reorderAndFilter(items: mastodon.v1.Status[]) {
return reorderedTimeline(items, 'account')

4
pages/[[server]]/@[account]/index/media.vue
View file

@ -3,9 +3,9 @@ definePageMeta({ name: 'account-media' })
const { t } = useI18n()
const params = useRoute().params
const handle = $(computedEager(() => params.account as string))
const handle = computedEager(() => params.account as string)
const account = await fetchAccountByHandle(handle)
const account = await fetchAccountByHandle(handle.value)
const paginator = useMastoClient().v1.accounts.$select(account.id).statuses.list({ onlyMedia: true, excludeReplies: false })

4
pages/[[server]]/@[account]/index/with_replies.vue
View file

@ -3,9 +3,9 @@ definePageMeta({ name: 'account-replies' })
const { t } = useI18n()
const params = useRoute().params
const handle = $(computedEager(() => params.account as string))
const handle = computedEager(() => params.account as string)
const account = await fetchAccountByHandle(handle)
const account = await fetchAccountByHandle(handle.value)
const paginator = useMastoClient().v1.accounts.$select(account.id).statuses.list({ excludeReplies: false })

12
pages/[[server]]/explore.vue
View file

@ -3,20 +3,20 @@ import type { CommonRouteTabOption } from '~/components/common/CommonRouteTabs.v
const { t } = useI18n()
const search = $ref<{ input?: HTMLInputElement }>()
const search = ref<{ input?: HTMLInputElement }>()
const route = useRoute()
watchEffect(() => {
if (isMediumOrLargeScreen && route.name === 'explore' && search?.input)
search?.input?.focus()
if (isMediumOrLargeScreen && route.name === 'explore' && search.value?.input)
search.value?.input?.focus()
})
onActivated(() =>
search?.input?.focus(),
search.value?.input?.focus(),
)
onDeactivated(() => search?.input?.blur())
onDeactivated(() => search.value?.input?.blur())
const userSettings = useUserSettings()
const tabs = $computed<CommonRouteTabOption[]>(() => [
const tabs = computed<CommonRouteTabOption[]>(() => [
{
to: isHydrated.value ? `/${currentServer.value}/explore` : '/explore',
display: isHydrated.value ? t('tab.posts') : '',

4
pages/[[server]]/explore/tags.vue
View file

@ -3,8 +3,8 @@ import { STORAGE_KEY_HIDE_EXPLORE_TAGS_TIPS } from '~~/constants'
const { t } = useI18n()
const { client } = $(useMasto())
const paginator = client.v1.trends.tags.list({
const { client } = useMasto()
const paginator = client.value.v1.trends.tags.list({
limit: 20,
})

16
pages/[[server]]/list/[list]/index.vue
View file

@ -8,14 +8,14 @@ definePageMeta({
const route = useRoute()
const { t } = useI18n()
const list = $computed(() => route.params.list as string)
const server = $computed(() => (route.params.server ?? currentServer.value) as string)
const list = computed(() => route.params.list as string)
const server = computed(() => (route.params.server ?? currentServer.value) as string)
const tabs = $computed<CommonRouteTabOption[]>(() => [
const tabs = computed<CommonRouteTabOption[]>(() => [
{
to: {
name: 'list',
params: { server, list },
params: { server: server.value, list: list.value },
},
display: t('tab.posts'),
icon: 'i-ri:list-unordered',
@ -23,7 +23,7 @@ const tabs = $computed<CommonRouteTabOption[]>(() => [
{
to: {
name: 'list-accounts',
params: { server, list },
params: { server: server.value, list: list.value },
},
display: t('tab.accounts'),
icon: 'i-ri:user-line',
@ -31,12 +31,12 @@ const tabs = $computed<CommonRouteTabOption[]>(() => [
],
)
const { client } = $(useMasto())
const { data: listInfo, refresh } = $(await useAsyncData(() => client.v1.lists.$select(list).fetch(), { default: () => shallowRef() }))
const { client } = useMasto()
const { data: listInfo, refresh } = await useAsyncData(() => client.value.v1.lists.$select(list.value).fetch(), { default: () => shallowRef() })
if (listInfo) {
useHydratedHead({
title: () => `${listInfo.title} | ${route.fullPath.endsWith('/accounts') ? t('tab.accounts') : t('tab.posts')} | ${t('nav.lists')}`,
title: () => `${listInfo.value.title} | ${route.fullPath.endsWith('/accounts') ? t('tab.accounts') : t('tab.posts')} | ${t('nav.lists')}`,
})
}

4
pages/[[server]]/list/[list]/index/accounts.vue
View file

@ -4,9 +4,9 @@ definePageMeta({
})
const params = useRoute().params
const listId = $(computedEager(() => params.list as string))
const listId = computedEager(() => params.list as string)
const paginator = useMastoClient().v1.lists.$select(listId).accounts.list()
const paginator = useMastoClient().v1.lists.$select(listId.value).accounts.list()
</script>
<template>

6
pages/[[server]]/list/[list]/index/index.vue
View file

@ -4,12 +4,12 @@ definePageMeta({
})
const params = useRoute().params
const listId = $(computedEager(() => params.list as string))
const listId = computedEager(() => params.list as string)
const client = useMastoClient()
const paginator = client.v1.timelines.list.$select(listId).list()
const stream = useStreaming(client => client.list.subscribe({ list: listId }))
const paginator = client.v1.timelines.list.$select(listId.value).list()
const stream = useStreaming(client => client.list.subscribe({ list: listId.value }))
</script>
<template>

16
pages/[[server]]/lists.vue
View file

@ -17,17 +17,17 @@ useHydratedHead({
const paginatorRef = ref()
const inputRef = ref<HTMLInputElement>()
let actionError = $ref<string | undefined>(undefined)
let busy = $ref<boolean>(false)
const actionError = ref<string | undefined>(undefined)
const busy = ref<boolean>(false)
const createText = ref('')
const enableSubmit = computed(() => createText.value.length > 0)
async function createList() {
if (busy || !enableSubmit.value)
if (busy.value || !enableSubmit.value)
return
busy = true
actionError = undefined
busy.value = true
actionError.value = undefined
await nextTick()
try {
const newEntry = await client.v1.lists.create({
@ -38,18 +38,18 @@ async function createList() {
}
catch (err) {
console.error(err)
actionError = (err as Error).message
actionError.value = (err as Error).message
nextTick(() => {
inputRef.value?.focus()
})
}
finally {
busy = false
busy.value = false
}
}
function clearError(focusBtn: boolean) {
actionError = undefined
actionError.value = undefined
focusBtn && nextTick(() => {
inputRef.value?.focus()
})

10
pages/[[server]]/search.vue
View file

@ -6,15 +6,15 @@ useHydratedHead({
title: () => t('nav.search'),
})
const search = $ref<{ input?: HTMLInputElement }>()
const search = ref<{ input?: HTMLInputElement }>()
watchEffect(() => {
if (search?.input)
search?.input?.focus()
if (search.value?.input)
search.value?.input?.focus()
})
onActivated(() =>
search?.input?.focus(),
search.value?.input?.focus(),
)
onDeactivated(() => search?.input?.blur())
onDeactivated(() => search.value?.input?.blur())
</script>
<template>

14
pages/[[server]]/tags/[tag].vue
View file

@ -4,17 +4,17 @@ definePageMeta({
})
const params = useRoute().params
const tagName = $(computedEager(() => params.tag as string))
const tagName = computedEager(() => params.tag as string)
const { client } = $(useMasto())
const { data: tag, refresh } = $(await useAsyncData(() => client.v1.tags.$select(tagName).fetch(), { default: () => shallowRef() }))
const { client } = useMasto()
const { data: tag, refresh } = await useAsyncData(() => client.value.v1.tags.$select(tagName.value).fetch(), { default: () => shallowRef() })
const paginator = client.v1.timelines.tag.$select(tagName).list()
const stream = useStreaming(client => client.hashtag.subscribe({ tag: tagName }))
const paginator = client.value.v1.timelines.tag.$select(tagName.value).list()
const stream = useStreaming(client => client.hashtag.subscribe({ tag: tagName.value }))
if (tag) {
if (tag.value) {
useHydratedHead({
title: () => `#${tag.name}`,
title: () => `#${tag.value.name}`,
})
}

18
pages/notifications.vue
View file

@ -14,7 +14,7 @@ const route = useRoute()
const { t } = useI18n()
const pwaEnabled = useAppConfig().pwaEnabled
const tabs = $computed<CommonRouteTabOption[]>(() => [
const tabs = computed<CommonRouteTabOption[]>(() => [
{
name: 'all',
to: '/notifications',
@ -27,7 +27,7 @@ const tabs = $computed<CommonRouteTabOption[]>(() => [
},
])
const filter = $computed<mastodon.v1.NotificationType | undefined>(() => {
const filter = computed<mastodon.v1.NotificationType | undefined>(() => {
if (!isHydrated.value)
return undefined
@ -50,22 +50,22 @@ const filterIconMap: Record<mastodon.v1.NotificationType, string> = {
'admin.report': 'i-ri:flag-line',
}
const filterText = $computed(() => (`${t('tab.notifications_more_tooltip')}${filter ? `: ${t(`tab.notifications_${filter}`)}` : ''}`))
const filterText = computed(() => (`${t('tab.notifications_more_tooltip')}${filter ? `: ${t(`tab.notifications_${filter}`)}` : ''}`))
const notificationFilterRoutes = $computed<CommonRouteTabOption[]>(() => NOTIFICATION_FILTER_TYPES.map(
const notificationFilterRoutes = computed<CommonRouteTabOption[]>(() => NOTIFICATION_FILTER_TYPES.map(
name => ({
name,
to: `/notifications/${name}`,
display: isHydrated.value ? t(`tab.notifications_${name}`) : '',
icon: filterIconMap[name],
match: name === filter,
match: name === filter.value,
}),
))
const moreOptions = $computed<CommonRouteTabMoreOption>(() => ({
options: notificationFilterRoutes,
const moreOptions = computed<CommonRouteTabMoreOption>(() => ({
options: notificationFilterRoutes.value,
icon: 'i-ri:filter-2-line',
tooltip: filterText,
match: !!filter,
tooltip: filterText.value,
match: !!filter.value,
}))
</script>

2
pages/notifications/[filter].vue
View file

@ -4,7 +4,7 @@ import type { mastodon } from 'masto'
const route = useRoute()
const { t } = useI18n()
const filter = $computed<mastodon.v1.NotificationType | undefined>(() => {
const filter = computed<mastodon.v1.NotificationType | undefined>(() => {
if (!isHydrated.value)
return undefined

4
pages/settings/about/index.vue
View file

@ -6,12 +6,12 @@ useHydratedHead({
title: () => `${t('settings.about.label')} | ${t('nav.settings')}`,
})
let showCommit = $ref(buildInfo.env !== 'release' && buildInfo.env !== 'dev')
const showCommit = ref(buildInfo.env !== 'release' && buildInfo.env !== 'dev')
const builtTime = useFormattedDateTime(buildInfo.time)
function handleShowCommit() {
setTimeout(() => {
showCommit = true
showCommit.value = true
}, 50)
}
</script>

26
pages/settings/profile/appearance.vue
View file

@ -12,39 +12,39 @@ useHydratedHead({
title: () => `${t('settings.profile.appearance.title')} | ${t('nav.settings')}`,
})
const { client } = $(useMasto())
const { client } = useMasto()
const avatarInput = ref<any>()
const headerInput = ref<any>()
const account = $computed(() => currentUser.value?.account)
const account = computed(() => currentUser.value?.account)
const onlineSrc = $computed(() => ({
avatar: account?.avatar || '',
header: account?.header || '',
const onlineSrc = computed(() => ({
avatar: account.value?.avatar || '',
header: account.value?.header || '',
}))
const { form, reset, submitter, isDirty, isError } = useForm({
form: () => {
// For complex types of objects, a deep copy is required to ensure correct comparison of initial and modified values
const fieldsAttributes = Array.from({ length: maxAccountFieldCount.value }, (_, i) => {
const field = { ...account?.fields?.[i] || { name: '', value: '' } }
const field = { ...account.value?.fields?.[i] || { name: '', value: '' } }
field.value = convertMetadata(field.value)
return field
})
return {
displayName: account?.displayName ?? '',
note: account?.source.note.replaceAll('\r', '') ?? '',
displayName: account.value?.displayName ?? '',
note: account.value?.source.note.replaceAll('\r', '') ?? '',
avatar: null as null | File,
header: null as null | File,
fieldsAttributes,
bot: account?.bot ?? false,
locked: account?.locked ?? false,
bot: account.value?.bot ?? false,
locked: account.value?.locked ?? false,
// These look more like account and privacy settings than appearance settings
// discoverable: false,
@ -54,19 +54,19 @@ const { form, reset, submitter, isDirty, isError } = useForm({
})
const isCanSubmit = computed(() => !isError.value && isDirty.value)
const failedMessages = $ref<string[]>([])
const failedMessages = ref<string[]>([])
const { submit, submitting } = submitter(async ({ dirtyFields }) => {
if (!isCanSubmit.value)
return
const res = await client.v1.accounts.updateCredentials(dirtyFields.value as mastodon.rest.v1.UpdateCredentialsParams)
const res = await client.value.v1.accounts.updateCredentials(dirtyFields.value as mastodon.rest.v1.UpdateCredentialsParams)
.then(account => ({ account }))
.catch((error: Error) => ({ error }))
if ('error' in res) {
console.error(res.error)
failedMessages.push(res.error.message)
failedMessages.value.push(res.error.message)
return
}