add @dub/analytics docs

mint.json

@@ -1,7 +1,12 @@
 {
   "$schema": "https://mintlify.com/schema.json",
   "anchors": [
-    { "icon": "question", "name": "Help Center", "url": "https://dub.co/help" },
+    {
+      "icon": "circle-info",
+      "iconType": "sharp-solid",
+      "name": "Help Center",
+      "url": "https://dub.co/help"
+    },
     {
       "icon": "github",
       "name": "GitHub",
@@ -18,7 +23,7 @@
     "primary": "#9563FF"
   },
   "favicon": "/logos/favicon.png",
-  "feedback": { "thumbsRating": true },
+  "feedback": { "thumbsRating": true, "suggestEdit": true, "raiseIssue": true },
   "footerSocials": {
     "github": "https://github.com/dubinc/dub",
     "linkedin": "https://www.linkedin.com/company/dubinc",
@@ -133,7 +138,7 @@
         "api-reference/endpoint/track-customer"
       ]
     },
-    { "group": "SDKs", "pages": ["sdks/overview"] },
+    { "group": "SDKs", "pages": ["sdks/overview", "sdks/js-client/overview"] },
     {
       "group": "TypeScript",
       "pages": [

quickstart/express.mdx

@@ -9,6 +9,8 @@ import LinkArguments from "/snippets/link-arguments.mdx";
 
 <Prerequisites />
 
+## 2. Install and initialize the Dub TypeScript SDK
+
 <InstallTypescript />
 
 ## 3. Create link

quickstart/nextjs.mdx

@@ -9,6 +9,8 @@ import LinkArguments from "/snippets/link-arguments.mdx";
 
 <Prerequisites />
 
+## 2. Install and initialize the Dub TypeScript SDK
+
 <InstallTypescript />
 
 ## 3. Create link

quickstart/nuxt.mdx

@@ -8,6 +8,8 @@ import InstallTypescript from "/snippets/sdk-install-ts.mdx";
 
 <Prerequisites />
 
+## 2. Install and initialize the Dub TypeScript SDK
+
 <InstallTypescript />
 
 ## 3. Create link

quickstart/remix.mdx

@@ -9,6 +9,8 @@ import LinkArguments from "/snippets/link-arguments.mdx";
 
 <Prerequisites />
 
+## 2. Install and initialize the Dub TypeScript SDK
+
 <InstallTypescript />
 
 ## 3. Create link

quickstart/typescript.mdx

@@ -9,6 +9,8 @@ import LinkArguments from "/snippets/link-arguments.mdx";
 
 <Prerequisites />
 
+## 2. Install and initialize the Dub TypeScript SDK
+
 <InstallTypescript />
 
 ## 3. Create link

sdks/js-client/overview.mdx

@@ -0,0 +1,107 @@
+---
+title: "@dub/analytics"
+description: Client-side JavaScript SDK for for Dub Conversions
+icon: node-js
+---
+
+import InstallDubAnalytics from "/snippets/dub-analytics-install.mdx";
+
+With Dub Analytics, you can track leads and sales conversions on your website, enabling you to measure the effectiveness of your marketing campaigns.
+
+## Quickstart
+
+This quick start guide will show you how to get started with Dub Analytics on your website.
+
+<InstallDubAnalytics />
+
+## Concepts
+
+You can pass the following props to the `<Analytics />` component to customize the tracking script:
+
+<ParamField body="cookieOptions" type="CookieOption Object">
+  <Expandable title="properties">
+    <ParamField body="domain" type="string">
+      Specifies the value for the `Domain` Set-Cookie attribute. This is useful
+      for cross-domain tracking. Example: `.example.com`
+    </ParamField>
+    <ParamField body="expires" type="integer" default="90">
+      Specifies the `Date` object to be the value for the `Expires` Set-Cookie
+      attribute. Example: `new Date('2024-12-31')`
+    </ParamField>
+    <ParamField body="expiresInDays" type="integer" default="90">
+      Specifies the number (in days) to be the value for the `Expires`
+      Set-Cookie attribute. Example: `90`
+    </ParamField>
+    <ParamField body="httpOnly" type="boolean" default="false">
+      Specifies the boolean value for the `HttpOnly` Set-Cookie attribute. Be
+      careful when setting this to true, as compliant clients will not allow
+      client-side JavaScript to see the cookie in `document.cookie`.
+    </ParamField>
+    <ParamField body="maxAge" type="integer">
+      Specifies the number (in seconds) to be the value for the `Max-Age`
+      Set-Cookie attribute. Example: `3600`
+    </ParamField>
+    <ParamField body="path" type="string" default="/">
+      Specifies the value for the `Path` Set-Cookie attribute. By default, the
+      path is considered the "default path". Example: `/`
+    </ParamField>
+    <ParamField body="sameSite" type="string" default="Lax">
+      Specifies the boolean or string to be the value for the `SameSite`
+      Set-Cookie attribute. Example: `strict`
+    </ParamField>
+    <ParamField body="secure" type="boolean" default="false">
+      Specifies the boolean value for the `Secure` Set-Cookie attribute.
+    </ParamField>
+  </Expandable>
+</ParamField>
+
+<ParamField
+  body="attributionModel"
+  type="first-click | last-click"
+  default="first-click"
+>
+  The attribution model to use for the analytics event. The following
+  attribution models are available:
+
+- `first-click`: The first click model
+  gives all the credit to the first touchpoint in the customer journey.
+- `last-click`: The last click model gives all the credit to the last
+  touchpoint in the customer journey.
+
+</ParamField>
+
+For example, to set a cross domain cookie that works on the apex domain (`domain.com`) as well as subdomains (`app.domain.com`):
+
+```jsx app/layout.tsx
+import { Analytics as DubAnalytics } from "@dub/analytics";
+
+<DubAnalytics
+  cookieOptions={{
+    domain: process.env.IS_PRODUCTION_ENV
+      ? ".yourdomain.com" // for cross-domain tracking
+      : undefined,
+  }}
+/>;
+```
+
+Alternatively, to set a last-click attribution model:
+
+```jsx app/layout.tsx
+import { Analytics as DubAnalytics } from "@dub/analytics";
+
+<DubAnalytics attributionModel="last-click" />;
+```
+
+## Examples
+
+We also have some advanced examples on GitHub:
+
+<CardGroup cols={2}>
+  <Card
+    title="Dub Analytics with Geolocation"
+    icon="github"
+    href="https://github.com/dubinc/analytics/tree/main/apps/nextjs-geolocation-script"
+  >
+    See the full example on GitHub.
+  </Card>
+</CardGroup>

snippets/dub-analytics-install.mdx

@@ -0,0 +1,58 @@
+<Steps titleSize="h3">
+  <Step title="Install package">
+    Using the package manager of your choice, add the `@dub/analytics` to your project.
+
+    <CodeGroup>
+
+      ```bash npm
+      npm install @dub/analytics
+      ```
+
+      ```bash pnpm
+      pnpm add @dub/analytics
+      ```
+
+      ```bash yarn
+      yarn add @dub/analytics
+      ```
+
+      ```bash bun
+      bun add @dub/analytics
+      ```
+
+    </CodeGroup>
+
+  </Step>
+
+  <Step title="Initialize package in your code">
+    If you are using a React framework, you can use the `<Analytics />` component to track conversions on your website.
+
+    E.g. if you're using Next.js, you can add the `<Analytics />` component to your root layout component or any other pages where you want to track conversions.
+
+    ```jsx app/layout.tsx
+    import { Analytics as DubAnalytics } from '@dub/analytics/react';
+
+    export default function RootLayout({
+      children,
+    }: Readonly<{
+      children: React.ReactNode;
+    }>) {
+      return (
+        <html lang="en">
+          <body>{children}</body>
+          <DubAnalytics />
+        </html>
+      );
+    }
+    ```
+
+    You can use the `inject()` function to add the tracking script to other frameworks.
+
+    ```jsx index.js
+    import { inject } from '@dub/analytics';
+
+    inject();
+    ```
+
+  </Step>
+</Steps>

snippets/sdk-install-ts.mdx

@@ -1,5 +1,3 @@
-## 2. Install and initialize the Dub TypeScript SDK
-
 <Steps titleSize="h3">
 
 <Step title="Install">