Modularize Back Button Logic

[samanthasbytes]

Issue Description

When a user is in the ProfileView, they can navigate directly to the page of any movie on their favorites list. However, the favorites list is displayed using the same MovieCard component that is used in the MainView. As a result, when the user clicks the "Back" button in the single movie view, they are returned to the homepage (MainView) instead of their ProfileView.

Steps to Reproduce:

1. Log in to the application.
2. Navigate to the ProfileView.
3. Click on a movie from the favorites list.
4. Click the "Back" button in the single movie view.
5. Observe that the user is redirected to the homepage (MainView) instead of the ProfileView.

Expected Behavior:

When the "Back" button is clicked in the single movie view, the user should be returned to the ProfileView if they navigated to the movie from there.

Actual Behavior:

The user is returned to the MainView when clicking the "Back" button in the single movie view, regardless of whether they navigated to the movie from the ProfileView.

---

Proposed Solution

• Modify the navigation logic in the single movie view's "Back" button to account for the navigation context (e.g., whether the user came from ProfileView or MainView).
• Use React Router's state or query to pass the originating view context when navigating to the single movie view.

Implementation Suggestions:

1. When navigating to a movie from ProfileView, pass additional context:

<Link to={`/movies/${movie._id}`} state={{ from: 'ProfileView' }}>
  <Button>Details</Button>
</Link>

2. In the single movie view, check the navigation context using useLocation:

const location = useLocation();

  const handleBack = () => {
    if (location.state?.from === 'ProfileView') {
      navigate('/profile');
    } else {
      navigate('/');
    }
  };

3. Update the "Back" button in the single movie view to call handleBack.

---

Benefits

• Improves navigation consistency by ensuring the user is returned to the appropriate view.
• Enhances the user experience by maintaining logical navigation paths.
• Avoids confusion caused by always redirecting back to the MainView, regardless of the navigation context.