Skip to content

Commit 3a4b9d5

Browse files
tnagorratnagorra
committed
Merge branch 'feature/update-ops-learning-key-insight-disclaimer' into develop
2 parents a113afc + 9563ad0 commit 3a4b9d5

File tree

8 files changed

+157
-134
lines changed

8 files changed

+157
-134
lines changed

‎.changeset/lucky-pigs-kneel.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"go-web-app": patch
3+
---
4+
5+
Update key insights disclaimer text in Ops. Learning

‎app/src/views/OperationalLearning/KeyInsights/i18n.json‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,13 @@
11
{
2-
"namespace": "keyInsights",
2+
"namespace": "opsLearningKeyInsights",
33
"strings": {
4-
"opsLearningSummariesHeading": "Summary of learnings",
5-
"keyInsightsDisclaimer": "THESE SUMMARIES WERE GENERATED USING AI AND LARGE LANGUAGE MODELS. THEY REPRESENT {numOfExtractsUsed} PRIORITISED EXTRACTS OUT OF {totalNumberOfExtracts} FROM THE DREF AND EA DOCUMENTS BETWEEN {appealsFromDate} - {appealsToDate}. TO SEE THE METHODOLOGY BEHIND THE PRIORITISATION ",
6-
"keyInsightsDisclaimerClickHere": "CLICK HERE.",
7-
"keyInsightsReportIssue": "Report an issue",
8-
"closeSources": "Close Sources",
9-
"seeSources": "Show Sources"
4+
"opsLearningSummariesHeading": "Summary of learnings",
5+
"keyInsightsDisclaimer": "These summaries were generated using AI and Large Language Models. They represent {numOfExtractsUsed} prioritised extracts out of {totalNumberOfExtracts} from the DREF and EA documents between {appealsFromDate} - {appealsToDate}. An initial automatic assessment of the quality of the summaries resulted in around 78% performance in terms of relevancy, coherence, consisentency and fluency. To see the methodology behind the prioritisation {methodologyLink}.",
6+
"methodologyLinkLabel": "click here",
7+
"keyInsightsReportIssue": "Report an issue",
8+
"closeSources": "Close Sources",
9+
"seeSources": "Show Sources"
1010
}
1111
}
12+
13+

‎app/src/views/OperationalLearning/KeyInsights/index.tsx‎

