docs(warehouse-native): convert mode diagrams to architecture-beta (FT-2119)

.diagram-design

@@ -0,0 +1 @@
+profile: absmartly

docs/web-console-docs/warehouse-native/modes.mdx

@@ -33,49 +33,9 @@ In Hybrid mode, you keep the ABsmartly-managed data source as your default and a
 - When a goal is sourced from an external warehouse, ABsmartly makes the default source's exposures available to that warehouse so the two can be evaluated together. You enable this by pointing ABsmartly at an object store through the **[Exposures import](./get-started#step-4-configure-exposures-import-hybrid-only)** section on each external data source.
 - Because that import lands the exposures inside your warehouse, **goals sourced from your warehouse can filter and enrich those exposures** the same way Fully mode does — strip out bots and internal traffic, or join in your own attributes table. **Goals that stay managed by ABsmartly don't get this**, since their exposures never leave ABsmartly's default data source.
 
-```mermaid
-%%{init: {"theme": "base", "themeVariables": {"fontFamily": "Manrope, system-ui, sans-serif", "primaryColor": "#ffffff", "primaryBorderColor": "#CA3721", "primaryTextColor": "#28293d", "lineColor": "#9296a6", "tertiaryColor": "#ffffff", "fontSize": "15px"}}}%%
-flowchart TB
-    SDK(["Your app - ABsmartly SDK"])
-
-    subgraph ABC["ABsmartly (default)"]
-        DEFAULT[("Exposures (no filtering)<br/>and managed goals")]
-    end
-
-    subgraph EWH["Your warehouse (external)"]
-        IMPORT[("Imported<br/>exposures")]
-        WGOALS[("Your goals")]
-        ATTR[("Your attributes")]
-        FILTER("Filter and enrich")
-        QUERY("Query interface")
-    end
-
-    subgraph CLOUD["ABsmartly Cloud"]
-        ENGINE("Assignment logic, stats and<br/>metric governance")
-    end
-
-    SDK --> DEFAULT
-    DEFAULT -.->|"exposures import"| IMPORT
-    IMPORT --> FILTER
-    ATTR --> FILTER
-    FILTER --> QUERY
-    WGOALS --> QUERY
-    DEFAULT --> ENGINE
-    ENGINE -.->|"scheduled query"| QUERY
-    QUERY -.->|"aggregate results only"| ENGINE
-
-    style ABC fill:#FBEDEA,stroke:#CA3721,stroke-width:1.5px,color:#28293d
-    style EWH fill:#EEF1FF,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style CLOUD fill:#FBEDEA,stroke:#CA3721,stroke-width:1.5px,color:#28293d
-    style DEFAULT fill:#ffffff,stroke:#CA3721,stroke-width:1.5px,color:#28293d
-    style IMPORT fill:#ffffff,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style WGOALS fill:#ffffff,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style ATTR fill:#ffffff,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style FILTER fill:#465BFF,stroke:#465BFF,stroke-width:1.5px,color:#ffffff
-    style QUERY fill:#ffffff,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style ENGINE fill:#ffffff,stroke:#CA3721,stroke-width:1.5px,color:#28293d
-    style SDK fill:#ffffff,stroke:#9296a6,stroke-width:1.5px,color:#28293d
-```
+![Hybrid Warehouse Native architecture: the ABsmartly SDK sends exposures into ABsmartly's default source, which handles unfiltered managed goals directly and also imports exposures into the customer's external warehouse, where imported exposures, goals, and attributes are filtered and enriched before ABsmartly Cloud runs a scheduled query and returns only aggregate results. ABsmartly Cloud retains user-level data for exposures and any goals kept on the managed default source.](/img/warehouse-native/hybrid-architecture.svg)
+
+*Across the privacy boundary between your warehouse and ABsmartly Cloud, ABsmartly runs a scheduled query in and only aggregate results come back out — no user-level data crosses that boundary. The default source's exposures flow into your warehouse on a scheduled exposures import.*
 
 Hybrid lets you bring metrics into your warehouse at your own pace: you keep ABsmartly's battle-tested assignment and exposure pipeline, and move as many (or as few) of your goals into your warehouse as you like — gaining filtering and enrichment for each one you move.
 
