fix: fixed back button to redirect to applications page (#35900)

added the changes to redirect to application pages instead of going back
in the history.

issue: [#34431](#34431)

fixed the navigation to not go back in history
The navigation of the back button used to go back in history. Now it
will be redirected to the expected page.

added the test for profile page:

![image](https://github.com/user-attachments/assets/18dcd56f-dab9-4b9c-8ade-9976b96a361f)

added the tests for settings page:

![image](https://github.com/user-attachments/assets/869fd21a-edf3-4ec9-ad68-bf3eea5d54e1)

video:


https://github.com/user-attachments/assets/35a805ec-a579-4571-b4c6-e415f0f5c5f3



## Automation

/ok-to-test tags="@tag.All"

### 🔍 Cypress test results
<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/10659602683>
> Commit: 23f2285
> <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=10659602683&attempt=3"
target="_blank">Cypress dashboard</a>.
> Tags: `@tag.All`
> Spec:
> <hr>Mon, 02 Sep 2024 04:52:56 UTC
<!-- end of auto-generated comment: Cypress test results  -->





<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->
## Summary by CodeRabbit


- **New Features**
- Enhanced navigation for the BackButton in both UserProfile and
Settings components, directing users to the applications page and
specific workspace pages, respectively.

- **Bug Fixes**
- Improved test coverage for BackButton interactions in both UserProfile
and Settings components, ensuring correct navigation behavior is
verified.

- **Tests**
- Expanded test suite for UserProfile and Settings components,
incorporating better routing and interaction simulations.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

app/client/src/pages/UserProfile/index.test.tsx

@@ -1,6 +1,6 @@
 import "@testing-library/jest-dom/extend-expect";
 import React from "react";
-import { render } from "@testing-library/react";
+import { render, screen, fireEvent } from "@testing-library/react";
 import { Provider } from "react-redux";
 import configureStore from "redux-mock-store";
 import { lightTheme } from "selectors/themeSelectors";
@@ -87,6 +87,15 @@ jest.mock("actions/gitSyncActions", () => ({
   fetchGlobalGitConfigInit: jest.fn(),
 }));
 
+const mockHistoryPush = jest.fn();
+
+jest.mock("react-router-dom", () => ({
+  ...jest.requireActual("react-router-dom"),
+  useHistory: () => ({
+    push: mockHistoryPush,
+  }),
+}));
+
 const mockStore = configureStore([]);
 describe("Git config ", () => {
   // TODO: Fix this the next time the file is edited
@@ -128,6 +137,22 @@ describe("Git config ", () => {
     expect(getAllByText("Sign in to your account")).toBeInTheDocument;
   });
 
+  it("should call history push when user goes back to applications", () => {
+    store = mockStore(defaultStoreState);
+    render(
+      <Provider store={store}>
+        <ThemeProvider theme={lightTheme}>
+          <Router>
+            <UserProfile />
+          </Router>
+        </ThemeProvider>
+      </Provider>,
+    );
+    const backButton = screen.getByText("Back");
+    fireEvent.click(backButton);
+    expect(mockHistoryPush).toHaveBeenCalledWith("/applications");
+  });
+
   afterAll(() => {
     jest.clearAllMocks();
     store.clearActions();

app/client/src/pages/UserProfile/index.tsx

@@ -56,7 +56,7 @@ function UserProfile() {
   return (
     <PageWrapper displayName={"Profile"}>
       <ProfileWrapper>
-        <BackButton />
+        <BackButton goTo="/applications" />
         <Tabs defaultValue={selectedTab} onValueChange={setSelectedTab}>
           <TabsList>
             {tabs.map((tab) => {

app/client/src/pages/workspace/__tests__/settings.test.tsx

@@ -1,9 +1,17 @@
 import React from "react";
 import "@testing-library/jest-dom";
 import Router from "react-router-dom";
+import { BrowserRouter } from "react-router-dom";
 import { render, screen } from "test/testUtils";
+import {
+  render as testRender,
+  screen as testScreen,
+} from "@testing-library/react";
+import { fireEvent } from "@testing-library/react";
 import Settings from "../settings";
 import * as reactRedux from "react-redux";
+import configureStore from "redux-mock-store";
+import { Provider } from "react-redux";
 
 // TODO: Fix this the next time the file is edited
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -151,9 +159,16 @@ const mockWorkspaceData = {
   new: false,
 };
 
+const mockHistoryPush = jest.fn();
+
+const mockStore = configureStore([]);
+
 jest.mock("react-router-dom", () => ({
   ...jest.requireActual("react-router-dom"),
   useParams: jest.fn(),
+  useHistory: () => ({
+    push: mockHistoryPush,
+  }),
 }));
 
 function renderComponent() {
@@ -190,4 +205,19 @@ describe("<Settings />", () => {
     expect(tabList.length).toBeGreaterThanOrEqual(2);
     expect(tabList.length).toBeLessThanOrEqual(3);
   });
+
+  it("should redirect to workspace page if user wants to go back", () => {
+    testRender(
+      <BrowserRouter>
+        <Provider store={mockStore(mockWorkspaceData)}>
+          <Settings />
+        </Provider>
+      </BrowserRouter>,
+    );
+    const backBtn = testScreen.getByText("Back");
+    fireEvent.click(backBtn);
+    expect(mockHistoryPush).toHaveBeenCalledWith(
+      `/applications?workspaceId=${mockWorkspaceData.id}`,
+    );
+  });
 });

app/client/src/pages/workspace/settings.tsx

@@ -127,7 +127,7 @@ export default function Settings() {
     <>
       <SettingsWrapper data-testid="t--settings-wrapper" isMobile={isMobile}>
         <StyledStickyHeader isMobile={isMobile}>
-          <BackButton />
+          <BackButton goTo={`/applications?workspaceId=${workspaceId}`} />
           <SettingsPageHeader
             buttonText="Add users"
             onButtonClick={onButtonClick}