Skip to content

Commit f047f95

Browse files
kkafarkkafar
authored
chore: format code in test examples (#1812)
## Description Working with test examples is stressful for eyes as ESlint is making my screen red. ## Changes "Fixed all autofixable problems" in test examples. Essentially I've adjusted eslint & prettier configs and run `prettier . --write` in examples. ## Checklist - [ ] Ensured that CI passes
1 parent 15e945a commit f047f95

File tree

188 files changed

+2844
-2212
lines changed

Some content is hidden

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

188 files changed

+2844
-2212
lines changed

‎FabricTestExample/.eslintrc.js

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,12 @@
11
module.exports = {
22
root: true,
33
extends: '@react-native',
4+
overrides: [
5+
{
6+
files: ['*.tsx', '*.js'],
7+
rules: {
8+
'react-native/no-inline-styles': 'off',
9+
},
10+
},
11+
],
412
};

‎FabricTestExample/.prettierrc.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
module.exports = {
22
arrowParens: 'avoid',
33
bracketSameLine: true,
4-
bracketSpacing: false,
4+
bracketSpacing: true,
55
singleQuote: true,
66
trailingComma: 'all',
77
};

‎FabricTestExample/App.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/* eslint-disable no-unused-vars */
22
import React from 'react';
33

4-
import {enableFreeze} from 'react-native-screens';
4+
import { enableFreeze } from 'react-native-screens';
55

66
import Test42 from './src/Test42';
77
import Test111 from './src/Test111';

‎FabricTestExample/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22
* @format
33
*/
44

5-
import {AppRegistry} from 'react-native';
5+
import { AppRegistry } from 'react-native';
66
import App from './App';
7-
import {name as appName} from './app.json';
7+
import { name as appName } from './app.json';
88

99
AppRegistry.registerComponent(appName, () => App);

‎FabricTestExample/metro.config.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,7 @@ module.exports = {
2424
resolver: {
2525
blacklistRE: exclusionList(
2626
modules.map(
27-
(m) =>
28-
new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`),
27+
m => new RegExp(`^${escape(path.join(root, 'node_modules', m))}\\/.*$`),
2928
),
3029
),
3130

‎FabricTestExample/src/Test1017.tsx

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
1-
import {NavigationContainer, RouteProp} from '@react-navigation/native';
1+
import { NavigationContainer, RouteProp } from '@react-navigation/native';
22
import {
33
createStackNavigator,
44
StackNavigationProp,
55
TransitionPresets,
66
} from '@react-navigation/stack';
77
import React from 'react';
8-
import {Alert, LogBox} from 'react-native';
9-
import {StyleSheet, Text, View, FlatList, Pressable} from 'react-native';
10-
import {ScrollView} from 'react-native-gesture-handler';
8+
import { Alert, LogBox } from 'react-native';
9+
import { StyleSheet, Text, View, FlatList, Pressable } from 'react-native';
10+
import { ScrollView } from 'react-native-gesture-handler';
1111

1212
import {
1313
Header,
@@ -36,15 +36,15 @@ LogBox.ignoreLogs([
3636

3737
const Stack = createStackNavigator();
3838

39-
const dataset = Array.from<unknown, DataItem>({length: 100}, (_, i) => ({
39+
const dataset = Array.from<unknown, DataItem>({ length: 100 }, (_, i) => ({
4040
title: `Title ${i}`,
4141
value: i,
4242
}));
4343

4444
const Screen: React.FC<{
4545
route: RouteProp<RootStackParamList, any>;
4646
navigation: StackNavigationProp<RootStackParamList, any>;
47-
}> = ({route, navigation}) => {
47+
}> = ({ route, navigation }) => {
4848
for (let i = 0; i < 10 ** 3; i++) {}
4949
const isSecondScreen = route.name === Route.SecondScreen;
5050

@@ -58,7 +58,7 @@ const Screen: React.FC<{
5858

5959
const renderItem = (item: DataItem) => (
6060
<Pressable
61-
android_ripple={{color: Colors.light}}
61+
android_ripple={{ color: Colors.light }}
6262
style={styles.listItemContainer}
6363
onPress={handleItemPress(item)}>
6464
<View style={styles.listItemContentWrapper}>
@@ -75,8 +75,8 @@ const Screen: React.FC<{
7575
<ScrollView>
7676
<FlatList
7777
data={dataset}
78-
keyExtractor={(item) => item.value.toString()}
79-
renderItem={({item}) => renderItem(item)}
78+
keyExtractor={item => item.value.toString()}
79+
renderItem={({ item }) => renderItem(item)}
8080
ItemSeparatorComponent={() => <View style={styles.separator} />}
8181
ListHeaderComponent={!isSecondScreen && Header}
8282
ListHeaderComponentStyle={styles.headerWrapper}
@@ -91,16 +91,17 @@ const Screen: React.FC<{
9191
const App: React.FC = () => {
9292
return (
9393
<NavigationContainer>
94-
<Stack.Navigator screenOptions={{...TransitionPresets.SlideFromRightIOS}}>
94+
<Stack.Navigator
95+
screenOptions={{ ...TransitionPresets.SlideFromRightIOS }}>
9596
<Stack.Screen
9697
name={Route.FirstScreen}
9798
component={Screen}
98-
options={{title: 'Sample List'}}
99+
options={{ title: 'Sample List' }}
99100
/>
100101
<Stack.Screen
101102
name={Route.SecondScreen}
102103
component={Screen}
103-
options={{title: 'Sample List 2'}}
104+
options={{ title: 'Sample List 2' }}
104105
/>
105106
</Stack.Navigator>
106107
</NavigationContainer>

‎FabricTestExample/src/Test1031.tsx

Lines changed: 28 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,50 @@
11
import * as React from 'react';
2-
import {Button} from 'react-native';
3-
import {NavigationContainer, ParamListBase} from '@react-navigation/native';
4-
import {createNativeStackNavigator, NativeStackNavigationProp, useHeaderHeight} from 'react-native-screens/native-stack';
2+
import { Button } from 'react-native';
3+
import { NavigationContainer, ParamListBase } from '@react-navigation/native';
4+
import {
5+
createNativeStackNavigator,
6+
NativeStackNavigationProp,
7+
useHeaderHeight,
8+
} from 'react-native-screens/native-stack';
59

610
const Stack = createNativeStackNavigator();
711

812
export default function App() {
913
return (
1014
<NavigationContainer>
11-
<Stack.Navigator screenOptions={{stackPresentation: 'formSheet', headerShown: false}}>
15+
<Stack.Navigator
16+
screenOptions={{ stackPresentation: 'formSheet', headerShown: false }}>
1217
<Stack.Screen name="First" component={First} />
13-
<Stack.Screen
14-
name="Second"
15-
component={Second}
16-
/>
18+
<Stack.Screen name="Second" component={Second} />
1719
</Stack.Navigator>
1820
</NavigationContainer>
1921
);
2022
}
2123

22-
function First({navigation}: {navigation: NativeStackNavigationProp<ParamListBase>}) {
24+
function First({
25+
navigation,
26+
}: {
27+
navigation: NativeStackNavigationProp<ParamListBase>;
28+
}) {
2329
console.log(useHeaderHeight());
2430
return (
25-
<Button title="Tap me for second screen" onPress={() => navigation.navigate('Second')} />
26-
31+
<Button
32+
title="Tap me for second screen"
33+
onPress={() => navigation.navigate('Second')}
34+
/>
2735
);
2836
}
2937

30-
function Second({navigation}: {navigation: NativeStackNavigationProp<ParamListBase>}) {
38+
function Second({
39+
navigation,
40+
}: {
41+
navigation: NativeStackNavigationProp<ParamListBase>;
42+
}) {
3143
console.log(useHeaderHeight());
3244
return (
33-
<Button title="Tap me for first screen" onPress={() => navigation.navigate('First')} />
45+
<Button
46+
title="Tap me for first screen"
47+
onPress={() => navigation.navigate('First')}
48+
/>
3449
);
3550
}
36-

‎FabricTestExample/src/Test1032.tsx

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1+
/* eslint-disable react-native/no-inline-styles */
12
import * as React from 'react';
2-
import {Alert, Button, Switch, Text, View} from 'react-native';
3-
import {NavigationContainer, ParamListBase} from '@react-navigation/native';
3+
import { Alert, Button, Switch, Text, View } from 'react-native';
4+
import { NavigationContainer, ParamListBase } from '@react-navigation/native';
45
import {
56
createNativeStackNavigator,
67
NativeStackNavigationProp,
@@ -11,9 +12,9 @@ const Stack = createNativeStackNavigator();
1112
export default function App() {
1213
const [gestureEnabled, setGestureEnable] = React.useState(false);
1314
return (
14-
<View style={{flex: 1, paddingBottom: 200}}>
15+
<View style={{ flex: 1, paddingBottom: 200 }}>
1516
<NavigationContainer>
16-
<Stack.Navigator screenOptions={{gestureEnabled}}>
17+
<Stack.Navigator screenOptions={{ gestureEnabled }}>
1718
<Stack.Screen name="Top" component={First} />
1819
<Stack.Screen name="Top1" component={Second} />
1920
</Stack.Navigator>
@@ -32,7 +33,7 @@ function First({
3233
navigation: NativeStackNavigationProp<ParamListBase>;
3334
}) {
3435
return (
35-
<View style={{backgroundColor: '#FFF'}}>
36+
<View style={{ backgroundColor: '#FFF' }}>
3637
<Button
3738
title="Tap me for second screen"
3839
onPress={() => navigation.push('Top1')}
@@ -43,8 +44,11 @@ function First({
4344

4445
function Second() {
4546
return (
46-
<View style={{backgroundColor: '#FFF'}}>
47-
<Button title="Swipe back to see if button click triggers" onPress={() => Alert.alert('Click detected')} />
47+
<View style={{ backgroundColor: '#FFF' }}>
48+
<Button
49+
title="Swipe back to see if button click triggers"
50+
onPress={() => Alert.alert('Click detected')}
51+
/>
4852
</View>
4953
);
5054
}

‎FabricTestExample/src/Test1036.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
2-
import {NavigationContainer} from '@react-navigation/native';
3-
import {createNativeStackNavigator} from 'react-native-screens/native-stack';
2+
import { NavigationContainer } from '@react-navigation/native';
3+
import { createNativeStackNavigator } from 'react-native-screens/native-stack';
44

55
const Stack = createNativeStackNavigator();
66

@@ -16,9 +16,9 @@ const App = () => {
1616
screenOptions={{
1717
headerTitle: 'Title',
1818
searchBar: {
19-
onCancelButtonPress: ()=>{
20-
console.log('cancel button press')
21-
}
19+
onCancelButtonPress: () => {
20+
console.log('cancel button press');
21+
},
2222
},
2323
}}>
2424
<Stack.Screen name="Screen" component={Screen} />

‎FabricTestExample/src/Test1072.tsx

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
import React, {useState} from 'react';
2-
import {Dimensions, Image, StyleSheet, Text, View} from 'react-native';
3-
import {NavigationContainer, ParamListBase} from '@react-navigation/native';
1+
import React, { useState } from 'react';
2+
import { Dimensions, Image, StyleSheet, Text, View } from 'react-native';
3+
import { NavigationContainer, ParamListBase } from '@react-navigation/native';
44
import {
55
createNativeStackNavigator,
66
NativeStackNavigationProp,
@@ -41,7 +41,7 @@ function Second() {
4141

4242
export default function App() {
4343
return (
44-
<GestureHandlerRootView style={{flex: 1}}>
44+
<GestureHandlerRootView style={{ flex: 1 }}>
4545
<NavigationContainer>
4646
<Stack.Navigator
4747
screenOptions={{
@@ -59,12 +59,12 @@ export default function App() {
5959

6060
// components
6161

62-
function Post({onPress}: {onPress?: () => void}) {
62+
function Post({ onPress }: { onPress?: () => void }) {
6363
const [width] = useState(Math.round(Dimensions.get('screen').width));
6464

6565
return (
6666
<TapGestureHandler
67-
onHandlerStateChange={(e) =>
67+
onHandlerStateChange={e =>
6868
e.nativeEvent.oldState === State.ACTIVE && onPress?.()
6969
}>
7070
<View style={styles.post}>
@@ -83,11 +83,11 @@ function generatePhotos(
8383
height: number,
8484
): JSX.Element[] {
8585
const startFrom = Math.floor(Math.random() * 20) + 10;
86-
return Array.from({length: amount}, (_, index) => {
86+
return Array.from({ length: amount }, (_, index) => {
8787
const uri = `https://picsum.photos/id/${
8888
startFrom + index
8989
}/${width}/${height}`;
90-
return <Image style={{width, height}} key={uri} source={{uri}} />;
90+
return <Image style={{ width, height }} key={uri} source={{ uri }} />;
9191
});
9292
}
9393

‎FabricTestExample/src/Test1084.tsx

Lines changed: 13 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,10 @@
11
import * as React from 'react';
2-
import {Button, View} from 'react-native';
3-
import {NavigationContainer, ParamListBase} from '@react-navigation/native';
4-
import {createNativeStackNavigator, NativeStackNavigationProp} from 'react-native-screens/native-stack';
2+
import { Button, View } from 'react-native';
3+
import { NavigationContainer, ParamListBase } from '@react-navigation/native';
4+
import {
5+
createNativeStackNavigator,
6+
NativeStackNavigationProp,
7+
} from 'react-native-screens/native-stack';
58

69
const Stack = createNativeStackNavigator();
710

@@ -13,7 +16,7 @@ export default function App() {
1316
<Stack.Screen
1417
name="Second"
1518
component={Second}
16-
options={{customAnimationOnSwipe: true, stackAnimation: 'fade'}}
19+
options={{ customAnimationOnSwipe: true, stackAnimation: 'fade' }}
1720
/>
1821
</Stack.Navigator>
1922
</NavigationContainer>
@@ -26,7 +29,7 @@ function First({
2629
navigation: NativeStackNavigationProp<ParamListBase>;
2730
}) {
2831
return (
29-
<View style={{flex: 1, backgroundColor: 'red'}}>
32+
<View style={{ flex: 1, backgroundColor: 'red' }}>
3033
<Button
3134
title="Tap me for second screen"
3235
onPress={() => navigation.navigate('Second')}
@@ -41,8 +44,11 @@ function Second({
4144
navigation: NativeStackNavigationProp<ParamListBase>;
4245
}) {
4346
return (
44-
<View style={{flex: 1, backgroundColor: 'yellow'}}>
45-
<Button title="Tap me for first screen" onPress={() => navigation.goBack()} />
47+
<View style={{ flex: 1, backgroundColor: 'yellow' }}>
48+
<Button
49+
title="Tap me for first screen"
50+
onPress={() => navigation.goBack()}
51+
/>
4652
</View>
4753
);
4854
}

‎FabricTestExample/src/Test1091.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import React from 'react';
2-
import {Button, View, Text} from 'react-native';
3-
import {NavigationContainer} from '@react-navigation/native';
2+
import { Button, View, Text } from 'react-native';
3+
import { NavigationContainer } from '@react-navigation/native';
44

55
// swipe gesture works when using react-native-screens/native-stack
66
import {
@@ -23,15 +23,15 @@ type StackParams = {
2323
const Stack = createNativeStackNavigator<StackParams>();
2424

2525
const Screen2 = () => (
26-
<View style={{paddingTop: 200}}>
26+
<View style={{ paddingTop: 200 }}>
2727
<Text>
2828
Swipe gesture doesn't work on iOS 12 in @react-navigation/native-stack
2929
</Text>
3030
</View>
3131
);
3232

33-
const Screen = ({navigation}: NativeStackScreenProps<StackParams>) => (
34-
<View style={{paddingTop: 200}}>
33+
const Screen = ({ navigation }: NativeStackScreenProps<StackParams>) => (
34+
<View style={{ paddingTop: 200 }}>
3535
<Button
3636
title="Go to Screen2"
3737
onPress={() => navigation.navigate('Screen2')}

0 commit comments

Comments
 (0)