bug: when pressing hardware back button app routing back to two times

[5snitish]

Prerequisites

• [X] I have read the Contributing Guidelines.
• [X] I agree to follow the Code of Conduct.
• [X] I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v6.x

Current Behavior

when pressing hardware back button app routing bac to two times

Expected Behavior

when pressing hardware back button app routing bac to one times

Steps to Reproduce

please check this video

https://github.com/ionic-team/ionic-framework/assets/40054427/e1b17028-52bb-4fc1-b786-c1d9da083b86

Code Reproduction URL

No response

Ionic Info

Ionic:

Ionic CLI : 5.4.16 (C:\Users\nitish sharma\AppData\Roaming\npm\node_modules\ionic) Ionic Framework : @ionic/react 6.7.4

Capacitor:

Capacitor CLI : 4.6.1 @capacitor/core : 4.6.1

Utility:

cordova-res : not installed native-run : 1.7.1

System:

NodeJS : v16.16.0 (C:\Program Files\nodejs\node.exe) npm : 8.11.0 OS : Windows 10

Additional Information

No response

[ionitron-bot[bot]]

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please reproduce this issue in an Ionic starter application and provide a way for us to access it (GitHub repo, StackBlitz, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.

If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue.

For a guide on how to create a good reproduction, see our Contributing Guide.

[5snitish]

this is my app .js

` import { Redirect, Route, Switch, useHistory } from 'react-router-dom'; import { IonApp, IonLoading, IonRouterOutlet, IonSplitPane, setupIonicReact, useIonLoading, useIonToast } from '@ionic/react'; import { IonReactRouter } from '@ionic/react-router';

/ Core CSS required for Ionic components to work properly / import '@ionic/react/css/core.css';

/ Basic CSS for apps built with Ionic / import '@ionic/react/css/normalize.css'; import '@ionic/react/css/structure.css'; import '@ionic/react/css/typography.css';

/ Optional CSS utils that can be commented out / import '@ionic/react/css/padding.css'; import '@ionic/react/css/float-elements.css'; import '@ionic/react/css/text-alignment.css'; import '@ionic/react/css/text-transformation.css'; import '@ionic/react/css/flex-utils.css'; import '@ionic/react/css/display.css';

/ Theme variables / import './theme/variables.css'; import Menu from './components/Menu'; import { useAuth } from './pages/auth/authContext'; import React, { useContext, useEffect, useState } from "react";

import IntroScreen from './pages/IntroScreen';

import MainTabs from './pages/MainTabs'; import Login from './pages/Login/Login'; import CategorySelection from './pages/categorySelection/CategorySelection'; import Notifications from './pages/notifications/Notifications'; import LocationSelection from './pages/locationSelection/LocationSelection'; import ForgotPassword from './pages/forgotPassword/ForgotPassword'; import EmailVerification from './pages/emailVerification/EmailVerification'; import SignUpCoach from './pages/signUpCoach/SignUpCoach'; import SignUpStudent from './pages/signUpStudent/SignUpStudent'; import CoachProfileSetup from './pages/coachProfileSetup/CoachProfileSetup'; import useGetOnboardingStatus from './components/useGetOnboardingStatus'; import CoachProfileDetails from './pages/coachProfileDetails/CoachProfileDetails'; import BatchDetails from './pages/batchDetails/BatchDetails'; import ExploreStudentDetails from './pages/exploreStudentDetails/ExploreStudentDetails'; import BatchGuruDetails from './pages/batchGuruDetails/BatchGuruDetails'; import CreateBatch from './pages/createBatch/CreateBatch'; import ProfileSettingStudent from './pages/profileSettingStudent/ProfileSettingStudent'; import MessagesChatDetails from './pages/messagesChatDetails/MessagesChatDetails'; import MessagesChatGrpDetails from './pages/messagesChatGrpDetails/MessagesChatGrpDetails'; import ProfileSettingGuru from './pages/profileSettingGuru/ProfileSettingGuru'; import MessagesRequests from './pages/messagesRequests/MessagesRequests'; import MessagesRequestNotAccepted from './pages/messagesRequestNotAccepted/MessagesRequestNotAccepted'; import IdVerification from './pages/idVerification/IdVerification'; import MarkAttendence from './pages/markAttendence/MarkAttendence'; import PaymentAndTransactions from './pages/paymentAndTransactions/PaymentAndTransactionsStudent'; import EditPreference from './pages/editPreference/EditPreference'; import EditCategory from './pages/editCategory/EditCategory'; import EditExperience from './pages/editExperience/EditExperience'; import CreateRequirement from './pages/createRequirement/CreateRequirement'; import PasswordReset from './pages/passwordReset/PasswordReset'; import LocationManual from './pages/locationManual/LocationManual'; import { connect, useDispatch } from 'react-redux'; import AddressModal from './components/AddressModal'; import { SocketContext } from './helperFunctions/SocketService'; import { getAccessToken } from './helperFunctions/utils'; import AddressAddMultiple from './components/AddressAddMultiple'; import { AddChatMessages } from './redux/actions/messages/SingleChats'; import AddressSelectModal from './components/AddressSelectModal'; import { GetLocations } from './redux/actions/locations/Locations'; import { getCategories } from './apis/categories'; import { GetplatformFees, SetCategories, SetCategoriesGuru } from './redux/actions/startup/startupActions'; import { getCategoriesRequirements } from './apis/GuruRequirements'; import AddressSelectModalGuru from './components/AddressSelectModalGuru'; import EditPreferenceGuru from './pages/editPreference/EditPreferenceGuru';

import { PushNotificationSchema, PushNotifications, Token as token, ActionPerformed } from '@capacitor/push-notifications'; import EditBatch from './pages/createBatch/EditBatch'; import PauseBatch from './pages/markAttendence/PauseBatch'; import PaymentAndTransactionsStudent from './pages/paymentAndTransactions/PaymentAndTransactionsStudent'; import PaymentAndTransactionsGuru from './pages/paymentAndTransactions/PaymentAndTransactionsGuru'; import { CapacitorStripeProvider } from '@capacitor-community/stripe/dist/esm/react/provider'; import { SetGuruPaymentHistory, SetUserPaymentHistory } from './redux/actions/Authentication/User'; import { Preferences } from '@capacitor/preferences'; import { notificationTypes } from './Constants'; import { GetGurusbatch } from './redux/actions/GuruBatches/GetBatch'; import { GetBatchDetailsApi } from './apis/Batches'; import Notifcations from './components/Notifcations'; import { Network } from '@capacitor/network'; import { SplashScreen } from '@capacitor/splash-screen'; import { GetAllCategories } from './redux/actions/category/Category'; import { GetFavourites } from './redux/actions/Favourites/Favourites'; setupIonicReact();

const App: React.FC = (props: any) => { const socket = useContext(SocketContext); const { authInfo, initialize } = useAuth()!; const nullEntry: any[] = [] const [message, setMessage] = useState("") const [presentLoader, dismissLoader] = useIonLoading(); const [notifications, setnotifications] = useState(nullEntry); const [present, dismiss] = useIonToast(); useEffect(() => { !authInfo?.initialized && (async () => await initialize())(); }, [authInfo, initialize]);

const connectToSocet = async () => { await getAccessToken().then(async token => {

  if (token) {
    socket.io.opts.extraHeaders = { "access-token": `Bearer ${token}` };
    socket.connect();

  }
});

}

const categories = async (type: any = "student") => { try { if (type === "guru") { const res: any = await getCategories() props.dispatch(SetCategories(res.data.data.categories)) const res1: any = await getCategoriesRequirements() props.dispatch(SetCategoriesGuru(res1.data.data.categories)) } else { const res: any = await getCategories() props.dispatch(SetCategories(res.data.data.categories)) }

} catch (error) {
  console.log(error)
}

} const history = useHistory() const dispatch = useDispatch() useEffect(() => { if (props?.User?.user?.role === "guru") { props.dispatch(GetplatformFees()) props.dispatch(SetGuruPaymentHistory()) props.dispatch(GetLocations("guru")) props.dispatch(GetLocations()) categories("guru") } else { props.dispatch(GetLocations()) categories() } props.dispatch(GetAllCategories()) if (props?.User?.user?.role === "student") { props.dispatch(SetUserPaymentHistory()) props.dispatch(GetFavourites())

}

}, [props?.User?.user])

useEffect(() => { if (socket.connected === false && props?.User?.user) { connectToSocet() }

if (socket) {
  socket.on("connect", () => {
    console.log(socket, "connected")
  });

  socket.on('disconnect', () => {
    console.log(socket, "disconeected")

  });
  socket.on("MESSAGE_RECEIVE", (response: any) => {
    console.log(response);

    setMessage(response)
  })
  socket.on("connect_error", (error: any) => {
    console.log(error); // undefined
  });
  socket.on("ERROR", (error: any) => {
    console.log(error); // undefined
  });
}

return () => {
  socket.off("MESSAGE_RECEIVE", (response: any) => {
    console.log(response);
    props.dispatch(AddChatMessages(response))
  })
  socket.disconnect()
}

}, [socket, props?.User?.user]) useEffect(() => {

Network.addListener('networkStatusChange', status => {

  if (status.connected === true) {
    dismiss()

    // present({
    //   color: 'primary',
    //   message: 'Connected to Server',
    //   duration: 3000,
    //   position: 'bottom'
    // });

  } else {
    dismiss()
    present({
      color: 'danger',
      message: 'No Connected to Server,Please Check Your Internet Connection ',

      position: 'bottom'
    });
  }
  console.log('Network status changed', status.connected);
});

// splashSereen()

}, [])

const splashSereen = async () => { // Show the splash for an indefinite amount of time: await SplashScreen.show({ autoHide: false, });

}

useEffect(() => { const timer = setTimeout(() => { if (message) { props.dispatch(AddChatMessages(message)) setMessage("") }

}, 500)

return () => clearTimeout(timer)

}, [message])

if (!authInfo || !authInfo.initialized) { return (

);

} else { return ( <CapacitorStripeProvider publishableKey="" fallback={

}

<> {authInfo?.loggedIn === true ? (

            <Route path="/coach-profile-setup" component={CoachProfileSetup} />
            <Route path="/locationme" component={LocationSelection} />
            <Route path="/notifications" component={Notifications} />
            <Route path="/Coach-profile-details" component={CoachProfileDetails} />
            <Route path="/explore-student-details" component={ExploreStudentDetails} />
            <Route path="/batch-details" component={BatchDetails} />
            <Route path="/batch-guru-details" component={BatchGuruDetails} />
            <Route path="/create-batch" component={CreateBatch} />
            <Route path="/edit-batch" component={EditBatch} />
            <Route path="/signup-coach" component={SignUpCoach} />
            <Route path="/profile-setting-student" component={ProfileSettingStudent} />
            <Route path="/profile-setting-guru" component={ProfileSettingGuru} />
            <Route path="/messages-chat-details/:id" component={MessagesChatDetails} />
            <Route path="/messages-chat-group-details/:id" component={MessagesChatGrpDetails} />
            <Route path="/messages-requests/:id" component={MessagesRequests} />
            <Route path="/messages-requests-not-accepted/:id" component={MessagesRequestNotAccepted} />
            <Route path="/id-verification" component={IdVerification} />
            <Route path="/mark-attendence" component={MarkAttendence} />
            <Route path="/pause-batch" component={PauseBatch} />
            <Route path="/payment-and-transactions-student" component={PaymentAndTransactionsStudent} />
            <Route path="/payment-and-transactions-guru" component={PaymentAndTransactionsGuru} />
            <Route path="/edit-preference-guru" component={EditPreferenceGuru} />
            <Route path="/edit-preference" component={EditPreference} />
            <Route path="/edit-category" component={EditCategory} />
            <Route path="/edit-experience" component={EditExperience} />
            <Route path="/create-requirement" component={CreateRequirement} />
            <Route path="/password-reset/:id" component={PasswordReset} />
            <Route path="/location-manual" component={LocationManual} />
            {/* <Route path="/edit-location" component={AddressModal} /> */}
            <Route path="/edit-location-guru" component={AddressSelectModalGuru} />
            <Route path="/edit-location" component={AddressSelectModal} />
            <Route path="/add-location" component={AddressAddMultiple} />
            <Route path="/" exact={true} render={() => {
              return <MainTabs />
            }} />

          </IonReactRouter>
        ) : (
          <IonReactRouter>

            <IonSplitPane contentId="main">
              <Menu />
              <IonRouterOutlet id="main">
                <Switch>
                  <Route path="/tabs" component={MainTabs} />
                </Switch>
              </IonRouterOutlet>
            </IonSplitPane>

            {<Route path="/introscreen" component={IntroScreen} />}
            <Route path="/login" component={Login} />
            <Route path="/category" component={CategorySelection} />
            <Route path="/notifications" component={Notifications} />
            <Route path="/locationme" component={LocationSelection} />
            <Route path="/signup-student" component={SignUpStudent} />
            <Route path="/signup-coach" component={SignUpCoach} />
            <Route path="/ForgotPassword" component={ForgotPassword} />
            <Route path="/email-verification" component={EmailVerification} />
            <Route path="/coach-profile-setup" component={CoachProfileSetup} />
            <Route path="/Coach-profile-details" component={CoachProfileDetails} />
            <Route path="/explore-student-details" component={ExploreStudentDetails} />
            <Route path="/batch-details" component={BatchDetails} />
            <Route path="/batch-guru-details" component={BatchGuruDetails} />
            <Route path="/password-reset/:id" component={PasswordReset} />
            <Route path="/location-manual" component={LocationManual} />
            <Route path="/edit-preference" component={EditPreference} />
            {/* <Route path="/edit-location" component={AddressModal} /> */}
            <Route path="/edit-location" component={AddressSelectModal} />
            <Route path="/" exact={true} render={() => {
              return <IntroScreen />
            }} />
          </IonReactRouter>
        )}
      </>
    </IonApp>
  </CapacitorStripeProvider>
);

} };

function mapStateToProps(state: any, ownProps: any) { return { startTour: state.startTour, User: state.User

}; }

export default connect(mapStateToProps)(App);`

[5snitish]

this is main tabs code

`import { IonTabs, IonTabBar, IonTabButton, IonIcon, IonRouterOutlet, IonLabel,

} from "@ionic/react"; import React from "react"; import { Redirect, Route } from "react-router"; import "./MainTabs.css"; import { calendar } from "ionicons/icons";

import HomeTab from "./HomeTab"; import ExploreTab from "./ExploreTab"; import MessagesTab from "./MessagesTab"; import BatchesTab from "./BatchesTab"; import FavouritesTab from "./FavouritesTab";

const MainTabs: React.FC = () => { return (

} exact={true} /> } exact={true} /> } exact={true} /> } exact={true} /> } exact={true} /> {/*-- Tab bar --*/} Home Explore Messages Batches

); };

export default MainTabs;`

[averyjohnston]

Could you create a minimal Github repo that only contains the code necessary to reproduce the issue, and post a link here? You can see more information on why and how in the contributing guide.

[ionitron-bot[bot]]

Thanks for the issue! This issue is being closed due to the lack of a reply. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Thank you for using Ionic!