Logout route is not destroying the user session

[McNouvion]

Have you experienced this bug with the latest version of the template?

Yes

Steps to Reproduce

Just setup a new project, create an account and login, then hit '/logout' When I get back to the home page I'm still signed in ...

I did not spend a ton of time trying to figure out the root cause but nothing I did in the session.server.ts file seemed to have any effects. I suspect something else is setting/committing the session back in?

For now I just updated the logout.tsx loader which I think is called out as something you should not do in the docs (?? Sorry I have only started using remix a few weeks ago).

export const loader = async ({ request }: LoaderFunctionArgs) => {
  const session = await getSession(request);

  return redirect("/", {
    headers: {
      "Set-Cookie": await sessionStorage.destroySession(session),
    },
  });
};

Expected Behavior

When I hit the /logout route, the session is destroyed and I'm redirected to the homepage where I see a login and a signup button.

Actual Behavior

I'm redirected to the homepage where I see the "View notes" button. I also cannot navigate to the login page.

[falecci]

The /logout route code is:

import type { ActionFunctionArgs } from "@remix-run/node";
import { redirect } from "@remix-run/node";

import { logout } from "~/session.server";

export const action = async ({ request }: ActionFunctionArgs) =>
  logout(request);

export const loader = async () => redirect("/");

This means that if you hit /logout in the browser, you will go into the loader path, not the action. That's why you are being just redirected and not logging out.

If you want to logout via url, you can just update the loader function as the following

import type { ActionFunctionArgs, LoaderFunctionArgs } from "@remix-run/node";

import { logout } from "~/session.server";

export const action = async ({ request }: ActionFunctionArgs) =>
  logout(request);

export const loader = async ({ request }: LoaderFunctionArgs) =>
  logout(request);

If you want to log out by using the action, you'll need a Form.

        <Form action="/logout" method="post">
          <button
            type="submit"
          >
            Log out
          </button>
        </Form>

[McNouvion]

Thank you, that works :)