Detached QPs and hidden replies (#4878)
Co-authored-by: Hailey <me@haileyok.com>
This commit is contained in:
@@ -0,0 +1,358 @@
|
||||
import {
|
||||
AppBskyFeedDefs,
|
||||
AppBskyFeedGetPostThread,
|
||||
AppBskyFeedThreadgate,
|
||||
AtUri,
|
||||
BskyAgent,
|
||||
} from '@atproto/api'
|
||||
import {useMutation, useQuery, useQueryClient} from '@tanstack/react-query'
|
||||
|
||||
import {networkRetry, retry} from '#/lib/async/retry'
|
||||
import {until} from '#/lib/async/until'
|
||||
import {STALE} from '#/state/queries'
|
||||
import {RQKEY_ROOT as postThreadQueryKeyRoot} from '#/state/queries/post-thread'
|
||||
import {ThreadgateAllowUISetting} from '#/state/queries/threadgate/types'
|
||||
import {
|
||||
createThreadgateRecord,
|
||||
mergeThreadgateRecords,
|
||||
threadgateAllowUISettingToAllowRecordValue,
|
||||
threadgateViewToAllowUISetting,
|
||||
} from '#/state/queries/threadgate/util'
|
||||
import {useAgent} from '#/state/session'
|
||||
import {useThreadgateHiddenReplyUrisAPI} from '#/state/threadgate-hidden-replies'
|
||||
|
||||
export * from '#/state/queries/threadgate/types'
|
||||
export * from '#/state/queries/threadgate/util'
|
||||
|
||||
export const threadgateRecordQueryKeyRoot = 'threadgate-record'
|
||||
export const createThreadgateRecordQueryKey = (uri: string) => [
|
||||
threadgateRecordQueryKeyRoot,
|
||||
uri,
|
||||
]
|
||||
|
||||
export function useThreadgateRecordQuery({
|
||||
enabled,
|
||||
postUri,
|
||||
initialData,
|
||||
}: {
|
||||
enabled?: boolean
|
||||
postUri?: string
|
||||
initialData?: AppBskyFeedThreadgate.Record
|
||||
} = {}) {
|
||||
const agent = useAgent()
|
||||
|
||||
return useQuery({
|
||||
enabled: enabled ?? !!postUri,
|
||||
queryKey: createThreadgateRecordQueryKey(postUri || ''),
|
||||
placeholderData: initialData,
|
||||
staleTime: STALE.MINUTES.ONE,
|
||||
async queryFn() {
|
||||
return getThreadgateRecord({
|
||||
agent,
|
||||
postUri: postUri!,
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export const threadgateViewQueryKeyRoot = 'threadgate-view'
|
||||
export const createThreadgateViewQueryKey = (uri: string) => [
|
||||
threadgateViewQueryKeyRoot,
|
||||
uri,
|
||||
]
|
||||
export function useThreadgateViewQuery({
|
||||
postUri,
|
||||
initialData,
|
||||
}: {
|
||||
postUri?: string
|
||||
initialData?: AppBskyFeedDefs.ThreadgateView
|
||||
} = {}) {
|
||||
const agent = useAgent()
|
||||
|
||||
return useQuery({
|
||||
enabled: !!postUri,
|
||||
queryKey: createThreadgateViewQueryKey(postUri || ''),
|
||||
placeholderData: initialData,
|
||||
staleTime: STALE.MINUTES.ONE,
|
||||
async queryFn() {
|
||||
return getThreadgateView({
|
||||
agent,
|
||||
postUri: postUri!,
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export async function getThreadgateView({
|
||||
agent,
|
||||
postUri,
|
||||
}: {
|
||||
agent: BskyAgent
|
||||
postUri: string
|
||||
}) {
|
||||
const {data} = await agent.app.bsky.feed.getPostThread({
|
||||
uri: postUri!,
|
||||
depth: 0,
|
||||
})
|
||||
|
||||
if (AppBskyFeedDefs.isThreadViewPost(data.thread)) {
|
||||
return data.thread.post.threadgate ?? null
|
||||
}
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
export async function getThreadgateRecord({
|
||||
agent,
|
||||
postUri,
|
||||
}: {
|
||||
agent: BskyAgent
|
||||
postUri: string
|
||||
}): Promise<AppBskyFeedThreadgate.Record | null> {
|
||||
const urip = new AtUri(postUri)
|
||||
|
||||
if (!urip.host.startsWith('did:')) {
|
||||
const res = await agent.resolveHandle({
|
||||
handle: urip.host,
|
||||
})
|
||||
urip.host = res.data.did
|
||||
}
|
||||
|
||||
try {
|
||||
const {data} = await retry(
|
||||
2,
|
||||
e => {
|
||||
/*
|
||||
* If the record doesn't exist, we want to return null instead of
|
||||
* throwing an error. NB: This will also catch reference errors, such as
|
||||
* a typo in the URI.
|
||||
*/
|
||||
if (e.message.includes(`Could not locate record:`)) {
|
||||
return false
|
||||
}
|
||||
return true
|
||||
},
|
||||
() =>
|
||||
agent.api.com.atproto.repo.getRecord({
|
||||
repo: urip.host,
|
||||
collection: 'app.bsky.feed.threadgate',
|
||||
rkey: urip.rkey,
|
||||
}),
|
||||
)
|
||||
|
||||
if (data.value && AppBskyFeedThreadgate.isRecord(data.value)) {
|
||||
return data.value
|
||||
} else {
|
||||
return null
|
||||
}
|
||||
} catch (e: any) {
|
||||
/*
|
||||
* If the record doesn't exist, we want to return null instead of
|
||||
* throwing an error. NB: This will also catch reference errors, such as
|
||||
* a typo in the URI.
|
||||
*/
|
||||
if (e.message.includes(`Could not locate record:`)) {
|
||||
return null
|
||||
} else {
|
||||
throw e
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export async function writeThreadgateRecord({
|
||||
agent,
|
||||
postUri,
|
||||
threadgate,
|
||||
}: {
|
||||
agent: BskyAgent
|
||||
postUri: string
|
||||
threadgate: AppBskyFeedThreadgate.Record
|
||||
}) {
|
||||
const postUrip = new AtUri(postUri)
|
||||
const record = createThreadgateRecord({
|
||||
post: postUri,
|
||||
allow: threadgate.allow, // can/should be undefined!
|
||||
hiddenReplies: threadgate.hiddenReplies || [],
|
||||
})
|
||||
|
||||
await networkRetry(2, () =>
|
||||
agent.api.com.atproto.repo.putRecord({
|
||||
repo: agent.session!.did,
|
||||
collection: 'app.bsky.feed.threadgate',
|
||||
rkey: postUrip.rkey,
|
||||
record,
|
||||
}),
|
||||
)
|
||||
}
|
||||
|
||||
export async function upsertThreadgate(
|
||||
{
|
||||
agent,
|
||||
postUri,
|
||||
}: {
|
||||
agent: BskyAgent
|
||||
postUri: string
|
||||
},
|
||||
callback: (
|
||||
threadgate: AppBskyFeedThreadgate.Record | null,
|
||||
) => Promise<AppBskyFeedThreadgate.Record | undefined>,
|
||||
) {
|
||||
const prev = await getThreadgateRecord({
|
||||
agent,
|
||||
postUri,
|
||||
})
|
||||
const next = await callback(prev)
|
||||
if (!next) return
|
||||
await writeThreadgateRecord({
|
||||
agent,
|
||||
postUri,
|
||||
threadgate: next,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Update the allow list for a threadgate record.
|
||||
*/
|
||||
export async function updateThreadgateAllow({
|
||||
agent,
|
||||
postUri,
|
||||
allow,
|
||||
}: {
|
||||
agent: BskyAgent
|
||||
postUri: string
|
||||
allow: ThreadgateAllowUISetting[]
|
||||
}) {
|
||||
return upsertThreadgate({agent, postUri}, async prev => {
|
||||
if (prev) {
|
||||
return {
|
||||
...prev,
|
||||
allow: threadgateAllowUISettingToAllowRecordValue(allow),
|
||||
}
|
||||
} else {
|
||||
return createThreadgateRecord({
|
||||
post: postUri,
|
||||
allow: threadgateAllowUISettingToAllowRecordValue(allow),
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export function useSetThreadgateAllowMutation() {
|
||||
const agent = useAgent()
|
||||
const queryClient = useQueryClient()
|
||||
|
||||
return useMutation({
|
||||
mutationFn: async ({
|
||||
postUri,
|
||||
allow,
|
||||
}: {
|
||||
postUri: string
|
||||
allow: ThreadgateAllowUISetting[]
|
||||
}) => {
|
||||
return upsertThreadgate({agent, postUri}, async prev => {
|
||||
if (prev) {
|
||||
return {
|
||||
...prev,
|
||||
allow: threadgateAllowUISettingToAllowRecordValue(allow),
|
||||
}
|
||||
} else {
|
||||
return createThreadgateRecord({
|
||||
post: postUri,
|
||||
allow: threadgateAllowUISettingToAllowRecordValue(allow),
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
async onSuccess(_, {postUri, allow}) {
|
||||
await until(
|
||||
5, // 5 tries
|
||||
1e3, // 1s delay between tries
|
||||
(res: AppBskyFeedGetPostThread.Response) => {
|
||||
const thread = res.data.thread
|
||||
if (AppBskyFeedDefs.isThreadViewPost(thread)) {
|
||||
const fetchedSettings = threadgateViewToAllowUISetting(
|
||||
thread.post.threadgate,
|
||||
)
|
||||
return JSON.stringify(fetchedSettings) === JSON.stringify(allow)
|
||||
}
|
||||
return false
|
||||
},
|
||||
() => {
|
||||
return agent.app.bsky.feed.getPostThread({
|
||||
uri: postUri,
|
||||
depth: 0,
|
||||
})
|
||||
},
|
||||
)
|
||||
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: [postThreadQueryKeyRoot],
|
||||
})
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: [threadgateRecordQueryKeyRoot],
|
||||
})
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: [threadgateViewQueryKeyRoot],
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
export function useToggleReplyVisibilityMutation() {
|
||||
const agent = useAgent()
|
||||
const queryClient = useQueryClient()
|
||||
const hiddenReplies = useThreadgateHiddenReplyUrisAPI()
|
||||
|
||||
return useMutation({
|
||||
mutationFn: async ({
|
||||
postUri,
|
||||
replyUri,
|
||||
action,
|
||||
}: {
|
||||
postUri: string
|
||||
replyUri: string
|
||||
action: 'hide' | 'show'
|
||||
}) => {
|
||||
if (action === 'hide') {
|
||||
hiddenReplies.addHiddenReplyUri(replyUri)
|
||||
} else if (action === 'show') {
|
||||
hiddenReplies.removeHiddenReplyUri(replyUri)
|
||||
}
|
||||
|
||||
await upsertThreadgate({agent, postUri}, async prev => {
|
||||
if (prev) {
|
||||
if (action === 'hide') {
|
||||
return mergeThreadgateRecords(prev, {
|
||||
hiddenReplies: [replyUri],
|
||||
})
|
||||
} else if (action === 'show') {
|
||||
return {
|
||||
...prev,
|
||||
hiddenReplies:
|
||||
prev.hiddenReplies?.filter(uri => uri !== replyUri) || [],
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (action === 'hide') {
|
||||
return createThreadgateRecord({
|
||||
post: postUri,
|
||||
hiddenReplies: [replyUri],
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
onSuccess() {
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: [threadgateRecordQueryKeyRoot],
|
||||
})
|
||||
},
|
||||
onError(_, {replyUri, action}) {
|
||||
if (action === 'hide') {
|
||||
hiddenReplies.removeHiddenReplyUri(replyUri)
|
||||
} else if (action === 'show') {
|
||||
hiddenReplies.addHiddenReplyUri(replyUri)
|
||||
}
|
||||
},
|
||||
})
|
||||
}
|
||||
@@ -0,0 +1,6 @@
|
||||
export type ThreadgateAllowUISetting =
|
||||
| {type: 'everybody'}
|
||||
| {type: 'nobody'}
|
||||
| {type: 'mention'}
|
||||
| {type: 'following'}
|
||||
| {type: 'list'; list: unknown}
|
||||
@@ -0,0 +1,141 @@
|
||||
import {AppBskyFeedDefs, AppBskyFeedThreadgate} from '@atproto/api'
|
||||
|
||||
import {ThreadgateAllowUISetting} from '#/state/queries/threadgate/types'
|
||||
|
||||
export function threadgateViewToAllowUISetting(
|
||||
threadgateView: AppBskyFeedDefs.ThreadgateView | undefined,
|
||||
): ThreadgateAllowUISetting[] {
|
||||
const threadgate =
|
||||
threadgateView &&
|
||||
AppBskyFeedThreadgate.isRecord(threadgateView.record) &&
|
||||
AppBskyFeedThreadgate.validateRecord(threadgateView.record).success
|
||||
? threadgateView.record
|
||||
: undefined
|
||||
return threadgateRecordToAllowUISetting(threadgate)
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts a full {@link AppBskyFeedThreadgate.Record} to a list of
|
||||
* {@link ThreadgateAllowUISetting}, for use by app UI.
|
||||
*/
|
||||
export function threadgateRecordToAllowUISetting(
|
||||
threadgate: AppBskyFeedThreadgate.Record | undefined,
|
||||
): ThreadgateAllowUISetting[] {
|
||||
/*
|
||||
* If `threadgate` doesn't exist (default), or if `threadgate.allow === undefined`, it means
|
||||
* anyone can reply.
|
||||
*
|
||||
* If `threadgate.allow === []` it means no one can reply, and we translate to UI code
|
||||
* here. This was a historical choice, and we have no lexicon representation
|
||||
* for 'replies disabled' other than an empty array.
|
||||
*/
|
||||
if (!threadgate || threadgate.allow === undefined) {
|
||||
return [{type: 'everybody'}]
|
||||
}
|
||||
if (threadgate.allow.length === 0) {
|
||||
return [{type: 'nobody'}]
|
||||
}
|
||||
|
||||
const settings: ThreadgateAllowUISetting[] = threadgate.allow
|
||||
.map(allow => {
|
||||
let setting: ThreadgateAllowUISetting | undefined
|
||||
if (allow.$type === 'app.bsky.feed.threadgate#mentionRule') {
|
||||
setting = {type: 'mention'}
|
||||
} else if (allow.$type === 'app.bsky.feed.threadgate#followingRule') {
|
||||
setting = {type: 'following'}
|
||||
} else if (allow.$type === 'app.bsky.feed.threadgate#listRule') {
|
||||
setting = {type: 'list', list: allow.list}
|
||||
}
|
||||
return setting
|
||||
})
|
||||
.filter(n => !!n)
|
||||
return settings
|
||||
}
|
||||
|
||||
/**
|
||||
* Converts an array of {@link ThreadgateAllowUISetting} to the `allow` prop on
|
||||
* {@link AppBskyFeedThreadgate.Record}.
|
||||
*
|
||||
* If the `allow` property on the record is undefined, we infer that to mean
|
||||
* that everyone can reply. If it's an empty array, we infer that to mean that
|
||||
* no one can reply.
|
||||
*/
|
||||
export function threadgateAllowUISettingToAllowRecordValue(
|
||||
threadgate: ThreadgateAllowUISetting[],
|
||||
): AppBskyFeedThreadgate.Record['allow'] {
|
||||
if (threadgate.find(v => v.type === 'everybody')) {
|
||||
return undefined
|
||||
}
|
||||
|
||||
let allow: (
|
||||
| AppBskyFeedThreadgate.MentionRule
|
||||
| AppBskyFeedThreadgate.FollowingRule
|
||||
| AppBskyFeedThreadgate.ListRule
|
||||
)[] = []
|
||||
|
||||
if (!threadgate.find(v => v.type === 'nobody')) {
|
||||
for (const rule of threadgate) {
|
||||
if (rule.type === 'mention') {
|
||||
allow.push({$type: 'app.bsky.feed.threadgate#mentionRule'})
|
||||
} else if (rule.type === 'following') {
|
||||
allow.push({$type: 'app.bsky.feed.threadgate#followingRule'})
|
||||
} else if (rule.type === 'list') {
|
||||
allow.push({
|
||||
$type: 'app.bsky.feed.threadgate#listRule',
|
||||
list: rule.list,
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return allow
|
||||
}
|
||||
|
||||
/**
|
||||
* Merges two {@link AppBskyFeedThreadgate.Record} objects, combining their
|
||||
* `allow` and `hiddenReplies` arrays and de-deduplicating them.
|
||||
*
|
||||
* Note: `allow` can be undefined here, be sure you don't accidentally set it
|
||||
* to an empty array. See other comments in this file.
|
||||
*/
|
||||
export function mergeThreadgateRecords(
|
||||
prev: AppBskyFeedThreadgate.Record,
|
||||
next: Partial<AppBskyFeedThreadgate.Record>,
|
||||
): AppBskyFeedThreadgate.Record {
|
||||
// can be undefined if everyone can reply!
|
||||
const allow: AppBskyFeedThreadgate.Record['allow'] | undefined =
|
||||
prev.allow || next.allow
|
||||
? [...(prev.allow || []), ...(next.allow || [])].filter(
|
||||
(v, i, a) => a.findIndex(t => t.$type === v.$type) === i,
|
||||
)
|
||||
: undefined
|
||||
const hiddenReplies = Array.from(
|
||||
new Set([...(prev.hiddenReplies || []), ...(next.hiddenReplies || [])]),
|
||||
)
|
||||
|
||||
return createThreadgateRecord({
|
||||
post: prev.post,
|
||||
allow, // can be undefined!
|
||||
hiddenReplies,
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a new {@link AppBskyFeedThreadgate.Record} object with the given
|
||||
* properties.
|
||||
*/
|
||||
export function createThreadgateRecord(
|
||||
threadgate: Partial<AppBskyFeedThreadgate.Record>,
|
||||
): AppBskyFeedThreadgate.Record {
|
||||
if (!threadgate.post) {
|
||||
throw new Error('Cannot create a threadgate record without a post URI')
|
||||
}
|
||||
|
||||
return {
|
||||
$type: 'app.bsky.feed.threadgate',
|
||||
post: threadgate.post,
|
||||
createdAt: new Date().toISOString(),
|
||||
allow: threadgate.allow, // can be undefined!
|
||||
hiddenReplies: threadgate.hiddenReplies || [],
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user