Lines changed: 61 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,15 @@ import {
66
import {
77
Button,
88
Container,
9+
NumberOutput,
910
} from '@ifrc-go/ui';
1011
import {
1112
useBooleanState,
1213
useTranslation,
1314
} from '@ifrc-go/ui/hooks';
1415
import {
1516
formatDate,
16-
resolveToString,
17+
resolveToComponent,
1718
} from '@ifrc-go/ui/utils';
1819
import { isDefined } from '@togglecorp/fujs';
1920

@@ -48,9 +49,13 @@ function KeyInsights(props: Props) {
4849
return (
4950
<Container
5051
className={styles.keyInsights}
52+
headingLevel={2}
5153
heading={strings.opsLearningSummariesHeading}
5254
withInternalPadding
5355
withOverflowInContent
56+
contentViewType="grid"
57+
numPreferredGridContentColumns={3}
58+
footerActionsContainerClassName={styles.actions}
5459
footerActions={(
5560
<Button
5661
name={opsLearningSummaryResponse.id}
@@ -64,61 +69,72 @@ function KeyInsights(props: Props) {
6469
{isExpanded ? strings.closeSources : strings.seeSources}
6570
</Button>
6671
)}
67-
childrenContainerClassName={styles.insights}
6872
>
69-
<div className={styles.insightTexts}>
70-
{isDefined(opsLearningSummaryResponse?.insights1_title) && (
71-
<Container
72-
heading={opsLearningSummaryResponse.insights1_title}
73-
headerDescription={opsLearningSummaryResponse.insights1_content}
74-
/>
75-
)}
76-
{isDefined(opsLearningSummaryResponse?.insights2_title) && (
77-
<Container
78-
heading={opsLearningSummaryResponse.insights2_title}
79-
headerDescription={opsLearningSummaryResponse.insights2_content}
80-
/>
81-
)}
82-
{isDefined(opsLearningSummaryResponse?.insights3_title) && (
83-
<Container
84-
heading={opsLearningSummaryResponse.insights3_title}
85-
headerDescription={opsLearningSummaryResponse.insights3_content}
86-
/>
87-
)}
73+
{isDefined(opsLearningSummaryResponse?.insights1_title) && (
74+
<Container
75+
heading={opsLearningSummaryResponse.insights1_title}
76+
headerDescription={opsLearningSummaryResponse.insights1_content}
77+
/>
78+
)}
79+
{isDefined(opsLearningSummaryResponse?.insights2_title) && (
80+
<Container
81+
heading={opsLearningSummaryResponse.insights2_title}
82+
headerDescription={opsLearningSummaryResponse.insights2_content}
83+
/>
84+
)}
85+
{isDefined(opsLearningSummaryResponse?.insights3_title) && (
86+
<Container
87+
heading={opsLearningSummaryResponse.insights3_title}
88+
headerDescription={opsLearningSummaryResponse.insights3_content}
89+
/>
90+
)}
91+
<div className={styles.disclaimerText}>
92+
{resolveToComponent(strings.keyInsightsDisclaimer, {
93+
numOfExtractsUsed: (
94+
<NumberOutput
95+
value={opsLearningSummaryResponse.used_extracts_count}
96+
/>
97+
),
98+
totalNumberOfExtracts: (
99+
<NumberOutput
100+
value={opsLearningSummaryResponse.total_extracts_count}
101+
/>
102+
),
103+
appealsFromDate: formatDate(
104+
opsLearningSummaryResponse.earliest_appeal_date,
105+
'MMM-yyyy',
106+
),
107+
appealsToDate: formatDate(
108+
opsLearningSummaryResponse.latest_appeal_date,
109+
'MMM-yyyy',
110+
),
111+
methodologyLink: (
112+
<Link
113+
href="https://go-wiki.ifrc.org/en/user_guide/ops_learning"
114+
external
115+
withUnderline
116+
linkElementClassName={styles.methodologyLink}
117+
withLinkIcon
118+
>
119+
{strings.methodologyLinkLabel}
120+
</Link>
121+
),
122+
})}
88123
</div>
89-
<div className={styles.summaries}>
90-
<span className={styles.text}>
91-
{resolveToString(strings.keyInsightsDisclaimer, {
92-
numOfExtractsUsed: opsLearningSummaryResponse.used_extracts_count,
93-
totalNumberOfExtracts: opsLearningSummaryResponse.total_extracts_count,
94-
appealsFromDate: formatDate(
95-
opsLearningSummaryResponse.earliest_appeal_date,
96-
'MMM-yyyy',
97-
),
98-
appealsToDate: formatDate(
99-
opsLearningSummaryResponse.latest_appeal_date,
100-
'MMM-yyyy',
101-
),
102-
})}
103-
<Link
104-
href="https://go-wiki.ifrc.org/en/user_guide/ops_learning"
105-
external
106-
withUnderline
107-
>
108-
{strings.keyInsightsDisclaimerClickHere}
109-
</Link>
110-
</span>
124+
<div className={styles.reportIssueLinkContainer}>
111125
<Link
112-
className={styles.reportIssue}
126+
linkElementClassName={styles.reportIssueLink}
113127
href="https://forms.office.com/pages/responsepage.aspx?id=5Tu1ok5zbE6rDdGE9g_ZF4KwLxGrbflAt2rbQ7DtFG5UQU1CTEZTSldLQ0ZTVEtPSVdQQklOVzBDVi4u"
114-
actions={<AlertFillIcon />}
128+
icons={<AlertFillIcon />}
115129
external
130+
withLinkIcon
116131
>
117132
{strings.keyInsightsReportIssue}
118133
</Link>
119134
</div>
120135
{isExpanded && (
121136
<Sources
137+
className={styles.sources}
122138
summaryId={opsLearningSummaryResponse.id}
123139
summaryType="insight"
124140
/>

‎app/src/views/OperationalLearning/KeyInsights/styles.module.css‎

Lines changed: 21 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,35 @@
11
.key-insights {
22
background-color: var(--go-ui-color-background);
33

4-
.summaries {
5-
display: flex;
6-
align-items: baseline;
7-
justify-content: flex-end;
8-
gap: var(--go-ui-spacing-md);
4+
.sources {
5+
grid-column: 1 / -1;
6+
}
97

10-
.text {
11-
color: var(--go-ui-color-text-light);
8+
.disclaimer-text {
9+
grid-column: 1 / -1;
10+
text-transform: uppercase;
11+
color: var(--go-ui-color-text-light);
12+
13+
.methodology-link {
14+
text-transform: uppercase;
1215
}
16+
}
1317

14-
.report-issue {
18+
.report-issue-link-container {
19+
display: flex;
20+
justify-content: flex-end;
21+
grid-column: 1 / -1;
22+
23+
.report-issue-link {
1524
flex-shrink: 0;
1625
color: var(--go-ui-color-negative);
1726
}
1827
}
1928

20-
.insights {
21-
display: flex;
29+
.actions {
30+
align-items: flex-end;
31+
align-self: flex-end;
2232
flex-direction: column;
23-
gap: var(--go-ui-spacing-lg);
24-
25-
.insight-texts {
26-
display: grid;
27-
grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr));
28-
gap: var(--go-ui-spacing-md);
29-
}
33+
flex-grow: 1;
3034
}
3135
}

‎app/src/views/OperationalLearning/Sources/index.tsx‎

Lines changed: 24 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ import { CopyLineIcon } from '@ifrc-go/icons';
33
import {
44
Button,
55
Container,
6-
List,
76
Pager,
7+
RawList,
88
} from '@ifrc-go/ui';
99
import {
1010
useBooleanState,
@@ -23,7 +23,6 @@ import AllExtractsModal from './AllExtractsModal';
2323
import Emergency from './Emergency';
2424

2525
import i18n from './i18n.json';
26-
import styles from './styles.module.css';
2726

2827
// FIXME: move this to utils
2928
// NOTE: this may be slower on the long run
@@ -35,17 +34,19 @@ export function isChildNull(children: any) {
3534
type AppealDocumentResponse = GoApiResponse<'/api/v2/appeal_document/'>;
3635
type AppealDocument = NonNullable<AppealDocumentResponse['results']>[number];
3736

38-
type Props = {
37+
const PAGE_SIZE = 10;
38+
39+
interface Props {
40+
className?: string;
3941
summaryType: 'sector' | 'component' | 'insight';
4042
summaryId: number;
4143
}
4244

43-
const PAGE_SIZE = 10;
44-
4545
function Sources(props: Props) {
4646
const {
4747
summaryId,
4848
summaryType,
49+
className,
4950
} = props;
5051

5152
const strings = useTranslation(i18n);
@@ -99,30 +100,31 @@ function Sources(props: Props) {
99100

100101
return (
101102
<Container
102-
className={styles.sources}
103+
className={className}
103104
footerContent={isChildNull(pager) ? undefined : pager}
104-
childrenContainerClassName={styles.content}
105+
contentViewType="vertical"
106+
footerIcons={(
107+
<Button
108+
name="viewAll"
109+
variant="secondary"
110+
icons={<CopyLineIcon />}
111+
onClick={setShowExtractsModalTrue}
112+
>
113+
{strings.viewAllExtracts}
114+
</Button>
115+
)}
116+
emptyMessage={strings.noSources}
117+
errored={isDefined(appealDocumentError)}
118+
pending={appealDocumentPending}
119+
filtered={false}
120+
compactMessage
105121
>
106-
<List
107-
className={styles.appealList}
122+
<RawList
108123
data={appealDocumentResponse?.results}
109124
renderer={Emergency}
110125
keySelector={numericIdSelector}
111126
rendererParams={appealRendererParams}
112-
emptyMessage={strings.noSources}
113-
errored={isDefined(appealDocumentError)}
114-
pending={appealDocumentPending}
115-
filtered={false}
116-
compact
117127
/>
118-
<Button
119-
name="viewAll"
120-
variant="secondary"
121-
icons={<CopyLineIcon />}
122-
onClick={setShowExtractsModalTrue}
123-
>
124-
{strings.viewAllExtracts}
125-
</Button>
126128
{showExtractsModal && (
127129
<AllExtractsModal
128130
summaryType={summaryType}

‎app/src/views/OperationalLearning/Sources/styles.module.css‎

Lines changed: 0 additions & 16 deletions
This file was deleted.

0 commit comments

Comments
 (0)