varnitgoyal95/houston-fe
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #91 from navi-sa/member-count

Browse Source 
TP-47721 | member count on add/remove member bug fix
This commit is contained in:
Ajay Devarakonda
2023-11-10 17:48:38 +05:30
committed by GitHub
parent ad7ee95df8 d9654912d1
commit 7eb1520496
2 changed files with 75 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/Pages/Team/partials/TeamForm.tsx
View File

@@ -18,15 +18,17 @@ import styles from '../Team.module.scss';
import { ConfigProvider, Select, ThemeConfig } from 'antd';
import { getBots } from '../bots';
import SlackIcon from '@src/assets/SlackIcon';
import { RootState, setData } from '@src/slices/teamSlice';
import {
FETCH_SINGLE_TEAM_DATA,
TeamFormProps,
UPDATE_TEAM_DATA,
FETCH_TEAM_DATA,
} from '../constants';
const TeamForm = (props: TeamFormProps) => {
const { teamId, isExpanded, setLastUpdatedAt } = props;
const [data, setData] = useState<any>({});
const [teamData, setTeamData] = useState<any>({});
const dispatch = useDispatch();
const [slackUserEmails, setSlackUserEmails] = useState('');
const [isLoading, setIsLoading] = useState<boolean>(false);
@@ -35,6 +37,28 @@ const TeamForm = (props: TeamFormProps) => {
const [psecOncallHandle, setPsecOncallHandle] = useState<string>('');
const [showTooltip, setShowTooltip] = useState<boolean>(false);
const { data } = useSelector((state: RootState) => state.team);
const startTeamSearch = (createdTeamId?: number): void => {
const endPoint = FETCH_TEAM_DATA;
ApiService.get(endPoint)
.then(response => {
const teams = response?.data?.data ?? [];
const updatedTeams = teams.map(t => ({
...t,
expand: t.id === createdTeamId,
}));
dispatch(setData(updatedTeams));
})
.catch(error => {
const toastMessage = `${
error?.response?.data?.error?.message
? `${error?.response?.data?.error?.message}`
: ''
}`;
});
};
const { fireEvent } = useClickStream();
const { EVENT_NAME, SCREEN_NAME } = CLICK_STREAM_EVENT_FACTORY;
@@ -47,7 +71,7 @@ const TeamForm = (props: TeamFormProps) => {
if (updateDate) {
setLastUpdatedAt(response?.data?.data?.lastUpdatedAt);
}
setData(response?.data?.data);
setTeamData(response?.data?.data);
})
.catch(error => {
const toastMessage = `${
@@ -57,7 +81,7 @@ const TeamForm = (props: TeamFormProps) => {
}`;
setIsLoading(false);
toast.error(toastMessage);
setData({});
setTeamData({});
});
};
@@ -82,6 +106,7 @@ const TeamForm = (props: TeamFormProps) => {
.then(response => {
toast.success(response?.data?.data);
fetchTeamById(true);
startTeamSearch();
})
.catch(error => {
const toastMessage = `${
@@ -142,8 +167,8 @@ const TeamForm = (props: TeamFormProps) => {
};
const returnSlackChannel = () => {
return data?.webhookSlackChannelName != 'not found' &&
data?.webhookSlackChannelId ? (
return teamData?.webhookSlackChannelName != 'not found' &&
teamData?.webhookSlackChannelId ? (
<div className={styles['slack-channel-wrapper']}>
<Typography
variant="p4"
@@ -154,11 +179,11 @@ const TeamForm = (props: TeamFormProps) => {
<SlackIcon width={16} height={16} />
<div className="slack-channel-content">
<a
href={`https://go-navi.slack.com/archives/${data?.webhookSlackChannelId}`}
href={`https://go-navi.slack.com/archives/${teamData?.webhookSlackChannelId}`}
target="_blank"
rel="noreferrer"
>
{'#' + data?.webhookSlackChannelName}
{'#' + teamData?.webhookSlackChannelName}
</a>
</div>
</Typography>
@@ -208,8 +233,8 @@ const TeamForm = (props: TeamFormProps) => {
variant="p3"
className={styles['slack-property-detail']}
>
{data?.oncall && data?.oncall?.name != ''
? '@' + data?.oncall?.name
{teamData?.oncall && teamData?.oncall?.name != ''
? '@' + teamData?.oncall?.name
: '-'}
</Typography>
</div>
@@ -225,8 +250,8 @@ const TeamForm = (props: TeamFormProps) => {
variant="p3"
className={styles['slack-property-detail']}
>
{data?.pse_oncall && data?.pse_oncall?.name != ''
? '@' + data?.pse_oncall?.name
{teamData?.pse_oncall && teamData?.pse_oncall?.name != ''
? '@' + teamData?.pse_oncall?.name
: '-'}
</Typography>
</div>
@@ -236,7 +261,7 @@ const TeamForm = (props: TeamFormProps) => {
Members
</Typography>
<MembersDetails data={data} />
<MembersDetails data={teamData} />
</div>
</div>

50
src/components/MembersDetails/index.tsx
View File

@@ -11,16 +11,18 @@ import PersonIcon from '@src/assets/PersonIcon';
import ManagerIcon from '@src/assets/ManagerIcon';
import { CloseIcon } from '@navi/web-ui/lib/icons';
import LoadingIcon from '@navi/web-ui/lib/icons/LoadingIcon';
import { useDispatch, useSelector } from 'react-redux';
import {
REMOVE_TEAM_MEMBER,
MAKE_MANAGER,
FETCH_SINGLE_TEAM_DATA,
FETCH_TEAM_DATA,
} from '@src/Pages/Team/constants';
import { RootState, setData } from '@src/slices/teamSlice';
const MembersDetails = (props: any) => {
const [data, setData] = useState(props.data);
const totalMembers = data?.participants?.length;
const [teamData, setTeamData] = useState(props.data);
const totalMembers = teamData?.participants?.length;
const [showTotalMembers, setShowTotalMembers] = useState(10);
const [showRemoveButton, setShowRemoveButton] = useState(false);
const [open, setOpen] = useState<boolean>(false);
@@ -29,13 +31,36 @@ const MembersDetails = (props: any) => {
const [isShowMore, setIsShowMore] = useState<boolean>(false);
const [selectedParticipantName, setSelectedParticipantName] = useState('0');
const dispatch = useDispatch();
const { data } = useSelector((state: RootState) => state.team);
const startTeamSearch = (createdTeamId?: number): void => {
const endPoint = FETCH_TEAM_DATA;
ApiService.get(endPoint)
.then(response => {
const teams = response?.data?.data ?? [];
const updatedTeams = teams.map(t => ({
...t,
expand: t.id === createdTeamId,
}));
dispatch(setData(updatedTeams));
})
.catch(error => {
const toastMessage = `${
error?.response?.data?.error?.message
? `${error?.response?.data?.error?.message}`
: ''
}`;
});
};
const fetchSingleTeamData = teamId => {
const fetchTeamDataEndpoint = FETCH_SINGLE_TEAM_DATA(teamId);
ApiService.get(fetchTeamDataEndpoint)
.then(response => {
if (response.status === 200) {
const updatedData = response?.data?.data;
setData(updatedData);
setTeamData(updatedData);
setIsLoading(false);
} else {
toast.error(response.data.error.message);
@@ -59,8 +84,9 @@ const MembersDetails = (props: any) => {
if (response.status === 200) {
toast.success(response.data.data);
setIsLoading(true);
setData([]);
setTeamData([]);
fetchSingleTeamData(teamId);
startTeamSearch();
} else {
toast.error(response.data.error.message);
}
@@ -77,7 +103,7 @@ const MembersDetails = (props: any) => {
if (response.status === 200) {
toast.success(response.data.data);
setIsLoading(true);
setData([]);
setTeamData([]);
fetchSingleTeamData(teamId);
} else {
toast.error(response.data.error.message);
@@ -96,8 +122,8 @@ const MembersDetails = (props: any) => {
const userRoles = useAuthData();
const managerEmail = data?.participants?.find(
participant => participant.id === data.managerId,
const managerEmail = teamData?.participants?.find(
participant => participant.id === teamData.managerId,
)?.email;
const storedEmail = localStorage.getItem('email-id');
const isAdmin = userRoles.includes('Admin');
@@ -113,7 +139,7 @@ const MembersDetails = (props: any) => {
} else {
setShowTotalMembers(10);
}
}, [data, userRoles, open, isShowMore]);
}, [teamData, userRoles, open, isShowMore]);
if (isLoading) {
return (
@@ -126,7 +152,7 @@ const MembersDetails = (props: any) => {
<div>
{totalMembers ? (
<>
{data?.participants
{teamData?.participants
?.slice(0, showTotalMembers)
?.map((participant, index) => (
<div
@@ -195,7 +221,7 @@ const MembersDetails = (props: any) => {
<CloseIcon
onClick={() => {
handleRemoveUser(
data.id,
teamData.id,
participant.id,
participant.name,
);
@@ -232,7 +258,7 @@ const MembersDetails = (props: any) => {
label: 'Change manager',
onClick: () => {
setOpen(false);
handleMakeManager(data.id);
handleMakeManager(teamData.id);
},
},
]}