support blocking contacts

This commit is contained in:
balzack 2024-12-23 11:35:51 -08:00
parent 9d45ff0e79
commit 965d6d56e0
6 changed files with 19 additions and 9 deletions

View File

@ -49,7 +49,8 @@ export function useContacts() {
useEffect(() => { useEffect(() => {
const contact = app.state.session?.getContact() const contact = app.state.session?.getContact()
const setCards = (cards: Card[]) => { const setCards = (cards: Card[]) => {
updateState({ cards }) const filtered = cards.filter(card => !card.blocked);
updateState({ cards: filtered })
} }
contact.addCardListener(setCards) contact.addCardListener(setCards)
return () => { return () => {

View File

@ -63,9 +63,10 @@ export function useContent() {
const contacts = [] as (Card | undefined)[] const contacts = [] as (Card | undefined)[]
if (cardId) { if (cardId) {
const card = state.cards.find((contact) => contact.cardId === cardId) const card = state.cards.find((contact) => contact.cardId === cardId)
if (card) { if (!card || card.blocked) {
contacts.push(card) return null;
} }
contacts.push(card)
} }
const guests = members.filter((contact) => contact.guid !== state.guid) const guests = members.filter((contact) => contact.guid !== state.guid)
const guestCards = guests const guestCards = guests
@ -147,6 +148,9 @@ export function useContent() {
const search = state.filter?.toLowerCase() const search = state.filter?.toLowerCase()
const filtered = channels.filter((item) => { const filtered = channels.filter((item) => {
if (!item) {
return false
}
if (search) { if (search) {
if (item.subject?.find((value) => value?.toLowerCase().includes(search))) { if (item.subject?.find((value) => value?.toLowerCase().includes(search))) {
return true return true

View File

@ -18,6 +18,10 @@
margin-right: 16px; margin-right: 16px;
} }
.alert {
color: var(--mantine-color-red-6);
}
.frame { .frame {
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;

View File

@ -169,7 +169,7 @@ export function Conversation({ openDetails }: { openDetails: ()=>void }) {
<IconShield size={24} /> <IconShield size={24} />
)} )}
{ state.detailSet && state.access === false && ( { state.detailSet && state.access === false && (
<IconExclamationCircle size={24} /> <IconExclamationCircle className={classes.alert} size={24} />
)} )}
</div> </div>
<div className={classes.title}> <div className={classes.title}>

View File

@ -33,7 +33,7 @@ export type ProfileParams = {
offsync?: boolean offsync?: boolean
} }
export function Profile({ params, close }: { params: ProfileParams; close?: () => void }) { export function Profile({ params, showClose, close }: { params: ProfileParams; showClose: boolean; close: () => void }) {
const { state, actions } = useProfile(params) const { state, actions } = useProfile(params)
const [removing, setRemoving] = useState(false) const [removing, setRemoving] = useState(false)
const [blocking, setBlocking] = useState(false) const [blocking, setBlocking] = useState(false)
@ -142,6 +142,7 @@ export function Profile({ params, close }: { params: ProfileParams; close?: () =
if (!blocking) { if (!blocking) {
setBlocking(true) setBlocking(true)
await setAction(actions.block) await setAction(actions.block)
close();
setBlocking(false) setBlocking(false)
} }
}, },
@ -238,9 +239,9 @@ export function Profile({ params, close }: { params: ProfileParams; close?: () =
return ( return (
<div className={classes.contact}> <div className={classes.contact}>
<div className={classes.header}> <div className={classes.header}>
{close && <IconX size={28} className={classes.match} />} {showClose && <IconX size={28} className={classes.match} />}
<Text className={classes.label}>{`${state.handle}${state.node ? '/' + state.node : ''}`}</Text> <Text className={classes.label}>{`${state.handle}${state.node ? '/' + state.node : ''}`}</Text>
{close && <IconX size={30} className={classes.close} onClick={close} />} {showClose && <IconX size={30} className={classes.close} onClick={close} />}
</div> </div>
<div className={classes.detail}> <div className={classes.detail}>
<div className={classes.image}> <div className={classes.image}>

View File

@ -87,7 +87,7 @@ export function Session() {
)} )}
{profile && ( {profile && (
<div className={classes.screen}> <div className={classes.screen}>
<Profile params={profileParams} close={closeProfile} /> <Profile params={profileParams} showClose={true} close={closeProfile} />
</div> </div>
)} )}
</div> </div>
@ -161,7 +161,7 @@ export function Session() {
</Drawer> </Drawer>
<Drawer opened={profile} onClose={closeProfile} withCloseButton={false} size="xs" padding="0" position="right"> <Drawer opened={profile} onClose={closeProfile} withCloseButton={false} size="xs" padding="0" position="right">
<div style={{ height: '100vh' }}> <div style={{ height: '100vh' }}>
<Profile params={profileParams} /> <Profile params={profileParams} showClose={false} close={closeProfile} />
</div> </div>
</Drawer> </Drawer>
<Drawer opened={details} onClose={closeDetails} withCloseButton={false} size="xs" padding="0" position="right" trapFocus={false}> <Drawer opened={details} onClose={closeDetails} withCloseButton={false} size="xs" padding="0" position="right" trapFocus={false}>