Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

✨ Reports: select Questionnaires #1374

Merged
merged 12 commits into from
Sep 21, 2023
Merged

✨ Reports: select Questionnaires #1374

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
63628eb
Reports: select Questionnaires
gildub Sep 19, 2023
02998ab
select from assessments; set donut colors
gildub Sep 19, 2023
a7ed5d0
Reduce assessment list to unique questionnaires
gildub Sep 19, 2023
9b0a143
Pass specific questionnaire to LandScape
gildub Sep 19, 2023
57485c0
LandScape gets assessments from selection
gildub Sep 19, 2023
f17b04a
Use isAssessmentsFetching
gildub Sep 20, 2023
89c578e
check assessments fetchError
gildub Sep 20, 2023
981fead
Adjust landscapeData
gildub Sep 21, 2023
4277f71
Rename and default select value is constant
gildub Sep 21, 2023
228bded
Handle empty assessment questionnaire case and sort list
gildub Sep 21, 2023
d13e446
Refactor answeredQuestionnaires
gildub Sep 21, 2023
d087521
Merge branch 'main' into reports-questionnaires-dropdown
sjd78 Sep 21, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 2 additions & 5 deletions client/public/locales/en/translation.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,7 +71,8 @@
"orange": "Orange",
"purple": "Purple",
"red": "Red",
"teal": "Teal"
"teal": "Teal",
"yellow": "Yellow"
},
"composed": {
"add": "Add {{what}}",
Expand Down Expand Up @@ -243,7 +244,6 @@
"businessServices": "Business services",
"canceled": "Canceled",
"category": "Category",
"cloudNativeReady": "Cloud-native ready",
"color": "Color",
"comments": "Comments",
"completed": "Completed",
Expand Down Expand Up @@ -311,7 +311,6 @@
"member(s)": "Member(s)",
"memberCount": "Member count",
"message": "Message",
"modernizable": "Modernizable",
"migrationWave": "Migration wave",
"migrationWaves": "Migration waves",
"migrationWave(s)": "Migration wave(s)",
Expand All @@ -322,7 +321,6 @@
"notConnected": "Not connected",
"notReviewed": "Not reviewed",
"notStarted": "Not started",
"notYetAssessed": "Not yet assessed",
"notYetReviewed": "Not yet reviewed",
"other": "Other",
"owner": "Owner",
Expand Down Expand Up @@ -384,7 +382,6 @@
"unassessed": "Unassessed",
"unassigned": "Not yet assigned",
"unknown": "Unknown",
"unsuitableForContainers": "Unsuitable for containers",
"uploadApplicationFile": "Upload your application file",
"uploadYamlFile": "Upload your YAML file",
"url": "URL",
Expand Down
7 changes: 2 additions & 5 deletions client/public/locales/es/translation.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,8 @@
"green": "Verde",
"orange": "Naranja",
"purple": "Morado",
"red": "Rojo"
"red": "Rojo",
"yellow": "Amarillo"
},
"composed": {
"add": "Agregar {{what}}",
Expand Down Expand Up @@ -194,7 +195,6 @@
"businessServices": "Servicios de negocio",
"canceled": "Cancelado",
"category": "Categoría",
"cloudNativeReady": "Listo para Cloud-native",
"color": "Color",
"comments": "Comentarios",
"completed": "Completado",
Expand Down Expand Up @@ -247,13 +247,11 @@
"member(s)": "Miembro(s)",
"memberCount": "Número de miembros",
"message": "Mensaje",
"modernizable": "Modernizable",
"name": "Nombre",
"northboundDependencies": "Dependencias del norte",
"notAvailable": "No disponible",
"notReviewed": "No revisado",
"notStarted": "No empezado",
"notYetAssessed": "No evaluado todavía",
"notYetReviewed": "No revisado todavía",
"other": "Otro",
"owner": "Propietario",
Expand Down Expand Up @@ -304,7 +302,6 @@
"trivialButMigratable": "Trivial pero migrable",
"unassessed": "No evaluado",
"unknown": "Desconocido",
"unsuitableForContainers": "No apto para contenedores",
"uploadApplicationFile": "Carga tu archivo con aplicaciones",
"user": "Usuario",
"version": "Versión",
Expand Down
5 changes: 0 additions & 5 deletions client/src/app/api/models.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -205,7 +205,7 @@
identity?: Ref;
createTime?: string;
createUser?: string;
id: any;

Check warning on line 208 in client/src/app/api/models.ts

View workflow job for this annotation

GitHub Actions / unit-test (18.x) 

Unexpected any. Specify a different type
enabled: boolean;
}

Expand Down Expand Up @@ -362,7 +362,7 @@

export interface TaskgroupTask {
name: string;
data: any;

Check warning on line 365 in client/src/app/api/models.ts

View workflow job for this annotation

GitHub Actions / unit-test (18.x) 

Unexpected any. Specify a different type
application: Ref;
}

Expand Down Expand Up @@ -723,11 +723,6 @@
applicationId: number;
risk: Risk;
}
export interface AssessmentRisk {
assessmentId: number;
applicationId: number;
risk: Risk;
}

