Update Auto-Install PRs

In order to complete the installation process, which is fairly automated, you will need to make some changes to the Backend PR(s) and Frontend PR(s).

Backend PR(s)

In order to get the Backend PR(s) ready to go, you will need to perform the following updates:

1. If you have CORS enabled, you will have to allow our headers to be received:
   • e.g. in Django, edit your settings.py by adding "X-Sf3-Rid" to the list, ALLOWED_HEADERS.
2. If you use lockfiles (poetry.lock, yarn.lock, etc), you will need to run the requirement locking command:
   • e.g. with an Poetry project, you will run poetry lock
   • e.g. with an npm project (JS/TS), you will run npm lock
3. Run your application locally and check if there are any external-facing network requests that result in response codes of 400; if there are any:
   • Add these domains to the setup_interceptors call, particularly the keyword argument domains_to_not_propagate_headers_to, which needs to be a list of strings.
   • Note: these can contain wildcard characters or entire subdomains.
   • e.g. ["api.example.com", "*.foo.com", "google.com"]
4. Commit these changes to the branch the Auto-Installation PR is using.

Frontend PR(s)

In order to get the Frontend PR(s) ready to go, you will need to perform the following updates:

1. Run your application locally and check if there are any external-facing network requests that result in response codes of 400; if there are any:
   • These domains will need to be added to the initRecorder call, particularly the keyword argument domainsToNotPropagateHeaderTo, which needs to be a array of strings.
   • Note: these can contain wildcard characters or entire subdomains.
   • e.g. ["api.example.com", "*.foo.com", "google.com"]
2. Wherever your code exists that authenticates/logs in a user, you will want to add the following code (we highly recommend using the user's email address):

import { identify } from "@sailfish-ai/recorder";
identify(user.email);

• Note: if you want to add traits, you can do so via adding an object with any key=value pairs you want.

import { identify } from "@sailfish-ai/recorder";
identify(user.email, { lastAction: "2024-11-18" });

3. Add GIT_SHA to the environment.
4. Whitelist the domain, https://api-service.sailfishqa.com, particularly the /graphql/ path, so the "Report Issue Modal" works properly.
5. If you do not wish for a specific parent class and its children to be captured, add the class sailfishSanitize/.sailfishSanitize to the element and the data should not be captured.
6. Commit these changes to the branch the Auto-Installation PR is using.

How we discover the GIT_SHA

During the build process, we pull in the environment variable, GIT_SHA, via the code block code, automatically. If you believe the following does not work, you can populate it manually in the initRecorder function call, which is set to null by default during the Auto-Installation process.

Here's how our frontend package auto-discovers the Git SHA at compile time

export function readGitSha(): string | undefined {
  // 1) global
  try {
    const g = globalThis as any;
    if (typeof g.__GIT_SHA__ === "string" && g.__GIT_SHA__)
      return g.__GIT_SHA__;
  } catch {}

  // 2) process.env
  try {
    const p = typeof process !== "undefined" ? (process as any) : undefined;
    if (p?.env?.GIT_SHA) return String(p.env.GIT_SHA);
  } catch {}

  // 3) build-time define fallback (see vite.config define)
  try {
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    const S = (globalThis as any).__GIT_SHA_DEFINE__;
    if (typeof S === "string" && S) return S;
  } catch {}

  return undefined;
}