[INJIMOB-781] fix copilot target issue on downloaded vc

Signed-off-by: srikanth716 <srikanthsri7447@gmail.com>

components/VC/Views/VCCardView.tsx

@@ -87,7 +87,6 @@ export const VCCardView: React.FC<VCItemProps> = props => {
         }>
         {props.isTopCard ? (
           <Copilot
-            key={t('copilot:cardTitle')}
             description={t('copilot:cardMessage')}
             order={6}
             title={t('copilot:cardTitle')}

components/VC/Views/VCCardViewContent.tsx

@@ -19,7 +19,7 @@ import {RemoveVcWarningOverlay} from '../../../screens/Home/MyVcs/RemoveVcWarnin
 import {HistoryTab} from '../../../screens/Home/MyVcs/HistoryTab';
 import {getTextColor} from '../common/VCUtils';
 import {useCopilot} from 'react-native-copilot';
-import {COPILOT_FINAL_STEP} from '../../../shared/constants';
+import {useTranslation} from 'react-i18next';
 
 export const VCCardViewContent: React.FC<VCItemContentProps> = props => {
   const isVCSelectable = props.selectable && (
@@ -39,7 +39,8 @@ export const VCCardViewContent: React.FC<VCItemContentProps> = props => {
   );
   const issuerLogo = props.verifiableCredentialData.issuerLogo;
   const faceImage = props.verifiableCredentialData.face;
-  const {start, goToNth} = useCopilot();
+  const {start} = useCopilot();
+  const {t} = useTranslation();
 
   return (
     <ImageBackground
@@ -52,10 +53,7 @@ export const VCCardViewContent: React.FC<VCItemContentProps> = props => {
       <View
         onLayout={
           props.isInitialLaunch
-            ? () => {
-                start();
-                goToNth(COPILOT_FINAL_STEP);
-              }
+            ? () => start(t('copilot:cardTitle'))
             : undefined
         }>
         <Row crossAlign="center" padding="3 0 0 3">

components/ui/Copilot.tsx

@@ -4,10 +4,8 @@ import {CopilotStep, walkthroughable} from 'react-native-copilot';
 
 export const Copilot: React.FC<CopilotProps> = (props: CopilotProps) => {
   const CopilotView = walkthroughable(View);
-
   return (
     <CopilotStep
-      key={props.key}
       name={props.title}
       text={props.description}
       order={props.order}>
@@ -19,7 +17,6 @@ export const Copilot: React.FC<CopilotProps> = (props: CopilotProps) => {
 };
 
 interface CopilotProps {
-  key: any;
   title: string;
   description: string;
   order: number;

screens/Home/HomeScreen.tsx

@@ -88,7 +88,6 @@ export const HomeScreen: React.FC<HomeRouteProps> = props => {
       </Column>
 
       <Copilot
-        key={t('copilot:downloadTitle')}
         title={t('copilot:downloadTitle')}
         description={t('copilot:downloadMessage')}
         order={2}

screens/HomeScreenLayout.tsx

@@ -47,7 +47,6 @@ export const HomeScreenLayout: React.FC<RootRouteProps> = props => {
       source={'Inji'}
       triggerComponent={
         <Copilot
-          key={t('copilot:helpTitle')}
           title={t('copilot:helpTitle')}
           description={t('copilot:helpMessage')}
           order={1}

screens/MainLayout.tsx

@@ -78,7 +78,6 @@ export const MainLayout: React.FC = () => {
                     </View>
                   ) : (
                     <Copilot
-                      key={t(route.name)}
                       title={t(`copilot:${route.name}Title`)}
                       description={t(`copilot:${route.name}Message`)}
                       order={2 + index}