diff --git a/apps/ledger-live-mobile/src/components/RootNavigator/PortfolioNavigator.tsx b/apps/ledger-live-mobile/src/components/RootNavigator/PortfolioNavigator.tsx index 6f807bf311e2..958ba63c639f 100644 --- a/apps/ledger-live-mobile/src/components/RootNavigator/PortfolioNavigator.tsx +++ b/apps/ledger-live-mobile/src/components/RootNavigator/PortfolioNavigator.tsx @@ -1,16 +1,12 @@ import React, { useMemo } from "react"; -import { useSelector } from "react-redux"; import { createStackNavigator } from "@react-navigation/stack"; import { useTheme } from "styled-components/native"; -import { NavigatorName, ScreenName } from "../../const"; -import Portfolio from "../../screens/Portfolio"; -// eslint-disable-next-line import/no-cycle -import ReadOnlyPortfolio from "../../screens/Portfolio/ReadOnly"; +import { NavigatorName } from "../../const"; // eslint-disable-next-line import/no-cycle import AccountsNavigator from "./AccountsNavigator"; import { getStackNavigatorConfig } from "../../navigation/navigatorConfig"; -import { readOnlyModeEnabledSelector } from "../../reducers/settings"; -import { accountsSelector } from "../../reducers/accounts"; +// eslint-disable-next-line import/no-cycle +import WalletTabNavigator from "./WalletTabNavigator"; export default function PortfolioNavigator() { const { colors } = useTheme(); @@ -18,22 +14,16 @@ export default function PortfolioNavigator() { () => getStackNavigatorConfig(colors, true), [colors], ); - const readOnlyModeEnabled = useSelector(readOnlyModeEnabledSelector); - const accounts = useSelector(accountsSelector); return ( p.theme.colors.palette.neutral.c40}; + background-color: transparent; +`; + +const StyledTab = styled.TouchableOpacity``; + +function TabBar({ state, descriptors, navigation }: MaterialTopTabBarProps) { + const { colors } = useTheme(); + + return ( + + + {state.routes.map((route, index) => { + const { options } = descriptors[route.key]; + const label = options.title; + + const isActive = state.index === index; + + const onPress = () => { + const event = navigation.emit({ + type: "tabPress", + target: route.key, + canPreventDefault: true, + }); + + if (!isActive && !event.defaultPrevented) { + navigation.navigate(route.name); + } + }; + + return ( + + + {label} + + + ); + })} + + + ); +} + +export default function WalletTabNavigator() { + const readOnlyModeEnabled = useSelector(readOnlyModeEnabledSelector); + const accounts = useSelector(accountsSelector); + + const { t } = useTranslation(); + return ( + // + } + screenOptions={{ + tabBarStyle: { backgroundColor: "red" }, + }} + style={{ backgroundColor: "transparent" }} + sceneContainerStyle={{ backgroundColor: "transparent" }} + tabBarOptions={{ style: { backgroundColor: "transparent" } }} + // lazy + lazy={true} + > + + + + // + ); +} diff --git a/apps/ledger-live-mobile/src/const/navigation.ts b/apps/ledger-live-mobile/src/const/navigation.ts index ec35bb0985c8..babd41952adb 100644 --- a/apps/ledger-live-mobile/src/const/navigation.ts +++ b/apps/ledger-live-mobile/src/const/navigation.ts @@ -165,6 +165,7 @@ export const ScreenName = { VoteValidation: "VoteValidation", VoteValidationError: "VoteValidationError", VoteValidationSuccess: "VoteValidationSuccess", + WalletNftGallery: "WalletNftGallery", // celo CeloRegistrationValidationSuccess: "CeloRegistrationValidationSuccess", @@ -523,6 +524,7 @@ export const NavigatorName = { CeloWithdrawFlow: "CeloWithdrawFlow", // Tab Main: "Main", + WalletTab: "WalletTabNavigator", // Root RootNavigator: "RootNavigator", Discover: "Discover", diff --git a/apps/ledger-live-mobile/src/locales/en/common.json b/apps/ledger-live-mobile/src/locales/en/common.json index ee4ba0596bd5..65a79100caed 100644 --- a/apps/ledger-live-mobile/src/locales/en/common.json +++ b/apps/ledger-live-mobile/src/locales/en/common.json @@ -5131,5 +5131,11 @@ "title": "Getting started", "description": "Click here to finish setting up your {{productName}} with Ledger Live" } + }, + "wallet": { + "tabs": { + "crypto": "Crypto", + "nft": "NFTs" + } } } \ No newline at end of file diff --git a/apps/ledger-live-mobile/src/screens/Nft/WalletNftGallery/index.tsx b/apps/ledger-live-mobile/src/screens/Nft/WalletNftGallery/index.tsx new file mode 100644 index 000000000000..dc53baf4590e --- /dev/null +++ b/apps/ledger-live-mobile/src/screens/Nft/WalletNftGallery/index.tsx @@ -0,0 +1,9 @@ +import { Box } from "@ledgerhq/native-ui"; +import React from "react"; + +const WalletNftGallery = () => { + console.log("WalletNftGallery screen"); + return ; +}; + +export default WalletNftGallery;