Skip to content

Commit cd949fc

Browse files
frozenheliumfrozenhelium
authored
Merge pull request #2112 from IFRCGo/fix/go-ui-updates
fix(ui): update go ui affected changes
2 parents 6b8cba4 + 6bc2fe6 commit cd949fc

47 files changed

Lines changed: 276 additions & 219 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.changeset/brown-banks-act.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 UI to accomodate GO UI changes

‎.changeset/few-buckets-obey.md‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
---
2+
"@ifrc-go/ui": patch
3+
---
4+
5+
Do minor improvements on some components
6+
7+
- Button: add default colorVariant according to the styleVariants
8+
- Description: add overflow wrap
9+
- ExpandableContainer: fix footer action rendering condition
10+
- Heading: update styling for level 6
11+
- InlineLayout: add a fallback fix for before, after component for go icons
12+
- ListView: fix responsiveness for sidebar layout on start
13+
- TabLayout: update styling for step tab
14+
- TabListLayout: update styling for step tab
15+
- ColumnShortcuts: update styling for action columns
16+
- TableActions: update styling to avoid shrink

‎app/src/components/DropdownMenuItem/index.tsx‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,6 @@ function DropdownMenuItem<NAME>(props: Props<NAME>) {
9999
// eslint-disable-next-line @typescript-eslint/no-unused-vars
100100
type: _,
101101
styleVariant = 'transparent',
102-
colorVariant = 'text',
103102
...otherProps
104103
} = remainingProps;
105104

