@embedreach/components 0.1.12 → 0.1.14

package/dist/styles.module-B1IY0-9d.js

@@ -1,342 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import { useFlags } from "launchdarkly-react-client-sdk";
-import * as React from "react";
-import React__default, { useState, useEffect } from "react";
-import { useTranslation } from "react-i18next";
-import { useNavigate } from "react-router-dom";
-import { n as cn, U as PoweredByReach, V as analytics, W as megaphone, X as useOAuthCard, B as Button, Y as OAuthCardWrapper } from "./index-OHOroL_D.js";
-import { Settings, X, BarChart2, Megaphone } from "lucide-react";
-import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { cva } from "class-variance-authority";
-const calculateDateRange = (preset) => {
-  const today = /* @__PURE__ */ new Date();
-  today.setHours(0, 0, 0, 0);
-  const endDate = new Date(today);
-  endDate.setDate(today.getDate() - 1);
-  const startDate = new Date(today);
-  startDate.setHours(0, 0, 0, 0);
-  switch (preset) {
-    case "last-week":
-      startDate.setDate(today.getDate() - 7);
-      break;
-    case "last-month":
-      startDate.setDate(today.getDate() - 30);
-      break;
-    case "last-quarter":
-      startDate.setDate(today.getDate() - 90);
-      break;
-    case "last-year":
-      startDate.setDate(today.getDate() - 365);
-      break;
-    default:
-      throw new Error("Invalid date range preset");
-  }
-  return {
-    from: startDate,
-    to: endDate
-  };
-};
-const checkIfNearExpiry = (account) => {
-  var _a, _b;
-  const bufferTime = 24 * 60 * 60 * 1e3 * 5;
-  if (account.ad_platform === "google") {
-    return false;
-  }
-  const isNearExpiry = new Date(
-    ((_b = (_a = account.ad_platform_metadata) == null ? void 0 : _a.encrypted_credentials) == null ? void 0 : _b.expiryDate) || 0
-  ).getTime() - bufferTime < Date.now();
-  return isNearExpiry;
-};
-const formatDateToString = (date) => {
-  const year = date.getUTCFullYear();
-  const month = String(date.getUTCMonth() + 1).padStart(2, "0");
-  const day = String(date.getUTCDate()).padStart(2, "0");
-  return `${year}-${month}-${day}`;
-};
-const InteractiveHoverButton = React__default.forwardRef(
-  ({
-    text = "Button",
-    className,
-    pulse = false,
-    pulseDuration = 1e4,
-    ...props
-  }, ref) => {
-    const [isPulsing, setIsPulsing] = useState(pulse);
-    useEffect(() => {
-      if (pulse && pulseDuration) {
-        setIsPulsing(true);
-        const timer = setTimeout(() => {
-          setIsPulsing(false);
-        }, pulseDuration);
-        return () => clearTimeout(timer);
-      }
-    }, [pulse, pulseDuration]);
-    const PulseElement = () => /* @__PURE__ */ jsx("div", { className: "right-1.5 top-3.5 z-20", children: /* @__PURE__ */ jsxs("span", { className: "relative flex h-3 w-3", children: [
-      /* @__PURE__ */ jsx("span", { className: "absolute inline-flex h-full w-full animate-[ping_1s_ease-in-out_infinite] rounded-full bg-red-500 opacity-75" }),
-      /* @__PURE__ */ jsx("span", { className: "relative inline-flex rounded-full h-3 w-3 bg-red-600" })
-    ] }) });
-    return /* @__PURE__ */ jsxs(
-      "button",
-      {
-        ref,
-        className: cn(
-          "group relative w-32 cursor-pointer overflow-hidden rounded-full border bg-[var(--reach-background)] p-1 text-center font-semibold",
-          className
-        ),
-        ...props,
-        children: [
-          /* @__PURE__ */ jsxs("span", { className: "flex items-center justify-evenly transition-all duration-300 group-hover:translate-x-12 group-hover:opacity-0 px-2 py-1", children: [
-            /* @__PURE__ */ jsx(PoweredByReach, { showText: false }),
-            isPulsing && /* @__PURE__ */ jsx(PulseElement, {})
-          ] }),
-          /* @__PURE__ */ jsxs("div", { className: "absolute top-0 z-10 flex h-full w-full translate-x-12 items-center justify-center gap-2 text-primary-foreground opacity-0 transition-all duration-300 group-hover:-translate-x-1 group-hover:opacity-100", children: [
-            /* @__PURE__ */ jsx("span", { children: text }),
-            !isPulsing && /* @__PURE__ */ jsx(Settings, {}),
-            isPulsing && /* @__PURE__ */ jsx(PulseElement, {})
-          ] }),
-          /* @__PURE__ */ jsx("div", { className: "absolute left-[20%] top-[40%] h-2 w-2 scale-[0] rounded-lg bg-[var(--reach-primary)] transition-all duration-300 group-hover:left-[0%] group-hover:top-[0%] group-hover:h-full group-hover:w-full group-hover:scale-[1.8] group-hover:bg-[var(--reach-primary)]" })
-        ]
-      }
-    );
-  }
-);
-InteractiveHoverButton.displayName = "InteractiveHoverButton";
-const Sheet = DialogPrimitive.Root;
-const SheetTrigger = DialogPrimitive.Trigger;
-const SheetPortal = DialogPrimitive.Portal;
-const SheetOverlay = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  DialogPrimitive.Overlay,
-  {
-    className: cn(
-      "fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-      className
-    ),
-    ...props,
-    ref
-  }
-));
-SheetOverlay.displayName = DialogPrimitive.Overlay.displayName;
-const sheetVariants = cva(
-  "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",
-  {
-    variants: {
-      side: {
-        top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
-        bottom: "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
-        left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
-        right: "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm"
-      }
-    },
-    defaultVariants: {
-      side: "right"
-    }
-  }
-);
-const SheetContent = React.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [
-  /* @__PURE__ */ jsx(SheetOverlay, {}),
-  /* @__PURE__ */ jsxs(
-    DialogPrimitive.Content,
-    {
-      ref,
-      className: cn(sheetVariants({ side }), className),
-      ...props,
-      children: [
-        /* @__PURE__ */ jsxs(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
-          /* @__PURE__ */ jsx(X, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
-        ] }),
-        children
-      ]
-    }
-  )
-] }));
-SheetContent.displayName = DialogPrimitive.Content.displayName;
-const SheetHeader = ({
-  className,
-  ...props
-}) => /* @__PURE__ */ jsx(
-  "div",
-  {
-    className: cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
-      className
-    ),
-    ...props
-  }
-);
-SheetHeader.displayName = "SheetHeader";
-const SheetTitle = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  DialogPrimitive.Title,
-  {
-    ref,
-    className: cn("text-lg font-semibold text-foreground", className),
-    ...props
-  }
-));
-SheetTitle.displayName = DialogPrimitive.Title.displayName;
-const SheetDescription = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
-  DialogPrimitive.Description,
-  {
-    ref,
-    className: cn("text-sm text-muted-foreground", className),
-    ...props
-  }
-));
-SheetDescription.displayName = DialogPrimitive.Description.displayName;
-const sheetContent = "reach-styles-module__sheetContent___0ciEx";
-const container$1 = "reach-styles-module__container___T38N5";
-const sectionTitle = "reach-styles-module__sectionTitle___EKjxE";
-const setupContainer = "reach-styles-module__setupContainer___eFNIi";
-const featureButton = "reach-styles-module__featureButton___wqCjo";
-const featureContent = "reach-styles-module__featureContent___XZoau";
-const featureTitle = "reach-styles-module__featureTitle___1dex2";
-const featureDescription = "reach-styles-module__featureDescription___e6Nh-";
-const imageContainer = "reach-styles-module__imageContainer___fnBSj";
-const featureImage = "reach-styles-module__featureImage___DZbp8";
-const connectedAccounts = "reach-styles-module__connectedAccounts___6e8OJ";
-const legalSection = "reach-styles-module__legalSection___EAH2m";
-const legalLinks = "reach-styles-module__legalLinks___4PwOC";
-const legalLink = "reach-styles-module__legalLink___XaCkC";
-const styles$1 = {
-  sheetContent,
-  container: container$1,
-  sectionTitle,
-  setupContainer,
-  featureButton,
-  featureContent,
-  featureTitle,
-  featureDescription,
-  imageContainer,
-  featureImage,
-  connectedAccounts,
-  legalSection,
-  legalLinks,
-  legalLink
-};
-const useSettingsFeatures = () => {
-  const { t } = useTranslation();
-  return [
-    {
-      title: t("dashboard.settings_sheet.setup_analytics"),
-      description: t("dashboard.settings_sheet.setup_analytics_description"),
-      icon: /* @__PURE__ */ jsx(BarChart2, { className: "h-6 w-6" }),
-      route: "/setup/analytics",
-      image: analytics,
-      flagKey: "show-setup-analytics"
-    },
-    {
-      title: t("dashboard.settings_sheet.setup_campaigns"),
-      description: t("dashboard.settings_sheet.setup_campaigns_description"),
-      icon: /* @__PURE__ */ jsx(Megaphone, { className: "h-6 w-6" }),
-      route: "/setup/campaigns",
-      image: megaphone,
-      flagKey: "show-setup-campaigns"
-    }
-  ];
-};
-const SettingsSheet = () => {
-  const flags = useFlags();
-  const { t } = useTranslation();
-  const [open, setOpen] = useState(false);
-  const navigate = useNavigate();
-  const { accounts } = useOAuthCard();
-  const settingsFeatures = useSettingsFeatures();
-  const needsReauth = accounts == null ? void 0 : accounts.some(
-    (account) => {
-      var _a, _b;
-      return ((_b = (_a = account == null ? void 0 : account.ad_platform_metadata) == null ? void 0 : _a.encrypted_credentials) == null ? void 0 : _b.expiryDate) && checkIfNearExpiry(account) || account.status === "revoked";
-    }
-  );
-  if (!accounts) return null;
-  return /* @__PURE__ */ jsxs(Sheet, { open, onOpenChange: setOpen, children: [
-    /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, children: /* @__PURE__ */ jsx(InteractiveHoverButton, { text: "Settings", pulse: needsReauth }) }),
-    /* @__PURE__ */ jsx(SheetContent, { className: styles$1.sheetContent, children: /* @__PURE__ */ jsxs("div", { className: styles$1.container, children: [
-      /* @__PURE__ */ jsxs(SheetHeader, { children: [
-        /* @__PURE__ */ jsx(SheetTitle, { children: t("account_settings") }),
-        /* @__PURE__ */ jsx(SheetDescription, { asChild: true, children: /* @__PURE__ */ jsx("span", { className: needsReauth ? "text-red-500 font-medium" : "", children: needsReauth ? t("reauth_required_description") : t("manage_account_settings") }) })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("h4", { className: styles$1.sectionTitle, children: t("dashboard.settings_sheet.setup") }),
-        /* @__PURE__ */ jsx("div", { className: styles$1.setupContainer, children: settingsFeatures.map((item) => {
-          const isEnabled = item.flagKey ? flags[item.flagKey] : false;
-          return /* @__PURE__ */ jsxs(
-            Button,
-            {
-              variant: "outline",
-              disabled: !isEnabled,
-              className: styles$1.featureButton,
-              onClick: () => isEnabled && navigate(item.route),
-              title: !isEnabled ? "Contact your platform admin to enable this feature" : void 0,
-              children: [
-                /* @__PURE__ */ jsxs("div", { className: styles$1.featureContent, children: [
-                  /* @__PURE__ */ jsx("div", { className: styles$1.featureTitle, children: item.title }),
-                  /* @__PURE__ */ jsx("div", { className: styles$1.featureDescription, children: !isEnabled ? "Contact your platform admin to enable this feature" : item.description })
-                ] }),
-                item.image && /* @__PURE__ */ jsx("div", { className: styles$1.imageContainer, children: /* @__PURE__ */ jsx(
-                  "img",
-                  {
-                    src: item.image,
-                    alt: item.title,
-                    className: styles$1.featureImage
-                  }
-                ) })
-              ]
-            },
-            item.title
-          );
-        }) })
-      ] }),
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("h4", { className: styles$1.sectionTitle, children: t("dashboard.settings_sheet.connected_accounts") }),
-        /* @__PURE__ */ jsx("div", { className: styles$1.connectedAccounts, children: accounts == null ? void 0 : accounts.map((account) => /* @__PURE__ */ jsx(
-          OAuthCardWrapper,
-          {
-            platform: account.ad_platform
-          },
-          account.id
-        )) })
-      ] }),
-      /* @__PURE__ */ jsx("div", { className: styles$1.legalSection, children: /* @__PURE__ */ jsxs("div", { className: styles$1.legalLinks, children: [
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "link",
-            className: styles$1.legalLink,
-            onClick: () => window.open(
-              "https://www.embedreach.com/terms-of-service/",
-              "_blank"
-            ),
-            children: t("dashboard.settings_sheet.terms_of_service")
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "link",
-            className: styles$1.legalLink,
-            onClick: () => window.open(
-              "https://www.embedreach.com/privacy-policy/",
-              "_blank"
-            ),
-            children: t("dashboard.settings_sheet.privacy_policy")
-          }
-        )
-      ] }) })
-    ] }) })
-  ] });
-};
-const container = "reach-styles-module__container___lqhzq";
-const innerContainer = "reach-styles-module__innerContainer___ESl0A";
-const header = "reach-styles-module__header___D7EkI";
-const styles = {
-  container,
-  innerContainer,
-  header
-};
-export {
-  SettingsSheet as S,
-  calculateDateRange as c,
-  formatDateToString as f,
-  styles as s
-};
-//# sourceMappingURL=styles.module-B1IY0-9d.js.map

