join requests hide when accepted

This commit is contained in:
PhilReact 2024-09-24 15:59:35 +03:00
parent cf9bea2954
commit fe6497bf62
4 changed files with 54 additions and 12 deletions

View File

@ -15,12 +15,13 @@ import { Box, Typography } from "@mui/material";
import { Spacer } from "../../common/Spacer";
import { CustomLoader } from "../../common/CustomLoader";
import { getBaseApi } from "../../background";
import { getBaseApiReact, isMobile } from "../../App";
import { MyContext, getBaseApiReact, isMobile } from "../../App";
export const requestQueueGroupJoinRequests = new RequestQueueWithPromise(2)
export const GroupJoinRequests = ({ myAddress, groups, setOpenManageMembers, getTimestampEnterChat, setSelectedGroup, setGroupSection, setMobileViewMode }) => {
const [groupsWithJoinRequests, setGroupsWithJoinRequests] = React.useState([])
const [loading, setLoading] = React.useState(true)
const {txList, setTxList} = React.useContext(MyContext)
@ -92,6 +93,22 @@ export const GroupJoinRequests = ({ myAddress, groups, setOpenManageMembers, get
}
}, [myAddress, groups]);
const filteredJoinRequests = React.useMemo(()=> {
return groupsWithJoinRequests.map((group)=> {
const filteredGroupRequests = group?.data?.filter((gd)=> {
const findJoinRequsetInTxList = txList?.find((tx)=> tx?.groupId === group?.group?.groupId && tx?.qortalAddress === gd?.joiner && tx?.type === 'join-request-accept')
if(findJoinRequsetInTxList) return false
return true
})
return {
...group,
data: filteredGroupRequests
}
})
}, [groupsWithJoinRequests, txList])
console.log('filteredJoinRequests', filteredJoinRequests)
return (
<Box sx={{
@ -132,7 +149,7 @@ export const GroupJoinRequests = ({ myAddress, groups, setOpenManageMembers, get
borderRadius: '19px'
}}
>
{loading && groupsWithJoinRequests.length === 0 && (
{loading && filteredJoinRequests.length === 0 && (
<Box sx={{
width: '100%',
display: 'flex',
@ -141,7 +158,7 @@ export const GroupJoinRequests = ({ myAddress, groups, setOpenManageMembers, get
<CustomLoader />
</Box>
)}
{!loading && (groupsWithJoinRequests.length === 0 || groupsWithJoinRequests?.filter((group)=> group?.data?.length > 0).length === 0) && (
{!loading && (filteredJoinRequests.length === 0 || filteredJoinRequests?.filter((group)=> group?.data?.length > 0).length === 0) && (
<Box
sx={{
width: "100%",
@ -164,7 +181,7 @@ export const GroupJoinRequests = ({ myAddress, groups, setOpenManageMembers, get
</Box>
)}
<List sx={{ width: "100%", maxWidth: 360, bgcolor: "background.paper", maxHeight: '300px', overflow: 'auto' }}>
{groupsWithJoinRequests?.map((group)=> {
{filteredJoinRequests?.map((group)=> {
if(group?.data?.length === 0) return null
return (
<ListItem

View File

@ -1,10 +1,10 @@
import React, { useEffect, useRef, useState } from 'react';
import React, { useContext, useEffect, useRef, useState } from 'react';
import { Avatar, Box, Button, ListItem, ListItemAvatar, ListItemButton, ListItemText, Popover } from '@mui/material';
import { AutoSizer, CellMeasurer, CellMeasurerCache, List } from 'react-virtualized';
import { getNameInfo } from './Group';
import { getBaseApi, getFee } from '../../background';
import { LoadingButton } from '@mui/lab';
import { getBaseApiReact } from '../../App';
import { MyContext, getBaseApiReact } from '../../App';
export const getMemberInvites = async (groupNumber) => {
const response = await fetch(`${getBaseApiReact()}/groups/joinrequests/${groupNumber}?limit=0`);
@ -34,6 +34,8 @@ const cache = new CellMeasurerCache({
export const ListOfJoinRequests = ({ groupId, setInfoSnack, setOpenSnack, show }) => {
const [invites, setInvites] = useState([]);
const {txList, setTxList} = useContext(MyContext)
const [popoverAnchor, setPopoverAnchor] = useState(null); // Track which list item the popover is anchored to
const [openPopoverIndex, setOpenPopoverIndex] = useState(null); // Track which list item has the popover open
const listRef = useRef();
@ -89,6 +91,16 @@ export const ListOfJoinRequests = ({ groupId, setInfoSnack, setOpenSnack, show }
setOpenSnack(true);
handlePopoverClose();
res(response)
setTxList((prev)=> [{
...response,
type: 'join-request-accept',
label: `Accepted join request: awaiting confirmation`,
labelDone: `User successfully joined!`,
done: false,
groupId,
qortalAddress: address
}, ...prev])
return
}
setInfoSnack({
@ -108,7 +120,8 @@ export const ListOfJoinRequests = ({ groupId, setInfoSnack, setOpenSnack, show }
const rowRenderer = ({ index, key, parent, style }) => {
const member = invites[index];
const findJoinRequsetInTxList = txList?.find((tx)=> tx?.groupId === groupId && tx?.qortalAddress === member?.joiner && tx?.type === 'join-request-accept')
if(findJoinRequsetInTxList) return null
return (
<CellMeasurer
key={key}

View File

@ -122,6 +122,16 @@ export const TaskManger = ({getUserInfo}) => {
}
})
prev.forEach((tx, index)=> {
if(tx?.type === "join-request-accept" && tx?.signature && !tx.done){
if(intervals.current[tx.signature]) return
getStatus({signature: tx.signature})
}
})
prev.forEach((tx, index)=> {
if(tx?.type === "register-name" && tx?.signature && !tx.done){

View File

@ -70,12 +70,14 @@ export const WrapperUserAction = ({ children, address, name, disabled }) => {
<Button
variant="text"
onClick={() => {
executeEvent('openDirectMessageInternal', {
address,
name,
});
handleClose();
setTimeout(() => {
executeEvent('openDirectMessageInternal', {
address,
name,
});
}, 200);
}}
sx={{
color: 'white'