zio
/
bsky-app
2
0
Fork 0
Code Pull Requests Packages Releases Activity

Implement blocks (#554) 

* Quick fix to prompt

* Add blocked accounts screen

* Add blocking tools to profile

* Blur avis/banners of blocked users

* Factor blocking state into moderation dsl

* Filter post slices from the feed if any are hidden

* Handle various block UIs

* Filter in the client on blockedBy

* Implement block list

* Fix some copy

* Bump deps

* Fix lint
zio/stable
Paul Frazee 2023-04-28 20:03:13 -05:00 committed by GitHub
parent e68aa75429
commit a95c03e280
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
24 changed files with 974 additions and 291 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
bskyweb/cmd/bskyweb/server.go
View File

@ -93,6 +93,7 @@ func serve(cctx *cli.Context) error {
e.GET("/notifications", server.WebGeneric)
e.GET("/settings", server.WebGeneric)
e.GET("/settings/app-passwords", server.WebGeneric)
e.GET("/settings/blocked-accounts", server.WebGeneric)
e.GET("/sys/debug", server.WebGeneric)
e.GET("/sys/log", server.WebGeneric)
e.GET("/support", server.WebGeneric)

4
package.json
View File

@ -22,7 +22,7 @@
"e2e:run": "detox test --configuration ios.sim.debug --take-screenshots all"
},
"dependencies": {
"@atproto/api": "0.2.10",
"@atproto/api": "0.2.11",
"@bam.tech/react-native-image-resizer": "^3.0.4",
"@braintree/sanitize-url": "^6.0.2",
"@expo/webpack-config": "^18.0.1",
@ -130,7 +130,7 @@
"zod": "^3.20.2"
},
"devDependencies": {
"@atproto/pds": "^0.1.4",
"@atproto/pds": "^0.1.5",
"@babel/core": "^7.20.0",
"@babel/preset-env": "^7.20.0",
"@babel/runtime": "^7.20.0",

6
src/Navigation.tsx
View File

@ -27,6 +27,8 @@ import {colors} from 'lib/styles'
import {isNative} from 'platform/detection'
import {useColorSchemeStyle} from 'lib/hooks/useColorSchemeStyle'
import {router} from './routes'
import {usePalette} from 'lib/hooks/usePalette'
import {useStores} from './state'
import {HomeScreen} from './view/screens/Home'
import {SearchScreen} from './view/screens/Search'
@ -46,9 +48,8 @@ import {PrivacyPolicyScreen} from './view/screens/PrivacyPolicy'
import {TermsOfServiceScreen} from './view/screens/TermsOfService'
import {CommunityGuidelinesScreen} from './view/screens/CommunityGuidelines'
import {CopyrightPolicyScreen} from './view/screens/CopyrightPolicy'
import {usePalette} from 'lib/hooks/usePalette'
import {useStores} from './state'
import {AppPasswords} from 'view/screens/AppPasswords'
import {BlockedAccounts} from 'view/screens/BlockedAccounts'
const navigationRef = createNavigationContainerRef<AllNavigatorParams>()
@ -88,6 +89,7 @@ function commonScreens(Stack: typeof HomeTab) {
/>
<Stack.Screen name="CopyrightPolicy" component={CopyrightPolicyScreen} />
<Stack.Screen name="AppPasswords" component={AppPasswords} />
<Stack.Screen name="BlockedAccounts" component={BlockedAccounts} />
</>
)
}

94
src/lib/labeling/helpers.ts
View File

@ -57,6 +57,7 @@ export function getPostModeration(
let avatar = {
warn: accountPref.pref === 'hide' || accountPref.pref === 'warn',
blur:
postInfo.isBlocking ||
accountPref.pref === 'hide' ||
accountPref.pref === 'warn' ||
profilePref.pref === 'hide' ||
@ -75,6 +76,22 @@ export function getPostModeration(
}
// hide cases
if (postInfo.isBlocking) {
return {
avatar,
list: hide('Post from an account you blocked.'),
thread: hide('Post from an account you blocked.'),
view: warn('Post from an account you blocked.'),
}
}
if (postInfo.isBlockedBy) {
return {
avatar,
list: hide('Post from an account that has blocked you.'),
thread: hide('Post from an account that has blocked you.'),
view: warn('Post from an account that has blocked you.'),
}
}
if (accountPref.pref === 'hide') {
return {
avatar,
@ -144,21 +161,45 @@ export function getPostModeration(
}
}
export function mergePostModerations(
moderations: PostModeration[],
): PostModeration {
const merged: PostModeration = {
avatar: {warn: false, blur: false},
list: show(),
thread: show(),
view: show(),
}
for (const mod of moderations) {
if (mod.list.behavior === ModerationBehaviorCode.Hide) {
merged.list = mod.list
}
if (mod.thread.behavior === ModerationBehaviorCode.Hide) {
merged.thread = mod.thread
}
if (mod.view.behavior === ModerationBehaviorCode.Hide) {
merged.view = mod.view
}
}
return merged
}
export function getProfileModeration(
store: RootStoreModel,
profileLabels: ProfileLabelInfo,
profileInfo: ProfileLabelInfo,
): ProfileModeration {
const accountPref = store.preferences.getLabelPreference(
profileLabels.accountLabels,
profileInfo.accountLabels,
)
const profilePref = store.preferences.getLabelPreference(
profileLabels.profileLabels,
profileInfo.profileLabels,
)
// avatar
let avatar = {
warn: accountPref.pref === 'hide' || accountPref.pref === 'warn',
blur:
profileInfo.isBlocking ||
accountPref.pref === 'hide' ||
accountPref.pref === 'warn' ||
profilePref.pref === 'hide' ||
@ -193,7 +234,10 @@ export function getProfileModeration(
if (accountPref.pref === 'warn') {
return {
avatar,
list: warn(accountPref.desc.warning),
list:
profileInfo.isBlocking || profileInfo.isBlockedBy
? hide('Blocked account')
: warn(accountPref.desc.warning),
view: warn(accountPref.desc.warning),
}
}
@ -208,7 +252,7 @@ export function getProfileModeration(
return {
avatar,
list: show(),
list: profileInfo.isBlocking ? hide('Blocked account') : show(),
view: show(),
}
}
@ -220,6 +264,7 @@ export function getProfileViewBasicLabelInfo(
accountLabels: filterAccountLabels(profile.labels),
profileLabels: filterProfileLabels(profile.labels),
isMuted: profile.viewer?.muted || false,
isBlocking: !!profile.viewer?.blocking || false,
}
}
@ -236,6 +281,45 @@ export function getEmbedLabels(embed?: Embed): Label[] {
return []
}
export function getEmbedMuted(embed?: Embed): boolean {
if (!embed) {
return false
}
if (
AppBskyEmbedRecord.isView(embed) &&
AppBskyEmbedRecord.isViewRecord(embed.record)
) {
return !!embed.record.author.viewer?.muted
}
return false
}
export function getEmbedBlocking(embed?: Embed): boolean {
if (!embed) {
return false
}
if (
AppBskyEmbedRecord.isView(embed) &&
AppBskyEmbedRecord.isViewRecord(embed.record)
) {
return !!embed.record.author.viewer?.blocking
}
return false
}
export function getEmbedBlockedBy(embed?: Embed): boolean {
if (!embed) {
return false
}
if (
AppBskyEmbedRecord.isView(embed) &&
AppBskyEmbedRecord.isViewRecord(embed.record)
) {
return !!embed.record.author.viewer?.blockedBy
}
return false
}
export function filterAccountLabels(labels?: Label[]): Label[] {
if (!labels) {
return []

4
src/lib/labeling/types.ts
View File

@ -17,12 +17,16 @@ export interface PostLabelInfo {
accountLabels: Label[]
profileLabels: Label[]
isMuted: boolean
isBlocking: boolean
isBlockedBy: boolean
}
export interface ProfileLabelInfo {
accountLabels: Label[]
profileLabels: Label[]
isMuted: boolean
isBlocking: boolean
isBlockedBy: boolean
}
export enum ModerationBehaviorCode {

1
src/lib/routes/types.ts
View File

@ -20,6 +20,7 @@ export type CommonNavigatorParams = {
CommunityGuidelines: undefined
CopyrightPolicy: undefined
AppPasswords: undefined
BlockedAccounts: undefined
}
export type BottomTabNavigatorParams = CommonNavigatorParams & {

1
src/routes.ts
View File

@ -14,6 +14,7 @@ export const router = new Router({
Debug: '/sys/debug',
Log: '/sys/log',
AppPasswords: '/settings/app-passwords',
BlockedAccounts: '/settings/blocked-accounts',
Support: '/support',
PrivacyPolicy: '/support/privacy',
TermsOfService: '/support/tos',

43
src/state/models/content/post-thread.ts
View File

@ -13,6 +13,9 @@ import {updateDataOptimistically} from 'lib/async/revertible'
import {PostLabelInfo, PostModeration} from 'lib/labeling/types'
import {
getEmbedLabels,
getEmbedMuted,
getEmbedBlocking,
getEmbedBlockedBy,
filterAccountLabels,
filterProfileLabels,
getPostModeration,
@ -30,7 +33,10 @@ export class PostThreadItemModel {
// data
post: AppBskyFeedDefs.PostView
postRecord?: FeedPost.Record
parent?: PostThreadItemModel | AppBskyFeedDefs.NotFoundPost
parent?:
| PostThreadItemModel
| AppBskyFeedDefs.NotFoundPost
| AppBskyFeedDefs.BlockedPost
replies?: (PostThreadItemModel | AppBskyFeedDefs.NotFoundPost)[]
richText?: RichText
@ -60,7 +66,18 @@ export class PostThreadItemModel {
),
accountLabels: filterAccountLabels(this.post.author.labels),
profileLabels: filterProfileLabels(this.post.author.labels),
isMuted: this.post.author.viewer?.muted || false,
isMuted:
this.post.author.viewer?.muted ||
getEmbedMuted(this.post.embed) ||
false,
isBlocking:
!!this.post.author.viewer?.blocking ||
getEmbedBlocking(this.post.embed) ||
false,
isBlockedBy:
!!this.post.author.viewer?.blockedBy ||
getEmbedBlockedBy(this.post.embed) ||
false,
}
}
@ -114,6 +131,8 @@ export class PostThreadItemModel {
this.parent = parentModel
} else if (AppBskyFeedDefs.isNotFoundPost(v.parent)) {
this.parent = v.parent
} else if (AppBskyFeedDefs.isBlockedPost(v.parent)) {
this.parent = v.parent
}
}
// replies
@ -218,6 +237,7 @@ export class PostThreadModel {
// data
thread?: PostThreadItemModel
isBlocked = false
constructor(
public rootStore: RootStoreModel,
@ -377,11 +397,17 @@ export class PostThreadModel {
this._replaceAll(res)
this._xIdle()
} catch (e: any) {
console.log(e)
this._xIdle(e)
}
}
_replaceAll(res: GetPostThread.Response) {
this.isBlocked = AppBskyFeedDefs.isBlockedPost(res.data.thread)
if (this.isBlocked) {
return
}
pruneReplies(res.data.thread)
sortThread(res.data.thread)
const thread = new PostThreadItemModel(
this.rootStore,
@ -399,7 +425,20 @@ export class PostThreadModel {
type MaybePost =
| AppBskyFeedDefs.ThreadViewPost
| AppBskyFeedDefs.NotFoundPost
| AppBskyFeedDefs.BlockedPost
| {[k: string]: unknown; $type: string}
function pruneReplies(post: MaybePost) {
if (post.replies) {
post.replies = (post.replies as MaybePost[]).filter((reply: MaybePost) => {
if (reply.blocked) {
return false
}
pruneReplies(reply)
return true
})
}
}
function sortThread(post: MaybePost) {
if (post.notFound) {
return

32
src/state/models/content/profile.ts
View File

@ -1,5 +1,6 @@
import {makeAutoObservable, runInAction} from 'mobx'
import {
AtUri,
ComAtprotoLabelDefs,
AppBskyActorGetProfile as GetProfile,
AppBskyActorProfile,
@ -23,6 +24,8 @@ export class ProfileViewerModel {
muted?: boolean
following?: string
followedBy?: string
blockedBy?: boolean
blocking?: string
constructor() {
makeAutoObservable(this)
@ -86,6 +89,8 @@ export class ProfileModel {
accountLabels: filterAccountLabels(this.labels),
profileLabels: filterProfileLabels(this.labels),
isMuted: this.viewer?.muted || false,
isBlocking: !!this.viewer?.blocking || false,
isBlockedBy: !!this.viewer?.blockedBy || false,
}
}
@ -185,6 +190,33 @@ export class ProfileModel {
await this.refresh()
}
async blockAccount() {
const res = await this.rootStore.agent.app.bsky.graph.block.create(
{
repo: this.rootStore.me.did,
},
{
subject: this.did,
createdAt: new Date().toISOString(),
},
)
this.viewer.blocking = res.uri
await this.refresh()
}
async unblockAccount() {
if (!this.viewer.blocking) {
return
}
const {rkey} = new AtUri(this.viewer.blocking)
await this.rootStore.agent.app.bsky.graph.block.delete({
repo: this.rootStore.me.did,
rkey,
})
this.viewer.blocking = undefined
await this.refresh()
}
// state transitions
// =

4
src/state/models/feeds/notifications.ts
View File

@ -111,6 +111,10 @@ export class NotificationsFeedItemModel {
addedInfo?.profileLabels || [],
),
isMuted: this.author.viewer?.muted || addedInfo?.isMuted || false,
isBlocking:
!!this.author.viewer?.blocking || addedInfo?.isBlocking || false,
isBlockedBy:
!!this.author.viewer?.blockedBy || addedInfo?.isBlockedBy || false,
}
}

25
src/state/models/feeds/posts.ts
View File

@ -23,7 +23,11 @@ import {updateDataOptimistically} from 'lib/async/revertible'
import {PostLabelInfo, PostModeration} from 'lib/labeling/types'
import {
getEmbedLabels,
getEmbedMuted,
getEmbedBlocking,
getEmbedBlockedBy,
getPostModeration,
mergePostModerations,
filterAccountLabels,
filterProfileLabels,
} from 'lib/labeling/helpers'
@ -97,7 +101,18 @@ export class PostsFeedItemModel {
),
accountLabels: filterAccountLabels(this.post.author.labels),
profileLabels: filterProfileLabels(this.post.author.labels),
isMuted: this.post.author.viewer?.muted || false,
isMuted:
this.post.author.viewer?.muted ||
getEmbedMuted(this.post.embed) ||
false,
isBlocking:
!!this.post.author.viewer?.blocking ||
getEmbedBlocking(this.post.embed) ||
false,
isBlockedBy:
!!this.post.author.viewer?.blockedBy ||
getEmbedBlockedBy(this.post.embed) ||
false,
}
}
@ -240,6 +255,10 @@ export class PostsFeedSliceModel {
return this.items[0]
}
get moderation() {
return mergePostModerations(this.items.map(item => item.moderation))
}
containsUri(uri: string) {
return !!this.items.find(item => item.post.uri === uri)
}
@ -265,6 +284,8 @@ export class PostsFeedModel {
isRefreshing = false
hasNewLatest = false
hasLoaded = false
isBlocking = false
isBlockedBy = false
error = ''
loadMoreError = ''
params: GetTimeline.QueryParams | GetAuthorFeed.QueryParams
@ -553,6 +574,8 @@ export class PostsFeedModel {
this.isLoading = false
this.isRefreshing = false
this.hasLoaded = true
this.isBlocking = error instanceof GetAuthorFeed.BlockedActorError
this.isBlockedBy = error instanceof GetAuthorFeed.BlockedByActorError
this.error = cleanError(error)
this.loadMoreError = cleanError(loadMoreError)
if (error) {

106
src/state/models/lists/blocked-accounts.ts 100644
View File

@ -0,0 +1,106 @@
import {makeAutoObservable} from 'mobx'
import {
AppBskyGraphGetBlocks as GetBlocks,
AppBskyActorDefs as ActorDefs,
} from '@atproto/api'
import {RootStoreModel} from '../root-store'
import {cleanError} from 'lib/strings/errors'
import {bundleAsync} from 'lib/async/bundle'
const PAGE_SIZE = 30
export class BlockedAccountsModel {
// state
isLoading = false
isRefreshing = false
hasLoaded = false
error = ''
hasMore = true
loadMoreCursor?: string
// data
blocks: ActorDefs.ProfileView[] = []
constructor(public rootStore: RootStoreModel) {
makeAutoObservable(
this,
{
rootStore: false,
},
{autoBind: true},
)
}
get hasContent() {
return this.blocks.length > 0
}
get hasError() {
return this.error !== ''
}
get isEmpty() {
return this.hasLoaded && !this.hasContent
}
// public api
// =
async refresh() {
return this.loadMore(true)
}
loadMore = bundleAsync(async (replace: boolean = false) => {
if (!replace && !this.hasMore) {
return
}
this._xLoading(replace)
try {
const res = await this.rootStore.agent.app.bsky.graph.getBlocks({
limit: PAGE_SIZE,
cursor: replace ? undefined : this.loadMoreCursor,
})
if (replace) {
this._replaceAll(res)
} else {
this._appendAll(res)
}
this._xIdle()
} catch (e: any) {
this._xIdle(e)
}
})
// state transitions
// =
_xLoading(isRefreshing = false) {
this.isLoading = true
this.isRefreshing = isRefreshing
this.error = ''
}
_xIdle(err?: any) {
this.isLoading = false
this.isRefreshing = false
this.hasLoaded = true
this.error = cleanError(err)
if (err) {
this.rootStore.log.error('Failed to fetch user followers', err)
}
}
// helper functions
// =
_replaceAll(res: GetBlocks.Response) {
this.blocks = []
this._appendAll(res)
}
_appendAll(res: GetBlocks.Response) {
this.loadMoreCursor = res.data.cursor
this.hasMore = !!this.loadMoreCursor
this.blocks = this.blocks.concat(res.data.blocks)
}
}

6
src/view/com/composer/Composer.tsx
View File

@ -190,11 +190,7 @@ export const ComposePost = observer(function ComposePost({
const canPost = graphemeLength <= MAX_GRAPHEME_LENGTH
const selectTextInputPlaceholder = replyTo
? 'Write your reply'
: gallery.isEmpty
? 'Write a comment'
: "What's up?"
const selectTextInputPlaceholder = replyTo ? 'Write your reply' : "What's up?"
const canSelectImages = gallery.size < 4
const viewStyles = {

3
src/view/com/modals/Confirm.tsx
View File

@ -11,6 +11,7 @@ import {s, colors} from 'lib/styles'
import {ErrorMessage} from '../util/error/ErrorMessage'
import {cleanError} from 'lib/strings/errors'
import {usePalette} from 'lib/hooks/usePalette'
import {isDesktopWeb} from 'platform/detection'
export const snapPoints = [300]
@ -77,7 +78,7 @@ const styles = StyleSheet.create({
container: {
flex: 1,
padding: 10,
paddingBottom: 60,
paddingBottom: isDesktopWeb ? 0 : 60,
},
title: {
textAlign: 'center',

64
src/view/com/post-thread/PostThread.tsx
View File

@ -7,6 +7,7 @@ import {
TouchableOpacity,
View,
} from 'react-native'
import {AppBskyFeedDefs} from '@atproto/api'
import {CenteredView, FlatList} from '../util/Views'
import {
PostThreadModel,
@ -27,11 +28,17 @@ import {useNavigation} from '@react-navigation/native'
import {NavigationProp} from 'lib/routes/types'
const REPLY_PROMPT = {_reactKey: '__reply__', _isHighlightedPost: false}
const DELETED = {_reactKey: '__deleted__', _isHighlightedPost: false}
const BLOCKED = {_reactKey: '__blocked__', _isHighlightedPost: false}
const BOTTOM_COMPONENT = {
_reactKey: '__bottom_component__',
_isHighlightedPost: false,
}
type YieldedItem = PostThreadItemModel | typeof REPLY_PROMPT
type YieldedItem =
| PostThreadItemModel
| typeof REPLY_PROMPT
| typeof DELETED
| typeof BLOCKED
export const PostThread = observer(function PostThread({
uri,
@ -103,6 +110,22 @@ export const PostThread = observer(function PostThread({
({item}: {item: YieldedItem}) => {
if (item === REPLY_PROMPT) {
return <ComposePrompt onPressCompose={onPressReply} />
} else if (item === DELETED) {
return (
<View style={[pal.border, pal.viewLight, styles.missingItem]}>
<Text type="lg-bold" style={pal.textLight}>
Deleted post.
</Text>
</View>
)
} else if (item === BLOCKED) {
return (
<View style={[pal.border, pal.viewLight, styles.missingItem]}>
<Text type="lg-bold" style={pal.textLight}>
Blocked post.
</Text>
</View>
)
} else if (item === BOTTOM_COMPONENT) {
// HACK
// due to some complexities with how flatlist works, this is the easiest way
@ -177,6 +200,30 @@ export const PostThread = observer(function PostThread({
</CenteredView>
)
}
if (view.isBlocked) {
return (
<CenteredView>
<View style={[pal.view, pal.border, styles.notFoundContainer]}>
<Text type="title-lg" style={[pal.text, s.mb5]}>
Post hidden
</Text>
<Text type="md" style={[pal.text, s.mb10]}>
You have blocked the author or you have been blocked by the author.
</Text>
<TouchableOpacity onPress={onPressBack}>
<Text type="2xl" style={pal.link}>
<FontAwesomeIcon
icon="angle-left"
style={[pal.link as FontAwesomeIconStyle, s.mr5]}
size={14}
/>
Back
</Text>
</TouchableOpacity>
</View>
</CenteredView>
)
}
// loaded
// =
@ -208,8 +255,10 @@ function* flattenThread(
isAscending = false,
): Generator<YieldedItem, void> {
if (post.parent) {
if ('notFound' in post.parent && post.parent.notFound) {
// TODO render not found
if (AppBskyFeedDefs.isNotFoundPost(post.parent)) {
yield DELETED
} else if (AppBskyFeedDefs.isBlockedPost(post.parent)) {
yield BLOCKED
} else {
yield* flattenThread(post.parent as PostThreadItemModel, true)
}
@ -220,8 +269,8 @@ function* flattenThread(
}
if (post.replies?.length) {
for (const reply of post.replies) {
if ('notFound' in reply && reply.notFound) {
// TODO render not found
if (AppBskyFeedDefs.isNotFoundPost(reply)) {
yield DELETED
} else {
yield* flattenThread(reply as PostThreadItemModel)
}
@ -238,6 +287,11 @@ const styles = StyleSheet.create({
paddingVertical: 14,
borderRadius: 6,
},
missingItem: {
borderTop: 1,
paddingHorizontal: 18,
paddingVertical: 18,
},
bottomBorder: {
borderBottomWidth: 1,
},

4
src/view/com/posts/FeedSlice.tsx
View File

@ -7,6 +7,7 @@ import {Text} from '../util/text/Text'
import Svg, {Circle, Line} from 'react-native-svg'
import {FeedItem} from './FeedItem'
import {usePalette} from 'lib/hooks/usePalette'
import {ModerationBehaviorCode} from 'lib/labeling/types'
export function FeedSlice({
slice,
@ -17,6 +18,9 @@ export function FeedSlice({
showFollowBtn?: boolean
ignoreMuteFor?: string
}) {
if (slice.moderation.list.behavior === ModerationBehaviorCode.Hide) {
return null
}
if (slice.isThread && slice.items.length > 3) {
const last = slice.items.length - 1
return (

7
src/view/com/profile/ProfileCard.tsx
View File

@ -23,6 +23,7 @@ export const ProfileCard = observer(
noBg,
noBorder,
followers,
overrideModeration,
renderButton,
}: {
testID?: string
@ -30,6 +31,7 @@ export const ProfileCard = observer(
noBg?: boolean
noBorder?: boolean
followers?: AppBskyActorDefs.ProfileView[] | undefined
overrideModeration?: boolean
renderButton?: () => JSX.Element
}) => {
const store = useStores()
@ -40,7 +42,10 @@ export const ProfileCard = observer(
getProfileViewBasicLabelInfo(profile),
)
if (moderation.list.behavior === ModerationBehaviorCode.Hide) {
if (
moderation.list.behavior === ModerationBehaviorCode.Hide &&
!overrideModeration
) {
return null
}

617
src/view/com/profile/ProfileHeader.tsx
View File

@ -96,281 +96,377 @@ export const ProfileHeader = observer(
},
)
const ProfileHeaderLoaded = observer(function ProfileHeaderLoaded({
view,
onRefreshAll,
hideBackButton = false,
}: Props) {
const pal = usePalette('default')
const store = useStores()
const navigation = useNavigation<NavigationProp>()
const {track} = useAnalytics()
const ProfileHeaderLoaded = observer(
({view, onRefreshAll, hideBackButton = false}: Props) => {
const pal = usePalette('default')
const store = useStores()
const navigation = useNavigation<NavigationProp>()
const {track} = useAnalytics()
const onPressBack = React.useCallback(() => {
navigation.goBack()
}, [navigation])
const onPressBack = React.useCallback(() => {
navigation.goBack()
}, [navigation])
const onPressAvi = React.useCallback(() => {
if (view.avatar) {
store.shell.openLightbox(new ProfileImageLightbox(view))
}
}, [store, view])
const onPressAvi = React.useCallback(() => {
if (view.avatar) {
store.shell.openLightbox(new ProfileImageLightbox(view))
}
}, [store, view])
const onPressToggleFollow = React.useCallback(() => {
view?.toggleFollowing().then(
() => {
Toast.show(
`${
view.viewer.following ? 'Following' : 'No longer following'
} ${sanitizeDisplayName(view.displayName || view.handle)}`,
)
},
err => store.log.error('Failed to toggle follow', err),
const onPressToggleFollow = React.useCallback(() => {
view?.toggleFollowing().then(
() => {
Toast.show(
`${
view.viewer.following ? 'Following' : 'No longer following'
} ${sanitizeDisplayName(view.displayName || view.handle)}`,
)
},
err => store.log.error('Failed to toggle follow', err),
)
}, [view, store])
const onPressEditProfile = React.useCallback(() => {
track('ProfileHeader:EditProfileButtonClicked')
store.shell.openModal({
name: 'edit-profile',
profileView: view,
onUpdate: onRefreshAll,
})
}, [track, store, view, onRefreshAll])
const onPressFollowers = React.useCallback(() => {
track('ProfileHeader:FollowersButtonClicked')
navigation.push('ProfileFollowers', {name: view.handle})
}, [track, navigation, view])
const onPressFollows = React.useCallback(() => {
track('ProfileHeader:FollowsButtonClicked')
navigation.push('ProfileFollows', {name: view.handle})
}, [track, navigation, view])
const onPressShare = React.useCallback(async () => {
track('ProfileHeader:ShareButtonClicked')
const url = toShareUrl(`/profile/${view.handle}`)
shareUrl(url)
}, [track, view])
const onPressMuteAccount = React.useCallback(async () => {
track('ProfileHeader:MuteAccountButtonClicked')
try {
await view.muteAccount()
Toast.show('Account muted')
} catch (e: any) {
store.log.error('Failed to mute account', e)
Toast.show(`There was an issue! ${e.toString()}`)
}
}, [track, view, store])
const onPressUnmuteAccount = React.useCallback(async () => {
track('ProfileHeader:UnmuteAccountButtonClicked')
try {
await view.unmuteAccount()
Toast.show('Account unmuted')
} catch (e: any) {
store.log.error('Failed to unmute account', e)
Toast.show(`There was an issue! ${e.toString()}`)
}
}, [track, view, store])
const onPressBlockAccount = React.useCallback(async () => {
track('ProfileHeader:BlockAccountButtonClicked')
store.shell.openModal({
name: 'confirm',
title: 'Block Account',
message:
'Blocked accounts cannot reply in your threads, mention you, or otherwise interact with you. You will not see their content and they will be prevented from seeing yours.',
onPressConfirm: async () => {
try {
await view.blockAccount()
onRefreshAll()
Toast.show('Account blocked')
} catch (e: any) {
store.log.error('Failed to block account', e)
Toast.show(`There was an issue! ${e.toString()}`)
}
},
})
}, [track, view, store, onRefreshAll])
const onPressUnblockAccount = React.useCallback(async () => {
track('ProfileHeader:UnblockAccountButtonClicked')
store.shell.openModal({
name: 'confirm',
title: 'Unblock Account',
message:
'The account will be able to interact with you after unblocking. (You can always block again in the future.)',
onPressConfirm: async () => {
try {
await view.unblockAccount()
onRefreshAll()
Toast.show('Account unblocked')
} catch (e: any) {
store.log.error('Failed to block unaccount', e)
Toast.show(`There was an issue! ${e.toString()}`)
}
},
})
}, [track, view, store, onRefreshAll])
const onPressReportAccount = React.useCallback(() => {
track('ProfileHeader:ReportAccountButtonClicked')
store.shell.openModal({
name: 'report-account',
did: view.did,
})
}, [track, store, view])
const isMe = React.useMemo(
() => store.me.did === view.did,
[store.me.did, view.did],
)
}, [view, store])
const dropdownItems: DropdownItem[] = React.useMemo(() => {
let items: DropdownItem[] = [
{
testID: 'profileHeaderDropdownShareBtn',
label: 'Share',
onPress: onPressShare,
},
]
if (!isMe) {
items.push({sep: true})
if (!view.viewer.blocking) {
items.push({
testID: 'profileHeaderDropdownMuteBtn',
label: view.viewer.muted ? 'Unmute Account' : 'Mute Account',
onPress: view.viewer.muted
? onPressUnmuteAccount
: onPressMuteAccount,
})
}
items.push({
testID: 'profileHeaderDropdownBlockBtn',
label: view.viewer.blocking ? 'Unblock Account' : 'Block Account',
onPress: view.viewer.blocking
? onPressUnblockAccount
: onPressBlockAccount,
})
items.push({
testID: 'profileHeaderDropdownReportBtn',
label: 'Report Account',
onPress: onPressReportAccount,
})
}
return items
}, [
isMe,
view.viewer.muted,
view.viewer.blocking,
onPressShare,
onPressUnmuteAccount,
onPressMuteAccount,
onPressUnblockAccount,
onPressBlockAccount,
onPressReportAccount,
])
const onPressEditProfile = React.useCallback(() => {
track('ProfileHeader:EditProfileButtonClicked')
store.shell.openModal({
name: 'edit-profile',
profileView: view,
onUpdate: onRefreshAll,
})
}, [track, store, view, onRefreshAll])
const blockHide = !isMe && (view.viewer.blocking || view.viewer.blockedBy)
const onPressFollowers = React.useCallback(() => {
track('ProfileHeader:FollowersButtonClicked')
navigation.push('ProfileFollowers', {name: view.handle})
}, [track, navigation, view])
const onPressFollows = React.useCallback(() => {
track('ProfileHeader:FollowsButtonClicked')
navigation.push('ProfileFollows', {name: view.handle})
}, [track, navigation, view])
const onPressShare = React.useCallback(async () => {
track('ProfileHeader:ShareButtonClicked')
const url = toShareUrl(`/profile/${view.handle}`)
shareUrl(url)
}, [track, view])
const onPressMuteAccount = React.useCallback(async () => {
track('ProfileHeader:MuteAccountButtonClicked')
try {
await view.muteAccount()
Toast.show('Account muted')
} catch (e: any) {
store.log.error('Failed to mute account', e)
Toast.show(`There was an issue! ${e.toString()}`)
}
}, [track, view, store])
const onPressUnmuteAccount = React.useCallback(async () => {
track('ProfileHeader:UnmuteAccountButtonClicked')
try {
await view.unmuteAccount()
Toast.show('Account unmuted')
} catch (e: any) {
store.log.error('Failed to unmute account', e)
Toast.show(`There was an issue! ${e.toString()}`)
}
}, [track, view, store])
const onPressReportAccount = React.useCallback(() => {
track('ProfileHeader:ReportAccountButtonClicked')
store.shell.openModal({
name: 'report-account',
did: view.did,
})
}, [track, store, view])
const isMe = React.useMemo(
() => store.me.did === view.did,
[store.me.did, view.did],
)
const dropdownItems: DropdownItem[] = React.useMemo(() => {
let items: DropdownItem[] = [
{
testID: 'profileHeaderDropdownSahreBtn',
label: 'Share',
onPress: onPressShare,
},
]
if (!isMe) {
items.push({
testID: 'profileHeaderDropdownMuteBtn',
label: view.viewer.muted ? 'Unmute Account' : 'Mute Account',
onPress: view.viewer.muted ? onPressUnmuteAccount : onPressMuteAccount,
})
items.push({
testID: 'profileHeaderDropdownReportBtn',
label: 'Report Account',
onPress: onPressReportAccount,
})
}
return items
}, [
isMe,
view.viewer.muted,
onPressShare,
onPressUnmuteAccount,
onPressMuteAccount,
onPressReportAccount,
])
return (
<View style={pal.view}>
<UserBanner banner={view.banner} moderation={view.moderation.avatar} />
<View style={styles.content}>
<View style={[styles.buttonsLine]}>
{isMe ? (
<TouchableOpacity
testID="profileHeaderEditProfileButton"
onPress={onPressEditProfile}
style={[styles.btn, styles.mainBtn, pal.btn]}>
<Text type="button" style={pal.text}>
Edit Profile
</Text>
</TouchableOpacity>
) : (
return (
<View style={pal.view}>
<UserBanner banner={view.banner} moderation={view.moderation.avatar} />
<View style={styles.content}>
<View style={[styles.buttonsLine]}>
{isMe ? (
<TouchableOpacity
testID="profileHeaderEditProfileButton"
onPress={onPressEditProfile}
style={[styles.btn, styles.mainBtn, pal.btn]}>
<Text type="button" style={pal.text}>
Edit Profile
</Text>
</TouchableOpacity>
) : view.viewer.blocking ? (
<TouchableOpacity
testID="unblockBtn"
onPress={onPressUnblockAccount}
style={[styles.btn, styles.mainBtn, pal.btn]}>
<Text type="button" style={[pal.text, s.bold]}>
Unblock
</Text>
</TouchableOpacity>
) : !view.viewer.blockedBy ? (
<>
{store.me.follows.getFollowState(view.did) ===
FollowState.Following ? (
<TouchableOpacity
testID="unfollowBtn"
onPress={onPressToggleFollow}
style={[styles.btn, styles.mainBtn, pal.btn]}>
<FontAwesomeIcon
icon="check"
style={[pal.text, s.mr5]}
size={14}
/>
<Text type="button" style={pal.text}>
Following
</Text>
</TouchableOpacity>
) : (
<TouchableOpacity
testID="followBtn"
onPress={onPressToggleFollow}
style={[styles.btn, styles.primaryBtn]}>
<FontAwesomeIcon
icon="plus"
style={[s.white as FontAwesomeIconStyle, s.mr5]}
/>
<Text type="button" style={[s.white, s.bold]}>
Follow
</Text>
</TouchableOpacity>
)}
</>
) : null}
{dropdownItems?.length ? (
<DropdownButton
testID="profileHeaderDropdownBtn"
type="bare"
items={dropdownItems}
style={[styles.btn, styles.secondaryBtn, pal.btn]}>
<FontAwesomeIcon icon="ellipsis" style={[pal.text]} />
</DropdownButton>
) : undefined}
</View>
<View>
<Text
testID="profileHeaderDisplayName"
type="title-2xl"
style={[pal.text, styles.title]}>
{sanitizeDisplayName(view.displayName || view.handle)}
</Text>
</View>
<View style={styles.handleLine}>
{view.viewer.followedBy && !blockHide ? (
<View style={[styles.pill, pal.btn, s.mr5]}>
<Text type="xs" style={[pal.text]}>
Follows you
</Text>
</View>
) : undefined}
<Text style={pal.textLight}>@{view.handle}</Text>
</View>
{!blockHide && (
<>
{store.me.follows.getFollowState(view.did) ===
FollowState.Following ? (
<View style={styles.metricsLine}>
<TouchableOpacity
testID="unfollowBtn"
onPress={onPressToggleFollow}
style={[styles.btn, styles.mainBtn, pal.btn]}>
<FontAwesomeIcon
icon="check"
style={[pal.text, s.mr5]}
size={14}
/>
<Text type="button" style={pal.text}>
Following
testID="profileHeaderFollowersButton"
style={[s.flexRow, s.mr10]}
onPress={onPressFollowers}>
<Text type="md" style={[s.bold, s.mr2, pal.text]}>
{view.followersCount}
</Text>
<Text type="md" style={[pal.textLight]}>
{pluralize(view.followersCount, 'follower')}
</Text>
</TouchableOpacity>
) : (
<TouchableOpacity
testID="followBtn"
onPress={onPressToggleFollow}
style={[styles.btn, styles.primaryBtn]}>
<FontAwesomeIcon
icon="plus"
style={[s.white as FontAwesomeIconStyle, s.mr5]}
/>
<Text type="button" style={[s.white, s.bold]}>
Follow
testID="profileHeaderFollowsButton"
style={[s.flexRow, s.mr10]}
onPress={onPressFollows}>
<Text type="md" style={[s.bold, s.mr2, pal.text]}>
{view.followsCount}
</Text>
<Text type="md" style={[pal.textLight]}>
following
</Text>
</TouchableOpacity>
)}
<View style={[s.flexRow, s.mr10]}>
<Text type="md" style={[s.bold, s.mr2, pal.text]}>
{view.postsCount}
</Text>
<Text type="md" style={[pal.textLight]}>
{pluralize(view.postsCount, 'post')}
</Text>
</View>
</View>
{view.descriptionRichText ? (
<RichText
testID="profileHeaderDescription"
style={[styles.description, pal.text]}
numberOfLines={15}
richText={view.descriptionRichText}
/>
) : undefined}
</>
)}
{dropdownItems?.length ? (
<DropdownButton
testID="profileHeaderDropdownBtn"
type="bare"
items={dropdownItems}
style={[styles.btn, styles.secondaryBtn, pal.btn]}>
<FontAwesomeIcon icon="ellipsis" style={[pal.text]} />
</DropdownButton>
) : undefined}
<ProfileHeaderWarnings moderation={view.moderation.view} />
<View style={styles.moderationLines}>
{view.viewer.blocking ? (
<View
testID="profileHeaderBlockedNotice"
style={[styles.moderationNotice, pal.view, pal.border]}>
<FontAwesomeIcon icon="ban" style={[pal.text, s.mr5]} />
<Text type="md" style={[s.mr2, pal.text]}>
Account blocked
</Text>
</View>
) : view.viewer.muted ? (
<View
testID="profileHeaderMutedNotice"
style={[styles.moderationNotice, pal.view, pal.border]}>
<FontAwesomeIcon
icon={['far', 'eye-slash']}
style={[pal.text, s.mr5]}
/>
<Text type="md" style={[s.mr2, pal.text]}>
Account muted
</Text>
</View>
) : undefined}
{view.viewer.blockedBy && (
<View
testID="profileHeaderBlockedNotice"
style={[styles.moderationNotice, pal.view, pal.border]}>
<FontAwesomeIcon icon="ban" style={[pal.text, s.mr5]} />
<Text type="md" style={[s.mr2, pal.text]}>
This account has blocked you
</Text>
</View>
)}
</View>
</View>
<View>
<Text
testID="profileHeaderDisplayName"
type="title-2xl"
style={[pal.text, styles.title]}>
{sanitizeDisplayName(view.displayName || view.handle)}
</Text>
</View>
<View style={styles.handleLine}>
{view.viewer.followedBy ? (
<View style={[styles.pill, pal.btn, s.mr5]}>
<Text type="xs" style={[pal.text]}>
Follows you
</Text>
{!isDesktopWeb && !hideBackButton && (
<TouchableWithoutFeedback
onPress={onPressBack}
hitSlop={BACK_HITSLOP}>
<View style={styles.backBtnWrapper}>
<BlurView style={styles.backBtn} blurType="dark">
<FontAwesomeIcon size={18} icon="angle-left" style={s.white} />
</BlurView>
</View>
) : undefined}
<Text style={pal.textLight}>@{view.handle}</Text>
</View>
<View style={styles.metricsLine}>
<TouchableOpacity
testID="profileHeaderFollowersButton"
style={[s.flexRow, s.mr10]}
onPress={onPressFollowers}>
<Text type="md" style={[s.bold, s.mr2, pal.text]}>
{view.followersCount}
</Text>
<Text type="md" style={[pal.textLight]}>
{pluralize(view.followersCount, 'follower')}
</Text>
</TouchableOpacity>
<TouchableOpacity
testID="profileHeaderFollowsButton"
style={[s.flexRow, s.mr10]}
onPress={onPressFollows}>
<Text type="md" style={[s.bold, s.mr2, pal.text]}>
{view.followsCount}
</Text>
<Text type="md" style={[pal.textLight]}>
following
</Text>
</TouchableOpacity>
<View style={[s.flexRow, s.mr10]}>
<Text type="md" style={[s.bold, s.mr2, pal.text]}>
{view.postsCount}
</Text>
<Text type="md" style={[pal.textLight]}>
{pluralize(view.postsCount, 'post')}
</Text>
</View>
</View>
{view.descriptionRichText ? (
<RichText
testID="profileHeaderDescription"
style={[styles.description, pal.text]}
numberOfLines={15}
richText={view.descriptionRichText}
/>
) : undefined}
<ProfileHeaderWarnings moderation={view.moderation.view} />
{view.viewer.muted ? (
</TouchableWithoutFeedback>
)}
<TouchableWithoutFeedback
testID="profileHeaderAviButton"
onPress={onPressAvi}>
<View
testID="profileHeaderMutedNotice"
style={[styles.detailLine, pal.btn, s.p5]}>
<FontAwesomeIcon
icon={['far', 'eye-slash']}
style={[pal.text, s.mr5]}
style={[
pal.view,
{borderColor: pal.colors.background},
styles.avi,
]}>
<UserAvatar
size={80}
avatar={view.avatar}
moderation={view.moderation.avatar}
/>
<Text type="md" style={[s.mr2, pal.text]}>
Account muted
</Text>
</View>
) : undefined}
</View>
{!isDesktopWeb && !hideBackButton && (
<TouchableWithoutFeedback onPress={onPressBack} hitSlop={BACK_HITSLOP}>
<View style={styles.backBtnWrapper}>
<BlurView style={styles.backBtn} blurType="dark">
<FontAwesomeIcon size={18} icon="angle-left" style={s.white} />
</BlurView>
</View>
</TouchableWithoutFeedback>
)}
<TouchableWithoutFeedback
testID="profileHeaderAviButton"
onPress={onPressAvi}>
<View
style={[pal.view, {borderColor: pal.colors.background}, styles.avi]}>
<UserAvatar
size={80}
avatar={view.avatar}
moderation={view.moderation.avatar}
/>
</View>
</TouchableWithoutFeedback>
</View>
)
})
</View>
)
},
)
const styles = StyleSheet.create({
banner: {
@ -460,6 +556,19 @@ const styles = StyleSheet.create({
paddingVertical: 2,
},
moderationLines: {
gap: 6,
},
moderationNotice: {
flexDirection: 'row',
alignItems: 'center',
borderWidth: 1,
borderRadius: 8,
paddingHorizontal: 12,
paddingVertical: 10,
},
br40: {borderRadius: 40},
br50: {borderRadius: 50},
})

2
src/view/index.ts
View File

@ -15,6 +15,7 @@ import {faArrowRotateLeft} from '@fortawesome/free-solid-svg-icons/faArrowRotate
import {faArrowsRotate} from '@fortawesome/free-solid-svg-icons/faArrowsRotate'
import {faAt} from '@fortawesome/free-solid-svg-icons/faAt'
import {faBars} from '@fortawesome/free-solid-svg-icons/faBars'
import {faBan} from '@fortawesome/free-solid-svg-icons/faBan'
import {faBell} from '@fortawesome/free-solid-svg-icons/faBell'
import {faBell as farBell} from '@fortawesome/free-regular-svg-icons/faBell'
import {faBookmark} from '@fortawesome/free-solid-svg-icons/faBookmark'
@ -90,6 +91,7 @@ export function setup() {
faArrowRotateLeft,
faArrowsRotate,
faAt,
faBan,
faBars,
faBell,
farBell,

2
src/view/screens/AppPasswords.tsx
View File

@ -27,7 +27,7 @@ export const AppPasswords = withAuthRequired(
useFocusEffect(
React.useCallback(() => {
screen('Settings')
screen('AppPasswords')
store.shell.setMinimalShellMode(false)
}, [screen, store]),
)

172
src/view/screens/BlockedAccounts.tsx 100644
View File

@ -0,0 +1,172 @@
import React, {useMemo} from 'react'
import {
ActivityIndicator,
FlatList,
RefreshControl,
StyleSheet,
View,
} from 'react-native'
import {AppBskyActorDefs as ActorDefs} from '@atproto/api'
import {Text} from '../com/util/text/Text'
import {useStores} from 'state/index'
import {usePalette} from 'lib/hooks/usePalette'
import {isDesktopWeb} from 'platform/detection'
import {withAuthRequired} from 'view/com/auth/withAuthRequired'
import {observer} from 'mobx-react-lite'
import {NativeStackScreenProps} from '@react-navigation/native-stack'
import {CommonNavigatorParams} from 'lib/routes/types'
import {BlockedAccountsModel} from 'state/models/lists/blocked-accounts'
import {useAnalytics} from 'lib/analytics'
import {useFocusEffect} from '@react-navigation/native'
import {ViewHeader} from '../com/util/ViewHeader'
import {CenteredView} from 'view/com/util/Views'
import {ProfileCard} from 'view/com/profile/ProfileCard'
type Props = NativeStackScreenProps<CommonNavigatorParams, 'BlockedAccounts'>
export const BlockedAccounts = withAuthRequired(
observer(({}: Props) => {
const pal = usePalette('default')
const store = useStores()
const {screen} = useAnalytics()
const blockedAccounts = useMemo(
() => new BlockedAccountsModel(store),
[store],
)
useFocusEffect(
React.useCallback(() => {
screen('BlockedAccounts')
store.shell.setMinimalShellMode(false)
blockedAccounts.refresh()
}, [screen, store, blockedAccounts]),
)
const onRefresh = React.useCallback(() => {
blockedAccounts.refresh()
}, [blockedAccounts])
const onEndReached = React.useCallback(() => {
blockedAccounts
.loadMore()
.catch(err =>
store.log.error('Failed to load more blocked accounts', err),
)
}, [blockedAccounts, store])
const renderItem = ({
item,
index,
}: {
item: ActorDefs.ProfileView
index: number
}) => (
<ProfileCard
testID={`blockedAccount-${index}`}
key={item.did}
profile={item}
overrideModeration
/>
)
return (
<CenteredView
style={[
styles.container,
isDesktopWeb && styles.containerDesktop,
pal.view,
pal.border,
]}
testID="blockedAccountsScreen">
<ViewHeader title="Blocked Accounts" showOnDesktop />
<Text
type="sm"
style={[
styles.description,
pal.text,
isDesktopWeb && styles.descriptionDesktop,
]}>
Blocked accounts cannot reply in your threads, mention you, or
otherwise interact with you. You will not see their content and they
will be prevented from seeing yours.
</Text>
{!blockedAccounts.hasContent ? (
<View style={[pal.border, !isDesktopWeb && styles.flex1]}>
<View style={[styles.empty, pal.viewLight]}>
<Text type="lg" style={[pal.text, styles.emptyText]}>
You have not blocked any accounts yet. To block an account, go
to their profile and selected "Block account" from the menu on
their account.
</Text>
</View>
</View>
) : (
<FlatList
style={[!isDesktopWeb && styles.flex1]}
data={blockedAccounts.blocks}
keyExtractor={(item: ActorDefs.ProfileView) => item.did}
refreshControl={
<RefreshControl
refreshing={blockedAccounts.isRefreshing}
onRefresh={onRefresh}
tintColor={pal.colors.text}
titleColor={pal.colors.text}
/>
}
onEndReached={onEndReached}
renderItem={renderItem}
initialNumToRender={15}
ListFooterComponent={() => (
<View style={styles.footer}>
{blockedAccounts.isLoading && <ActivityIndicator />}
</View>
)}
extraData={blockedAccounts.isLoading}
// @ts-ignore our .web version only -prf
desktopFixedHeight
/>
)}
</CenteredView>
)
}),
)
const styles = StyleSheet.create({
container: {
flex: 1,
paddingBottom: isDesktopWeb ? 0 : 100,
},
containerDesktop: {
borderLeftWidth: 1,
borderRightWidth: 1,
},
title: {
textAlign: 'center',
marginTop: 12,
marginBottom: 12,
},
description: {
textAlign: 'center',
paddingHorizontal: 30,
marginBottom: 14,
},
descriptionDesktop: {
marginTop: 14,
},
flex1: {
flex: 1,
},
empty: {
paddingHorizontal: 20,
paddingVertical: 20,
borderRadius: 16,
marginHorizontal: 24,
marginTop: 10,
},
emptyText: {
textAlign: 'center',
},
footer: {
height: 200,
paddingTop: 20,
},
})

25
src/view/screens/Profile.tsx
View File

@ -116,6 +116,24 @@ export const ProfileScreen = withAuthRequired(
} else if (item === ProfileUiModel.LOADING_ITEM) {
return <PostFeedLoadingPlaceholder />
} else if (item._reactKey === '__error__') {
if (uiState.feed.isBlocking) {
return (
<EmptyState
icon="ban"
message="Posts hidden"
style={styles.emptyState}
/>
)
}
if (uiState.feed.isBlockedBy) {
return (
<EmptyState
icon="ban"
message="Posts hidden"
style={styles.emptyState}
/>
)
}
return (
<View style={s.p5}>
<ErrorMessage
@ -137,7 +155,12 @@ export const ProfileScreen = withAuthRequired(
}
return <View />
},
[onPressTryAgain, uiState.profile.did],
[
onPressTryAgain,
uiState.profile.did,
uiState.feed.isBlocking,
uiState.feed.isBlockedBy,
],
)
return (

22
src/view/screens/Settings.tsx
View File

@ -255,7 +255,7 @@ export const SettingsScreen = withAuthRequired(
<View style={styles.spacer20} />
<Text type="xl-bold" style={[pal.text, styles.heading]}>
Advanced
Moderation
</Text>
<TouchableOpacity
testID="contentFilteringBtn"
@ -271,6 +271,26 @@ export const SettingsScreen = withAuthRequired(
Content moderation
</Text>
</TouchableOpacity>
<Link
testID="blockedAccountsBtn"
style={[styles.linkCard, pal.view, isSwitching && styles.dimmed]}
href="/settings/blocked-accounts">
<View style={[styles.iconContainer, pal.btn]}>
<FontAwesomeIcon
icon="ban"
style={pal.text as FontAwesomeIconStyle}
/>
</View>
<Text type="lg" style={pal.text}>
Blocked accounts
</Text>
</Link>
<View style={styles.spacer20} />
<Text type="xl-bold" style={[pal.text, styles.heading]}>
Advanced
</Text>
<Link
testID="appPasswordBtn"
style={[styles.linkCard, pal.view, isSwitching && styles.dimmed]}

20
yarn.lock
View File

@ -30,10 +30,10 @@
tlds "^1.234.0"
typed-emitter "^2.1.0"
"@atproto/api@0.2.10":
version "0.2.10"
resolved "https://registry.yarnpkg.com/@atproto/api/-/api-0.2.10.tgz#19c4d695f88ab4e45e4c9f2f4db5fad61590a3d2"
integrity sha512-97UBtvIXhsgNO7bXhHk0JwDNwyqTcL1N0JT2rnXjUeLKNf2hDvomFtI50Y4RFU942uUS5W5VtM+JJuZO5Ryw5w==
"@atproto/api@0.2.11":
version "0.2.11"
resolved "https://registry.yarnpkg.com/@atproto/api/-/api-0.2.11.tgz#53b70b0f4942b2e2dd5cb46433f133cde83917bf"
integrity sha512-5JY1Ii/81Bcy1ZTGRqALsaOdc8fIJTSlMNoSptpGH73uAPQE93weDrb8sc3KoxWi1G2ss3IIBSLPJWxALocJSQ==
dependencies:
"@atproto/common-web" "*"
"@atproto/uri" "*"
@ -122,10 +122,10 @@
resolved "https://registry.yarnpkg.com/@atproto/nsid/-/nsid-0.0.1.tgz#0cdc00cefe8f0b1385f352b9f57b3ad37fff09a4"
integrity sha512-t5M6/CzWBVYoBbIvfKDpqPj/+ZmyoK9ydZSStcTXosJ27XXwOPhz0VDUGKK2SM9G5Y7TPes8S5KTAU0UdVYFCw==
"@atproto/pds@^0.1.4":
version "0.1.4"
resolved "https://registry.yarnpkg.com/@atproto/pds/-/pds-0.1.4.tgz#43379912e127d6d4f79a514e785dab9b54fd7810"
integrity sha512-vrFYL+2nNm/0fJyUIgFK9h9FRuEf4rHjU/LJV7/nBO+HA3hP3U/mTgvVxuuHHvcRsRL5AVpAJR0xWFUoYsFmmg==
"@atproto/pds@^0.1.5":
version "0.1.5"
resolved "https://registry.yarnpkg.com/@atproto/pds/-/pds-0.1.5.tgz#59411497f2d85b6706ab793e8f7f618bdb8c51a3"
integrity sha512-QtTf2mbqO5MEsrXPTFU43dSb0WT3TzaLw5mL++9w18CZDMvdmv2uJXKeaSiU+u3WJEtRpRs5hoLSdfrJ2i3PuA==
dependencies:
"@atproto/api" "*"
"@atproto/common" "*"
@ -154,7 +154,7 @@
nodemailer "^6.8.0"
nodemailer-html-to-text "^3.2.0"
p-queue "^6.6.2"
pg "^8.8.0"
pg "^8.10.0"
pino "^8.6.1"
pino-http "^8.2.1"
sharp "^0.31.2"
@ -13419,7 +13419,7 @@ pg-types@^2.1.0:
postgres-date "~1.0.4"
postgres-interval "^1.1.0"
pg@^8.8.0, pg@^8.9.0:
pg@^8.10.0, pg@^8.9.0:
version "8.10.0"
resolved "https://registry.yarnpkg.com/pg/-/pg-8.10.0.tgz#5b8379c9b4a36451d110fc8cd98fc325fe62ad24"
integrity sha512-ke7o7qSTMb47iwzOSaZMfeR7xToFdkE71ifIipOAAaLIM0DYzfOAXlgFFmYUIE2BcJtvnVlGCID84ZzCegE8CQ==