From 398e118c45d06e4ff16c92232443f061722a44c8 Mon Sep 17 00:00:00 2001 From: Roland Osborne Date: Tue, 20 Sep 2022 10:57:57 -0700 Subject: [PATCH] rendering subject and message --- app/mobile/src/context/useAppContext.hook.js | 4 +- .../src/context/useChannelContext.hook.js | 4 +- app/mobile/src/session/channels/Channels.jsx | 6 +-- .../channels/channelItem/ChannelItem.jsx | 15 ++++++- .../src/session/channels/useChannels.hook.js | 39 ++++++++++++++++++- app/mobile/src/utitls/Logo.jsx | 2 +- 6 files changed, 58 insertions(+), 12 deletions(-) diff --git a/app/mobile/src/context/useAppContext.hook.js b/app/mobile/src/context/useAppContext.hook.js index 565bf59c..922a60ee 100644 --- a/app/mobile/src/context/useAppContext.hook.js +++ b/app/mobile/src/context/useAppContext.hook.js @@ -95,8 +95,8 @@ export function useAppContext() { try { profile.actions.setRevision(rev.profile); account.actions.setRevision(rev.account); - card.actions.setRevision(rev.channel); - channel.actions.setRevision(rev.card); + channel.actions.setRevision(rev.channel); + card.actions.setRevision(rev.card); } catch(err) { console.log(err); diff --git a/app/mobile/src/context/useChannelContext.hook.js b/app/mobile/src/context/useChannelContext.hook.js index ee3c211f..727242a7 100644 --- a/app/mobile/src/context/useChannelContext.hook.js +++ b/app/mobile/src/context/useChannelContext.hook.js @@ -43,7 +43,7 @@ export function useChannelContext() { if (channel) { channel.summary = summary; channel.topicRevision = revision; - channels.curent.set(channelId, channel); + channels.current.set(channelId, channel); } } const setChannelRevision = (channelId, revision) => { @@ -64,6 +64,7 @@ export function useChannelContext() { const { server, appToken, guid } = session.current; const delta = await getChannels(server, appToken, setRevision.current); +console.log(delta); for (let channel of delta) { if (channel.data) { if (channel.data.channelDetail && channel.data.channelSummary) { @@ -138,6 +139,7 @@ export function useChannelContext() { updateState({ account: null, channels: channels.current }); }, setRevision: (rev) => { +console.log("CHANNEL REVISION:", rev); curRevision.current = rev; sync(); }, diff --git a/app/mobile/src/session/channels/Channels.jsx b/app/mobile/src/session/channels/Channels.jsx index 5cb8127e..dd2221ad 100644 --- a/app/mobile/src/session/channels/Channels.jsx +++ b/app/mobile/src/session/channels/Channels.jsx @@ -3,12 +3,10 @@ import { FlatList, ScrollView, View, TextInput, TouchableOpacity, Text } from 'r import { styles } from './Channels.styled'; import { useChannels } from './useChannels.hook'; import Ionicons from '@expo/vector-icons/AntDesign'; -import { ChannelItem } from './channelItem/ChannelItem'; +import { MemoizedChannelItem } from './channelItem/ChannelItem'; export function Channels() { - const { state, actions } = useChannels(); - return ( @@ -19,7 +17,7 @@ export function Channels() { } + renderItem={({ item }) => } keyExtractor={item => (`${item.cardId}:${item.channelId}`)} /> diff --git a/app/mobile/src/session/channels/channelItem/ChannelItem.jsx b/app/mobile/src/session/channels/channelItem/ChannelItem.jsx index 6335af75..537ce231 100644 --- a/app/mobile/src/session/channels/channelItem/ChannelItem.jsx +++ b/app/mobile/src/session/channels/channelItem/ChannelItem.jsx @@ -1,7 +1,18 @@ -import { Text } from 'react-native'; +import { Text, TouchableOpacity, View } from 'react-native'; +import React from 'react'; import { Logo } from 'utils/Logo'; +import { styles } from './ChannelItem.styled'; export function ChannelItem({ item }) { - return + return ( + + + + { item.subject } + { item.message } + + + ) } +export const MemoizedChannelItem = React.memo(ChannelItem); diff --git a/app/mobile/src/session/channels/useChannels.hook.js b/app/mobile/src/session/channels/useChannels.hook.js index 52883755..93c2f816 100644 --- a/app/mobile/src/session/channels/useChannels.hook.js +++ b/app/mobile/src/session/channels/useChannels.hook.js @@ -1,4 +1,4 @@ -import { useState, useEffect, useContext } from 'react'; +import { useState, useEffect, useRef, useContext } from 'react'; import { useWindowDimensions } from 'react-native'; import { useNavigate } from 'react-router-dom'; import { CardContext } from 'context/CardContext'; @@ -12,6 +12,7 @@ export function useChannels() { channels: [] }); + const items = useRef([]); const channel = useContext(ChannelContext); const card = useContext(CardContext); @@ -53,16 +54,50 @@ export function useChannels() { logo = 'appstore'; } + let subject = null; + if (item?.detail?.data) { + try { + subject = JSON.parse(item?.detail?.data).subject; + } + catch (err) { + console.log(err); + } + } + if (!subject) { + if (contacts.length) { + let names = []; + for (let contact of contacts) { + names.push(contact?.profile?.handle); + } + subject = names.join(', '); + } + else { + subject = "Notes"; + } + } + + let message; + if (item?.summary?.lastTopic?.dataType === 'superbasictopic') { + try { + message = JSON.parse(item.summary.lastTopic.data).text; + } + catch (err) { + console.log(err); + } + } + return { channelId: item.channelId, contacts: contacts, logo: logo, + subject: subject, + message: message, } } useEffect(() => { const channels = Array.from(channel.state.channels.values()).map(item => setChannelEntry(item)); - updateState({ channels }); + updateState({ channels: channels }); }, [channel, card]); const actions = { diff --git a/app/mobile/src/utitls/Logo.jsx b/app/mobile/src/utitls/Logo.jsx index a32483f4..6c94c38e 100644 --- a/app/mobile/src/utitls/Logo.jsx +++ b/app/mobile/src/utitls/Logo.jsx @@ -6,7 +6,7 @@ import team from 'images/team.png'; export function Logo({ src, width, height, radius }) { return ( - + { src === 'team' && ( )}