diff --git a/package.json b/package.json index 1394d75..f44374e 100644 --- a/package.json +++ b/package.json @@ -42,6 +42,7 @@ "react-i18next": "^11.15.1", "react-native": "0.64.3", "react-native-awesome-alerts": "^1.5.2", + "react-native-copilot": "^2.5.1", "react-native-htmlview": "^0.16.0", "react-native-openanything": "^0.0.6", "react-native-qrcode-scanner": "^1.5.4", diff --git a/src/components/Navbar.js b/src/components/Navbar.js index 92f6431..0a3812f 100644 --- a/src/components/Navbar.js +++ b/src/components/Navbar.js @@ -7,6 +7,7 @@ import { TouchableOpacity, ActivityIndicator, } from "react-native"; +import { copilot, walkthroughable, CopilotStep } from "react-native-copilot"; import Svg, { G, @@ -33,6 +34,8 @@ import Colors from "../constants/Colors"; import tw from "tailwind-rn"; import fontSize from "../constants/fontSize"; +const CopilotView = walkthroughable(View); + const Navbar = ({ notification, setBoxPosition, @@ -42,9 +45,16 @@ const Navbar = ({ userFavoriteList, theme, bookmarkLoading, + ...props }) => { const navigation = useNavigation(); + React.useEffect(() => { + setTimeout(() => { + props.start(); + }, 800); + }, []); + const isActiveBookmark = React.useMemo(() => { return userFavoriteList.filter((object) => headerOptions.bookmarkItem?.productId @@ -64,7 +74,6 @@ const Navbar = ({ borderColor: theme === "light" ? Colors.theme1.green79 : Colors.theme1.white, borderWidth: 1, - marginLeft: route === "AR" ? 10 : 0, }, ]} onPress={() => navigation.navigate(route, { page: state })} @@ -86,6 +95,7 @@ const Navbar = ({ ? Colors.theme1.white : Colors.theme1.dark, height: 64, + zIndex: 100, }, ]} > @@ -414,236 +424,257 @@ const Navbar = ({ ) : null} {headerOptions?.qr ? ( <> -