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

Merge branch 'main' into upload-image

zio/stable
João Ferreiro 2022-11-29 10:29:19 +00:00
parent 3ce113f107 88c868dd80
commit 77ea3bfd0a
16 changed files with 255 additions and 137 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/state/models/me.ts
View File

@ -1,6 +1,7 @@
import {makeAutoObservable, runInAction} from 'mobx' import {makeAutoObservable, runInAction} from 'mobx'
import {RootStoreModel} from './root-store' import {RootStoreModel} from './root-store'
import {MembershipsViewModel} from './memberships-view' import {MembershipsViewModel} from './memberships-view'
import {NotificationsViewModel} from './notifications-view'
export class MeModel { export class MeModel {
did?: string did?: string
@ -9,9 +10,11 @@ export class MeModel {
description?: string description?: string
notificationCount: number = 0 notificationCount: number = 0
memberships?: MembershipsViewModel memberships?: MembershipsViewModel
notifications: NotificationsViewModel
constructor(public rootStore: RootStoreModel) { constructor(public rootStore: RootStoreModel) {
makeAutoObservable(this, {rootStore: false}, {autoBind: true}) makeAutoObservable(this, {rootStore: false}, {autoBind: true})
this.notifications = new NotificationsViewModel(this.rootStore, {})
} }
clear() { clear() {
@ -43,7 +46,12 @@ export class MeModel {
this.memberships = new MembershipsViewModel(this.rootStore, { this.memberships = new MembershipsViewModel(this.rootStore, {
actor: this.did, actor: this.did,
}) })
await this.memberships?.setup() await this.memberships?.setup().catch(e => {
console.error('Failed to setup memberships model', e)
})
await this.notifications.setup().catch(e => {
console.error('Failed to setup notifications model', e)
})
} else { } else {
this.clear() this.clear()
} }
@ -56,7 +64,12 @@ export class MeModel {
async fetchStateUpdate() { async fetchStateUpdate() {
const res = await this.rootStore.api.app.bsky.notification.getCount() const res = await this.rootStore.api.app.bsky.notification.getCount()
runInAction(() => { runInAction(() => {
const newNotifications = this.notificationCount !== res.data.count
this.notificationCount = res.data.count this.notificationCount = res.data.count
if (newNotifications) {
// trigger pre-emptive fetch on new notifications
this.notifications.refresh()
}
}) })
} }

103
src/state/models/notifications-view.ts
View File

@ -1,6 +1,7 @@
import {makeAutoObservable} from 'mobx' import {makeAutoObservable, runInAction} from 'mobx'
import * as ListNotifications from '../../third-party/api/src/client/types/app/bsky/notification/list' import * as ListNotifications from '../../third-party/api/src/client/types/app/bsky/notification/list'
import {RootStoreModel} from './root-store' import {RootStoreModel} from './root-store'
import {PostThreadViewModel} from './post-thread-view'
import {Declaration} from './_common' import {Declaration} from './_common'
import {hasProp} from '../lib/type-guards' import {hasProp} from '../lib/type-guards'
import {APP_BSKY_GRAPH} from '../../third-party/api' import {APP_BSKY_GRAPH} from '../../third-party/api'
@ -34,6 +35,9 @@ export class NotificationsViewItemModel implements GroupedNotification {
indexedAt: string = '' indexedAt: string = ''
additional?: NotificationsViewItemModel[] additional?: NotificationsViewItemModel[]
// additional data
additionalPost?: PostThreadViewModel
constructor( constructor(
public rootStore: RootStoreModel, public rootStore: RootStoreModel,
reactKey: string, reactKey: string,
@ -89,6 +93,13 @@ export class NotificationsViewItemModel implements GroupedNotification {
return this.reason === 'assertion' return this.reason === 'assertion'
} }
get needsAdditionalData() {
if (this.isUpvote || this.isRepost || this.isTrend || this.isReply) {
return !this.additionalPost
}
return false
}
get isInvite() { get isInvite() {
return ( return (
this.isAssertion && this.record.assertion === APP_BSKY_GRAPH.AssertMember this.isAssertion && this.record.assertion === APP_BSKY_GRAPH.AssertMember
@ -107,6 +118,27 @@ export class NotificationsViewItemModel implements GroupedNotification {
} }
return '' return ''
} }
async fetchAdditionalData() {
if (!this.needsAdditionalData) {
return
}
let postUri
if (this.isReply) {
postUri = this.uri
} else if (this.isUpvote || this.isRead || this.isTrend) {
postUri = this.subjectUri
}
if (postUri) {
this.additionalPost = new PostThreadViewModel(this.rootStore, {
uri: postUri,
depth: 0,
})
await this.additionalPost.setup().catch(e => {
console.error('Failed to load post needed by notification', e)
})
}
}
} }
export class NotificationsViewModel { export class NotificationsViewModel {
@ -171,7 +203,6 @@ export class NotificationsViewModel {
await this._pendingWork() await this._pendingWork()
this._loadPromise = this._initialLoad(isRefreshing) this._loadPromise = this._initialLoad(isRefreshing)
await this._loadPromise await this._loadPromise
this._updateReadState()
this._loadPromise = undefined this._loadPromise = undefined
} }
@ -208,6 +239,20 @@ export class NotificationsViewModel {
this._updatePromise = undefined this._updatePromise = undefined
} }
/**
* Update read/unread state
*/
async updateReadState() {
try {
await this.rootStore.api.app.bsky.notification.updateSeen({
seenAt: new Date().toISOString(),
})
this.rootStore.me.clearNotificationCount()
} catch (e) {
console.log('Failed to update notifications read state', e)
}
}
// state transitions // state transitions
// = // =
@ -246,7 +291,7 @@ export class NotificationsViewModel {
limit: PAGE_SIZE, limit: PAGE_SIZE,
}) })
const res = await this.rootStore.api.app.bsky.notification.list(params) const res = await this.rootStore.api.app.bsky.notification.list(params)
this._replaceAll(res) await this._replaceAll(res)
this._xIdle() this._xIdle()
} catch (e: any) { } catch (e: any) {
this._xIdle(`Failed to load notifications: ${e.toString()}`) this._xIdle(`Failed to load notifications: ${e.toString()}`)
@ -264,7 +309,7 @@ export class NotificationsViewModel {
before: this.loadMoreCursor, before: this.loadMoreCursor,
}) })
const res = await this.rootStore.api.app.bsky.notification.list(params) const res = await this.rootStore.api.app.bsky.notification.list(params)
this._appendAll(res) await this._appendAll(res)
this._xIdle() this._xIdle()
} catch (e: any) { } catch (e: any) {
this._xIdle(`Failed to load notifications: ${e.toString()}`) this._xIdle(`Failed to load notifications: ${e.toString()}`)
@ -296,25 +341,40 @@ export class NotificationsViewModel {
} }
} }
private _replaceAll(res: ListNotifications.Response) { private async _replaceAll(res: ListNotifications.Response) {
this.notifications.length = 0 return this._appendAll(res, true)
this._appendAll(res)
} }
private _appendAll(res: ListNotifications.Response) { private async _appendAll(res: ListNotifications.Response, replace = false) {
this.loadMoreCursor = res.data.cursor this.loadMoreCursor = res.data.cursor
this.hasMore = !!this.loadMoreCursor this.hasMore = !!this.loadMoreCursor
let counter = this.notifications.length let counter = this.notifications.length
const promises = []
const itemModels: NotificationsViewItemModel[] = []
for (const item of groupNotifications(res.data.notifications)) { for (const item of groupNotifications(res.data.notifications)) {
this._append(counter++, item) const itemModel = new NotificationsViewItemModel(
this.rootStore,
`item-${counter++}`,
item,
)
if (itemModel.needsAdditionalData) {
promises.push(itemModel.fetchAdditionalData())
}
itemModels.push(itemModel)
} }
} await Promise.all(promises).catch(e => {
console.error(
private _append(keyId: number, item: GroupedNotification) { 'Uncaught failure during notifications-view _appendAll()',
// TODO: validate .record e,
this.notifications.push( )
new NotificationsViewItemModel(this.rootStore, `item-${keyId}`, item), })
) runInAction(() => {
if (replace) {
this.notifications = itemModels
} else {
this.notifications = this.notifications.concat(itemModels)
}
})
} }
private _updateAll(res: ListNotifications.Response) { private _updateAll(res: ListNotifications.Response) {
@ -330,17 +390,6 @@ export class NotificationsViewModel {
} }
} }
} }
private async _updateReadState() {
try {
await this.rootStore.api.app.bsky.notification.updateSeen({
seenAt: new Date().toISOString(),
})
this.rootStore.me.clearNotificationCount()
} catch (e) {
console.log('Failed to update notifications read state', e)
}
}
} }
function groupNotifications( function groupNotifications(

11
src/state/models/post-thread-view.ts
View File

@ -1,5 +1,5 @@
import {makeAutoObservable, runInAction} from 'mobx' import {makeAutoObservable, runInAction} from 'mobx'
import * as GetPostThread from '../../third-party/api/src/client/types/app/bsky/feed/getPostThread' import {AppBskyFeedGetPostThread as GetPostThread} from '../../third-party/api'
import {AtUri} from '../../third-party/uri' import {AtUri} from '../../third-party/uri'
import _omit from 'lodash.omit' import _omit from 'lodash.omit'
import {RootStoreModel} from './root-store' import {RootStoreModel} from './root-store'
@ -216,6 +216,7 @@ export class PostThreadViewModel {
isRefreshing = false isRefreshing = false
hasLoaded = false hasLoaded = false
error = '' error = ''
notFound = false
resolvedUri = '' resolvedUri = ''
params: GetPostThread.QueryParams params: GetPostThread.QueryParams
@ -286,13 +287,15 @@ export class PostThreadViewModel {
this.isLoading = true this.isLoading = true
this.isRefreshing = isRefreshing this.isRefreshing = isRefreshing
this.error = '' this.error = ''
this.notFound = false
} }
private _xIdle(err: string = '') { private _xIdle(err: any = undefined) {
this.isLoading = false this.isLoading = false
this.isRefreshing = false this.isRefreshing = false
this.hasLoaded = true this.hasLoaded = true
this.error = err this.error = err ? err.toString() : ''
this.notFound = err instanceof GetPostThread.NotFoundError
} }
// loader functions // loader functions
@ -317,7 +320,7 @@ export class PostThreadViewModel {
this._replaceAll(res) this._replaceAll(res)
this._xIdle() this._xIdle()
} catch (e: any) { } catch (e: any) {
this._xIdle(`Failed to load thread: ${e.toString()}`) this._xIdle(e)
} }
} }

