zio/elk
2
0
Fork 0
Code Releases 2 Packages 1 Activity

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

4
components/account/AccountAvatar.vue
View file

@ -6,8 +6,8 @@ defineProps<{
square?: boolean
}>()
const loaded = $ref(false)
const error = $ref(false)
const loaded = ref(false)
const error = ref(false)
</script>
<template>

2
components/account/AccountBigCard.vue
View file

@ -5,7 +5,7 @@ defineOptions({
inheritAttrs: false,
})
const { account, as = 'div' } = $defineProps<{
const { account, as = 'div' } = defineProps<{
account: mastodon.v1.Account
as?: string
}>()

34
components/account/AccountFollowButton.vue
View file

@ -10,35 +10,35 @@ const { account, command, context, ...props } = defineProps<{
}>()
const { t } = useI18n()
const isSelf = $(useSelfAccount(() => account))
const enable = $computed(() => !isSelf && currentUser.value)
const relationship = $computed(() => props.relationship || useRelationship(account).value)
const isSelf = useSelfAccount(() => account)
const enable = computed(() => !isSelf.value && currentUser.value)
const relationship = computed(() => props.relationship || useRelationship(account).value)
const { client } = $(useMasto())
const { client } = useMasto()
async function unblock() {
relationship!.blocking = false
relationship.value!.blocking = false
try {
const newRel = await client.v1.accounts.$select(account.id).unblock()
const newRel = await client.value.v1.accounts.$select(account.id).unblock()
Object.assign(relationship!, newRel)
}
catch (err) {
console.error(err)
// TODO error handling
relationship!.blocking = true
relationship.value!.blocking = true
}
}
async function unmute() {
relationship!.muting = false
relationship.value!.muting = false
try {
const newRel = await client.v1.accounts.$select(account.id).unmute()
const newRel = await client.value.v1.accounts.$select(account.id).unmute()
Object.assign(relationship!, newRel)
}
catch (err) {
console.error(err)
// TODO error handling
relationship!.muting = true
relationship.value!.muting = true
}
}
@ -46,21 +46,21 @@ useCommand({
scope: 'Actions',
order: -2,
visible: () => command && enable,
name: () => `${relationship?.following ? t('account.unfollow') : t('account.follow')} ${getShortHandle(account)}`,
name: () => `${relationship.value?.following ? t('account.unfollow') : t('account.follow')} ${getShortHandle(account)}`,
icon: 'i-ri:star-line',
onActivate: () => toggleFollowAccount(relationship!, account),
onActivate: () => toggleFollowAccount(relationship.value!, account),
})
const buttonStyle = $computed(() => {
if (relationship?.blocking)
const buttonStyle = computed(() => {
if (relationship.value?.blocking)
return 'text-inverted bg-red border-red'
if (relationship?.muting)
if (relationship.value?.muting)
return 'text-base bg-card border-base'
// If following, use a label style with a strong border for Mutuals
if (relationship ? relationship.following : context === 'following')
return `text-base ${relationship?.followedBy ? 'border-strong' : 'border-base'}`
if (relationship.value ? relationship.value.following : context === 'following')
return `text-base ${relationship.value?.followedBy ? 'border-strong' : 'border-base'}`
// If not following, use a button style
return 'text-inverted bg-primary border-primary'

20
components/account/AccountFollowRequestButton.vue
View file

@ -5,32 +5,32 @@ const { account, ...props } = defineProps<{
account: mastodon.v1.Account
relationship?: mastodon.v1.Relationship
}>()
const relationship = $computed(() => props.relationship || useRelationship(account).value)
const { client } = $(useMasto())
const relationship = computed(() => props.relationship || useRelationship(account).value)
const { client } = useMasto()
async function authorizeFollowRequest() {
relationship!.requestedBy = false
relationship!.followedBy = true
relationship.value!.requestedBy = false
relationship.value!.followedBy = true
try {
const newRel = await client.v1.followRequests.$select(account.id).authorize()
const newRel = await client.value.v1.followRequests.$select(account.id).authorize()
Object.assign(relationship!, newRel)
}
catch (err) {
console.error(err)
relationship!.requestedBy = true
relationship!.followedBy = false
relationship.value!.requestedBy = true
relationship.value!.followedBy = false
}
}
async function rejectFollowRequest() {
relationship!.requestedBy = false
relationship.value!.requestedBy = false
try {
const newRel = await client.v1.followRequests.$select(account.id).reject()
const newRel = await client.value.v1.followRequests.$select(account.id).reject()
Object.assign(relationship!, newRel)
}
catch (err) {
console.error(err)
relationship!.requestedBy = true
relationship.value!.requestedBy = true
}
}
</script>

2
components/account/AccountHandle.vue
View file

@ -5,7 +5,7 @@ const { account } = defineProps<{
account: mastodon.v1.Account
}>()
const serverName = $computed(() => getServerName(account))
const serverName = computed(() => getServerName(account))
</script>
<template>

38
components/account/AccountHeader.vue
View file

@ -6,22 +6,22 @@ const { account } = defineProps<{
command?: boolean
}>()
const { client } = $(useMasto())
const { client } = useMasto()
const { t } = useI18n()
const createdAt = $(useFormattedDateTime(() => account.createdAt, {
const createdAt = useFormattedDateTime(() => account.createdAt, {
month: 'long',
day: 'numeric',
year: 'numeric',
}))
})
const relationship = $(useRelationship(account))
const relationship = useRelationship(account)
const namedFields = ref<mastodon.v1.AccountField[]>([])
const iconFields = ref<mastodon.v1.AccountField[]>([])
const isEditingPersonalNote = ref<boolean>(false)
const hasHeader = $computed(() => !account.header.endsWith('/original/missing.png'))
const hasHeader = computed(() => !account.header.endsWith('/original/missing.png'))
const isCopied = ref<boolean>(false)
function getFieldIconTitle(fieldName: string) {
@ -29,7 +29,7 @@ function getFieldIconTitle(fieldName: string) {
}
function getNotificationIconTitle() {
return relationship?.notifying ? t('account.notifications_on_post_disable', { username: `@${account.username}` }) : t('account.notifications_on_post_enable', { username: `@${account.username}` })
return relationship.value?.notifying ? t('account.notifications_on_post_disable', { username: `@${account.username}` }) : t('account.notifications_on_post_enable', { username: `@${account.username}` })
}
function previewHeader() {
@ -51,14 +51,14 @@ function previewAvatar() {
}
async function toggleNotifications() {
relationship!.notifying = !relationship?.notifying
relationship.value!.notifying = !relationship.value?.notifying
try {
const newRel = await client.v1.accounts.$select(account.id).follow({ notify: relationship?.notifying })
const newRel = await client.value.v1.accounts.$select(account.id).follow({ notify: relationship.value?.notifying })
Object.assign(relationship!, newRel)
}
catch {
// TODO error handling
relationship!.notifying = !relationship?.notifying
relationship.value!.notifying = !relationship.value?.notifying
}
}
@ -75,35 +75,35 @@ watchEffect(() => {
})
icons.push({
name: 'Joined',
value: createdAt,
value: createdAt.value,
})
namedFields.value = named
iconFields.value = icons
})
const personalNoteDraft = ref(relationship?.note ?? '')
watch($$(relationship), (relationship, oldValue) => {
const personalNoteDraft = ref(relationship.value?.note ?? '')
watch(relationship, (relationship, oldValue) => {
if (!oldValue && relationship)
personalNoteDraft.value = relationship.note ?? ''
})
async function editNote(event: Event) {
if (!event.target || !('value' in event.target) || !relationship)
if (!event.target || !('value' in event.target) || !relationship.value)
return
const newNote = event.target?.value as string
if (relationship.note?.trim() === newNote.trim())
if (relationship.value.note?.trim() === newNote.trim())
return
const newNoteApiResult = await client.v1.accounts.$select(account.id).note.create({ comment: newNote })
relationship.note = newNoteApiResult.note
personalNoteDraft.value = relationship.note ?? ''
const newNoteApiResult = await client.value.v1.accounts.$select(account.id).note.create({ comment: newNote })
relationship.value.note = newNoteApiResult.note
personalNoteDraft.value = relationship.value.note ?? ''
}
const isSelf = $(useSelfAccount(() => account))
const isNotifiedOnPost = $computed(() => !!relationship?.notifying)
const isSelf = useSelfAccount(() => account)
const isNotifiedOnPost = computed(() => !!relationship.value?.notifying)
const personalNoteMaxLength = 2000

2
components/account/AccountHoverCard.vue
View file

@ -5,7 +5,7 @@ const { account } = defineProps<{
account: mastodon.v1.Account
}>()
const relationship = $(useRelationship(account))
const relationship = useRelationship(account)
</script>
<template>

18
components/account/AccountMoreButton.vue
View file

@ -11,12 +11,12 @@ const emit = defineEmits<{
(evt: 'removeNote'): void
}>()
let relationship = $(useRelationship(account))
const relationship = useRelationship(account)
const isSelf = $(useSelfAccount(() => account))
const isSelf = useSelfAccount(() => account)
const { t } = useI18n()
const { client } = $(useMasto())
const { client } = useMasto()
const useStarFavoriteIcon = usePreferences('useStarFavoriteIcon')
const { share, isSupported: isShareSupported } = useShare()
@ -25,7 +25,7 @@ function shareAccount() {
}
async function toggleReblogs() {
if (!relationship!.showingReblogs && await openConfirmDialog({
if (!relationship.value!.showingReblogs && await openConfirmDialog({
title: t('confirm.show_reblogs.title'),
description: t('confirm.show_reblogs.description', [account.acct]),
confirm: t('confirm.show_reblogs.confirm'),
@ -33,8 +33,8 @@ async function toggleReblogs() {
}) !== 'confirm')
return
const showingReblogs = !relationship?.showingReblogs
relationship = await client.v1.accounts.$select(account.id).follow({ reblogs: showingReblogs })
const showingReblogs = !relationship.value?.showingReblogs
relationship.value = await client.value.v1.accounts.$select(account.id).follow({ reblogs: showingReblogs })
}
async function addUserNote() {
@ -42,11 +42,11 @@ async function addUserNote() {
}
async function removeUserNote() {
if (!relationship!.note || relationship!.note.length === 0)
if (!relationship.value!.note || relationship.value!.note.length === 0)
return
const newNote = await client.v1.accounts.$select(account.id).note.create({ comment: '' })
relationship!.note = newNote.note
const newNote = await client.value.v1.accounts.$select(account.id).note.create({ comment: '' })
relationship.value!.note = newNote.note
emit('removeNote')
}
</script>

4
components/account/AccountPaginator.vue
View file

@ -8,10 +8,10 @@ const { paginator, account, context } = defineProps<{
relationshipContext?: 'followedBy' | 'following'
}>()
const fallbackContext = $computed(() => {
const fallbackContext = computed(() => {
return ['following', 'followers'].includes(context!)
})
const showOriginSite = $computed(() =>
const showOriginSite = computed(() =>
account && account.id !== currentUser.value?.account.id && getServerName(account) !== currentServer.value,
)
</script>

12
components/account/AccountTabs.vue
View file

@ -4,15 +4,15 @@ import type { CommonRouteTabOption } from '../common/CommonRouteTabs.vue'
const { t } = useI18n()
const route = useRoute()
const server = $(computedEager(() => route.params.server as string))
const account = $(computedEager(() => route.params.account as string))
const server = computedEager(() => route.params.server as string)
const account = computedEager(() => route.params.account as string)
const tabs = $computed<CommonRouteTabOption[]>(() => [
const tabs = computed<CommonRouteTabOption[]>(() => [
{
name: 'account-index',
to: {
name: 'account-index',
params: { server, account },
params: { server: server.value, account: account.value },
},
display: t('tab.posts'),
icon: 'i-ri:file-list-2-line',
@ -21,7 +21,7 @@ const tabs = $computed<CommonRouteTabOption[]>(() => [
name: 'account-replies',
to: {
name: 'account-replies',
params: { server, account },
params: { server: server.value, account: account.value },
},
display: t('tab.posts_with_replies'),
icon: 'i-ri:chat-1-line',
@ -30,7 +30,7 @@ const tabs = $computed<CommonRouteTabOption[]>(() => [
name: 'account-media',
to: {
name: 'account-media',
params: { server, account },
params: { server: server.value, account: account.value },
},
display: t('tab.media'),
icon: 'i-ri:camera-2-line',