refresh inbox empty state
This commit is contained in:
@@ -272,7 +272,7 @@ export function ChatList({
|
|||||||
|
|
||||||
if (conversations.length === 0) {
|
if (conversations.length === 0) {
|
||||||
return (
|
return (
|
||||||
<Layout.Center>
|
<Layout.Center style={web({minHeight: '100%'})}>
|
||||||
{isLoading ? (
|
{isLoading ? (
|
||||||
<ChatListLoadingPlaceholder />
|
<ChatListLoadingPlaceholder />
|
||||||
) : (
|
) : (
|
||||||
@@ -319,6 +319,7 @@ export function ChatList({
|
|||||||
iconSize="4xl"
|
iconSize="4xl"
|
||||||
textStyle={t.atoms.text}
|
textStyle={t.atoms.text}
|
||||||
iconColor={t.atoms.text.color}
|
iconColor={t.atoms.text.color}
|
||||||
|
style={web([a.h_full, a.justify_center, {paddingBottom: 120}])}
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<EmptyState
|
<EmptyState
|
||||||
@@ -335,6 +336,7 @@ export function ChatList({
|
|||||||
color: 'primary',
|
color: 'primary',
|
||||||
icon: MessagePlusIcon,
|
icon: MessagePlusIcon,
|
||||||
}}
|
}}
|
||||||
|
style={web([a.h_full, a.justify_center, {paddingBottom: 120}])}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -25,10 +25,11 @@ import {useMessagesEventBus} from '#/state/messages/events'
|
|||||||
import {useLeftConvos} from '#/state/queries/messages/leave-conversation'
|
import {useLeftConvos} from '#/state/queries/messages/leave-conversation'
|
||||||
import {useListConvosQuery} from '#/state/queries/messages/list-conversations'
|
import {useListConvosQuery} from '#/state/queries/messages/list-conversations'
|
||||||
import {useUpdateAllRead} from '#/state/queries/messages/update-all-read'
|
import {useUpdateAllRead} from '#/state/queries/messages/update-all-read'
|
||||||
|
import {EmptyState} from '#/view/com/util/EmptyState'
|
||||||
import {FAB} from '#/view/com/util/fab/FAB'
|
import {FAB} from '#/view/com/util/fab/FAB'
|
||||||
import {List} from '#/view/com/util/List'
|
import {List} from '#/view/com/util/List'
|
||||||
import {ChatListLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
|
import {ChatListLoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
|
||||||
import {atoms as a, useBreakpoints, useTheme} from '#/alf'
|
import {atoms as a, useBreakpoints, useTheme, web} from '#/alf'
|
||||||
import {AgeRestrictedScreen} from '#/components/ageAssurance/AgeRestrictedScreen'
|
import {AgeRestrictedScreen} from '#/components/ageAssurance/AgeRestrictedScreen'
|
||||||
import {useAgeAssuranceCopy} from '#/components/ageAssurance/useAgeAssuranceCopy'
|
import {useAgeAssuranceCopy} from '#/components/ageAssurance/useAgeAssuranceCopy'
|
||||||
import {Button, ButtonIcon, ButtonText} from '#/components/Button'
|
import {Button, ButtonIcon, ButtonText} from '#/components/Button'
|
||||||
@@ -37,7 +38,7 @@ import {ArrowLeft_Stroke2_Corner0_Rounded as ArrowLeftIcon} from '#/components/i
|
|||||||
import {ArrowRotateCounterClockwise_Stroke2_Corner0_Rounded as RetryIcon} from '#/components/icons/ArrowRotate'
|
import {ArrowRotateCounterClockwise_Stroke2_Corner0_Rounded as RetryIcon} from '#/components/icons/ArrowRotate'
|
||||||
import {Check_Stroke2_Corner0_Rounded as CheckIcon} from '#/components/icons/Check'
|
import {Check_Stroke2_Corner0_Rounded as CheckIcon} from '#/components/icons/Check'
|
||||||
import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfoIcon} from '#/components/icons/CircleInfo'
|
import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfoIcon} from '#/components/icons/CircleInfo'
|
||||||
import {Message_Stroke2_Corner0_Rounded as MessageIcon} from '#/components/icons/Message'
|
import {Inbox_Stroke2_Corner2_Rounded_Large as InboxLargeIcon} from '#/components/icons/Inbox'
|
||||||
import * as Layout from '#/components/Layout'
|
import * as Layout from '#/components/Layout'
|
||||||
import {ListFooter} from '#/components/Lists'
|
import {ListFooter} from '#/components/Lists'
|
||||||
import * as Toast from '#/components/Toast'
|
import * as Toast from '#/components/Toast'
|
||||||
@@ -182,7 +183,7 @@ function RequestList({
|
|||||||
|
|
||||||
if (conversations.length < 1) {
|
if (conversations.length < 1) {
|
||||||
return (
|
return (
|
||||||
<Layout.Center>
|
<Layout.Center style={web([a.h_full])}>
|
||||||
{isLoading ? (
|
{isLoading ? (
|
||||||
<ChatListLoadingPlaceholder />
|
<ChatListLoadingPlaceholder />
|
||||||
) : (
|
) : (
|
||||||
@@ -224,48 +225,36 @@ function RequestList({
|
|||||||
</View>
|
</View>
|
||||||
</>
|
</>
|
||||||
) : (
|
) : (
|
||||||
<>
|
<EmptyState
|
||||||
<View style={[a.pt_3xl, a.align_center]}>
|
message={l({
|
||||||
<MessageIcon width={48} fill={t.palette.primary_500} />
|
message: `Inbox zero!`,
|
||||||
<Text
|
comment:
|
||||||
style={[a.pt_md, a.pb_sm, a.text_2xl, a.font_semi_bold]}>
|
"Title message shown in chat requests inbox when it's empty",
|
||||||
<Trans comment="Title message shown in chat requests inbox when it's empty">
|
})}
|
||||||
Inbox zero!
|
icon={InboxLargeIcon}
|
||||||
</Trans>
|
iconSize="4xl"
|
||||||
</Text>
|
textStyle={t.atoms.text}
|
||||||
<Text
|
iconColor={t.atoms.text.color}
|
||||||
style={[
|
button={
|
||||||
a.text_md,
|
isWithinSplitView
|
||||||
a.pb_xl,
|
? undefined
|
||||||
a.text_center,
|
: {
|
||||||
a.leading_snug,
|
label: l`Back to Chats`,
|
||||||
t.atoms.text_contrast_medium,
|
text: l`Back`,
|
||||||
]}>
|
onPress: () => {
|
||||||
<Trans>
|
if (navigation.canGoBack()) {
|
||||||
You don't have any chat requests at the moment.
|
navigation.goBack()
|
||||||
</Trans>
|
} else {
|
||||||
</Text>
|
navigation.navigate('Messages', {animation: 'pop'})
|
||||||
{!isWithinSplitView && (
|
}
|
||||||
<Button
|
},
|
||||||
variant="solid"
|
size: 'small',
|
||||||
color="secondary"
|
color: 'secondary',
|
||||||
size="small"
|
icon: ArrowLeftIcon,
|
||||||
label={l`Go back`}
|
}
|
||||||
onPress={() => {
|
}
|
||||||
if (navigation.canGoBack()) {
|
style={web([a.h_full, a.justify_center, a.pb_5xl])}
|
||||||
navigation.goBack()
|
/>
|
||||||
} else {
|
|
||||||
navigation.navigate('Messages', {animation: 'pop'})
|
|
||||||
}
|
|
||||||
}}>
|
|
||||||
<ButtonIcon icon={ArrowLeftIcon} />
|
|
||||||
<ButtonText>
|
|
||||||
<Trans>Back to Chats</Trans>
|
|
||||||
</ButtonText>
|
|
||||||
</Button>
|
|
||||||
)}
|
|
||||||
</View>
|
|
||||||
</>
|
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user