export interface AssessmentQuestionRisk {
category: string;
Expand Down
3 changes: 3 additions & 0 deletions client/src/app/api/rest.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -117,11 +117,11 @@

type Direction = "asc" | "desc";

const buildQuery = (params: any) => {

Check warning on line 120 in client/src/app/api/rest.ts

View workflow job for this annotation

GitHub Actions / unit-test (18.x) 

'buildQuery' is assigned a value but never used

Check warning on line 120 in client/src/app/api/rest.ts

View workflow job for this annotation

GitHub Actions / unit-test (18.x) 

Unexpected any. Specify a different type
const query: string[] = [];

Object.keys(params).forEach((key) => {
const value = (params as any)[key];

Check warning on line 124 in client/src/app/api/rest.ts

View workflow job for this annotation

GitHub Actions / unit-test (18.x) 

Unexpected any. Specify a different type

if (value !== undefined && value !== null) {
let queryParamValues: string[] = [];
Expand Down Expand Up @@ -205,6 +205,9 @@
});
};

export const getAssessments = (): Promise<Assessment[]> =>
axios.get(ASSESSMENTS).then((response) => response.data);

Check warning on line 209 in client/src/app/api/rest.ts

View check run for this annotation

Codecov / codecov/patch

client/src/app/api/rest.ts#L209 

Added line #L209 was not covered by tests

export const getAssessmentsByItemId = (
isArchetype: boolean,
itemId?: number | string
Expand Down
2 changes: 1 addition & 1 deletion client/src/app/pages/reports/components/landscape/donut.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ export interface IDonutProps {
total: number;
color: string;
riskLabel: string;
riskDescription: string;
riskDescription?: string;
}

export const Donut: React.FC<IDonutProps> = ({
Expand Down
30 changes: 17 additions & 13 deletions client/src/app/pages/reports/components/landscape/landscape.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { ConditionalRender } from "@app/components/ConditionalRender";
import { StateError } from "@app/components/StateError";

import { RISK_LIST } from "@app/Constants";
import { AssessmentRisk } from "@app/api/models";
import { Assessment, AssessmentRisk } from "@app/api/models";

import { ApplicationSelectionContext } from "../../application-selection-context";
import { NoApplicationSelectedEmptyState } from "../no-application-selected-empty-state";
Expand Down Expand Up @@ -48,7 +48,11 @@ const extractLandscapeData = (
return { low, medium, high, unassessed };
};

export const Landscape: React.FC = () => {
interface ILandscapeProps {
assessments: Assessment[];
}

export const Landscape: React.FC<ILandscapeProps> = ({ assessments }) => {
sjd78 marked this conversation as resolved.
Show resolved Hide resolved
const { t } = useTranslation();

// Context
Expand Down Expand Up @@ -89,38 +93,38 @@ export const Landscape: React.FC = () => {
<Split hasGutter>
<SplitItem>
<Donut
value={landscapeData.low}
value={landscapeData.high}
total={applications.length}
color={RISK_LIST["green"].hexColor}
riskLabel={t("terms.lowRisk")}
riskDescription={t("terms.cloudNativeReady")}
color={RISK_LIST["red"].hexColor}
riskLabel={t("colors.red")}
// riskDescription={}
/>
</SplitItem>
<SplitItem>
<Donut
value={landscapeData.medium}
total={applications.length}
color={RISK_LIST["yellow"].hexColor}
riskLabel={t("terms.mediumRisk")}
riskDescription={t("terms.modernizable")}
riskLabel={t("colors.yellow")}
// riskDescription={}
/>
</SplitItem>
<SplitItem>
<Donut
value={landscapeData.high}
total={applications.length}
color={RISK_LIST["red"].hexColor}
riskLabel={t("terms.highRisk")}
riskDescription={t("terms.unsuitableForContainers")}
color={RISK_LIST["green"].hexColor}
riskLabel={t("colors.green")}
// riskDescription={}
/>
Comment on lines 113 to 119
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If this one is 'green', should the value be switched to landscapeData.low?

</SplitItem>
<SplitItem>
<Donut
value={landscapeData.unassessed}
total={applications.length}
color={RISK_LIST["unknown"].hexColor}
riskLabel={t("terms.unassessed")}
riskDescription={t("terms.notYetAssessed")}
riskLabel={`${t("terms.unassessed")}/${t("terms.unknown")}`}
// riskDescription={}
/>
</SplitItem>
</Split>
Expand Down
115 changes: 111 additions & 4 deletions client/src/app/pages/reports/reports.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,15 @@ import {
CardExpandableContent,
CardHeader,
CardTitle,
Flex,
FlexItem,
MenuToggle,
MenuToggleElement,
PageSection,
PageSectionVariants,
Popover,
Select,
SelectOption,
Split,
SplitItem,
Stack,
Expand All @@ -31,11 +37,27 @@ import { Landscape } from "./components/landscape";
import { AdoptionPlan } from "./components/adoption-plan";
import { IdentifiedRisksTable } from "./components/identified-risks-table";
import { useFetchApplications } from "@app/queries/applications";
import { useFetchAssessments } from "@app/queries/assessments";
import { Ref } from "@app/api/models";

const ALL_QUESTIONNAIRES = "All questionnaires";

export const Reports: React.FC = () => {
// i18
const { t } = useTranslation();

const [isQuestionnaireSelectOpen, setIsQuestionnaireSelectOpen] =
React.useState<boolean>(false);

const [selectedQuestionnaire, setSelectedQuestionnaire] =
React.useState<string>("All questionnaires");

const {
assessments,
isFetching: isAssessmentsFetching,
fetchError: assessmentsFetchError,
} = useFetchAssessments();

// Cards
const [isAdoptionCandidateTable, setIsAdoptionCandidateTable] =
useState(true);
Expand Down Expand Up @@ -66,6 +88,48 @@ export const Reports: React.FC = () => {
);
}

const toggleQuestionnaire = (toggleRef: React.Ref<MenuToggleElement>) => (
<MenuToggle
ref={toggleRef}
aria-label="kebab dropdown toggle"
onClick={() => {
setIsQuestionnaireSelectOpen(!isQuestionnaireSelectOpen);
}}
isExpanded={isQuestionnaireSelectOpen}
>
{selectedQuestionnaire}
</MenuToggle>
);

const onSelectQuestionnaire = (
_event: React.MouseEvent<Element, MouseEvent> | undefined,
value: string | number | undefined
) => {
setSelectedQuestionnaire(value as string);
setIsQuestionnaireSelectOpen(false);
};

const answeredQuestionnaires: Ref[] =
isAssessmentsFetching || assessmentsFetchError
? []
: assessments
.reduce((questionnaires: Ref[], assessment) => {
if (
!questionnaires
.map((ref) => ref.id)
.includes(assessment.questionnaire.id)
) {
assessment.questionnaire &&
questionnaires.push(assessment.questionnaire);
}
return questionnaires;
}, [])
.sort((a, b) => {
if (a.name > b.name) return 1;
if (b.name > a.name) return -1;
return 0;
});

return (
<>
{pageHeaderSection}
Expand All @@ -78,13 +142,56 @@ export const Reports: React.FC = () => {
<StackItem>
<Card>
<CardHeader>
<TextContent>
<Text component="h3">{t("terms.currentLandscape")}</Text>
</TextContent>
<Flex>
<FlexItem>
<TextContent>
<Text component="h3">
{t("terms.currentLandscape")}
</Text>
</TextContent>
</FlexItem>
<FlexItem>
<Select
id="select-questionnaires"
isOpen={isQuestionnaireSelectOpen}
selected={selectedQuestionnaire}
onSelect={onSelectQuestionnaire}
onOpenChange={(_isOpen) =>
setIsQuestionnaireSelectOpen(false)
}
toggle={toggleQuestionnaire}
shouldFocusToggleOnSelect
>
<SelectOption key={0} value={ALL_QUESTIONNAIRES}>
All questionnaires
</SelectOption>
{answeredQuestionnaires.map(
(answeredQuestionnaire, index) => (
<SelectOption
key={index}
value={answeredQuestionnaire.name}
>
{answeredQuestionnaire.name}
</SelectOption>
)
)}
</Select>
</FlexItem>
</Flex>
</CardHeader>
<CardBody>
<Bullseye>
<Landscape />
<Landscape
sjd78 marked this conversation as resolved.
Show resolved Hide resolved
assessments={
selectedQuestionnaire === "All questionnaires"
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Swap out the string for a constant for safety

? assessments
: assessments.filter(
(assessment) =>
assessment.questionnaire.name ===
selectedQuestionnaire
)
}
/>
</Bullseye>
</CardBody>
</Card>
Expand Down
13 changes: 13 additions & 0 deletions client/src/app/queries/assessments.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
createAssessment,
deleteAssessment,
getAssessmentById,
getAssessments,
getAssessmentsByItemId,
updateAssessment,
} from "@app/api/rest";
Expand All @@ -15,6 +16,18 @@
export const assessmentQueryKey = "assessment";
export const assessmentsByItemIdQueryKey = "assessmentsByItemId";

export const useFetchAssessments = () => {
const { isLoading, data, error } = useQuery({

Check warning on line 20 in client/src/app/queries/assessments.ts

View check run for this annotation

Codecov / codecov/patch

client/src/app/queries/assessments.ts#L20 

Added line #L20 was not covered by tests
queryKey: [QuestionnairesQueryKey],
queryFn: getAssessments,
onError: (error: AxiosError) => console.log("error, ", error),

Check warning on line 23 in client/src/app/queries/assessments.ts

View check run for this annotation

Codecov / codecov/patch

client/src/app/queries/assessments.ts#L23 

Added line #L23 was not covered by tests
});
return {

Check warning on line 25 in client/src/app/queries/assessments.ts

View check run for this annotation

Codecov / codecov/patch

client/src/app/queries/assessments.ts#L25 

Added line #L25 was not covered by tests
assessments: data || [],
isFetching: isLoading,
fetchError: error,
};
};
export const useCreateAssessmentMutation = (
isArchetype: boolean,
onSuccess: (name: string) => void,
Expand Down
Loading