@@ -108,7 +107,6 @@ function DropdownMenuItem<NAME>(props: Props<NAME>) {
108107
// eslint-disable-next-line react/jsx-props-no-spreading
109108
{...otherProps}
110109
styleVariant={styleVariant}
111-
colorVariant={colorVariant}
112110
onClick={handleButtonClick}
113111
withFullWidth={!withoutFullWidth}
114112
/>
@@ -120,7 +118,6 @@ function DropdownMenuItem<NAME>(props: Props<NAME>) {
120118
// eslint-disable-next-line @typescript-eslint/no-unused-vars
121119
type: _,
122120
styleVariant = 'transparent',
123-
colorVariant = 'text',
124121
...otherProps
125122
} = remainingProps;
126123

@@ -129,7 +126,6 @@ function DropdownMenuItem<NAME>(props: Props<NAME>) {
129126
// eslint-disable-next-line react/jsx-props-no-spreading
130127
{...otherProps}
131128
styleVariant={styleVariant}
132-
colorVariant={colorVariant}
133129
onClick={handleButtonClick}
134130
withFullWidth={!withoutFullWidth}
135131
/>

‎app/src/components/MapPopup/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,6 @@ function MapPopup(props: Props) {
6161
className={styles.closeButton}
6262
name={undefined}
6363
styleVariant="action"
64-
colorVariant="text"
6564
onClick={onCloseButtonClick}
6665
title={strings.messagePopupClose}
6766
>

‎app/src/components/Navbar/CountryDropdown/index.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -151,6 +151,7 @@ function CountryDropdown() {
151151
filtered={isTruthyString(countrySearch)}
152152
className={styles.regionDetailContent}
153153
withHeaderBorder
154+
withContentOverflow
154155
heading={(
155156
<DropdownMenuItem
156157
type="link"

‎app/src/components/Navbar/LanguageDropdown/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,6 @@ function LanguageDropdown() {
5656
<DropdownMenu
5757
label={languageNameMapEn[currentLanguage]}
5858
labelStyleVariant="action"
59-
labelColorVariant="text"
6059
persistent
6160
labelSpacing="sm"
6261
>

‎app/src/components/Navbar/index.tsx‎

Lines changed: 11 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -226,8 +226,8 @@ function Navbar(props: Props) {
226226
<DropdownMenuItem
227227
type="link"
228228
to="perProcessLayout"
229-
colorVariant="secondary"
230-
styleVariant="outline"
229+
colorVariant="primary"
230+
styleVariant="action"
231231
withoutFullWidth
232232
>
233233
{strings.userMenuStartPER}
@@ -301,12 +301,13 @@ function Navbar(props: Props) {
301301
<ListView
302302
layout="block"
303303
spacing="sm"
304+
withSpacingOpticalCorrection
304305
>
305306
<DropdownMenuItem
306307
type="link"
307308
to="fieldReportFormNew"
308309
colorVariant="primary"
309-
styleVariant="outline"
310+
styleVariant="action"
310311
withoutFullWidth
311312
>
312313
{strings.userMenuCreateFieldReport}
@@ -315,7 +316,7 @@ function Navbar(props: Props) {
315316
type="link"
316317
to="newThreeWActivity"
317318
colorVariant="primary"
318-
styleVariant="outline"
319+
styleVariant="action"
319320
withoutFullWidth
320321
>
321322
{strings.userMenuSubmit3WActivity}
@@ -334,12 +335,13 @@ function Navbar(props: Props) {
334335
<ListView
335336
layout="block"
336337
spacing="sm"
338+
withSpacingOpticalCorrection
337339
>
338340
<DropdownMenuItem
339341
type="link"
340342
to="fieldReportFormNew"
341-
colorVariant="secondary"
342-
styleVariant="outline"
343+
colorVariant="primary"
344+
styleVariant="action"
343345
state={{ earlyWarning: true }}
344346
withoutFullWidth
345347
>
@@ -348,8 +350,8 @@ function Navbar(props: Props) {
348350
<DropdownMenuItem
349351
type="link"
350352
to="flashUpdateFormNew"
351-
colorVariant="secondary"
352-
styleVariant="outline"
353+
colorVariant="primary"
354+
styleVariant="action"
353355
withoutFullWidth
354356
>
355357
{strings.userMenuCreateFlashUpdate}
@@ -376,7 +378,7 @@ function Navbar(props: Props) {
376378
<DropdownMenuItem
377379
type="link"
378380
to="newDrefApplicationForm"
379-
styleVariant="outline"
381+
styleVariant="action"
380382
colorVariant="primary"
381383
withoutFullWidth
382384
>

‎app/src/components/NavigationTab/index.tsx‎

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -32,11 +32,10 @@ import { type WrappedRoutes } from '../../App/routes';
3232

3333
import styles from './styles.module.css';
3434

35-
type CommonLinkProps = Omit<TabLayoutProps, 'styleVariant' | 'colorVariant'> & {
35+
type CommonProps = Omit<TabLayoutProps, 'styleVariant' | 'colorVariant'> & {
3636
withEllipsizedContent?: boolean;
3737
withLinkIcon?: boolean;
3838
withUnderline?: boolean;
39-
stepCompleted?: boolean;
4039
};
4140

4241
interface InternalLinkProps extends Omit<RouterLinkProps, 'to'> {
@@ -64,7 +63,7 @@ interface ExternalLinkProps extends Omit<React.AnchorHTMLAttributes<HTMLAnchorEl
6463
parentRoute?: never;
6564
}
6665

67-
type Props = CommonLinkProps & (InternalLinkProps | ExternalLinkProps);
66+
type Props = CommonProps & (InternalLinkProps | ExternalLinkProps);
6867

6968
function NavigationTab(props: Props) {
7069
const {
@@ -77,6 +76,8 @@ function NavigationTab(props: Props) {
7776
after,
7877
disabled: disabledFromProps,
7978
stepCompleted,
79+
isFirstStep,
80+
isLastStep,
8081

8182
external,
8283
to,
@@ -197,6 +198,8 @@ function NavigationTab(props: Props) {
197198
</>
198199
)}
199200
stepCompleted={stepCompleted}
201+
isFirstStep={isFirstStep}
202+
isLastStep={isLastStep}
200203
>
201204
{children}
202205
</TabLayout>

‎app/src/components/domain/DrefShareModal/index.tsx‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -110,7 +110,6 @@ function DrefShareModal(props: Props) {
110110
<Button
111111
name={null}
112112
onClick={triggerUpdate}
113-
colorVariant="primary"
114113
>
115114
{strings.drefShareUpdate}
116115
</Button>

‎app/src/views/AccountDetails/EditAccountInfo/index.tsx‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -213,7 +213,6 @@ function EditAccountInfo(props: Props) {
213213
<ListView spacing="sm">
214214
<Button
215215
name={undefined}
216-
colorVariant="primary"
217216
onClick={handleModalCloseButton}
218217
>
219218
{strings.editProfileCancelButtonLabel}
@@ -222,7 +221,6 @@ function EditAccountInfo(props: Props) {
222221
name={undefined}
223222
onClick={handleFormSubmit}
224223
disabled={updateAccountPending}
225-
colorVariant="primary"
226224
styleVariant="filled"
227225
>
228226
{strings.editProfileConfirmButtonLabel}

0 commit comments

Comments
 (0)