@@ -13,6 +13,7 @@ import {
1313import { IconButton , Stack } from '@primer/react' ;
1414
1515import { APPLICATION } from '../../shared/constants' ;
16+
1617import { AppContext } from '../context/App' ;
1718import { quitApp } from '../utils/comms' ;
1819import { Constants } from '../utils/constants' ;
@@ -72,129 +73,129 @@ export const Sidebar: FC = () => {
7273
7374 return (
7475 < Stack
76+ className = "fixed left-sidebar -ml-sidebar w-sidebar h-full bg-gitify-sidebar text-white"
7577 direction = "vertical"
7678 justify = "space-between"
77- className = "fixed left-sidebar -ml-sidebar w-sidebar h-full bg-gitify-sidebar text-white"
7879 >
7980 < Stack
80- direction = "vertical"
8181 align = "center"
82+ direction = "vertical"
8283 gap = "condensed"
8384 padding = "normal"
8485 >
8586 < IconButton
86- icon = { LogoIcon }
8787 aria-label = { APPLICATION . NAME }
88+ data-testid = "sidebar-home"
8889 description = "Home"
89- unsafeDisableTooltip = { false }
90+ icon = { LogoIcon }
91+ onClick = { ( ) => navigate ( '/' , { replace : true } ) }
9092 size = "small"
91- variant = "invisible"
9293 tooltipDirection = "e"
93- onClick = { ( ) => navigate ( '/' , { replace : true } ) }
94- data-testid = "sidebar-home "
94+ unsafeDisableTooltip = { false }
95+ variant = "invisible "
9596 />
9697
9798 < IconButton
98- icon = { BellIcon }
9999 aria-label = "Notifications"
100+ data-testid = "sidebar-notifications"
100101 description = { `${ notificationsCount } unread notifications` }
101- unsafeDisableTooltip = { false }
102- size = "small"
103- variant = { notificationsCount > 0 ? 'primary' : 'invisible' }
104- tooltipDirection = "e"
102+ icon = { BellIcon }
105103 onClick = { ( ) => openGitHubNotifications ( primaryAccountHostname ) }
106- data-testid = "sidebar-notifications "
104+ size = "small "
107105 sx = { sidebarButtonStyle }
106+ tooltipDirection = "e"
107+ unsafeDisableTooltip = { false }
108+ variant = { notificationsCount > 0 ? 'primary' : 'invisible' }
108109 />
109110
110111 { isLoggedIn && (
111112 < IconButton
112- icon = { FilterIcon }
113113 aria-label = "Filters"
114+ data-testid = "sidebar-filter-notifications"
114115 description = "Filter notifications"
115- unsafeDisableTooltip = { false }
116- size = "small"
117- variant = { hasAnyFiltersSet ( settings ) ? 'primary' : 'invisible' }
118- tooltipDirection = "e"
116+ icon = { FilterIcon }
119117 onClick = { ( ) => toggleFilters ( ) }
120- data-testid = "sidebar-filter-notifications "
118+ size = "small "
121119 sx = { sidebarButtonStyle }
120+ tooltipDirection = "e"
121+ unsafeDisableTooltip = { false }
122+ variant = { hasAnyFiltersSet ( settings ) ? 'primary' : 'invisible' }
122123 />
123124 ) }
124125
125126 < IconButton
126- icon = { IssueOpenedIcon }
127127 aria-label = "My issues"
128- unsafeDisableTooltip = { false }
129- size = "small"
130- variant = "invisible"
131- tooltipDirection = "e"
132- onClick = { ( ) => openGitHubIssues ( primaryAccountHostname ) }
133128 data-testid = "sidebar-my-issues"
129+ icon = { IssueOpenedIcon }
130+ onClick = { ( ) => openGitHubIssues ( primaryAccountHostname ) }
131+ size = "small"
134132 sx = { sidebarButtonStyle }
133+ tooltipDirection = "e"
134+ unsafeDisableTooltip = { false }
135+ variant = "invisible"
135136 />
136137
137138 < IconButton
138- icon = { GitPullRequestIcon }
139139 aria-label = "My pull requests"
140- unsafeDisableTooltip = { false }
141- size = "small"
142- variant = "invisible"
143- tooltipDirection = "e"
144- onClick = { ( ) => openGitHubPulls ( primaryAccountHostname ) }
145140 data-testid = "sidebar-my-pull-requests"
141+ icon = { GitPullRequestIcon }
142+ onClick = { ( ) => openGitHubPulls ( primaryAccountHostname ) }
143+ size = "small"
146144 sx = { sidebarButtonStyle }
145+ tooltipDirection = "e"
146+ unsafeDisableTooltip = { false }
147+ variant = "invisible"
147148 />
148149 </ Stack >
149150
150151 < Stack
151- direction = "vertical"
152152 align = "center"
153+ direction = "vertical"
153154 gap = "condensed"
154155 padding = "normal"
155156 >
156157 { isLoggedIn && (
157158 < >
158159 < IconButton
159- icon = { SyncIcon }
160160 aria-label = "Refresh"
161+ data-testid = "sidebar-refresh"
161162 description = "Refresh notifications"
162- unsafeDisableTooltip = { false }
163- size = "small"
164- variant = "invisible"
165- tooltipDirection = "e"
166- loading = { status === 'loading' }
167163 disabled = { status === 'loading' }
164+ icon = { SyncIcon }
165+ loading = { status === 'loading' }
168166 onClick = { ( ) => refreshNotifications ( ) }
169- data-testid = "sidebar-refresh "
167+ size = "small "
170168 sx = { sidebarButtonStyle }
169+ tooltipDirection = "e"
170+ unsafeDisableTooltip = { false }
171+ variant = "invisible"
171172 />
172173
173174 < IconButton
174- icon = { GearIcon }
175175 aria-label = "Settings"
176- unsafeDisableTooltip = { false }
177- size = "small"
178- variant = "invisible"
179- tooltipDirection = "e"
180- onClick = { ( ) => toggleSettings ( ) }
181176 data-testid = "sidebar-settings"
177+ icon = { GearIcon }
178+ onClick = { ( ) => toggleSettings ( ) }
179+ size = "small"
182180 sx = { sidebarButtonStyle }
181+ tooltipDirection = "e"
182+ unsafeDisableTooltip = { false }
183+ variant = "invisible"
183184 />
184185 </ >
185186 ) }
186187
187188 { ! isLoggedIn && (
188189 < IconButton
189- icon = { XCircleIcon }
190190 aria-label = { `Quit ${ APPLICATION . NAME } ` }
191- unsafeDisableTooltip = { false }
192- size = "small"
193- variant = "invisible"
194- tooltipDirection = "e"
195- onClick = { ( ) => quitApp ( ) }
196191 data-testid = "sidebar-quit"
192+ icon = { XCircleIcon }
193+ onClick = { ( ) => quitApp ( ) }
194+ size = "small"
197195 sx = { sidebarButtonStyle }
196+ tooltipDirection = "e"
197+ unsafeDisableTooltip = { false }
198+ variant = "invisible"
198199 />
199200 ) }
200201 </ Stack >
0 commit comments