Skip to content

Commit a19c2f1

Browse files
committed
frontend: fix nouncheckedindexedaccess in template literals
Most errors are due to CSS modules which can be of type string or undefined. Fixed most of those by type casting as string.
1 parent 98b7830 commit a19c2f1

File tree

60 files changed

+303
-148
lines changed

Some content is hidden

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

60 files changed

+303
-148
lines changed

frontends/web/src/app.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -108,7 +108,7 @@ export const App = () => {
108108
deviceIDs.length === 1
109109
&& currentURL === '/settings/no-device-connected'
110110
) {
111-
navigate(`/settings/device-settings/${deviceIDs[0]}`);
111+
navigate(`/settings/device-settings/${deviceIDs[0] as string}`);
112112
return;
113113
}
114114
// if on an account that isn't registered route to /
@@ -159,7 +159,7 @@ export const App = () => {
159159
if (firstNewDevice) {
160160
const productName = devices[firstNewDevice];
161161
if (productName === 'bitbox' || productName === 'bitbox02-bootloader') {
162-
navigate(`settings/device-settings/${newDeviceIDList[0]}`);
162+
navigate(`settings/device-settings/${newDeviceIDList[0] as string}`);
163163
return;
164164
}
165165
}
@@ -191,7 +191,10 @@ export const App = () => {
191191
accounts={activeAccounts}
192192
devices={devices}
193193
/>
194-
<div className={`${styles.appContent} ${showBottomNavigation ? styles.hasBottomNavigation : ''}`}>
194+
<div className={`
195+
${styles.appContent || ''}
196+
${showBottomNavigation && styles.hasBottomNavigation || ''}
197+
`}>
195198
<WCSigningRequest />
196199
<Aopp />
197200
<KeystoreConnectPrompt />

frontends/web/src/components/actionable-item/actionable-item.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,14 +38,14 @@ export const ActionableItem = ({
3838
return (
3939
<>
4040
{notButton ? (
41-
<div className={`${styles.container} ${className}`}>
41+
<div className={`${styles.container || ''} ${className}`}>
4242
{children}
4343
{icon && icon}
4444
</div>
4545
) : (
4646
<button
4747
type="button"
48-
className={`${styles.container} ${styles.isButton} ${className}`}
48+
className={`${styles.container || ''} ${styles.isButton || ''} ${className}`}
4949
onClick={onClick}>
5050
{children}
5151
{icon ? icon : (

frontends/web/src/components/amount/amount-with-unit.tsx

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,10 @@ export const AmountWithUnit = ({
8383
);
8484
}
8585
return (
86-
<span className={ `${style.rates} ${!displayedAmount ? style.notAvailable : ''}`}>
86+
<span className={`
87+
${style.rates || ''}
88+
${!displayedAmount && style.notAvailable || ''}
89+
`.trim()}>
8790
{!!displayedAmount ? sign : ''}
8891
{formattedAmount}
8992
{' '}
@@ -98,7 +101,11 @@ type TAmountUnitProps = {
98101
}
99102

100103
export const AmountUnit = ({ rotateUnit, unit }: TAmountUnitProps) => {
101-
const classRototable = rotateUnit ? style.rotatable : '';
102-
const textStyle = `${style.unit} ${classRototable}`;
103-
return <span className={textStyle} onClick={rotateUnit}>{unit}</span>;
104+
const classRototable = rotateUnit ? (style.rotatable || '') : '';
105+
const textStyle = `${style.unit || ''} ${classRototable}`;
106+
return (
107+
<span className={textStyle} onClick={rotateUnit}>
108+
{unit}
109+
</span>
110+
);
104111
};

frontends/web/src/components/anchor/anchor.tsx

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,10 @@ export const A = ({
4949
}: TProps) => {
5050
return (
5151
<span
52-
className={`${runningInIOS() ? style.linkIos : style.link} ${className || ''}`}
52+
className={`
53+
${(runningInIOS() ? style.linkIos : style.link) || ''}
54+
${className || ''}
55+
`}
5356
title={props.title || href}
5457
onClick={(e: SyntheticEvent) => {
5558
e.preventDefault();

frontends/web/src/components/aopp/vasp.tsx

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -63,11 +63,14 @@ export const Vasp = ({
6363
);
6464
}
6565

66-
const logoClasses = prominent ? `${styles.logo} ${styles.prominent}` : styles.logo;
66+
const logoClasses = prominent ? `
67+
${styles.logo || ''}
68+
${styles.prominent || ''}
69+
` : styles.logo as string;
6770
return (
6871
<div>
6972
<img className={logoClasses} src={VASPLogoMap[knownVasp]} alt={knownVasp} />
70-
<p className={`${styles.hostname} ${styles.capitalized}`}>
73+
<p className={`${styles.hostname as string} ${styles.capitalized as string}`}>
7174
{knownVasp in VASPHostnameMap ? VASPHostnameMap[knownVasp] : knownVasp}
7275
</p>
7376
{withLogoText ? (<p>{withLogoText}</p>) : null}

frontends/web/src/components/badge/badge.tsx

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -36,9 +36,17 @@ export const Badge = ({
3636
const iconOnlyStyle = (children === undefined && icon) ? style.iconOnly : '';
3737
return (
3838
<span
39-
className={`${style.badge} ${style[type]} ${withChildrenStyle} ${iconOnlyStyle} ${className || ''}`}
39+
className={`
40+
${style.badge || ''}
41+
${style[type] || ''}
42+
${withChildrenStyle || ''}
43+
${iconOnlyStyle || ''}
44+
${className || ''}
45+
`}
4046
{...props}>
41-
{icon && style.badgeIcon && icon({ className: style.badgeIcon })}
47+
{icon && style.badgeIcon && icon({
48+
className: style.badgeIcon || ''
49+
})}
4250
{children}
4351
</span>
4452
);

frontends/web/src/components/banners/backup.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -58,12 +58,13 @@ export const BackupReminder = ({ keystore, accountsBalanceSummary }: BackupRemin
5858
const connectResult = await connectKeystore(keystore.rootFingerprint);
5959
if (connectResult.success) {
6060
const devices = await getDeviceList();
61-
if (Object.keys(devices).length === 0) {
61+
const firstDevice = Object.keys(devices)[0];
62+
if (!firstDevice) {
6263
// If no devices are connected, we cannot navigate to settings.
6364
// This shouldn't happen in theory, as the connectKeystore functions has succeeded.
6465
return;
6566
}
66-
const deviceSettingsURL = `/settings/device-settings/recovery-words/${Object.keys(devices)[0]}`;
67+
const deviceSettingsURL = `/settings/device-settings/recovery-words/${firstDevice}`;
6768
// Proceed to the setting screen if the keystore was connected.
6869
navigate(deviceSettingsURL);
6970
}

frontends/web/src/components/bottom-navigation/bottom-navigation.tsx

Lines changed: 13 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -43,14 +43,20 @@ export const BottomNavigation = ({ activeAccounts, devices }: Props) => {
4343
return (
4444
<div className={styles.container}>
4545
<Link
46-
className={`${styles.link} ${pathname.startsWith('/account-summary') ? styles.active : ''}`}
46+
className={`
47+
${styles.link || ''}
48+
${pathname.startsWith('/account-summary') && styles.active || ''}
49+
`}
4750
to="/account-summary"
4851
>
4952
<PortfolioIconSVG />
5053
{t('accountSummary.portfolio')}
5154
</Link>
5255
<Link
53-
className={`${styles.link} ${pathname.startsWith('/account/') || pathname.startsWith('/accounts/') ? styles.active : ''}`}
56+
className={`
57+
${styles.link || ''}
58+
${pathname.startsWith('/account/') || pathname.startsWith('/accounts/') ? (styles.active || '') : ''}
59+
`}
5460
to={
5561
onlyHasOneAccount && accountCode ?
5662
`/account/${accountCode}` :
@@ -62,7 +68,7 @@ export const BottomNavigation = ({ activeAccounts, devices }: Props) => {
6268
</Link>
6369
<Link
6470
className={`
65-
${styles.link as string}
71+
${styles.link || ''}
6672
${pathname.startsWith('/market/') && styles.active || ''}
6773
`}
6874
to="/market/info"
@@ -71,7 +77,10 @@ export const BottomNavigation = ({ activeAccounts, devices }: Props) => {
7177
{t('generic.buySell')}
7278
</Link>
7379
<Link
74-
className={`${styles.link} ${pathname.startsWith('/settings') || pathname.startsWith('/bitsurance/') ? styles.active : ''}`}
80+
className={`
81+
${styles.link || ''}
82+
${pathname.startsWith('/settings') || pathname.startsWith('/bitsurance/') ? (styles.active || '') : ''}
83+
`}
7584
to="/settings/more"
7685
>
7786
<MoreIconSVG />

frontends/web/src/components/contentwrapper/contentwrapper.tsx

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,11 @@ type TProps = {
2424

2525
export const ContentWrapper = (({ className = '', children }: TProps) => {
2626
return (
27-
<div className={`${className} ${style.contentWrapper}`}>{children}</div>
27+
<div className={`
28+
${className}
29+
${style.contentWrapper || ''}
30+
`}>
31+
{children}
32+
</div>
2833
);
2934
});

frontends/web/src/components/dialog/dialog.tsx

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -99,27 +99,27 @@ export const Dialog = ({
9999
}
100100

101101
const modalClass = `
102-
${style.modal as string}
102+
${style.modal || ''}
103103
${small && style.small || ''}
104104
${medium && style.medium || ''}
105105
${large && style.large || ''}
106106
${(status === 'open' || status === 'opening') && style.open || ''}
107107
`.trim();
108108

109109
const overlayClass = `
110-
${style.overlay as string}
110+
${style.overlay || ''}
111111
${(status === 'opening' || status === 'open') && style.activeOverlay || ''}
112112
${status === 'closing' && style.closingOverlay || ''}
113113
`.trim();
114114

115115
const headerClass = `
116-
${style.header}
117-
${centered && !onClose ? style.centered : ''}
116+
${style.header || ''}
117+
${centered && !onClose && style.centered || ''}
118118
`.trim();
119119

120120
const contentClass = `
121-
${style.contentContainer}
122-
${slim ? style.slim : ''}
121+
${style.contentContainer || ''}
122+
${slim && style.slim || ''}
123123
`.trim();
124124

125125
return (

0 commit comments

Comments
 (0)