67 lines
1.9 KiB
TypeScript
67 lines
1.9 KiB
TypeScript
import { Tabs } from "expo-router";
|
|
|
|
import { Colors } from "@/constants/Colors";
|
|
import { useColorScheme } from "@/hooks/useColorScheme";
|
|
import { TabBarIcon } from "@/components/navigation/TabBarIcon";
|
|
import { Provider } from "react-redux";
|
|
import fixtures from "@/__fixtures__/initialProducts";
|
|
import { setupStore } from "../store";
|
|
const CarpetRoleSvg = require("@/assets/images/icons/icon-carpet-roll.svg");
|
|
const CarpetRoleSelectedSvg = require("@/assets/images/icons/icon-carpet-roll-selected.svg");
|
|
|
|
const CarpetRollIcon = ({ selected }: { selected: boolean }) => {
|
|
return selected ? CarpetRoleSelectedSvg : CarpetRoleSvg;
|
|
};
|
|
|
|
export default function TabLayout() {
|
|
const colorScheme = useColorScheme();
|
|
const store = setupStore({
|
|
products: fixtures,
|
|
units: "ft",
|
|
});
|
|
return (
|
|
<Provider store={store}>
|
|
<Tabs
|
|
screenOptions={{
|
|
tabBarActiveTintColor: Colors[colorScheme ?? "light"].tint,
|
|
headerShown: false,
|
|
}}
|
|
>
|
|
<Tabs.Screen
|
|
name="index"
|
|
options={{
|
|
title: "Plywood",
|
|
tabBarIcon: ({ color, focused }) => (
|
|
<TabBarIcon
|
|
name={focused ? "scale" : "scale-outline"}
|
|
color={color}
|
|
/>
|
|
),
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="product-editor"
|
|
options={{
|
|
title: "Carpet Roll Calculator",
|
|
tabBarIcon: ({ color, focused }) => (
|
|
<CarpetRollIcon selected={focused} />
|
|
),
|
|
}}
|
|
/>
|
|
<Tabs.Screen
|
|
name="product-editor"
|
|
options={{
|
|
title: "Edit Products",
|
|
tabBarIcon: ({ color, focused }) => (
|
|
<TabBarIcon
|
|
name={focused ? "list" : "list-outline"}
|
|
color={color}
|
|
/>
|
|
),
|
|
}}
|
|
/>
|
|
</Tabs>
|
|
</Provider>
|
|
);
|
|
}
|