package/dist/styles.module-B1IY0-9d.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.module-B1IY0-9d.js","sources":["../../common/utils/dateUtils.ts","../../common/components/ui/interactive-button.tsx","../../common/components/ui/sheet.tsx","../../common/components/dashboard/settings-sheet/useSettingsFeatures.tsx","../../common/components/dashboard/settings-sheet/SettingsSheet.tsx"],"sourcesContent":["import { DateRange } from '../services/ad-metrics';\nimport { AdAccount } from '../services/ad-accounts/types';\nimport type { DateRangePreset } from '../components/dashboard/action-bar/date-range-picker';\n\n/**\n * Calculates date range based on preset.\n * Uses local timezone for UI display purposes.\n */\nexport const calculateDateRange = (preset: DateRangePreset): DateRange => {\n  const today = new Date();\n  // Set time to start of day to avoid time-related issues\n  today.setHours(0, 0, 0, 0);\n\n  const endDate = new Date(today);\n  endDate.setDate(today.getDate() - 1);\n\n  const startDate = new Date(today);\n  startDate.setHours(0, 0, 0, 0);\n\n  switch (preset) {\n    case 'last-week':\n      startDate.setDate(today.getDate() - 7);\n      break;\n    case 'last-month':\n      startDate.setDate(today.getDate() - 30);\n      break;\n    case 'last-quarter':\n      startDate.setDate(today.getDate() - 90);\n      break;\n    case 'last-year':\n      startDate.setDate(today.getDate() - 365);\n      break;\n    default:\n      throw new Error('Invalid date range preset');\n  }\n\n  return {\n    from: startDate,\n    to: endDate,\n  };\n};\n\n/**\n * Checks if account credentials are near expiry.\n * Uses UTC timestamps for comparison.\n */\nexport const checkIfNearExpiry = (account: AdAccount) => {\n  const bufferTime = 24 * 60 * 60 * 1000 * 5; // 5 days in ms\n\n  // google accounts are handled on the BE with auto refresh\n  if (account.ad_platform === 'google') {\n    return false;\n  }\n\n  const isNearExpiry =\n    new Date(\n      account.ad_platform_metadata?.encrypted_credentials?.expiryDate || 0,\n    ).getTime() -\n      bufferTime <\n    Date.now();\n  return isNearExpiry;\n};\n\n/**\n * Formats date to MM/DD for UI display.\n * Uses local timezone formatting.\n */\nexport const formatDateToShortMonthDay = (date: Date) => {\n  return date.toLocaleDateString('en-US', {\n    month: '2-digit',\n    day: '2-digit',\n  });\n};\n\n/**\n * Formats date to YYYY-MM-DD for API requests.\n * Uses UTC timestamps for consistency.\n */\nexport const formatDateToString = (date: Date) => {\n  // Get the date in UTC to ensure consistency\n  const year = date.getUTCFullYear();\n  const month = String(date.getUTCMonth() + 1).padStart(2, '0');\n  const day = String(date.getUTCDate()).padStart(2, '0');\n\n  return `${year}-${month}-${day}`;\n};\n","import { Settings } from 'lucide-react';\nimport React, { useEffect, useState } from 'react';\n\nimport { cn } from '../../utils/cn';\nimport PoweredByReach from '../ui/reach';\n\ninterface InteractiveHoverButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  text?: string;\n  pulse?: boolean;\n  pulseDuration?: number; // Duration in milliseconds\n}\n\nconst InteractiveHoverButton = React.forwardRef<\n  HTMLButtonElement,\n  InteractiveHoverButtonProps\n>(\n  (\n    {\n      text = 'Button',\n      className,\n      pulse = false,\n      pulseDuration = 10000,\n      ...props\n    },\n    ref,\n  ) => {\n    const [isPulsing, setIsPulsing] = useState(pulse);\n\n    useEffect(() => {\n      if (pulse && pulseDuration) {\n        // Start pulsing\n        setIsPulsing(true);\n\n        // Stop pulsing after duration\n        const timer = setTimeout(() => {\n          setIsPulsing(false);\n        }, pulseDuration);\n\n        return () => clearTimeout(timer);\n      }\n    }, [pulse, pulseDuration]);\n\n    const PulseElement = () => (\n      <div className=\"right-1.5 top-3.5 z-20\">\n        <span className=\"relative flex h-3 w-3\">\n          <span className=\"absolute inline-flex h-full w-full animate-[ping_1s_ease-in-out_infinite] rounded-full bg-red-500 opacity-75\"></span>\n          <span className=\"relative inline-flex rounded-full h-3 w-3 bg-red-600\"></span>\n        </span>\n      </div>\n    );\n\n    return (\n      <button\n        ref={ref}\n        className={cn(\n          'group relative w-32 cursor-pointer overflow-hidden rounded-full border bg-[var(--reach-background)] p-1 text-center font-semibold',\n          className,\n        )}\n        {...props}>\n        <span className=\"flex items-center justify-evenly transition-all duration-300 group-hover:translate-x-12 group-hover:opacity-0 px-2 py-1\">\n          <PoweredByReach showText={false} />\n          {isPulsing && <PulseElement />}\n        </span>\n        <div className=\"absolute top-0 z-10 flex h-full w-full translate-x-12 items-center justify-center gap-2 text-primary-foreground opacity-0 transition-all duration-300 group-hover:-translate-x-1 group-hover:opacity-100\">\n          <span>{text}</span>\n          {!isPulsing && <Settings />}\n          {isPulsing && <PulseElement />}\n        </div>\n        <div className=\"absolute left-[20%] top-[40%] h-2 w-2 scale-[0] rounded-lg bg-[var(--reach-primary)] transition-all duration-300 group-hover:left-[0%] group-hover:top-[0%] group-hover:h-full group-hover:w-full group-hover:scale-[1.8] group-hover:bg-[var(--reach-primary)]\"></div>\n      </button>\n    );\n  },\n);\n\nInteractiveHoverButton.displayName = 'InteractiveHoverButton';\n\nexport { InteractiveHoverButton };\n","import * as SheetPrimitive from '@radix-ui/react-dialog';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { X } from 'lucide-react';\nimport * as React from 'react';\n\nimport { cn } from '../../utils/cn';\n\nconst Sheet = SheetPrimitive.Root;\n\nconst SheetTrigger = SheetPrimitive.Trigger;\n\nconst SheetClose = SheetPrimitive.Close;\n\nconst SheetPortal = SheetPrimitive.Portal;\n\nconst SheetOverlay = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Overlay\n    className={cn(\n      'fixed inset-0 z-50 bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n      className,\n    )}\n    {...props}\n    ref={ref}\n  />\n));\nSheetOverlay.displayName = SheetPrimitive.Overlay.displayName;\n\nconst sheetVariants = cva(\n  'fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out',\n  {\n    variants: {\n      side: {\n        top: 'inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top',\n        bottom:\n          'inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom',\n        left: 'inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm',\n        right:\n          'inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm',\n      },\n    },\n    defaultVariants: {\n      side: 'right',\n    },\n  },\n);\n\ninterface SheetContentProps\n  extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,\n    VariantProps<typeof sheetVariants> {}\n\nconst SheetContent = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Content>,\n  SheetContentProps\n>(({ side = 'right', className, children, ...props }, ref) => (\n  <SheetPortal>\n    <SheetOverlay />\n    <SheetPrimitive.Content\n      ref={ref}\n      className={cn(sheetVariants({ side }), className)}\n      {...props}>\n      <SheetPrimitive.Close className=\"absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary\">\n        <X className=\"h-4 w-4\" />\n        <span className=\"sr-only\">Close</span>\n      </SheetPrimitive.Close>\n      {children}\n    </SheetPrimitive.Content>\n  </SheetPortal>\n));\nSheetContent.displayName = SheetPrimitive.Content.displayName;\n\nconst SheetHeader = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      'flex flex-col space-y-2 text-center sm:text-left',\n      className,\n    )}\n    {...props}\n  />\n);\nSheetHeader.displayName = 'SheetHeader';\n\nconst SheetFooter = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      'flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2',\n      className,\n    )}\n    {...props}\n  />\n);\nSheetFooter.displayName = 'SheetFooter';\n\nconst SheetTitle = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Title\n    ref={ref}\n    className={cn('text-lg font-semibold text-foreground', className)}\n    {...props}\n  />\n));\nSheetTitle.displayName = SheetPrimitive.Title.displayName;\n\nconst SheetDescription = React.forwardRef<\n  React.ElementRef<typeof SheetPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof SheetPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <SheetPrimitive.Description\n    ref={ref}\n    className={cn('text-sm text-muted-foreground', className)}\n    {...props}\n  />\n));\nSheetDescription.displayName = SheetPrimitive.Description.displayName;\n\nexport {\n  Sheet,\n  SheetClose,\n  SheetContent,\n  SheetDescription,\n  SheetFooter,\n  SheetHeader,\n  SheetOverlay,\n  SheetPortal,\n  SheetTitle,\n  SheetTrigger,\n};\n","import { BarChart2, Megaphone } from 'lucide-react';\nimport { useTranslation } from 'react-i18next';\n\nimport analytics from '../../../assets/analytics.png';\nimport megaphone from '../../../assets/megaphone.png';\nimport { FeatureItem } from './SettingsSheet.types';\n\nexport const useSettingsFeatures = (): FeatureItem[] => {\n  const { t } = useTranslation();\n  return [\n    {\n      title: t('dashboard.settings_sheet.setup_analytics'),\n      description: t('dashboard.settings_sheet.setup_analytics_description'),\n      icon: <BarChart2 className=\"h-6 w-6\" />,\n      route: '/setup/analytics',\n      image: analytics,\n      flagKey: 'show-setup-analytics',\n    },\n    {\n      title: t('dashboard.settings_sheet.setup_campaigns'),\n      description: t('dashboard.settings_sheet.setup_campaigns_description'),\n      icon: <Megaphone className=\"h-6 w-6\" />,\n      route: '/setup/campaigns',\n      image: megaphone,\n      flagKey: 'show-setup-campaigns',\n    },\n  ];\n};\n","import { useFlags } from 'launchdarkly-react-client-sdk';\nimport { useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { useNavigate } from 'react-router-dom';\nimport { LaunchDarklyFlags } from '../../../types/launch-darkly';\n\nimport { useOAuthCard } from '../../../hooks/useOauthCard';\nimport { checkIfNearExpiry } from '../../../utils/dateUtils';\nimport OAuthCardWrapper from '../../auth/oauth/OauthCardWrapper';\nimport { Button } from '../../ui/button';\nimport { InteractiveHoverButton } from '../../ui/interactive-button';\nimport {\n  Sheet,\n  SheetContent,\n  SheetDescription,\n  SheetHeader,\n  SheetTitle,\n  SheetTrigger,\n} from '../../ui/sheet';\nimport styles from './styles.module.css';\nimport { useSettingsFeatures } from './useSettingsFeatures';\n\nexport const SettingsSheet = () => {\n  const flags = useFlags<LaunchDarklyFlags>();\n  const { t } = useTranslation();\n  const [open, setOpen] = useState(false);\n  const navigate = useNavigate();\n  const { accounts } = useOAuthCard();\n  const settingsFeatures = useSettingsFeatures();\n\n  const needsReauth = accounts?.some(\n    account =>\n      (account?.ad_platform_metadata?.encrypted_credentials?.expiryDate &&\n        checkIfNearExpiry(account)) ||\n      account.status === 'revoked',\n  );\n\n  if (!accounts) return null;\n\n  return (\n    <Sheet open={open} onOpenChange={setOpen}>\n      <SheetTrigger asChild>\n        <InteractiveHoverButton text=\"Settings\" pulse={needsReauth} />\n      </SheetTrigger>\n      <SheetContent className={styles.sheetContent}>\n        <div className={styles.container}>\n          <SheetHeader>\n            <SheetTitle>{t('account_settings')}</SheetTitle>\n            <SheetDescription asChild>\n              <span className={needsReauth ? 'text-red-500 font-medium' : ''}>\n                {needsReauth\n                  ? t('reauth_required_description')\n                  : t('manage_account_settings')}\n              </span>\n            </SheetDescription>\n          </SheetHeader>\n\n          <div>\n            <h4 className={styles.sectionTitle}>\n              {t('dashboard.settings_sheet.setup')}\n            </h4>\n            <div className={styles.setupContainer}>\n              {settingsFeatures.map(item => {\n                const isEnabled = item.flagKey ? flags[item.flagKey] : false;\n                return (\n                  <Button\n                    key={item.title}\n                    variant=\"outline\"\n                    disabled={!isEnabled}\n                    className={styles.featureButton}\n                    onClick={() => isEnabled && navigate(item.route)}\n                    title={\n                      !isEnabled\n                        ? 'Contact your platform admin to enable this feature'\n                        : undefined\n                    }>\n                    <div className={styles.featureContent}>\n                      <div className={styles.featureTitle}>{item.title}</div>\n                      <div className={styles.featureDescription}>\n                        {!isEnabled\n                          ? 'Contact your platform admin to enable this feature'\n                          : item.description}\n                      </div>\n                    </div>\n                    {item.image && (\n                      <div className={styles.imageContainer}>\n                        <img\n                          src={item.image}\n                          alt={item.title}\n                          className={styles.featureImage}\n                        />\n                      </div>\n                    )}\n                  </Button>\n                );\n              })}\n            </div>\n          </div>\n\n          <div>\n            <h4 className={styles.sectionTitle}>\n              {t('dashboard.settings_sheet.connected_accounts')}\n            </h4>\n            <div className={styles.connectedAccounts}>\n              {accounts?.map(account => (\n                <OAuthCardWrapper\n                  key={account.id}\n                  platform={account.ad_platform}\n                />\n              ))}\n            </div>\n          </div>\n\n          <div className={styles.legalSection}>\n            <div className={styles.legalLinks}>\n              <Button\n                variant=\"link\"\n                className={styles.legalLink}\n                onClick={() =>\n                  window.open(\n                    'https://www.embedreach.com/terms-of-service/',\n                    '_blank',\n                  )\n                }>\n                {t('dashboard.settings_sheet.terms_of_service')}\n              </Button>\n              <Button\n                variant=\"link\"\n                className={styles.legalLink}\n                onClick={() =>\n                  window.open(\n                    'https://www.embedreach.com/privacy-policy/',\n                    '_blank',\n                  )\n                }>\n                {t('dashboard.settings_sheet.privacy_policy')}\n              </Button>\n            </div>\n          </div>\n        </div>\n      </SheetContent>\n    </Sheet>\n  );\n};\n\nexport default SettingsSheet;\n"],"names":["React","SheetPrimitive","styles"],"mappings":"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"}