diff --git a/packages/common/models/clientModels/conversationData.md b/packages/common/models/clientModels/conversationData.md new file mode 100644 index 0000000..6f96373 --- /dev/null +++ b/packages/common/models/clientModels/conversationData.md @@ -0,0 +1,48 @@ +export default class ConversationData { // want all of the contents of a +conversation in one place for the frontend // need all of the content items in +the conversation for the past week // can be audio clip or link for now // if +user wants more data, click button to fetch further back // see if this convo is +a priority one // all users in the conversation: userId's perhaps, but the +actual user we can get from the relevantUsersCache map // want to create +individual convo chunks...if I send three messages in a row, it should show my +name and only one click to listen to all three in order + +// B - conversations - last activity date - update cache item for when last time +this conversation had something going on (new link, new room, new clip...) AND +other users just subscribe to this published source - last audioClip url - last +// -> users - A -> last interaction date // -> audioClips - c // -> links // -> +live } + +# Listeners + +### A - listener for all - users within conversation documents + +### B - listener for changes to overall top level convo details + +### C - get once audio messages for a relevant conversation - maybe last 3 messages + +### D - get once latest links for all relevant conversations + +### F - live room listener - for all relevant convos, stay up to date on the live rooms associated + +// one map: all relevant users, a map we build based on where the user visits + +// one map: conversation id -> conversationData as above to get everything +relevant // fetch only all convos in last 90 days // search for any other ones +in the search bar + +// filter selector to get live convos // filter selector to get all priority +convos // filter selector to get all later convos // filter selector to get all +done convos + +// filter selector to get a map of default "inbox" conversations: // go through +all conversations in the conversation map and place in right category /\*\* + +- { +- "Today": [if latest message was today], +- "Last 7 Days": [if convo last message was > day - 7], +- "earlier this month": [...not in above two, but still > day - 30], +- "mm yyyy": [create these if convo is older than the last threshold] +- } \*/ + +// diff --git a/packages/web/components/MainTabsOrPages/ViewConvo.tsx b/packages/web/components/MainTabsOrPages/ViewConvo.tsx index b719698..8e29f46 100644 --- a/packages/web/components/MainTabsOrPages/ViewConvo.tsx +++ b/packages/web/components/MainTabsOrPages/ViewConvo.tsx @@ -48,6 +48,7 @@ const testAudioClips: { relativeSentTime: string; duration: number; alreadyPlayed: boolean; + isGap?: boolean; }[] = [ { senderName: "John", @@ -55,6 +56,14 @@ const testAudioClips: { duration: 150, alreadyPlayed: true, }, + + { + senderName: "Moha", + relativeSentTime: "5 minutes ago", + duration: 600, + alreadyPlayed: false, + isGap: true, + }, { senderName: "Alex", relativeSentTime: "7 hours ago", @@ -67,6 +76,7 @@ const testAudioClips: { duration: 300, alreadyPlayed: false, }, + { senderName: "Alex", relativeSentTime: "30 minutes ago", @@ -81,6 +91,9 @@ const testAudioClips: { }, ]; +const gridRows = 4; +const gridItems = 4 * 100; + export default function ViewConvo(props: { conversationId: string }) { // auth if do not have this conversation in react cache, then we are not authorized @@ -89,48 +102,7 @@ export default function ViewConvo(props: { conversationId: string }) { return ( <> -
- {/* drawer items */} -
- - Shared - - - {/* column list of drawer items - github first one */} - {testDrawerItems.map((link) => ( - - {/* */} - - - - - {link.linkName} - - {link.relativeSentTime} - - - - - - - - - - - - - - - - ))} -
- +
{/* main timeline view with action buttons on top */}
{/* header */} @@ -179,40 +151,64 @@ export default function ViewConvo(props: { conversationId: string }) { - {/* have one row, but just translate it along y downward to put it in it's own place */} - - {testAudioClips.map((audClip, index) => ( - - - - - - {audClip.senderName} - - - {audClip.relativeSentTime} - - - + {/* grid */} +
+ {[...Array(gridItems)].map((e, i) => ( +
))} - + + {/* have one row, but just translate it along y downward to put it in it's own place */} + + {testAudioClips.map((audClip, index) => { + if (audClip.isGap) { + return ( + + ); + } + return ( + + + + + + {audClip.senderName} + + + {audClip.relativeSentTime} + + + + ); + })} + +
{/* stuff for recording and playing action */} @@ -235,6 +231,52 @@ export default function ViewConvo(props: { conversationId: string }) {
+ + {/* drawer items */} +
+ + Shared + + + {/* row of cards drawer items */} + + {testDrawerItems.map((link) => ( + + {/* */} + + + + + + {link.linkName} + + + {link.relativeSentTime} + + + + + + + + + + + + + + + + ))} + +
);