Show message when failing to join a team via link because already in group

app/features/sendouq/routes/q.looking.tsx

@@ -5,7 +5,7 @@ import type {
   V2_MetaFunction,
 } from "@remix-run/node";
 import { redirect } from "@remix-run/node";
-import { useFetcher, useLoaderData } from "@remix-run/react";
+import { useFetcher, useLoaderData, useSearchParams } from "@remix-run/react";
 import clsx from "clsx";
 import * as React from "react";
 import { Flipper } from "react-flip-toolkit";
@@ -352,10 +352,13 @@ export const loader = async ({ request }: LoaderArgs) => {
 
 export default function QLookingPage() {
   const data = useLoaderData<typeof loader>();
+  const [searchParams] = useSearchParams();
   useAutoRefresh();
 
   const ownGroup = data.groups.own as LookingGroupWithInviteCode;
 
+  const wasTryingToJoinAnotherTeam = searchParams.get("joining") === "true";
+
   return (
     <Main className="stack lg">
       <div className="stack sm">
@@ -375,6 +378,11 @@ export default function QLookingPage() {
           trustedPlayers={data.trustedPlayers}
         />
       ) : null}
+      {wasTryingToJoinAnotherTeam ? (
+        <div className="text-warning text-center">
+          Before joining another group, leave the current one
+        </div>
+      ) : null}
       <Groups />
     </Main>
   );

app/features/sendouq/routes/q.tsx

@@ -185,18 +185,19 @@ export const action: ActionFunction = async ({ request }) => {
 export const loader = async ({ request }: LoaderArgs) => {
   const user = await getUserId(request);
 
+  const code = new URL(request.url).searchParams.get(
+    JOIN_CODE_SEARCH_PARAM_KEY
+  );
+
   const redirectLocation = groupRedirectLocationByCurrentLocation({
     group: user ? findCurrentGroupByUserId(user.id) : undefined,
     currentLocation: "default",
   });
 
   if (redirectLocation) {
-    throw redirect(redirectLocation);
+    throw redirect(`${redirectLocation}${code ? "?joining=true" : ""}`);
   }
 
-  const code = new URL(request.url).searchParams.get(
-    JOIN_CODE_SEARCH_PARAM_KEY
-  );
   const teamInvitedTo = code && user ? findTeamByInviteCode(code) : undefined;
 
   const now = new Date();