113
src/third-party/api/index.js vendored
View File

@ -10424,7 +10424,7 @@ var methodSchemaDict = {
required: ["useCount"], required: ["useCount"],
properties: { properties: {
useCount: { useCount: {
type: "number" type: "integer"
} }
}, },
$defs: {} $defs: {}
@ -10841,7 +10841,7 @@ var methodSchemaDict = {
description: "The NSID of the record type." description: "The NSID of the record type."
}, },
limit: { limit: {
type: "number", type: "integer",
minimum: 1, minimum: 1,
default: 50, default: 50,
description: "The number of records to return. TODO-max number?" description: "The number of records to return. TODO-max number?"
@ -11306,16 +11306,16 @@ var methodSchemaDict = {
maxLength: 256 maxLength: 256
}, },
followersCount: { followersCount: {
type: "number" type: "integer"
}, },
followsCount: { followsCount: {
type: "number" type: "integer"
}, },
membersCount: { membersCount: {
type: "number" type: "integer"
}, },
postsCount: { postsCount: {
type: "number" type: "integer"
}, },
myState: { myState: {
type: "object", type: "object",
@ -11403,7 +11403,7 @@ var methodSchemaDict = {
type: "object", type: "object",
properties: { properties: {
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
cursor: { cursor: {
@ -11536,7 +11536,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -11661,7 +11661,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
} }
} }
@ -11818,7 +11818,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -11889,16 +11889,16 @@ var methodSchemaDict = {
] ]
}, },
replyCount: { replyCount: {
type: "number" type: "integer"
}, },
repostCount: { repostCount: {
type: "number" type: "integer"
}, },
upvoteCount: { upvoteCount: {
type: "number" type: "integer"
}, },
downvoteCount: { downvoteCount: {
type: "number" type: "integer"
}, },
indexedAt: { indexedAt: {
type: "string", type: "string",
@ -12066,16 +12066,16 @@ var methodSchemaDict = {
] ]
}, },
replyCount: { replyCount: {
type: "number" type: "integer"
}, },
repostCount: { repostCount: {
type: "number" type: "integer"
}, },
upvoteCount: { upvoteCount: {
type: "number" type: "integer"
}, },
downvoteCount: { downvoteCount: {
type: "number" type: "integer"
}, },
indexedAt: { indexedAt: {
type: "string", type: "string",
@ -12207,7 +12207,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
depth: { depth: {
type: "number" type: "integer"
} }
} }
}, },
@ -12265,7 +12265,7 @@ var methodSchemaDict = {
$ref: "#/$defs/post" $ref: "#/$defs/post"
}, },
replyCount: { replyCount: {
type: "number" type: "integer"
}, },
replies: { replies: {
type: "array", type: "array",
@ -12274,13 +12274,13 @@ var methodSchemaDict = {
} }
}, },
repostCount: { repostCount: {
type: "number" type: "integer"
}, },
upvoteCount: { upvoteCount: {
type: "number" type: "integer"
}, },
downvoteCount: { downvoteCount: {
type: "number" type: "integer"
}, },
indexedAt: { indexedAt: {
type: "string", type: "string",
@ -12445,7 +12445,7 @@ var methodSchemaDict = {
$ref: "#/$defs/post" $ref: "#/$defs/post"
}, },
replyCount: { replyCount: {
type: "number" type: "integer"
}, },
replies: { replies: {
type: "array", type: "array",
@ -12454,13 +12454,13 @@ var methodSchemaDict = {
} }
}, },
repostCount: { repostCount: {
type: "number" type: "integer"
}, },
upvoteCount: { upvoteCount: {
type: "number" type: "integer"
}, },
downvoteCount: { downvoteCount: {
type: "number" type: "integer"
}, },
indexedAt: { indexedAt: {
type: "string", type: "string",
@ -12578,7 +12578,12 @@ var methodSchemaDict = {
enum: ["app.bsky.system.actorUser", "app.bsky.system.actorScene"] enum: ["app.bsky.system.actorUser", "app.bsky.system.actorScene"]
} }
} }
} },
errors: [
{
name: "NotFound"
}
]
}, },
"app.bsky.feed.getRepostedBy": { "app.bsky.feed.getRepostedBy": {
lexicon: 1, lexicon: 1,
@ -12595,7 +12600,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -12726,7 +12731,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -12797,16 +12802,16 @@ var methodSchemaDict = {
] ]
}, },
replyCount: { replyCount: {
type: "number" type: "integer"
}, },
repostCount: { repostCount: {
type: "number" type: "integer"
}, },
upvoteCount: { upvoteCount: {
type: "number" type: "integer"
}, },
downvoteCount: { downvoteCount: {
type: "number" type: "integer"
}, },
indexedAt: { indexedAt: {
type: "string", type: "string",
@ -12977,16 +12982,16 @@ var methodSchemaDict = {
] ]
}, },
replyCount: { replyCount: {
type: "number" type: "integer"
}, },
repostCount: { repostCount: {
type: "number" type: "integer"
}, },
upvoteCount: { upvoteCount: {
type: "number" type: "integer"
}, },
downvoteCount: { downvoteCount: {
type: "number" type: "integer"
}, },
indexedAt: { indexedAt: {
type: "string", type: "string",
@ -13128,7 +13133,7 @@ var methodSchemaDict = {
enum: ["up", "down"] enum: ["up", "down"]
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -13365,7 +13370,7 @@ var methodSchemaDict = {
type: "boolean" type: "boolean"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -13582,7 +13587,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -13727,7 +13732,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -13872,7 +13877,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -14017,7 +14022,7 @@ var methodSchemaDict = {
type: "string" type: "string"
}, },
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -14160,7 +14165,7 @@ var methodSchemaDict = {
required: ["count"], required: ["count"],
properties: { properties: {
count: { count: {
type: "number" type: "integer"
} }
}, },
$defs: {} $defs: {}
@ -14175,7 +14180,7 @@ var methodSchemaDict = {
type: "object", type: "object",
properties: { properties: {
limit: { limit: {
type: "number", type: "integer",
maximum: 100 maximum: 100
}, },
before: { before: {
@ -14563,11 +14568,11 @@ var recordSchemaDict = {
required: ["start", "end"], required: ["start", "end"],
properties: { properties: {
start: { start: {
type: "number", type: "integer",
minimum: 0 minimum: 0
}, },
end: { end: {
type: "number", type: "integer",
minimum: 0 minimum: 0
} }
} }
@ -14620,11 +14625,11 @@ var recordSchemaDict = {
required: ["start", "end"], required: ["start", "end"],
properties: { properties: {
start: { start: {
type: "number", type: "integer",
minimum: 0 minimum: 0
}, },
end: { end: {
type: "number", type: "integer",
minimum: 0 minimum: 0
} }
} }
@ -15315,10 +15320,18 @@ function toKnownErr29(e) {
// src/client/types/app/bsky/feed/getPostThread.ts // src/client/types/app/bsky/feed/getPostThread.ts
var getPostThread_exports = {}; var getPostThread_exports = {};
__export(getPostThread_exports, { __export(getPostThread_exports, {
NotFoundError: () => NotFoundError,
toKnownErr: () => toKnownErr30 toKnownErr: () => toKnownErr30
}); });
var NotFoundError = class extends XRPCError {
constructor(src) {
super(src.status, src.error, src.message);
}
};
function toKnownErr30(e) { function toKnownErr30(e) {
if (e instanceof XRPCError) { if (e instanceof XRPCError) {
if (e.error === "NotFound")
return new NotFoundError(e);
} }
return e; return e;
} }

4
src/third-party/api/index.js.map vendored
View File

File diff suppressed because one or more lines are too long

5
src/third-party/api/src/client/types/app/bsky/feed/getPostThread.d.ts vendored
View File

@ -1,4 +1,4 @@
import { Headers } from '@atproto/xrpc'; import { Headers, XRPCError } from '@atproto/xrpc';
export interface QueryParams { export interface QueryParams {
uri: string; uri: string;
depth?: number; depth?: number;
@ -61,4 +61,7 @@ export interface Response {
headers: Headers; headers: Headers;
data: OutputSchema; data: OutputSchema;
} }
export declare class NotFoundError extends XRPCError {
constructor(src: XRPCError);
}
export declare function toKnownErr(e: any): any; export declare function toKnownErr(e: any): any;

2
src/third-party/api/tsconfig.build.tsbuildinfo vendored
View File

File diff suppressed because one or more lines are too long

8
src/view/com/modals/EditProfile.tsx
View File

@ -65,8 +65,8 @@ export function Component({
return ( return (
<View style={s.flex1}> <View style={s.flex1}>
<Text style={[s.textCenter, s.bold, s.f16]}>Edit my profile</Text>
<BottomSheetScrollView style={styles.inner}> <BottomSheetScrollView style={styles.inner}>
<Text style={styles.title}>Edit my profile</Text>
{error !== '' && ( {error !== '' && (
<View style={s.mb10}> <View style={s.mb10}>
<ErrorMessage message={error} /> <ErrorMessage message={error} />
@ -114,6 +114,12 @@ const styles = StyleSheet.create({
inner: { inner: {
padding: 14, padding: 14,
}, },
title: {
textAlign: 'center',
fontWeight: 'bold',
fontSize: 24,
marginBottom: 18,
},
group: { group: {
marginBottom: 10, marginBottom: 10,
}, },

2
src/view/com/modals/Modal.tsx
View File

@ -35,7 +35,7 @@ export const Modal = observer(function Modal() {
} else { } else {
bottomSheetRef.current?.close() bottomSheetRef.current?.close()
} }
}, [store.shell.isModalActive, bottomSheetRef]) }, [store.shell.isModalActive, bottomSheetRef, store.shell.activeModal?.name])
let snapPoints: (string | number)[] = CLOSED_SNAPPOINTS let snapPoints: (string | number)[] = CLOSED_SNAPPOINTS
let element let element

4
src/view/com/notifications/Feed.tsx
View File

@ -43,7 +43,7 @@ export const Feed = observer(function Feed({
onPressTryAgain={onPressTryAgain} onPressTryAgain={onPressTryAgain}
/> />
)} )}
{view.hasContent && ( {view.hasLoaded && (
<FlatList <FlatList
data={view.notifications} data={view.notifications}
keyExtractor={item => item._reactKey} keyExtractor={item => item._reactKey}
@ -53,7 +53,7 @@ export const Feed = observer(function Feed({
onEndReached={onEndReached} onEndReached={onEndReached}
/> />
)} )}
{view.isEmpty && ( {view.hasLoaded && view.isEmpty && (
<EmptyState icon="bell" message="No notifications yet!" /> <EmptyState icon="bell" message="No notifications yet!" />
)} )}
</View> </View>

51
src/view/com/notifications/FeedItem.tsx
View File

@ -4,11 +4,12 @@ import {StyleSheet, Text, View} from 'react-native'
import {AtUri} from '../../../third-party/uri' import {AtUri} from '../../../third-party/uri'
import {FontAwesomeIcon, Props} from '@fortawesome/react-native-fontawesome' import {FontAwesomeIcon, Props} from '@fortawesome/react-native-fontawesome'
import {NotificationsViewItemModel} from '../../../state/models/notifications-view' import {NotificationsViewItemModel} from '../../../state/models/notifications-view'
import {PostThreadViewModel} from '../../../state/models/post-thread-view'
import {s, colors} from '../../lib/styles' import {s, colors} from '../../lib/styles'
import {ago, pluralize} from '../../../lib/strings' import {ago, pluralize} from '../../../lib/strings'
import {UpIconSolid} from '../../lib/icons' import {UpIconSolid} from '../../lib/icons'
import {UserAvatar} from '../util/UserAvatar' import {UserAvatar} from '../util/UserAvatar'
import {PostText} from '../post/PostText' import {ErrorMessage} from '../util/ErrorMessage'
import {Post} from '../post/Post' import {Post} from '../post/Post'
import {Link} from '../util/Link' import {Link} from '../util/Link'
import {InviteAccepter} from './InviteAccepter' import {InviteAccepter} from './InviteAccepter'
@ -42,16 +43,22 @@ export const FeedItem = observer(function FeedItem({
} }
}, [item]) }, [item])
if (item.additionalPost?.notFound) {
// don't render anything if the target post was deleted or unfindable
return <View />
}
if (item.isReply) { if (item.isReply) {
return ( return (
<Link <Link href={itemHref} title={itemTitle}>
style={[ <Post
styles.outerMinimal, uri={item.uri}
item.isRead ? undefined : styles.outerUnread, initView={item.additionalPost}
]} style={[
href={itemHref} styles.outerMinimal,
title={itemTitle}> item.isRead ? undefined : styles.outerUnread,
<Post uri={item.uri} /> ]}
/>
</Link> </Link>
) )
} }
@ -170,7 +177,7 @@ export const FeedItem = observer(function FeedItem({
</Text> </Text>
</View> </View>
{item.isUpvote || item.isRepost || item.isTrend ? ( {item.isUpvote || item.isRepost || item.isTrend ? (
<PostText uri={item.subjectUri} style={[s.gray5]} /> <AdditionalPostText additionalPost={item.additionalPost} />
) : ( ) : (
<></> <></>
)} )}
@ -181,17 +188,24 @@ export const FeedItem = observer(function FeedItem({
<InviteAccepter item={item} /> <InviteAccepter item={item} />
</View> </View>
)} )}
{item.isReply ? (
<View style={s.pt5}>
<Post uri={item.uri} />
</View>
) : (
<></>
)}
</Link> </Link>
) )
}) })
function AdditionalPostText({
additionalPost,
}: {
additionalPost?: PostThreadViewModel
}) {
if (!additionalPost) {
return <View />
}
if (additionalPost.error) {
return <ErrorMessage message={additionalPost.error} />
}
return <Text style={[s.gray5]}>{additionalPost.thread?.record.text}</Text>
}
const styles = StyleSheet.create({ const styles = StyleSheet.create({
outer: { outer: {
backgroundColor: colors.white, backgroundColor: colors.white,
@ -207,8 +221,9 @@ const styles = StyleSheet.create({
marginBottom: 0, marginBottom: 0,
}, },
outerUnread: { outerUnread: {
backgroundColor: colors.unreadNotifBg,
borderWidth: 1, borderWidth: 1,
borderColor: colors.blue2, borderColor: colors.blue1,
}, },
layout: { layout: {
flexDirection: 'row', flexDirection: 'row',

9
src/view/com/post-thread/PostThreadItem.tsx
View File

@ -88,6 +88,15 @@ export const PostThreadItem = observer(function PostThreadItem({
) )
} }
if (deleted) {
return (
<View style={[styles.outer, s.p20, s.flexRow]}>
<FontAwesomeIcon icon={['far', 'trash-can']} style={[s.gray4]} />
<Text style={[s.gray5, s.ml10]}>This post has been deleted.</Text>
</View>
)
}
if (item._isHighlightedPost) { if (item._isHighlightedPost) {
return ( return (
<> <>

27
src/view/com/post/Post.tsx
View File

@ -1,8 +1,15 @@
import React, {useState, useEffect} from 'react' import React, {useState, useEffect} from 'react'
import {
ActivityIndicator,
StyleProp,
StyleSheet,
Text,
View,
ViewStyle,
} from 'react-native'
import {observer} from 'mobx-react-lite' import {observer} from 'mobx-react-lite'
import {AtUri} from '../../../third-party/uri' import {AtUri} from '../../../third-party/uri'
import * as PostType from '../../../third-party/api/src/client/types/app/bsky/feed/post' import * as PostType from '../../../third-party/api/src/client/types/app/bsky/feed/post'
import {ActivityIndicator, StyleSheet, Text, View} from 'react-native'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome' import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import {PostThreadViewModel} from '../../../state/models/post-thread-view' import {PostThreadViewModel} from '../../../state/models/post-thread-view'
import {Link} from '../util/Link' import {Link} from '../util/Link'
@ -15,19 +22,27 @@ import {UserAvatar} from '../util/UserAvatar'
import {useStores} from '../../../state' import {useStores} from '../../../state'
import {s, colors} from '../../lib/styles' import {s, colors} from '../../lib/styles'
export const Post = observer(function Post({uri}: {uri: string}) { export const Post = observer(function Post({
uri,
initView,
style,
}: {
uri: string
initView?: PostThreadViewModel
style?: StyleProp<ViewStyle>
}) {
const store = useStores() const store = useStores()
const [view, setView] = useState<PostThreadViewModel | undefined>() const [view, setView] = useState<PostThreadViewModel | undefined>(initView)
const [deleted, setDeleted] = useState(false) const [deleted, setDeleted] = useState(false)
useEffect(() => { useEffect(() => {
if (view?.params.uri === uri) { if (initView || view?.params.uri === uri) {
return // no change needed? or trigger refresh? return // no change needed? or trigger refresh?
} }
const newView = new PostThreadViewModel(store, {uri, depth: 0}) const newView = new PostThreadViewModel(store, {uri, depth: 0})
setView(newView) setView(newView)
newView.setup().catch(err => console.error('Failed to fetch post', err)) newView.setup().catch(err => console.error('Failed to fetch post', err))
}, [uri, view?.params.uri, store]) }, [initView, uri, view?.params.uri, store])
// deleted // deleted
// = // =
@ -109,7 +124,7 @@ export const Post = observer(function Post({uri}: {uri: string}) {
} }
return ( return (
<Link style={styles.outer} href={itemHref} title={itemTitle}> <Link style={[styles.outer, style]} href={itemHref} title={itemTitle}>
<View style={styles.layout}> <View style={styles.layout}>
<View style={styles.layoutAvi}> <View style={styles.layoutAvi}>
<Link href={authorHref} title={authorTitle}> <Link href={authorHref} title={authorTitle}>

2
src/view/lib/styles.ts
View File

@ -41,6 +41,8 @@ export const colors = {
green3: '#20bc07', green3: '#20bc07',
green4: '#148203', green4: '#148203',
green5: '#082b03', green5: '#082b03',
unreadNotifBg: '#ebf6ff',
} }
export const gradients = { export const gradients = {

32
src/view/screens/Notifications.tsx
View File

@ -7,43 +7,33 @@ import {NotificationsViewModel} from '../../state/models/notifications-view'
import {ScreenParams} from '../routes' import {ScreenParams} from '../routes'
export const Notifications = ({navIdx, visible}: ScreenParams) => { export const Notifications = ({navIdx, visible}: ScreenParams) => {
const [hasSetup, setHasSetup] = useState<boolean>(false)
const [notesView, setNotesView] = useState<
NotificationsViewModel | undefined
>()
const store = useStores() const store = useStores()
useEffect(() => { useEffect(() => {
let aborted = false
if (!visible) { if (!visible) {
return return
} }
console.log('Updating notifications feed')
store.me.refreshMemberships() // needed for the invite notifications store.me.refreshMemberships() // needed for the invite notifications
if (hasSetup) { store.me.notifications
console.log('Updating notifications feed') .update()
notesView?.update() .catch(e => {
} else { console.error('Error while updating notifications feed', e)
store.nav.setTitle(navIdx, 'Notifications')
const newNotesView = new NotificationsViewModel(store, {})
setNotesView(newNotesView)
newNotesView.setup().then(() => {
if (aborted) return
setHasSetup(true)
}) })
} .then(() => {
return () => { store.me.notifications.updateReadState()
aborted = true })
} store.nav.setTitle(navIdx, 'Notifications')
}, [visible, store]) }, [visible, store])
const onPressTryAgain = () => { const onPressTryAgain = () => {
notesView?.refresh() store.me.notifications.refresh()
} }
return ( return (
<View style={{flex: 1}}> <View style={{flex: 1}}>
<ViewHeader title="Notifications" /> <ViewHeader title="Notifications" />
{notesView && <Feed view={notesView} onPressTryAgain={onPressTryAgain} />} <Feed view={store.me.notifications} onPressTryAgain={onPressTryAgain} />
</View> </View>
) )
} }

4
src/view/shell/mobile/index.tsx
View File

@ -321,7 +321,7 @@ export const MobileShell: React.FC = observer(() => {
<Btn <Btn
icon={isAtHome ? 'home-solid' : 'home'} icon={isAtHome ? 'home-solid' : 'home'}
onPress={onPressHome} onPress={onPressHome}
onLongPress={doNewTab('/')} onLongPress={TABS_ENABLED ? doNewTab('/') : undefined}
/> />
{TABS_ENABLED ? ( {TABS_ENABLED ? (
<Btn <Btn
@ -333,7 +333,7 @@ export const MobileShell: React.FC = observer(() => {
<Btn <Btn
icon={isAtNotifications ? 'bell-solid' : 'bell'} icon={isAtNotifications ? 'bell-solid' : 'bell'}
onPress={onPressNotifications} onPress={onPressNotifications}
onLongPress={doNewTab('/notifications')} onLongPress={TABS_ENABLED ? doNewTab('/notifications') : undefined}
notificationCount={store.me.notificationCount} notificationCount={store.me.notificationCount}
/> />
<Btn <Btn