refactoring details screen

This commit is contained in:
balzack 2023-03-01 00:42:57 -08:00
parent c062b84426
commit a86d84de33
7 changed files with 59 additions and 35 deletions

View File

@ -54,7 +54,6 @@ export function updateChannelSubject(subject, contentKey) {
const encrypted = CryptoJS.AES.encrypt(JSON.stringify({ subject }), key, { iv: iv }); const encrypted = CryptoJS.AES.encrypt(JSON.stringify({ subject }), key, { iv: iv });
const subjectEncrypted = encrypted.ciphertext.toString(CryptoJS.enc.Base64) const subjectEncrypted = encrypted.ciphertext.toString(CryptoJS.enc.Base64)
const subjectIv = iv.toString(); const subjectIv = iv.toString();
return { subjectEncrypted, subjectIv }; return { subjectEncrypted, subjectIv };
} }

View File

@ -147,7 +147,7 @@ export function useChannelContext() {
}, },
removeChannel: async (channelId) => { removeChannel: async (channelId) => {
const { server, token } = access.current; const { server, token } = access.current;
return await removeChannel(access.current, channelId); return await removeChannel(server, token, channelId);
}, },
setChannelSubject: async (channelId, type, subject) => { setChannelSubject: async (channelId, type, subject) => {
const { server, token } = access.current; const { server, token } = access.current;

View File

@ -165,7 +165,7 @@ export function useConversationContext() {
throw new Error("can only set hosted channel subjects"); throw new Error("can only set hosted channel subjects");
} }
else if(channelId) { else if(channelId) {
await channel.actions.setSubject(channelId, type, subject); await channel.actions.setChannelSubject(channelId, type, subject);
} }
}, },
removeChannel: async () => { removeChannel: async () => {

View File

@ -54,6 +54,7 @@ export function Session() {
const closeConversation = (navigation) => { const closeConversation = (navigation) => {
setCardId(null); setCardId(null);
setChannelId(null); setChannelId(null);
navigation.popToTop();
} }
const openDetails = (navigation) => { const openDetails = (navigation) => {
navigation.navigate('details'); navigation.navigate('details');
@ -73,7 +74,7 @@ export function Session() {
<ConversationStack.Screen name="details" options={{ ...stackParams, headerTitle: (props) => ( <ConversationStack.Screen name="details" options={{ ...stackParams, headerTitle: (props) => (
<Text style={styles.headertext}>Details</Text> <Text style={styles.headertext}>Details</Text>
)}}> )}}>
{(props) => <Details clearConversation={() => clearConversation(props.navigation)} />} {(props) => <Details clearConversation={() => closeConversation(props.navigation)} />}
</ConversationStack.Screen> </ConversationStack.Screen>
</ConversationStack.Navigator> </ConversationStack.Navigator>

View File

@ -50,6 +50,7 @@ export function useChannels() {
try { try {
const contentKey = await getContentKey(seals, account.state.sealKey); const contentKey = await getContentKey(seals, account.state.sealKey);
const unsealed = decryptChannelSubject(item.detail.data, contentKey); const unsealed = decryptChannelSubject(item.detail.data, contentKey);
if (unsealed) {
if (cardId) { if (cardId) {
await card.actions.setUnsealedChannelSubject(cardId, channelId, item.detailRevision, unsealed); await card.actions.setUnsealedChannelSubject(cardId, channelId, item.detailRevision, unsealed);
} }
@ -57,6 +58,7 @@ export function useChannels() {
await channel.actions.setUnsealedChannelSubject(channelId, item.detailRevision, unsealed); await channel.actions.setUnsealedChannelSubject(channelId, item.detailRevision, unsealed);
} }
} }
}
catch(err) { catch(err) {
console.log(err); console.log(err);
} }
@ -66,6 +68,7 @@ export function useChannels() {
try { try {
const contentKey = await getContentKey(seals, account.state.sealKey); const contentKey = await getContentKey(seals, account.state.sealKey);
const unsealed = decryptTopicSubject(item.summary.lastTopic.data, contentKey); const unsealed = decryptTopicSubject(item.summary.lastTopic.data, contentKey);
if (unsealed) {
if (cardId) { if (cardId) {
await card.actions.setUnsealedChannelSummary(cardId, channelId, item.topicRevision, unsealed); await card.actions.setUnsealedChannelSummary(cardId, channelId, item.topicRevision, unsealed);
} }
@ -73,6 +76,7 @@ export function useChannels() {
await channel.actions.setUnsealedChannelSummary(channelId, item.topicRevision, unsealed); await channel.actions.setUnsealedChannelSummary(channelId, item.topicRevision, unsealed);
} }
} }
}
catch(err) { catch(err) {
console.log(err); console.log(err);
} }

View File

@ -131,13 +131,13 @@ export function Details({ channel, clearConversation }) {
<MatIcons name="lock-open-variant-outline" style={styles.subjectIcon} size={16} color={Colors.text} /> <MatIcons name="lock-open-variant-outline" style={styles.subjectIcon} size={16} color={Colors.text} />
)} )}
<Text style={styles.subjectText} numberOfLines={1} ellipsizeMode={'tail'}>{ state.subject }</Text> <Text style={styles.subjectText} numberOfLines={1} ellipsizeMode={'tail'}>{ state.subject }</Text>
{ !state.hostId && (!state.locked || state.sealable) && ( { !state.hostId && (!state.locked || state.unlocked) && (
<TouchableOpacity onPress={actions.showEditSubject}> <TouchableOpacity onPress={actions.showEditSubject}>
<AntIcons name="edit" size={16} color={Colors.text} /> <AntIcons name="edit" size={16} color={Colors.text} />
</TouchableOpacity> </TouchableOpacity>
)} )}
</View> </View>
<Text style={styles.created}>{ state.created }</Text> <Text style={styles.created}>{ state.timestamp }</Text>
<Text style={styles.mode}>{ state.hostId ? 'guest' : 'host' }</Text> <Text style={styles.mode}>{ state.hostId ? 'guest' : 'host' }</Text>
</View> </View>
</View> </View>

View File

@ -5,14 +5,14 @@ import { CardContext } from 'context/CardContext';
import { AccountContext } from 'context/AccountContext'; import { AccountContext } from 'context/AccountContext';
import { ProfileContext } from 'context/ProfileContext'; import { ProfileContext } from 'context/ProfileContext';
import { getChannelSubjectLogo } from 'context/channelUtil'; import { getChannelSubjectLogo } from 'context/channelUtil';
import { getChannelSeals, isUnsealed } from 'context/sealUtil'; import { getChannelSeals, isUnsealed, getContentKey, updateChannelSubject } from 'context/sealUtil';
import moment from 'moment'; import moment from 'moment';
export function useDetails() { export function useDetails() {
const [state, setState] = useState({ const [state, setState] = useState({
subject: null, subject: null,
created: null, timestamp: null,
logo: null, logo: null,
hostId: null, hostId: null,
connected: [], connected: [],
@ -24,6 +24,8 @@ export function useDetails() {
locked: false, locked: false,
unlocked: false, unlocked: false,
count: 0, count: 0,
seals: null,
sealKey: null,
}); });
const card = useContext(CardContext); const card = useContext(CardContext);
@ -38,12 +40,14 @@ export function useDetails() {
useEffect(() => { useEffect(() => {
let locked; let locked;
let unlocked; let unlocked;
let seals;
let sealKey;
const { channel, notification } = conversation.state; const { channel, notification } = conversation.state;
if (channel.detail.dataType === 'sealed') { if (channel?.detail?.dataType === 'sealed') {
locked = true; locked = true;
try { try {
const { sealKey } = account.state; sealKey = account.state.sealKey;
const seals = getChannelSeals(channel.detail.data); seals = getChannelSeals(channel.detail.data);
unlocked = isUnsealed(seals, sealKey); unlocked = isUnsealed(seals, sealKey);
} }
catch(err) { catch(err) {
@ -55,7 +59,7 @@ export function useDetails() {
locked = false; locked = false;
unlocked = false; unlocked = false;
} }
updateState({ locked, unlocked, notification }); updateState({ locked, unlocked, seals, sealKey, notification });
}, [account.state, conversation.state]); }, [account.state, conversation.state]);
useEffect(() => { useEffect(() => {
@ -69,30 +73,42 @@ export function useDetails() {
}, [card.state]); }, [card.state]);
useEffect(() => { useEffect(() => {
const cardId = conversation.state.card?.cardId; const hostId = conversation.state.card?.cardId;
const profileGuid = profile.state.identity?.guid; const profileGuid = profile.state.identity?.guid;
const channel = conversation.state.channel; const channel = conversation.state.channel;
const cards = card.state.cards; const cards = card.state.cards;
const cardImageUrl = card.actions.getCardImageUrl; const cardImageUrl = card.actions.getCardImageUrl;
const { logo, subject } = getChannelSubjectLogo(cardId, profileGuid, channel, cards, cardImageUrl); const { logo, subject } = getChannelSubjectLogo(hostId, profileGuid, channel, cards, cardImageUrl);
const timestamp = conversation.state.channel?.detail?.created;
let created; let timestamp;
const date = new Date(item.detail.created * 1000); const { created, data, dataType } = conversation.state.channel?.detail || {}
const date = new Date(created * 1000);
const now = new Date(); const now = new Date();
const offset = now.getTime() - date.getTime(); const offset = now.getTime() - date.getTime();
if(offset < 86400000) { if(offset < 86400000) {
created = moment(date).format('h:mma'); timestamp = moment(date).format('h:mma');
} }
else if (offset < 31449600000) { else if (offset < 31449600000) {
created = moment(date).format('M/DD'); timestamp = moment(date).format('M/DD');
} }
else { else {
created = moment(date).format('M/DD/YYYY'); timestamp = moment(date).format('M/DD/YYYY');
} }
updateState({ logo, subject, created }); let subjectUpdate;
}, [conversation]); try {
if (dataType === 'superbasic') {
subjectUpdate = JSON.parse(data).subject;
}
else if (conversation.state?.channel?.unsealedDetail) {
subjectUpdate = conversation.state?.channel?.unsealedDetail?.subject;
}
}
catch(err) {
console.log(err);
}
updateState({ hostId, logo, subject, timestamp, subjectUpdate });
}, [conversation.state]);
const actions = { const actions = {
showEditMembers: () => { showEditMembers: () => {
@ -112,10 +128,14 @@ export function useDetails() {
}, },
saveSubject: async () => { saveSubject: async () => {
if (state.locked) { if (state.locked) {
await conversation.actions.setSealedSubject(state.subjectUpdate, account.state.sealKey); const contentKey = await getContentKey(state.seals, state.sealKey);
const sealed = updateChannelSubject(state.subjectUpdate, contentKey);
sealed.seals = state.seals;
await conversation.actions.setChannelSubject('sealed', sealed);
} }
else { else {
await conversation.actions.setSubject(state.subjectUpdate); const subject = { subject: state.subjectUpdate };
await conversation.actions.setChannelSubject('superbasic', subject);
} }
}, },
remove: async () => { remove: async () => {