Skip to content

Commit 374f24f

Browse files
krizzukrizzu
committed
example: improve example
1 parent 6f946fd commit 374f24f

File tree

11 files changed

+325
-225
lines changed

11 files changed

+325
-225
lines changed

‎examples/example-react-native/App.tsx‎

Lines changed: 0 additions & 56 deletions
This file was deleted.

‎examples/example-react-native/index.js‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,5 @@
1-
/**
2-
* @format
3-
*/
4-
51
import { AppRegistry } from "react-native";
6-
import App from "./App";
2+
import App from "./src/App";
73
import { name as appName } from "./app.json";
84

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

‎examples/example-react-native/ios/Podfile.lock‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1356,6 +1356,81 @@ PODS:
13561356
- React-jsiexecutor
13571357
- React-RCTFBReactNativeSpec
13581358
- ReactCommon/turbomodule/core
1359+
- react-native-safe-area-context (5.6.1):
1360+
- DoubleConversion
1361+
- glog
1362+
- hermes-engine
1363+
- RCT-Folly (= 2024.11.18.00)
1364+
- RCTRequired
1365+
- RCTTypeSafety
1366+
- React-Core
1367+
- React-debug
1368+
- React-Fabric
1369+
- React-featureflags
1370+
- React-graphics
1371+
- React-hermes
1372+
- React-ImageManager
1373+
- React-jsi
1374+
- react-native-safe-area-context/common (= 5.6.1)
1375+
- react-native-safe-area-context/fabric (= 5.6.1)
1376+
- React-NativeModulesApple
1377+
- React-RCTFabric
1378+
- React-renderercss
1379+
- React-rendererdebug
1380+
- React-utils
1381+
- ReactCodegen
1382+
- ReactCommon/turbomodule/bridging
1383+
- ReactCommon/turbomodule/core
1384+
- Yoga
1385+
- react-native-safe-area-context/common (5.6.1):
1386+
- DoubleConversion
1387+
- glog
1388+
- hermes-engine
1389+
- RCT-Folly (= 2024.11.18.00)
1390+
- RCTRequired
1391+
- RCTTypeSafety
1392+
- React-Core
1393+
- React-debug
1394+
- React-Fabric
1395+
- React-featureflags
1396+
- React-graphics
1397+
- React-hermes
1398+
- React-ImageManager
1399+
- React-jsi
1400+
- React-NativeModulesApple
1401+
- React-RCTFabric
1402+
- React-renderercss
1403+
- React-rendererdebug
1404+
- React-utils
1405+
- ReactCodegen
1406+
- ReactCommon/turbomodule/bridging
1407+
- ReactCommon/turbomodule/core
1408+
- Yoga
1409+
- react-native-safe-area-context/fabric (5.6.1):
1410+
- DoubleConversion
1411+
- glog
1412+
- hermes-engine
1413+
- RCT-Folly (= 2024.11.18.00)
1414+
- RCTRequired
1415+
- RCTTypeSafety
1416+
- React-Core
1417+
- React-debug
1418+
- React-Fabric
1419+
- React-featureflags
1420+
- React-graphics
1421+
- React-hermes
1422+
- React-ImageManager
1423+
- React-jsi
1424+
- react-native-safe-area-context/common
1425+
- React-NativeModulesApple
1426+
- React-RCTFabric
1427+
- React-renderercss
1428+
- React-rendererdebug
1429+
- React-utils
1430+
- ReactCodegen
1431+
- ReactCommon/turbomodule/bridging
1432+
- ReactCommon/turbomodule/core
1433+
- Yoga
13591434
- React-NativeModulesApple (0.79.6):
13601435
- glog
13611436
- hermes-engine
@@ -1753,6 +1828,7 @@ DEPENDENCIES:
17531828
- React-logger (from `../node_modules/react-native/ReactCommon/logger`)
17541829
- React-Mapbuffer (from `../node_modules/react-native/ReactCommon`)
17551830
- React-microtasksnativemodule (from `../node_modules/react-native/ReactCommon/react/nativemodule/microtasks`)
1831+
- react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
17561832
- React-NativeModulesApple (from `../node_modules/react-native/ReactCommon/react/nativemodule/core/platform/ios`)
17571833
- React-oscompat (from `../node_modules/react-native/ReactCommon/oscompat`)
17581834
- React-perflogger (from `../node_modules/react-native/ReactCommon/reactperflogger`)
@@ -1873,6 +1949,8 @@ EXTERNAL SOURCES:
18731949
:path: "../node_modules/react-native/ReactCommon"
18741950
React-microtasksnativemodule:
18751951
:path: "../node_modules/react-native/ReactCommon/react/nativemodule/microtasks"
1952+
react-native-safe-area-context:
1953+
:path: "../node_modules/react-native-safe-area-context"
18761954
React-NativeModulesApple:
18771955
:path: "../node_modules/react-native/ReactCommon/react/nativemodule/core/platform/ios"
18781956
React-oscompat:
@@ -1984,6 +2062,7 @@ SPEC CHECKSUMS:
19842062
React-logger: 1426d04b594a2e68b0ac2add21d45422d06397a3
19852063
React-Mapbuffer: 70a29536f84ddffca4a91097651d2b8f194f7c67
19862064
React-microtasksnativemodule: ff05e894231c44c21135d1d23a82b87656d98eeb
2065+
react-native-safe-area-context: 895c49ee2613865f90318789be89a8e286fe7b69
19872066
React-NativeModulesApple: d94850b316446b0c39a82eb278d6efaa1a634055
19882067
React-oscompat: 56b4766e96b06843a3af49a6763ef40992e720aa
19892068
React-perflogger: 8fe9ec5f9ddbab1b8906c1aec159aa946e0ba041

