more conversation details refactor

This commit is contained in:
Roland Osborne 2023-01-27 15:40:04 -08:00
parent b53e1be314
commit a9d4326490
3 changed files with 14 additions and 13 deletions

View File

@ -15,7 +15,7 @@ export function SelectItem({ item, select, selected, markup, setItem, clearItem
return profile?.handle; return profile?.handle;
} }
const onSelect = () => { const onSelect = (ev) => {
if (select) { if (select) {
select(item.id); select(item.id);
} }
@ -25,6 +25,7 @@ export function SelectItem({ item, select, selected, markup, setItem, clearItem
if (clearItem && state.selected) { if (clearItem && state.selected) {
clearItem(item.id); clearItem(item.id);
} }
ev.stopPropagation()
} }
return ( return (
@ -37,7 +38,7 @@ export function SelectItem({ item, select, selected, markup, setItem, clearItem
</div> </div>
{ (select || setItem || clearItem) && ( { (select || setItem || clearItem) && (
<div class="switch"> <div class="switch">
<Switch checked={state.selected} onChange={onSelect} size="small" /> <Switch checked={state.selected} onChange={(flag, ev) => onSelect(ev)} size="small" />
</div> </div>
)} )}
{ state.markup && ( { state.markup && (

View File

@ -152,7 +152,7 @@ export function Details({ closeDetails, closeConversation, openContact }) {
<Logo src={state.logo} width={72} height={72} radius={4} img={state.img} /> <Logo src={state.logo} width={72} height={72} radius={4} img={state.img} />
</div> </div>
<div class="stats"> <div class="stats">
{ state.host && ( { !state.host && (
<div class="subject" onClick={actions.setEditSubject}> <div class="subject" onClick={actions.setEditSubject}>
{ state.sealed && !state.contentKey && ( { state.sealed && !state.contentKey && (
<LockFilled style={{ paddingRight: 4 }} /> <LockFilled style={{ paddingRight: 4 }} />
@ -173,7 +173,7 @@ export function Details({ closeDetails, closeConversation, openContact }) {
)} )}
</div> </div>
)} )}
{ !state.host && ( { state.host && (
<div class="subject"> <div class="subject">
{ state.sealed && !state.contentKey && ( { state.sealed && !state.contentKey && (
<LockFilled style={{ paddingRight: 4 }} /> <LockFilled style={{ paddingRight: 4 }} />
@ -189,22 +189,22 @@ export function Details({ closeDetails, closeConversation, openContact }) {
)} )}
</div> </div>
)} )}
{ state.host && ( { !state.host && (
<div class="host">host</div> <div class="host">host</div>
)} )}
{ !state.host && ( { state.host && (
<div class="host">guest</div> <div class="host">guest</div>
)} )}
<div class="created">{ state.started }</div> <div class="created">{ state.started }</div>
</div> </div>
</div> </div>
{ state.host && ( { !state.host && (
<div class="button" onClick={deleteChannel}>Delete Topic</div> <div class="button" onClick={deleteChannel}>Delete Topic</div>
)} )}
{ state.host && !state.sealed && ( { !state.host && !state.sealed && (
<div class="button" onClick={actions.setEditMembers}>Edit Membership</div> <div class="button" onClick={actions.setEditMembers}>Edit Membership</div>
)} )}
{ !state.host && ( { state.host && (
<div class="button" onClick={leaveChannel}>Leave Topic</div> <div class="button" onClick={leaveChannel}>Leave Topic</div>
)} )}
<div class="label">Members</div> <div class="label">Members</div>
@ -215,7 +215,7 @@ export function Details({ closeDetails, closeConversation, openContact }) {
} }
return false; return false;
}} unknown={state.unknown} }} unknown={state.unknown}
/> markup={state.host} />
</div> </div>
</div> </div>
<Modal title="Edit Subject" centered visible={state.showEditSubject} footer={editSubjectFooter} <Modal title="Edit Subject" centered visible={state.showEditSubject} footer={editSubjectFooter}

View File

@ -13,7 +13,7 @@ export function useDetails() {
logo: null, logo: null,
img: null, img: null,
started: null, started: null,
host: false, host: null,
title: null, title: null,
label: null, label: null,
members: [], members: [],
@ -92,10 +92,10 @@ export function useDetails() {
started = date.toLocaleDateString("en-US"); started = date.toLocaleDateString("en-US");
} }
if (cardValue) { if (cardValue) {
host = false; host = cardValue.id;
} }
else { else {
host = true; host = null;
} }
// extract member info // extract member info