Skip to content

Commit ca62b83

Browse files
kkafarkkafar
authored
chore: use label instead of title in example using react-navigation (#3329)
## Description react-navigation uses `label` instead of `title`. We need to keep this in sync in our example app otherwise the titles won't show up. ## Changes ## Test code and steps to reproduce Just run `BarButtonItems` example & enter `Plain button` screen. ## Checklist - [ ] Included code example that can be used to test this change - [ ] Ensured that CI passes
1 parent 9bb2409 commit ca62b83

File tree

1 file changed

+38
-38
lines changed

1 file changed

+38
-38
lines changed

‎apps/src/screens/BarButtonItems.tsx‎

Lines changed: 38 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,7 @@ export default function BarButtonItemsExample() {
9090
headerRightItems: () => [
9191
{
9292
type: "button",
93-
title: 'Info',
93+
label: 'Info',
9494
onPress: () => Alert.alert('Info pressed'),
9595
},
9696
],
@@ -108,7 +108,7 @@ export default function BarButtonItemsExample() {
108108
type: "imageSource",
109109
imageSource: require('../../assets/variableIcons/icon_fill.png')
110110
},
111-
title: "Title",
111+
label: "Title",
112112
onPress: () => Alert.alert('Icon pressed'),
113113
},
114114
],
@@ -126,7 +126,7 @@ export default function BarButtonItemsExample() {
126126
type: "sfSymbol",
127127
name: "square.and.arrow.up"
128128
},
129-
title: "Title",
129+
label: "Title",
130130
onPress: () => Alert.alert('Icon pressed'),
131131
},
132132
],
@@ -140,16 +140,16 @@ export default function BarButtonItemsExample() {
140140
headerRightItems: () => [
141141
{
142142
type: "menu",
143-
title: 'Menu',
143+
label: 'Menu',
144144
menu: {
145145
items: [
146146
{
147-
title: 'Option 1',
147+
label: 'Option 1',
148148
type: "action",
149149
onPress: () => Alert.alert('Option 1 pressed'),
150150
},
151151
{
152-
title: 'Option 2',
152+
label: 'Option 2',
153153
type: "action",
154154
onPress: () => Alert.alert('Option 2 pressed'),
155155
},
@@ -167,7 +167,7 @@ export default function BarButtonItemsExample() {
167167
headerRightItems: () => [
168168
{
169169
type: "button",
170-
title: 'Badge',
170+
label: 'Badge',
171171
badge: {
172172
value: '3',
173173
style: {
@@ -188,7 +188,7 @@ export default function BarButtonItemsExample() {
188188
headerRightItems: () => [
189189
{
190190
type: "button",
191-
title: 'Disabled',
191+
label: 'Disabled',
192192
disabled: true,
193193
onPress: () => Alert.alert('Should not fire'),
194194
},
@@ -203,7 +203,7 @@ export default function BarButtonItemsExample() {
203203
headerRightItems: () => [
204204
{
205205
type: "button",
206-
title: 'Purple',
206+
label: 'Purple',
207207
tintColor: 'purple',
208208
onPress: () => Alert.alert('Purple pressed'),
209209
},
@@ -218,7 +218,7 @@ export default function BarButtonItemsExample() {
218218
headerRightItems: () => [
219219
{
220220
type: "button",
221-
title: 'Prominent',
221+
label: 'Prominent',
222222
variant: 'prominent',
223223
tintColor: 'green',
224224
onPress: () => Alert.alert('Prominent pressed'),
@@ -234,8 +234,8 @@ export default function BarButtonItemsExample() {
234234
headerRightItems: () => [
235235
{
236236
type: "button",
237-
title: 'Styled',
238-
titleStyle: {
237+
label: 'Styled',
238+
labelStyle: {
239239
fontFamily: 'Georgia',
240240
fontSize: 18,
241241
fontWeight: 'bold',
@@ -254,28 +254,28 @@ export default function BarButtonItemsExample() {
254254
headerRightItems: () => [
255255
{
256256
type: "button",
257-
title: "Title",
257+
label: "Title",
258258
icon: { type: "imageSource", imageSource: require('../../assets/search_black.png') },
259259
onPress: () => Alert.alert('Icon with sharesBackground pressed'),
260260
sharesBackground: true,
261261
},
262262
{
263263
type: "button",
264-
title: "Title",
264+
label: "Title",
265265
icon: { type: "imageSource", imageSource: require('../../assets/search_black.png') },
266266
onPress: () => Alert.alert('Icon with sharesBackground pressed'),
267267
sharesBackground: true,
268268
},
269269
{
270270
type: "button",
271-
title: "Title",
271+
label: "Title",
272272
icon: { type: "imageSource", imageSource: require('../../assets/search_black.png') },
273273
onPress: () => Alert.alert('Icon with sharesBackground pressed'),
274274
sharesBackground: false,
275275
},
276276
{
277277
type: "button",
278-
title: "Title",
278+
label: "Title",
279279
icon: { type: "imageSource", imageSource: require('../../assets/search_black.png') },
280280
hidesSharedBackground: true,
281281
onPress: () => Alert.alert('Icon with sharesBackground false pressed'),
@@ -291,7 +291,7 @@ export default function BarButtonItemsExample() {
291291
headerRightItems: () => [
292292
{
293293
type: "button",
294-
title: 'Wide',
294+
label: 'Wide',
295295
width: 100,
296296
onPress: () => Alert.alert('Wide text button pressed'),
297297
},
@@ -306,7 +306,7 @@ export default function BarButtonItemsExample() {
306306
headerRightItems: () => [
307307
{
308308
type: "button",
309-
title: "Title",
309+
label: "Title",
310310
icon: { type: "imageSource", imageSource: require('../../assets/search_black.png') },
311311
onPress: () => Alert.alert('First icon pressed'),
312312
},
@@ -316,7 +316,7 @@ export default function BarButtonItemsExample() {
316316
},
317317
{
318318
type: "button",
319-
title: "Title",
319+
label: "Title",
320320
icon: { type: "imageSource", imageSource: require('../../assets/search_white.png') },
321321
onPress: () => Alert.alert('Second icon pressed'),
322322
},
@@ -332,12 +332,12 @@ export default function BarButtonItemsExample() {
332332
headerRightItems: () => [
333333
{
334334
type: "button",
335-
title: 'Tinted',
335+
label: 'Tinted',
336336
onPress: () => Alert.alert('Tinted pressed'),
337337
},
338338
{
339339
type: "button",
340-
title: "Title",
340+
label: "Title",
341341
icon: { type: "imageSource", imageSource: require('../../assets/search_black.png') },
342342
onPress: () => Alert.alert('Tinted icon pressed'),
343343
},
@@ -352,13 +352,13 @@ export default function BarButtonItemsExample() {
352352
headerRightItems: () => [
353353
{
354354
type: "button",
355-
title: 'Done',
355+
label: 'Done',
356356
variant: 'done',
357357
onPress: () => Alert.alert('Done text pressed'),
358358
},
359359
{
360360
type: "button",
361-
title: "DoneIcon",
361+
label: "DoneIcon",
362362
icon: { type: "imageSource", imageSource: require('../../assets/search_black.png') },
363363
variant: 'done',
364364
onPress: () => Alert.alert('Done icon pressed'),
@@ -374,12 +374,12 @@ export default function BarButtonItemsExample() {
374374
headerRightItems: () => [
375375
{
376376
type: "menu",
377-
title: 'Menu',
377+
label: 'Menu',
378378
menu: {
379-
title: 'Context menu',
379+
label: 'Context menu',
380380
items: [
381381
{
382-
title: 'Action 1',
382+
label: 'Action 1',
383383
icon: { type: "sfSymbol", name: 'star' },
384384
type: "action",
385385
state: 'on',
@@ -388,7 +388,7 @@ export default function BarButtonItemsExample() {
388388
onPress: () => Alert.alert('Action 1 pressed'),
389389
},
390390
{
391-
title: 'Action 2',
391+
label: 'Action 2',
392392
icon: { type: "sfSymbol", name: 'square.and.arrow.up' },
393393
type: "action",
394394
state: 'off',
@@ -397,12 +397,12 @@ export default function BarButtonItemsExample() {
397397
onPress: () => Alert.alert('Action 2 pressed'),
398398
},
399399
{
400-
title: 'Submenu',
400+
label: 'Submenu',
401401
icon: { type: "sfSymbol", name: "star" },
402402
type: 'submenu',
403403
items: [
404404
{
405-
title: 'Sub Action 1',
405+
label: 'Sub Action 1',
406406
state: 'mixed',
407407
type: 'action',
408408
onPress: () => Alert.alert('Sub Action 1 pressed'),
@@ -411,7 +411,7 @@ export default function BarButtonItemsExample() {
411411
discoverabilityLabel: 'Sub Action 1',
412412
},
413413
{
414-
title: 'Sub Action 2',
414+
label: 'Sub Action 2',
415415
type: 'action',
416416
onPress: () => Alert.alert('Sub Action 2 pressed'),
417417
},
@@ -438,7 +438,7 @@ export default function BarButtonItemsExample() {
438438
},
439439
{
440440
type: "button",
441-
title: "Native",
441+
label: "Native",
442442
onPress: () => Alert.alert('Native button pressed'),
443443
sharesBackground: true,
444444
},
@@ -464,7 +464,7 @@ export default function BarButtonItemsExample() {
464464
},
465465
{
466466
type: "button",
467-
title: "Native",
467+
label: "Native",
468468
onPress: () => Alert.alert('Native button pressed'),
469469
},
470470
],
@@ -476,7 +476,7 @@ export default function BarButtonItemsExample() {
476476
headerRightItems: () => [
477477
{
478478
type: "button",
479-
title: 'Button',
479+
label: 'Button',
480480
onPress: () => {
481481
navigation.navigate('IdentifierExample2');
482482
},
@@ -491,7 +491,7 @@ export default function BarButtonItemsExample() {
491491
headerRightItems: () => [
492492
{
493493
type: "button",
494-
title: 'Btn',
494+
label: 'Btn',
495495
onPress: () => Alert.alert('Button 1 pressed'),
496496
},
497497
],
@@ -503,22 +503,22 @@ export default function BarButtonItemsExample() {
503503
headerRightItems: () => [
504504
{
505505
type: "button",
506-
title: "Button 1",
506+
label: "Button 1",
507507
onPress: () => Alert.alert('Button 1 pressed'),
508508
},
509509
{
510510
type: "button",
511-
title: "Button 2",
511+
label: "Button 2",
512512
onPress: () => Alert.alert('Button 2 pressed'),
513513
},
514514
{
515515
type: "button",
516-
title: "Button 3",
516+
label: "Button 3",
517517
onPress: () => Alert.alert('Button 3 pressed'),
518518
},
519519
{
520520
type: "button",
521-
title: "Button 4",
521+
label: "Button 4",
522522
onPress: () => Alert.alert('Button 4 pressed'),
523523
},
524524
]

0 commit comments

Comments
 (0)