‎examples/example-react-native/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@
2121
"react": "19.0.0",
2222
"react-native": "0.79.6",
2323
"react-native-macos": "^0.79.0",
24+
"react-native-safe-area-context": "^5.6.1",
2425
"react-native-windows": "^0.79.0"
2526
},
2627
"devDependencies": {

‎examples/example-react-native/src/App.tsx‎

Lines changed: 79 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
import React, { useState } from "react";
2+
import { Pressable, StatusBar, Text, useColorScheme, View } from "react-native";
3+
import { SafeAreaProvider, SafeAreaView } from "react-native-safe-area-context";
4+
import BasicTests from "./tests/BasicTests";
5+
import WithLegacyStorage from "./WithLegacyStorage";
6+
import WithAsyncStorage from "./WithAsyncStorage";
7+
8+
function App(): React.JSX.Element {
9+
const isDarkMode = useColorScheme() === "dark";
10+
const [example, setExample] = useState<"basic" | "legacy-basic">("basic");
11+
12+
return (
13+
<SafeAreaProvider>
14+
<SafeAreaView style={{ flex: 1 }}>
15+
<StatusBar barStyle={isDarkMode ? "light-content" : "dark-content"} />
16+
17+
<View
18+
style={{
19+
alignItems: "center",
20+
flexDirection: "row",
21+
padding: 8,
22+
gap: 4,
23+
}}
24+
>
25+
<Tab
26+
title="Basic"
27+
active={example === "basic"}
28+
onPress={() => setExample("basic")}
29+
/>
30+
31+
<Tab
32+
title="Basic (Legacy)"
33+
active={example === "legacy-basic"}
34+
onPress={() => setExample("legacy-basic")}
35+
/>
36+
</View>
37+
38+
{(() => {
39+
switch (example) {
40+
case "basic":
41+
return (
42+
<WithAsyncStorage dbName="test-db" TestComponent={BasicTests} />
43+
);
44+
case "legacy-basic":
45+
return <WithLegacyStorage TestComponent={BasicTests} />;
46+
}
47+
})()}
48+
</SafeAreaView>
49+
</SafeAreaProvider>
50+
);
51+
}
52+
53+
const activeTab = "#F42C04";
54+
const inactiveTab = "#625F63AA";
55+
const Tab: React.FC<{
56+
active: boolean;
57+
title: string;
58+
onPress: () => void;
59+
}> = ({ active, onPress, title }) => {
60+
return (
61+
<Pressable
62+
onPress={onPress}
63+
style={{
64+
padding: 8,
65+
backgroundColor: active ? activeTab : inactiveTab,
66+
}}
67+
>
68+
<Text
69+
style={{
70+
color: "white",
71+
}}
72+
>
73+
{title}
74+
</Text>
75+
</Pressable>
76+
);
77+
};
78+
79+
export default App;

‎examples/example-react-native/src/BasicCrud.tsx‎

Lines changed: 0 additions & 82 deletions
This file was deleted.

0 commit comments

Comments
 (0)