Unable to authenticate Remix template app in production

Update: while the log was caught in the spam filter and never posted here I continued debugging and found a few references to redirect from @remix-run/node.
Changing these to the redirect helper returned from authenticate.admin solved the authentication problems.

Do not use redirect from @remix-run/node (and check your IDE’s sneaky imports, that is how they got me)

For the other two problems:

  1. Translations are not being loaded, even though the resources are available at their respective urls.
  2. < Button > element not firing its onClick anymore.

Both problems stem from a solution to another problem.
When deploying my application to the staging environment I received a Response.json is not a function error. The shopify forums presented a solution of changing a featureflag as described here: Error when upgrading Remix, Response.json is not a function - #5 by maxidr

However, this caused the aforementioned problems and was solved this by setting the v3_singleFetch back to false, and changing the Response.json calls to returning pure objects or using the data function from @remix-run/node, this seems to be working for me for now.

As an example for future visitors on how I resolved the Response.json error:

import {data} from "@remix-run/node";

export async function action({request, params}: ActionFunctionArgs) {

  if (request.method === "POST") {
    return { hello:'world'}
  }

  if (request.method === "DELETE") {
    return data({goodbye:'world'},{status:410})
  }
}

Also, I recommend changing the shopify logging code to something like this:

//shopify.server
const shopify = shopifyApp({
  logger: {
    level: process.env.LOG_LEVEL ?? LogSeverity.Warning
  }
// And the rest of the configuration
}

It allows for enabling/disabling of logging via your environment or .env file via the LOG_LEVEL variable without having to rebuild your application, with the values being:

#    Error = 0,
#    Warning = 1,
#    Info = 2,
#    Debug = 3