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 subjectEncrypted = encrypted.ciphertext.toString(CryptoJS.enc.Base64)
const subjectIv = iv.toString();
return { subjectEncrypted, subjectIv };
}

View File

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

View File

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

View File

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

View File

@ -37,7 +37,7 @@ export function useChannels() {
const setChannelItem = async (loginTimestamp, cardId, channelId, item) => {
const timestamp = item.summary.lastTopic.created;
const { readRevision, topicRevision } = item;
// decrypt subject and message
let locked = false;
let unlocked = false;
@ -50,11 +50,13 @@ export function useChannels() {
try {
const contentKey = await getContentKey(seals, account.state.sealKey);
const unsealed = decryptChannelSubject(item.detail.data, contentKey);
if (cardId) {
await card.actions.setUnsealedChannelSubject(cardId, channelId, item.detailRevision, unsealed);
}
else {
await channel.actions.setUnsealedChannelSubject(channelId, item.detailRevision, unsealed);
if (unsealed) {
if (cardId) {
await card.actions.setUnsealedChannelSubject(cardId, channelId, item.detailRevision, unsealed);
}
else {
await channel.actions.setUnsealedChannelSubject(channelId, item.detailRevision, unsealed);
}
}
}
catch(err) {
@ -66,11 +68,13 @@ export function useChannels() {
try {
const contentKey = await getContentKey(seals, account.state.sealKey);
const unsealed = decryptTopicSubject(item.summary.lastTopic.data, contentKey);
if (cardId) {
await card.actions.setUnsealedChannelSummary(cardId, channelId, item.topicRevision, unsealed);
}
else {
await channel.actions.setUnsealedChannelSummary(channelId, item.topicRevision, unsealed);
if (unsealed) {
if (cardId) {
await card.actions.setUnsealedChannelSummary(cardId, channelId, item.topicRevision, unsealed);
}
else {
await channel.actions.setUnsealedChannelSummary(channelId, item.topicRevision, unsealed);
}
}
}
catch(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} />
)}
<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}>
<AntIcons name="edit" size={16} color={Colors.text} />
</TouchableOpacity>
)}
</View>
<Text style={styles.created}>{ state.created }</Text>
<Text style={styles.created}>{ state.timestamp }</Text>
<Text style={styles.mode}>{ state.hostId ? 'guest' : 'host' }</Text>
</View>
</View>

View File

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