Fix deployment of Segment app

.changeset/four-seahorses-itch.md

@@ -0,0 +1,5 @@
+---
+"segment": patch
+---
+
+Fixed broken deployment of Segment app

apps/segment/.eslintrc.cjs

@@ -4,6 +4,7 @@ module.exports = {
   plugins: ["node"],
   rules: {
     "turbo/no-undeclared-env-vars": ["error"],
+    "node/no-process-env": ["error"],
   },
   parserOptions: {
     project: "tsconfig.json",

apps/segment/package.json

@@ -19,11 +19,18 @@
     "@hookform/resolvers": "^3.3.1",
     "@saleor/app-sdk": "link:../../node_modules/@saleor/app-sdk",
     "@saleor/apps-logger": "workspace:*",
+    "@saleor/apps-otel": "workspace:*",
     "@saleor/apps-shared": "workspace:*",
     "@saleor/apps-ui": "workspace:*",
     "@saleor/macaw-ui": "1.1.10",
     "@saleor/react-hook-form-macaw": "workspace:*",
+    "@saleor/sentry-utils": "workspace:*",
+    "@saleor/webhook-utils": "workspace:*",
+    "@sentry/cli": "../../node_modules/@sentry/cli",
+    "@sentry/nextjs": "../../node_modules/@sentry/nextjs",
+    "@sentry/node": "../../node_modules/@sentry/node",
     "@segment/analytics-node": "^1.1.0",
+    "@t3-oss/env-nextjs": "0.11.1",
     "@trpc/client": "10.43.1",
     "@trpc/next": "10.43.1",
     "@trpc/server": "10.43.1",

apps/segment/scripts/deploy.ts

@@ -0,0 +1,10 @@
+import { execSync } from "node:child_process";
+
+import { exportSentryReleaseEnvironmentVariable } from "@saleor/sentry-utils";
+
+import packageJson from "../package.json";
+
+exportSentryReleaseEnvironmentVariable(packageJson.version);
+
+execSync("pnpm run build", { stdio: "inherit" });
+execSync("pnpm run migrate", { stdio: "inherit" });

apps/segment/scripts/migration-logger.ts

@@ -0,0 +1,14 @@
+// eslint-disable-next-line no-restricted-imports
+import { attachLoggerVercelBuildtimeTransport, rootLogger } from "@saleor/apps-logger";
+
+rootLogger.settings.maskValuesOfKeys = ["username", "password", "token"];
+
+attachLoggerVercelBuildtimeTransport(rootLogger);
+
+export const createMigrationScriptLogger = (name: string, params?: Record<string, unknown>) =>
+  rootLogger.getSubLogger(
+    {
+      name: name,
+    },
+    params,
+  );

apps/segment/scripts/run-webhooks-migration.ts

@@ -0,0 +1,87 @@
+import { WebhookMigrationRunner } from "@saleor/webhook-utils";
+import * as Sentry from "@sentry/node";
+
+import { env } from "@/env";
+import { createInstrumentedGraphqlClient } from "@/lib/create-instrumented-graphql-client";
+import { apl } from "@/saleor-app";
+
+import { appWebhooks } from "../src/modules/webhooks/webhooks";
+import { createMigrationScriptLogger } from "./migration-logger";
+
+const args = process.argv.slice(2);
+const dryRun = args.includes("--dry-run");
+
+const logger = createMigrationScriptLogger("WebhooksMigrationScript");
+
+Sentry.init({
+  dsn: env.NEXT_PUBLIC_SENTRY_DSN,
+  enableTracing: false,
+  environment: env.ENV,
+  includeLocalVariables: true,
+  ignoreErrors: [],
+  integrations: [],
+});
+
+const runMigrations = async () => {
+  logger.info(`Starting webhooks migration`);
+  logger.info(`Fetching environments from the ${env.APL} APL`);
+
+  const saleorCloudEnv = await apl.getAll().catch(() => {
+    logger.error(`Could not fetch instances from ${env.APL} APL`);
+
+    process.exit(1);
+  });
+
+  await Promise.allSettled(
+    saleorCloudEnv.map(async (saleorEnv) => {
+      const { saleorApiUrl, token } = saleorEnv;
+
+      logger.info(`Migrating webhooks for ${saleorApiUrl}`);
+
+      const client = createInstrumentedGraphqlClient({
+        saleorApiUrl: saleorApiUrl,
+        token: token,
+      });
+
+      const runner = new WebhookMigrationRunner({
+        dryRun,
+        logger,
+        client,
+        saleorApiUrl,
+        getManifests: async ({ appDetails }) => {
+          const webhooks = appDetails.webhooks;
+
+          if (!webhooks?.length) {
+            logger.warn("The environment does not have any webhooks, skipping");
+            return [];
+          }
+
+          const enabled = webhooks.some((w) => w.isActive);
+
+          const targetUrl = appDetails.appUrl;
+
+          if (!targetUrl?.length) {
+            logger.error("App has no defined appUrl, skipping");
+            return [];
+          }
+
+          const baseUrl = new URL(targetUrl).origin;
+
+          // All webhooks in this application are turned on or off. If any of them is enabled, we enable all of them.
+          return appWebhooks.map((w) => ({ ...w.getWebhookManifest(baseUrl), enabled }));
+        },
+      });
+
+      await runner.migrate().catch((error) => {
+        Sentry.captureException(error);
+      });
+    }),
+  );
+};
+
+runMigrations();
+
+process.on("beforeExit", () => {
+  logger.info(`Webhook migration complete for all environments from ${env.APL} APL`);
+  process.exit(0);
+});

apps/segment/src/env.ts

@@ -0,0 +1,56 @@
+/* eslint-disable node/no-process-env */
+import { createEnv } from "@t3-oss/env-nextjs";
+import { z } from "zod";
+
+// https://env.t3.gg/docs/recipes#booleans
+const booleanSchema = z
+  .string()
+  .refine((s) => s === "true" || s === "false")
+  .transform((s) => s === "true");
+
+export const env = createEnv({
+  client: {
+    NEXT_PUBLIC_SENTRY_DSN: z.string().optional(),
+  },
+  server: {
+    ALLOWED_DOMAIN_PATTERN: z.string().optional(),
+    APL: z.enum(["saleor-cloud", "file"]).optional().default("file"),
+    APP_API_BASE_URL: z.string().optional(),
+    APP_IFRAME_BASE_URL: z.string().optional(),
+    APP_LOG_LEVEL: z.enum(["fatal", "error", "warn", "info", "debug", "trace"]).default("info"),
+    FILE_APL_PATH: z.string().optional(),
+    MANIFEST_APP_ID: z.string().optional().default("saleor.app.segment-v2"),
+    REST_APL_ENDPOINT: z.string().optional(),
+    REST_APL_TOKEN: z.string().optional(),
+    OTEL_ENABLED: booleanSchema.optional().default("false"),
+    OTEL_SERVICE_NAME: z.string().optional(),
+    PORT: z.coerce.number().optional().default(3000),
+    SECRET_KEY: z.string(),
+    VERCEL_URL: z.string().optional(),
+  },
+  shared: {
+    NODE_ENV: z.enum(["development", "production", "test"]).optional().default("development"),
+    ENV: z.enum(["local", "development", "staging", "production"]).optional().default("local"),
+  },
+  // we use the manual destruction here to validate if env variable is set inside turbo.json
+  runtimeEnv: {
+    ALLOWED_DOMAIN_PATTERN: process.env.ALLOWED_DOMAIN_PATTERN,
+    APL: process.env.APL,
+    APP_API_BASE_URL: process.env.APP_API_BASE_URL,
+    APP_IFRAME_BASE_URL: process.env.APP_IFRAME_BASE_URL,
+    APP_LOG_LEVEL: process.env.APP_LOG_LEVEL,
+    FILE_APL_PATH: process.env.FILE_APL_PATH,
+    MANIFEST_APP_ID: process.env.MANIFEST_APP_ID,
+    ENV: process.env.ENV,
+    NEXT_PUBLIC_SENTRY_DSN: process.env.NEXT_PUBLIC_SENTRY_DSN,
+    NODE_ENV: process.env.NODE_ENV,
+    OTEL_ENABLED: process.env.OTEL_ENABLED,
+    OTEL_SERVICE_NAME: process.env.OTEL_SERVICE_NAME,
+    PORT: process.env.PORT,
+    REST_APL_ENDPOINT: process.env.REST_APL_ENDPOINT,
+    REST_APL_TOKEN: process.env.REST_APL_TOKEN,
+    SECRET_KEY: process.env.SECRET_KEY,
+    VERCEL_URL: process.env.VERCEL_URL,
+  },
+  isServer: typeof window === "undefined" || process.env.NODE_ENV === "test",
+});

apps/segment/src/lib/create-instrumented-graphql-client.ts

@@ -0,0 +1,12 @@
+import { otelExchange } from "@saleor/apps-otel";
+import { createGraphQLClient, CreateGraphQLClientArgs } from "@saleor/apps-shared";
+
+type CreateGraphQLClientProps = Omit<CreateGraphQLClientArgs, "opts">;
+
+export const createInstrumentedGraphqlClient = (props: CreateGraphQLClientProps) =>
+  createGraphQLClient({
+    ...props,
+    opts: {
+      prependingFetchExchanges: [otelExchange],
+    },
+  });

apps/segment/src/logger-context.ts

@@ -1,60 +1,6 @@
-import { SALEOR_API_URL_HEADER, SALEOR_EVENT_HEADER } from "@saleor/app-sdk/const";
-import { AsyncLocalStorage } from "async_hooks";
-import { NextApiHandler, NextApiRequest, NextApiResponse } from "next";
+import { LoggerContext } from "@saleor/apps-logger/node";
 
-class LoggerContext {
-  private als = new AsyncLocalStorage<Record<string, unknown>>();
-  private project_name = process.env.OTEL_SERVICE_NAME as string | undefined;
-
-  getRawContext() {
-    const store = this.als.getStore();
-
-    if (!store) {
-      if (!process.env.CI && process.env.OTEL_ENABLED === "true") {
-        console.warn(
-          "You cant use LoggerContext outside of the wrapped scope. Will fallback to {}",
-        );
-      }
-
-      return {};
-    }
-
-    return store;
-  }
-
-  async wrap(fn: (...args: unknown[]) => unknown, initialState = {}) {
-    return this.als.run(
-      {
-        ...initialState,
-        project_name: this.project_name,
-      },
-      fn,
-    );
-  }
-
-  set(key: string, value: string | number | Record<string, unknown> | null) {
-    const store = this.getRawContext();
-
-    store[key] = value;
-  }
-}
 /**
  * Server-side only
  */
 export const loggerContext = new LoggerContext();
-
-export const wrapWithLoggerContext = (handler: NextApiHandler, loggerContext: LoggerContext) => {
-  return (req: NextApiRequest, res: NextApiResponse) => {
-    return loggerContext.wrap(() => {
-      const saleorApiUrl = req.headers[SALEOR_API_URL_HEADER] as string;
-      const saleorEvent = req.headers[SALEOR_EVENT_HEADER] as string;
-      const path = req.url as string;
-
-      loggerContext.set("path", path);
-      loggerContext.set("saleorApiUrl", saleorApiUrl ?? null);
-      loggerContext.set("saleorEvent", saleorEvent ?? null);
-
-      return handler(req, res);
-    });
-  };
-};

apps/segment/src/logger.ts

@@ -1,18 +1,19 @@
 import { attachLoggerConsoleTransport, rootLogger } from "@saleor/apps-logger";
 
 import packageJson from "../package.json";
+import { env } from "./env";
 
 rootLogger.settings.maskValuesOfKeys = ["metadata", "username", "password", "apiKey"];
 
-if (process.env.NODE_ENV !== "production") {
+if (env.NODE_ENV !== "production") {
   attachLoggerConsoleTransport(rootLogger);
 }
 
 if (typeof window === "undefined") {
   // Don't remove require - it's necessary for proper logger initialization
   const { attachLoggerVercelRuntimeTransport } = require("@saleor/apps-logger/node");
 
-  if (process.env.NODE_ENV === "production") {
+  if (env.NODE_ENV === "production") {
     attachLoggerVercelRuntimeTransport(
       rootLogger,
       packageJson.version,

apps/segment/src/modules/configuration/metadata-manager.ts

@@ -2,11 +2,13 @@ import { SettingsManager } from "@saleor/app-sdk/settings-manager";
 import { EncryptedMetadataManagerFactory } from "@saleor/apps-shared";
 import { Client } from "urql";
 
+import { env } from "@/env";
+
 export const createSettingsManager = (
   client: Pick<Client, "query" | "mutation">,
   appId: string,
 ): SettingsManager => {
-  const metadataManagerFactory = new EncryptedMetadataManagerFactory(process.env.SECRET_KEY!);
+  const metadataManagerFactory = new EncryptedMetadataManagerFactory(env.SECRET_KEY);
 
   return metadataManagerFactory.create(client, appId);
 };

apps/segment/src/modules/trpc/trpc-client.ts

@@ -2,15 +2,16 @@ import { SALEOR_API_URL_HEADER, SALEOR_AUTHORIZATION_BEARER_HEADER } from "@sale
 import { httpBatchLink } from "@trpc/client";
 import { createTRPCNext } from "@trpc/next";
 
+import { env } from "@/env";
 import { appBridgeInstance } from "@/pages/_app";
 
 import { AppRouter } from "./trpc-app-router";
 
 function getBaseUrl() {
   if (typeof window !== "undefined") return "";
-  if (process.env.VERCEL_URL) return `https://${process.env.VERCEL_URL}`;
+  if (env.VERCEL_URL) return `https://${env.VERCEL_URL}`;
 
-  return `http://localhost:${process.env.PORT ?? 3000}`;
+  return `http://localhost:${env.PORT}`;
 }
 
 export const trpcClient = createTRPCNext<AppRouter>({

apps/segment/src/modules/webhooks/definitions/order-cancelled.ts

@@ -0,0 +1,16 @@
+import { SaleorAsyncWebhook } from "@saleor/app-sdk/handlers/next";
+
+import {
+  OrderCancelledDocument,
+  OrderUpdatedSubscriptionPayloadFragment,
+} from "@/generated/graphql";
+import { saleorApp } from "@/saleor-app";
+
+export const orderCancelledAsyncWebhook =
+  new SaleorAsyncWebhook<OrderUpdatedSubscriptionPayloadFragment>({
+    name: "Order Cancelled",
+    webhookPath: "api/webhooks/order-cancelled",
+    event: "ORDER_CANCELLED",
+    apl: saleorApp.apl,
+    query: OrderCancelledDocument,
+  });

apps/segment/src/modules/webhooks/definitions/order-created.ts

@@ -0,0 +1,13 @@
+import { SaleorAsyncWebhook } from "@saleor/app-sdk/handlers/next";
+
+import { OrderCreatedDocument, OrderCreatedSubscriptionPayloadFragment } from "@/generated/graphql";
+import { saleorApp } from "@/saleor-app";
+
+export const orderCreatedAsyncWebhook =
+  new SaleorAsyncWebhook<OrderCreatedSubscriptionPayloadFragment>({
+    name: "Order Created",
+    webhookPath: "api/webhooks/order-created",
+    event: "ORDER_CREATED",
+    apl: saleorApp.apl,
+    query: OrderCreatedDocument,
+  });

apps/segment/src/modules/webhooks/definitions/order-fully-paid.ts

@@ -0,0 +1,16 @@
+import { SaleorAsyncWebhook } from "@saleor/app-sdk/handlers/next";
+
+import {
+  OrderFullyPaidDocument,
+  OrderFullyPaidSubscriptionPayloadFragment,
+} from "@/generated/graphql";
+import { saleorApp } from "@/saleor-app";
+
+export const orderFullyPaidAsyncWebhook =
+  new SaleorAsyncWebhook<OrderFullyPaidSubscriptionPayloadFragment>({
+    name: "Order Fully Paid",
+    webhookPath: "api/webhooks/order-fully-paid",
+    event: "ORDER_FULLY_PAID",
+    apl: saleorApp.apl,
+    query: OrderFullyPaidDocument,
+  });

apps/segment/src/modules/webhooks/definitions/order-refunded.ts

@@ -0,0 +1,16 @@
+import { SaleorAsyncWebhook } from "@saleor/app-sdk/handlers/next";
+
+import {
+  OrderRefundedDocument,
+  OrderRefundedSubscriptionPayloadFragment,
+} from "@/generated/graphql";
+import { saleorApp } from "@/saleor-app";
+
+export const orderRefundedAsyncWebhook =
+  new SaleorAsyncWebhook<OrderRefundedSubscriptionPayloadFragment>({
+    name: "Order Refunded",
+    webhookPath: "api/webhooks/order-refunded",
+    event: "ORDER_REFUNDED",
+    apl: saleorApp.apl,
+    query: OrderRefundedDocument,
+  });