@@ -53,7 +53,7 @@ const GetAccountLink = ({
53
53
const { pathname } = useLocation ( ) ;
54
54
const active = ( pathname === `/account/${ code } ` ) || ( pathname . startsWith ( `/account/${ code } /` ) ) ;
55
55
return (
56
- < div key = { code } className = { style . sidebarItem } >
56
+ < div className = { style . sidebarItem } >
57
57
< Link
58
58
className = { active ? style . sidebarActive : '' }
59
59
to = { `/account/${ code } ` }
@@ -154,9 +154,9 @@ const Sidebar = ({
154
154
155
155
return (
156
156
< div className = { [ style . sidebarContainer , hidden ? style . forceHide : '' ] . join ( ' ' ) } >
157
- < div className = { [ style . sidebarOverlay , activeSidebar ? style . active : '' ] . join ( ' ' ) } onClick = { toggleSidebar } > </ div >
157
+ < div key = "overlay" className = { [ style . sidebarOverlay , activeSidebar ? style . active : '' ] . join ( ' ' ) } onClick = { toggleSidebar } > </ div >
158
158
< nav className = { [ style . sidebar , activeSidebar ? style . forceShow : '' ] . join ( ' ' ) } >
159
- < div className = { style . sidebarLogoContainer } >
159
+ < div key = "app-logo" className = { style . sidebarLogoContainer } >
160
160
< Link
161
161
to = { accounts . length ? '/account-summary' : '/' }
162
162
onClick = { handleSidebarItemClick } >
@@ -168,7 +168,7 @@ const Sidebar = ({
168
168
</ div >
169
169
170
170
{ accounts . length ? (
171
- < div className = { `${ style . sidebarItem } ${ style . sidebarPortfolio } ` } >
171
+ < div key = "account-summary" className = { `${ style . sidebarItem } ${ style . sidebarPortfolio } ` } >
172
172
< NavLink
173
173
className = { ( { isActive } ) => isActive ? style . sidebarActive : '' }
174
174
to = { '/account-summary' }
@@ -183,7 +183,7 @@ const Sidebar = ({
183
183
) : null }
184
184
185
185
{ accountsByKeystore . map ( keystore => (
186
- < React . Fragment key = { keystore . keystore . rootFingerprint } >
186
+ < div key = { ` keystore- ${ keystore . keystore . rootFingerprint } ` } >
187
187
< div className = { style . sidebarHeaderContainer } >
188
188
< span
189
189
className = { style . sidebarHeader }
@@ -204,11 +204,13 @@ const Sidebar = ({
204
204
title = { t ( 'device.keystoreConnected' ) } />
205
205
</ span >
206
206
</ div >
207
- { keystore . accounts . map ( acc => < GetAccountLink key = { acc . code } { ...acc } handleSidebarItemClick = { handleSidebarItemClick } /> ) }
208
- </ React . Fragment >
207
+ { keystore . accounts . map ( acc => (
208
+ < GetAccountLink key = { `account-${ acc . code } ` } { ...acc } handleSidebarItemClick = { handleSidebarItemClick } />
209
+ ) ) }
210
+ </ div >
209
211
) ) }
210
212
211
- < div className = { [ style . sidebarHeaderContainer , style . end ] . join ( ' ' ) } > </ div >
213
+ < div key = "services" className = { [ style . sidebarHeaderContainer , style . end ] . join ( ' ' ) } > </ div >
212
214
{ accounts . length ? (
213
215
< >
214
216
< div key = "buy" className = { style . sidebarItem } >
@@ -237,7 +239,7 @@ const Sidebar = ({
237
239
</ >
238
240
) : null }
239
241
240
- < div key = "settings-new " className = { style . sidebarItem } >
242
+ < div key = "settings" className = { style . sidebarItem } >
241
243
< NavLink
242
244
className = { ( { isActive } ) => isActive ? style . sidebarActive : '' }
243
245
to = { '/settings' }
0 commit comments