@@ -88,41 +48,9 @@ Because every exposure already lives in your warehouse, Fully extends Hybrid's w
 - **Filter exposures yourself.** You control the exposures table, so you can strip out bots, scrapers, internal traffic, or any other unwanted exposures before ABsmartly analyzes them — using your own logic in your own warehouse.
 - **Enrich exposures with your own attributes.** You can join in an external **attributes** table to add segmentation dimensions, then slice experiment results by those attributes.
 
-```mermaid
-%%{init: {"theme": "base", "themeVariables": {"fontFamily": "Manrope, system-ui, sans-serif", "primaryColor": "#ffffff", "primaryBorderColor": "#CA3721", "primaryTextColor": "#28293d", "lineColor": "#9296a6", "tertiaryColor": "#ffffff", "fontSize": "15px"}}}%%
-flowchart TB
-    SDK(["Your app - ABsmartly SDK"])
-
-    subgraph WH["Your warehouse (default)"]
-        EXP[("Exposures")]
-        GOALS[("Goals")]
-        ATTR[("Your attributes")]
-        FILTER("Filter and enrich")
-        QUERY("Query interface")
-    end
-
-    subgraph ABC["ABsmartly Cloud"]
-        ENGINE("Assignment logic, stats and<br/>metric governance<br/>no user-level data stored")
-    end
-
-    SDK --> EXP
-    EXP --> FILTER
-    ATTR --> FILTER
-    FILTER --> QUERY
-    GOALS --> QUERY
-    ENGINE -.->|"scheduled query"| QUERY
-    QUERY -.->|"aggregate results only"| ENGINE
-
-    style WH fill:#EEF1FF,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style ABC fill:#FBEDEA,stroke:#CA3721,stroke-width:1.5px,color:#28293d
-    style EXP fill:#ffffff,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style GOALS fill:#ffffff,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style ATTR fill:#ffffff,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style FILTER fill:#465BFF,stroke:#465BFF,stroke-width:1.5px,color:#ffffff
-    style QUERY fill:#ffffff,stroke:#465BFF,stroke-width:1.5px,color:#28293d
-    style ENGINE fill:#ffffff,stroke:#CA3721,stroke-width:1.5px,color:#28293d
-    style SDK fill:#ffffff,stroke:#9296a6,stroke-width:1.5px,color:#28293d
-```
+![Fully Warehouse Native architecture: the ABsmartly SDK sends exposures into the customer's own warehouse, which is the default data source holding exposures, attributes, and goals, filtering and enriching every exposure before ABsmartly Cloud runs a scheduled query and returns only aggregate results, storing no user-level data.](/img/warehouse-native/fully-architecture.svg)
+
+*Across the privacy boundary between your warehouse and ABsmartly Cloud, ABsmartly runs a scheduled query in and only aggregate results come back out — no user-level data crosses that boundary.*
 
 :::info Why the exposure source matters
 Exposure-side filtering (bots, scrapers, internal traffic) and attribute enrichment both operate on the exposure stream, and only work once that stream lives inside your warehouse. In **Hybrid**, that's true for goals you source from your warehouse — their imported exposures can be filtered and enriched. It's **not** true for goals that stay managed by ABsmartly, since their exposures never leave the default data source. In **Fully**, every exposure lives in your warehouse, so filtering and enrichment apply to every goal.

docusaurus.config.js

@@ -56,8 +56,11 @@ const config = {
     locales: ["en"],
   },
 
-  // Client modules for anchor redirects
-  clientModules: [require.resolve("./src/anchorRedirects.ts")],
+  // Client modules for anchor redirects and mermaid icon registration
+  clientModules: [
+    require.resolve("./src/anchorRedirects.ts"),
+    require.resolve("./src/scripts/mermaidIcons.js"),
+  ],
 
   presets: [
     [

package.json

@@ -21,6 +21,7 @@
     "@docusaurus/plugin-ideal-image": "^3.10.2",
     "@docusaurus/preset-classic": "^3.10.2",
     "@docusaurus/theme-mermaid": "^3.10.2",
+    "@iconify-json/mdi": "^1.2.3",
     "@mdx-js/react": "^3.1.1",
     "clsx": "^2.1.0",
     "docusaurus-plugin-openapi-docs": "^5.1.3",

src/scripts/mermaidIcons.js

@@ -0,0 +1,7 @@
+import { icons } from "@iconify-json/mdi";
+
+if (typeof window !== "undefined") {
+  import("mermaid").then(({ default: mermaid }) => {
+    mermaid.registerIconPacks([{ name: icons.prefix, icons }]);
+  });
+}