From 44bd77c6392cc7b3ac13992cb1541c60af97d9e3 Mon Sep 17 00:00:00 2001 From: xyfer17 Date: Fri, 27 Sep 2024 00:15:34 +0530 Subject: [PATCH 1/4] feat: add team view button --- web-server/src/components/TeamsList.tsx | 28 ++++++++++++++++++++----- 1 file changed, 23 insertions(+), 5 deletions(-) diff --git a/web-server/src/components/TeamsList.tsx b/web-server/src/components/TeamsList.tsx index 736b1de9..65abaf3e 100644 --- a/web-server/src/components/TeamsList.tsx +++ b/web-server/src/components/TeamsList.tsx @@ -13,7 +13,7 @@ import pluralize from 'pluralize'; import { ascend } from 'ramda'; import { FC, MouseEventHandler, useCallback, useEffect, useMemo } from 'react'; import { truncate } from 'voca'; - +import { appSlice } from '@/slices/app'; import { ROUTES } from '@/constants/routes'; import { FetchState } from '@/constants/ui-states'; import { useAuth } from '@/hooks/useAuth'; @@ -22,7 +22,6 @@ import { deleteTeam, fetchTeams } from '@/slices/team'; import { useDispatch, useSelector } from '@/store'; import { Team } from '@/types/api/teams'; import { depFn } from '@/utils/fn'; - import { FlexBox } from './FlexBox'; import { useOverlayPage } from './OverlayPageContext'; import { CreateEditTeams } from './Teams/CreateTeams'; @@ -36,6 +35,7 @@ export const TeamsList = () => { const teamsArray = useSelector((state) => state.team.teams); const searchQuery = useEasyState(''); const router = useRouter(); + const dispatch = useDispatch(); const showCreate = useBoolState(false); const teamsArrayFiltered = useMemo(() => { @@ -55,6 +55,14 @@ export const TeamsList = () => { (state) => state.team?.requests?.teams === FetchState.REQUEST ); + const handleTeamView = (team) => { + if (team) { + dispatch(appSlice.actions.setSingleTeam([team])); + } + const path = ROUTES.DORA_METRICS.PATH; + router.push(path); + } + useEffect(() => { if (router.query.create === 'true') { depFn(showCreate.true); @@ -89,7 +97,7 @@ export const TeamsList = () => { }} > {teamsArrayFiltered.map((team, index) => ( - + ))} {isLoadingTeams && ( @@ -180,7 +188,7 @@ type TeamCardProps = { onEdit: () => void; }; -const TeamCard: React.FC = ({ team, onEdit }) => { +const TeamCard: React.FC = ({ team, onEdit, onView }) => { const { name: teamName, id: teamId } = team; const teamReposMap = useSelector((state) => state.team.teamReposMaps); const assignedReposToTeam = useMemo( @@ -253,7 +261,17 @@ const TeamCard: React.FC = ({ team, onEdit }) => { - + + From c1bec4d5d261451e12fc95960733aeccf53258ba Mon Sep 17 00:00:00 2001 From: xyfer17 Date: Wed, 2 Oct 2024 14:11:01 +0530 Subject: [PATCH 2/4] fix: linting issue --- web-server/src/components/TeamsList.tsx | 13 ++++++++++--- 1 file changed, 10 insertions(+), 3 deletions(-) diff --git a/web-server/src/components/TeamsList.tsx b/web-server/src/components/TeamsList.tsx index 65abaf3e..bb77f4c2 100644 --- a/web-server/src/components/TeamsList.tsx +++ b/web-server/src/components/TeamsList.tsx @@ -13,15 +13,17 @@ import pluralize from 'pluralize'; import { ascend } from 'ramda'; import { FC, MouseEventHandler, useCallback, useEffect, useMemo } from 'react'; import { truncate } from 'voca'; -import { appSlice } from '@/slices/app'; + import { ROUTES } from '@/constants/routes'; import { FetchState } from '@/constants/ui-states'; import { useAuth } from '@/hooks/useAuth'; import { useBoolState, useEasyState } from '@/hooks/useEasyState'; +import { appSlice } from '@/slices/app'; import { deleteTeam, fetchTeams } from '@/slices/team'; import { useDispatch, useSelector } from '@/store'; import { Team } from '@/types/api/teams'; import { depFn } from '@/utils/fn'; + import { FlexBox } from './FlexBox'; import { useOverlayPage } from './OverlayPageContext'; import { CreateEditTeams } from './Teams/CreateTeams'; @@ -61,7 +63,7 @@ export const TeamsList = () => { } const path = ROUTES.DORA_METRICS.PATH; router.push(path); - } + }; useEffect(() => { if (router.query.create === 'true') { @@ -97,7 +99,12 @@ export const TeamsList = () => { }} > {teamsArrayFiltered.map((team, index) => ( - + ))} {isLoadingTeams && ( From c34fdd3e7528d125684d5a0bd3bf6273e5c411d4 Mon Sep 17 00:00:00 2001 From: xyfer17 Date: Tue, 15 Oct 2024 22:38:50 +0530 Subject: [PATCH 3/4] add dora icon --- web-server/src/assets/dora-icon.svg | 1 + web-server/src/components/TeamsList.tsx | 20 +++++++++++--------- 2 files changed, 12 insertions(+), 9 deletions(-) create mode 100644 web-server/src/assets/dora-icon.svg diff --git a/web-server/src/assets/dora-icon.svg b/web-server/src/assets/dora-icon.svg new file mode 100644 index 00000000..611e37dd --- /dev/null +++ b/web-server/src/assets/dora-icon.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/web-server/src/components/TeamsList.tsx b/web-server/src/components/TeamsList.tsx index bb77f4c2..1a56bdc0 100644 --- a/web-server/src/components/TeamsList.tsx +++ b/web-server/src/components/TeamsList.tsx @@ -14,6 +14,7 @@ import { ascend } from 'ramda'; import { FC, MouseEventHandler, useCallback, useEffect, useMemo } from 'react'; import { truncate } from 'voca'; +import DoraIcon from '@/assets/dora-icon.svg'; import { ROUTES } from '@/constants/routes'; import { FetchState } from '@/constants/ui-states'; import { useAuth } from '@/hooks/useAuth'; @@ -57,7 +58,7 @@ export const TeamsList = () => { (state) => state.team?.requests?.teams === FetchState.REQUEST ); - const handleTeamView = (team) => { + const handleTeamView = (team: Team) => { if (team) { dispatch(appSlice.actions.setSingleTeam([team])); } @@ -193,6 +194,7 @@ const SearchFilter: FC<{ type TeamCardProps = { team: Team; onEdit: () => void; + onView: (team: Team) => void; }; const TeamCard: React.FC = ({ team, onEdit, onView }) => { @@ -269,16 +271,16 @@ const TeamCard: React.FC = ({ team, onEdit, onView }) => { - + + From 6e511523c0559a02199aa0146d42034aeb748e06 Mon Sep 17 00:00:00 2001 From: Naveen yadav <52673659+xyfer17@users.noreply.github.com> Date: Wed, 16 Oct 2024 11:44:25 +0530 Subject: [PATCH 4/4] feat: change the tooltip to "View Dora Metrics" --- web-server/src/components/TeamsList.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web-server/src/components/TeamsList.tsx b/web-server/src/components/TeamsList.tsx index 1a56bdc0..f52a8328 100644 --- a/web-server/src/components/TeamsList.tsx +++ b/web-server/src/components/TeamsList.tsx @@ -272,7 +272,7 @@ const TeamCard: React.FC = ({ team, onEdit, onView }) => {