Skip to content

Commit ee4ccf6

Browse files
committed
Scaffold out cross-platform ui-kit project
1 parent 3cf9381 commit ee4ccf6

26 files changed

+21322
-4036
lines changed

package-lock.json

Lines changed: 5116 additions & 3676 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

packages/mobile-app/app/(tabs)/_layout.tsx

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,15 @@ export default function Layout() {
3939
),
4040
}}
4141
/>
42+
<Tabs.Screen
43+
name="ui"
44+
options={{
45+
title: "UI Kit",
46+
tabBarIcon: ({ color, size }) => (
47+
<FontAwesome name="paint-brush" size={size} color={color} />
48+
),
49+
}}
50+
/>
4251
</Tabs>
4352
);
4453
}
Lines changed: 3 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
import { Button } from "@ironfish/ui";
2-
import { View, Text } from "react-native";
1+
import { View, Text, Button } from "react-native";
32
import { wallet } from "../../data/wallet/wallet";
43

54
import { Network } from "../../data/constants";
@@ -9,12 +8,11 @@ export default function Contacts() {
98
<View>
109
<Text>Contacts</Text>
1110
<Button
11+
title="Request Blocks"
1212
onPress={() => {
1313
wallet.scan(Network.TESTNET);
1414
}}
15-
>
16-
Request Blocks
17-
</Button>
15+
/>
1816
</View>
1917
);
2018
}

packages/mobile-app/app/(tabs)/transact.tsx

Lines changed: 9 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
1-
import { View, Text, ScrollView, TextInput } from "react-native";
1+
import { View, Text, ScrollView, TextInput, Button } from "react-native";
22
import { useFacade } from "../../data/facades";
3-
import { Button } from "@ironfish/ui";
43
import { useQueryClient } from "@tanstack/react-query";
54
import React from "react";
65
import { AccountFormat } from "@ironfish/sdk";
@@ -49,9 +48,8 @@ export default function Transact() {
4948
await removeAccount.mutateAsync({ name: account.name });
5049
console.log("Removed Account", account.name);
5150
}}
52-
>
53-
Remove Account
54-
</Button>
51+
title="Remove Account"
52+
/>
5553
<Button
5654
onPress={async () => {
5755
const otherResult = await exportAccount.mutateAsync({
@@ -60,19 +58,17 @@ export default function Transact() {
6058
});
6159
console.log("Exported Account:", otherResult);
6260
}}
63-
>
64-
Export Account
65-
</Button>
61+
title="Export Account"
62+
/>
6663
</View>
6764
))}
6865
<Button
6966
onPress={async () => {
7067
const otherResult = await createAccount.mutateAsync({ name: "dave" });
7168
console.log("Created Account:", otherResult);
7269
}}
73-
>
74-
Create Account
75-
</Button>
70+
title="Create Account"
71+
/>
7672
<TextInput
7773
value={importAccountText}
7874
onChangeText={setImportAccountText}
@@ -86,9 +82,8 @@ export default function Transact() {
8682
});
8783
console.log("Imported Account:", otherResult);
8884
}}
89-
>
90-
Import Account
91-
</Button>
85+
title="Import Account"
86+
/>
9287
</ScrollView>
9388
);
9489
}

packages/mobile-app/app/(tabs)/ui.tsx

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import { Button } from "@ironfish/ui";
2+
import { ScrollView } from "react-native";
3+
4+
export default function UiKit() {
5+
return (
6+
<ScrollView>
7+
<Button label="Hello World" />
8+
</ScrollView>
9+
);
10+
}

packages/mobile-app/app/_layout.tsx

Lines changed: 14 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,6 @@ import { Text } from "react-native";
88
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
99

1010
import { useColorScheme } from "react-native";
11-
import { UIKitProvider } from "@ironfish/ui";
1211
import { FacadeProvider, useFacade } from "../data/facades";
1312
import { useEffect, useState } from "react";
1413

@@ -46,22 +45,20 @@ export default function Layout() {
4645
const scheme = useColorScheme();
4746
return (
4847
<ThemeProvider value={scheme === "dark" ? DarkTheme : DefaultTheme}>
49-
<UIKitProvider colorScheme={scheme || "light"}>
50-
<QueryClientProvider client={queryClient}>
51-
<FacadeProvider>
52-
<DatabaseLoader loading={<Text>Loading databases...</Text>}>
53-
<Stack>
54-
<Stack.Screen
55-
name="(tabs)"
56-
options={{
57-
headerShown: false,
58-
}}
59-
/>
60-
</Stack>
61-
</DatabaseLoader>
62-
</FacadeProvider>
63-
</QueryClientProvider>
64-
</UIKitProvider>
48+
<QueryClientProvider client={queryClient}>
49+
<FacadeProvider>
50+
<DatabaseLoader loading={<Text>Loading databases...</Text>}>
51+
<Stack>
52+
<Stack.Screen
53+
name="(tabs)"
54+
options={{
55+
headerShown: false,
56+
}}
57+
/>
58+
</Stack>
59+
</DatabaseLoader>
60+
</FacadeProvider>
61+
</QueryClientProvider>
6562
</ThemeProvider>
6663
);
6764
}

packages/mobile-app/babel.config.js

Lines changed: 1 addition & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,18 +2,6 @@ module.exports = function (api) {
22
api.cache(true);
33
return {
44
presets: ["babel-preset-expo"],
5-
plugins: [
6-
...(process.env.EAS_BUILD_PLATFORM === "android"
7-
? []
8-
: [
9-
[
10-
"@tamagui/babel-plugin",
11-
{
12-
components: ["@ironfish/ui", "tamagui"],
13-
config: "../../packages/ui-kit/src/theme/config.ts",
14-
},
15-
],
16-
]),
17-
],
5+
plugins: [],
186
};
197
};

packages/mobile-app/package.json

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,6 @@
3434
},
3535
"devDependencies": {
3636
"@babel/core": "^7.20.0",
37-
"@tamagui/babel-plugin": "1.102.1",
3837
"@types/react": "~18.2.79",
3938
"eslint-config-expo": "^7.0.0",
4039
"eslint-config-prettier": "^9.1.0",

packages/ui-kit/.eslintrc.json

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"extends": [
3+
"plugin:storybook/recommended"
4+
]
5+
}

packages/ui-kit/.storybook/main.ts

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import type { StorybookConfig } from "@storybook/react-webpack5";
2+
import path from "path";
3+
4+
const config: StorybookConfig = {
5+
stories: ["../src/**/*.mdx", "../src/**/*.stories.@(js|jsx|mjs|ts|tsx)"],
6+
addons: [
7+
"@storybook/addon-webpack5-compiler-swc",
8+
"@storybook/addon-onboarding",
9+
"@storybook/addon-links",
10+
"@storybook/addon-essentials",
11+
"@chromatic-com/storybook",
12+
"@storybook/addon-interactions",
13+
],
14+
framework: {
15+
name: "@storybook/react-webpack5",
16+
options: {},
17+
},
18+
webpackFinal: async (config) => {
19+
if (config.resolve) {
20+
config.resolve.alias = {
21+
...config.resolve?.alias,
22+
"react-native": "react-native-web",
23+
"@ironfish/ui": path.resolve(__dirname, "../src/index.ts"),
24+
};
25+
}
26+
return config;
27+
},
28+
};
29+
export default config;

0 commit comments

Comments
 (0)