@@ -167,95 +167,97 @@ export const AppearanceSettings: FC = () => {
167
167
tooltip = {
168
168
< Stack direction = "vertical" gap = "condensed" >
169
169
< Text >
170
- Enrich notifications with author or last commenter profile
171
- information, state and GitHub-like colors.
170
+ Enrich notifications with detailed user and state information.
171
+ </ Text >
172
+ < Text >
173
+ You may also choose to display{ ' ' }
174
+ < Text as = "strong" > notification metric pills</ Text > or{ ' ' }
175
+ < Text as = "strong" > notification numbers</ Text > .
172
176
</ Text >
173
177
< Text className = "text-gitify-caution" >
174
178
⚠️ Users with a large number of unread notifications < i > may</ i > { ' ' }
175
- experience rate limiting under certain circumstances. Disable
176
- this setting if you experience this.
179
+ experience rate limiting under certain circumstances. Please
180
+ disable this setting if you experience this.
177
181
</ Text >
178
182
</ Stack >
179
183
}
180
184
/>
181
185
182
- < Checkbox
183
- name = "showPills"
184
- label = "Show notification metric pills"
185
- checked = { settings . showPills }
186
- onChange = { ( evt ) => updateSetting ( 'showPills' , evt . target . checked ) }
187
- tooltip = {
188
- < Box >
189
- < Text > Show notification metric pills for:</ Text >
190
- < Box className = "pl-4" >
191
- < ul >
192
- < li className = "flex items-center gap-1" >
193
- < IssueClosedIcon size = { Size . SMALL } />
194
- linked issues
195
- </ li >
196
- < li className = "flex items-center gap-1" >
197
- < CheckIcon size = { Size . SMALL } />
198
- pr reviews
199
- </ li >
200
- < li className = "flex items-center gap-1" >
201
- < CommentIcon size = { Size . SMALL } />
202
- comments
203
- </ li >
204
- < li className = "flex items-center gap-1" >
205
- < TagIcon size = { Size . SMALL } />
206
- labels
207
- </ li >
208
- < li className = "flex items-center gap-1" >
209
- < MilestoneIcon size = { Size . SMALL } />
210
- milestones
211
- </ li >
212
- </ ul >
213
- </ Box >
214
- </ Box >
215
- }
216
- />
186
+ < Box className = "pl-6" hidden = { ! settings . detailedNotifications } >
187
+ < Stack direction = "vertical" gap = "condensed" >
188
+ < Checkbox
189
+ name = "showPills"
190
+ label = "Show notification metric pills"
191
+ checked = { settings . showPills }
192
+ onChange = { ( evt ) => updateSetting ( 'showPills' , evt . target . checked ) }
193
+ tooltip = {
194
+ < Stack direction = "vertical" gap = "condensed" >
195
+ < Text > Show notification metric pills for:</ Text >
196
+ < Box className = "pl-4" >
197
+ < ul >
198
+ < li className = "flex items-center gap-1" >
199
+ < IssueClosedIcon size = { Size . SMALL } />
200
+ linked issues
201
+ </ li >
202
+ < li className = "flex items-center gap-1" >
203
+ < CheckIcon size = { Size . SMALL } />
204
+ pr reviews
205
+ </ li >
206
+ < li className = "flex items-center gap-1" >
207
+ < CommentIcon size = { Size . SMALL } />
208
+ comments
209
+ </ li >
210
+ < li className = "flex items-center gap-1" >
211
+ < TagIcon size = { Size . SMALL } />
212
+ labels
213
+ </ li >
214
+ < li className = "flex items-center gap-1" >
215
+ < MilestoneIcon size = { Size . SMALL } />
216
+ milestones
217
+ </ li >
218
+ </ ul >
219
+ </ Box >
220
+ </ Stack >
221
+ }
222
+ />
217
223
218
- < Checkbox
219
- name = "showNumber"
220
- label = "Show number"
221
- checked = { settings . detailedNotifications && settings . showNumber }
222
- onChange = { ( evt ) =>
223
- settings . detailedNotifications &&
224
- updateSetting ( 'showNumber' , evt . target . checked )
225
- }
226
- disabled = { ! settings . detailedNotifications }
227
- tooltip = {
228
- < Stack direction = "vertical" gap = "condensed" >
229
- < Text > Show GitHub number for:</ Text >
230
- < Box className = "pl-4" >
231
- < ul >
232
- < li >
233
- < Stack direction = "horizontal" gap = "condensed" >
234
- < CommentIcon size = { Size . SMALL } />
235
- Discussion
236
- </ Stack >
237
- </ li >
238
- < li >
239
- < Stack direction = "horizontal" gap = "condensed" >
240
- < IssueClosedIcon size = { Size . SMALL } />
241
- Issue
242
- </ Stack >
243
- </ li >
244
- < li >
245
- < Stack direction = "horizontal" gap = "condensed" >
246
- < GitPullRequestIcon size = { Size . SMALL } />
247
- Pull Request
248
- </ Stack >
249
- </ li >
250
- </ ul >
251
- </ Box >
252
- < Text className = "text-gitify-caution" >
253
- ⚠️ This setting requires{ ' ' }
254
- < Text as = "strong" > Detailed Notifications</ Text > to be enabled.
255
- </ Text >
256
- </ Stack >
257
- }
258
- />
224
+ < Checkbox
225
+ name = "showNumber"
226
+ label = "Show notification number"
227
+ checked = { settings . showNumber }
228
+ onChange = { ( evt ) =>
229
+ updateSetting ( 'showNumber' , evt . target . checked )
230
+ }
231
+ tooltip = {
232
+ < Stack direction = "vertical" gap = "condensed" >
233
+ < Text > Show GitHub number for:</ Text >
234
+ < Box className = "pl-4" >
235
+ < ul >
236
+ < li >
237
+ < Stack direction = "horizontal" gap = "condensed" >
238
+ < CommentIcon size = { Size . SMALL } />
239
+ Discussion
240
+ </ Stack >
241
+ </ li >
242
+ < li >
243
+ < Stack direction = "horizontal" gap = "condensed" >
244
+ < IssueClosedIcon size = { Size . SMALL } />
245
+ Issue
246
+ </ Stack >
247
+ </ li >
248
+ < li >
249
+ < Stack direction = "horizontal" gap = "condensed" >
250
+ < GitPullRequestIcon size = { Size . SMALL } />
251
+ Pull Request
252
+ </ Stack >
253
+ </ li >
254
+ </ ul >
255
+ </ Box >
256
+ </ Stack >
257
+ }
258
+ />
259
+ </ Stack >
260
+ </ Box >
259
261
260
262
< Checkbox
261
263
name = "showAccountHeader"
0 commit comments