qt-ui-kit 1.0.78 → 1.0.80

package/dist/index.mjs

@@ -11172,16 +11172,16 @@ var require_lib7 = __commonJS({
 import { useState as useState2 } from "react";
 
 // src/types/global.ts
-var IntegrationService = /* @__PURE__ */ ((IntegrationService6) => {
-  IntegrationService6["SLACK"] = "slack";
-  IntegrationService6["GMAIL"] = "google_mail";
-  IntegrationService6["GCAL"] = "google_calendar";
-  IntegrationService6["MSTEAMS"] = "microsoft_teams";
-  IntegrationService6["MSMAIL"] = "microsoft_mail";
-  IntegrationService6["MSCAL"] = "microsoft_calendar";
-  IntegrationService6["AJIRA"] = "atlassian_jira";
-  IntegrationService6["CLKUP"] = "clickup";
-  return IntegrationService6;
+var IntegrationService = /* @__PURE__ */ ((IntegrationService5) => {
+  IntegrationService5["SLACK"] = "slack";
+  IntegrationService5["GMAIL"] = "google_mail";
+  IntegrationService5["GCAL"] = "google_calendar";
+  IntegrationService5["MSTEAMS"] = "microsoft_teams";
+  IntegrationService5["MSMAIL"] = "microsoft_mail";
+  IntegrationService5["MSCAL"] = "microsoft_calendar";
+  IntegrationService5["AJIRA"] = "atlassian_jira";
+  IntegrationService5["CLKUP"] = "clickup";
+  return IntegrationService5;
 })(IntegrationService || {});
 var BaseIconName = /* @__PURE__ */ ((BaseIconName2) => {
   BaseIconName2["SEARCH"] = "search";
@@ -13402,93 +13402,12 @@ function BrandIcon({ size = 24, className, service }) {
   );
 }
 
-// src/components/atoms/icons/base_icons/ExternalLink.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
-function ExternalLink({
-  size = 24,
-  color = "#1D1D1F",
-  fillColor = "none"
-}) {
-  const getIconData = () => {
-    switch (size) {
-      case 16:
-        return {
-          viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsx9(
-            "path",
-            {
-              d: "M6.66699 3.99996H4.00033C3.26395 3.99996 2.66699 4.59691 2.66699 5.33329V12C2.66699 12.7363 3.26395 13.3333 4.00033 13.3333H10.667C11.4034 13.3333 12.0003 12.7363 12.0003 12V9.33329M9.33366 2.66663H13.3337M13.3337 2.66663V6.66663M13.3337 2.66663L6.66699 9.33329",
-              stroke: color,
-              strokeWidth: "1.25",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
-            }
-          )
-        };
-      case 20:
-        return {
-          viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsx9(
-            "path",
-            {
-              d: "M8.33301 5.00004H4.99967C4.0792 5.00004 3.33301 5.74623 3.33301 6.66671V15C3.33301 15.9205 4.0792 16.6667 4.99967 16.6667H13.333C14.2535 16.6667 14.9997 15.9205 14.9997 15V11.6667M11.6663 3.33337H16.6663M16.6663 3.33337V8.33337M16.6663 3.33337L8.33301 11.6667",
-              stroke: color,
-              strokeWidth: "1.5",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
-            }
-          )
-        };
-      case 24:
-        return {
-          viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsx9(
-            "path",
-            {
-              d: "M10 6H6C4.89543 6 4 6.89543 4 8V18C4 19.1046 4.89543 20 6 20H16C17.1046 20 18 19.1046 18 18V14M14 4H20M20 4V10M20 4L10 14",
-              stroke: color,
-              strokeWidth: "2",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
-            }
-          )
-        };
-      case 36:
-        return {
-          viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsx9(
-            "path",
-            {
-              d: "M15 9H9C7.34315 9 6 10.3431 6 12V27C6 28.6569 7.34315 30 9 30H24C25.6569 30 27 28.6569 27 27V21M21 6H30M30 6V15M30 6L15 21",
-              stroke: color,
-              strokeWidth: "2.25",
-              strokeLinecap: "round",
-              strokeLinejoin: "round"
-            }
-          )
-        };
-    }
-  };
-  const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx9(
-    "svg",
-    {
-      width: size,
-      height: size,
-      viewBox,
-      fill: "none",
-      xmlns: "http://www.w3.org/2000/svg",
-      children: path
-    }
-  );
-}
-
 // src/data/vector_icons/service_brands/vector_icons.tsx
-import { jsx as jsx10, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 function AlertIcon({ variant }) {
   switch (variant) {
     case void 0:
-      return /* @__PURE__ */ jsx10(
+      return /* @__PURE__ */ jsx9(
         "svg",
         {
           width: "100%",
@@ -13496,7 +13415,7 @@ function AlertIcon({ variant }) {
           viewBox: "0 0 36 36",
           fill: "#FFC24D",
           xmlns: "http://www.w3.org/2000/svg",
-          children: /* @__PURE__ */ jsx10(
+          children: /* @__PURE__ */ jsx9(
             "path",
             {
               d: "M18.0003 15V18M18.0003 24H18.0153M7.60799 30H28.3926C30.702 30 32.1454 27.5 30.9907 25.5L20.5984 7.5C19.4437 5.5 16.5569 5.5 15.4022 7.5L5.00992 25.5C3.85521 27.5 5.29859 30 7.60799 30Z",
@@ -13509,7 +13428,7 @@ function AlertIcon({ variant }) {
         }
       );
     default:
-      return /* @__PURE__ */ jsx10(
+      return /* @__PURE__ */ jsx9(
         "svg",
         {
           width: "100%",
@@ -13517,7 +13436,7 @@ function AlertIcon({ variant }) {
           viewBox: "0 0 30 28",
           fill: variant,
           xmlns: "http://www.w3.org/2000/svg",
-          children: /* @__PURE__ */ jsx10(
+          children: /* @__PURE__ */ jsx9(
             "path",
             {
               d: "M18.0003 15V18M18.0003 24H18.0153M7.60799 30H28.3926C30.702 30 32.1454 27.5 30.9907 25.5L20.5984 7.5C19.4437 5.5 16.5569 5.5 15.4022 7.5L5.00992 25.5C3.85521 27.5 5.29859 30 7.60799 30Z",
@@ -13541,7 +13460,7 @@ function FireIcon({ variant }) {
       fill: variant == void 0 ? "none" : variant,
       xmlns: "http://www.w3.org/2000/svg",
       children: [
-        /* @__PURE__ */ jsx10(
+        /* @__PURE__ */ jsx9(
           "path",
           {
             d: "M26.4853 27.9853C21.799 32.6716 14.201 32.6716 9.51472 27.9853C7.17158 25.6421 6 22.5711 6 19.5C6 16.4289 7.17157 13.3579 9.51472 11.0147C9.51472 11.0147 10.5001 13.4999 13.5001 14.9999C13.5001 11.9999 14.2501 7.49993 17.9788 4.5C21 7.5 24.1367 8.66617 26.4853 11.0147C28.8284 13.3579 30 16.4289 30 19.5C30 22.5711 28.8284 25.6421 26.4853 27.9853Z",
@@ -13552,7 +13471,7 @@ function FireIcon({ variant }) {
             strokeLinejoin: "round"
           }
         ),
-        /* @__PURE__ */ jsx10(
+        /* @__PURE__ */ jsx9(
           "path",
           {
             d: "M14.818 24.1819C16.5754 25.9393 19.4246 25.9393 21.182 24.1819C22.0606 23.3033 22.5 22.1516 22.5 21C22.5 19.8483 22.0607 18.6967 21.182 17.818C20.3089 16.9448 19.1662 16.5055 18.0218 16.5L16.4999 20.9999L13.5 21C13.5 22.1516 13.9394 23.3033 14.818 24.1819Z",
@@ -13596,15 +13515,6 @@ function toDate(argument, context) {
   return constructFrom(context || argument, argument);
 }
 
-// node_modules/date-fns/addDays.js
-function addDays(date, amount, options) {
-  const _date = toDate(date, options?.in);
-  if (isNaN(amount)) return constructFrom(options?.in || date, NaN);
-  if (!amount) return _date;
-  _date.setDate(_date.getDate() + amount);
-  return _date;
-}
-
 // node_modules/date-fns/_lib/defaultOptions.js
 var defaultOptions = {};
 function getDefaultOptions() {
@@ -13706,21 +13616,6 @@ function startOfISOWeekYear(date, options) {
   return startOfISOWeek(fourthOfJanuary);
 }
 
-// node_modules/date-fns/constructNow.js
-function constructNow(date) {
-  return constructFrom(date, Date.now());
-}
-
-// node_modules/date-fns/isSameDay.js
-function isSameDay(laterDate, earlierDate, options) {
-  const [dateLeft_, dateRight_] = normalizeDates(
-    options?.in,
-    laterDate,
-    earlierDate
-  );
-  return +startOfDay(dateLeft_) === +startOfDay(dateRight_);
-}
-
 // node_modules/date-fns/isDate.js
 function isDate(value) {
   return value instanceof Date || typeof value === "object" && Object.prototype.toString.call(value) === "[object Date]";
@@ -15161,188 +15056,151 @@ function cleanEscapedString(input) {
   return matched[1].replace(doubleQuoteRegExp, "'");
 }
 
-// node_modules/date-fns/isSameWeek.js
-function isSameWeek(laterDate, earlierDate, options) {
-  const [laterDate_, earlierDate_] = normalizeDates(
-    options?.in,
-    laterDate,
-    earlierDate
-  );
-  return +startOfWeek(laterDate_, options) === +startOfWeek(earlierDate_, options);
-}
-
-// node_modules/date-fns/isToday.js
-function isToday(date, options) {
-  return isSameDay(
-    constructFrom(options?.in || date, date),
-    constructNow(options?.in || date)
-  );
-}
-
-// node_modules/date-fns/isTomorrow.js
-function isTomorrow(date, options) {
-  return isSameDay(
-    date,
-    addDays(constructNow(options?.in || date), 1),
-    options
-  );
-}
-
 // src/util/common.tsx
-import { Fragment as Fragment8, jsx as jsx11 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx10 } from "react/jsx-runtime";
 function getCategoryIcon(service, variant, size) {
   if (!size) {
     size = 24;
   }
   switch (service) {
     case "fire" /* FIRE */:
-      return /* @__PURE__ */ jsx11(FireIcon, { variant });
+      return /* @__PURE__ */ jsx10(FireIcon, { variant });
     case "alert" /* ALERT */:
-      return /* @__PURE__ */ jsx11(AlertIcon, { variant });
+      return /* @__PURE__ */ jsx10(AlertIcon, { variant });
     default:
-      return /* @__PURE__ */ jsx11(Fragment8, {});
+      return /* @__PURE__ */ jsx10(Fragment8, {});
   }
 }
 function formatCustomRelative(date) {
   const now = /* @__PURE__ */ new Date();
-  if (isToday(date)) {
-    return `Today @ ${format(date, "h:mm a")}`;
-  }
-  if (isTomorrow(date)) {
-    return `Tomorrow @ ${format(date, "h:mm a")}`;
-  }
-  if (isSameWeek(date, now, { weekStartsOn: 1 })) {
-    return `${format(date, "EEE")} @ ${format(date, "h:mm a")}`;
-  }
-  return `${format(date, "EEE, do MMMM")} @ ${format(date, "h:mm a")}`;
+  return format(date, "MMM d, h:mmaaa").replace("AM", "am").replace("PM", "pm");
 }
 
 // src/components/molecules/text_content/sender_source_row/sender_source_row.tsx
-import { jsx as jsx12, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx11, jsxs as jsxs9 } from "react/jsx-runtime";
 function SenderSourceRow({
   leftText,
   seperator,
   rightText,
-  onClick,
-  shrunk,
   date
 }) {
-  return /* @__PURE__ */ jsxs9("div", { className: "flex w-full place-content-between text-neutral-1 text-[14px] leading-[130%] ", children: [
+  return /* @__PURE__ */ jsxs9("div", { className: "flex w-full place-content-between gap-6 text-qtneutral-900", children: [
     /* @__PURE__ */ jsxs9("div", { className: "flex gap-[4px] place-items-center", children: [
-      /* @__PURE__ */ jsx12("div", { className: "body-small-bold break-all line-clamp-1", children: leftText }),
-      /* @__PURE__ */ jsx12("div", { className: "body-smal text-center", children: seperator }),
-      /* @__PURE__ */ jsx12("div", { className: "body-small-bold text-center", children: rightText }),
-      /* @__PURE__ */ jsx12("div", { className: "label-3 flex", children: date && formatCustomRelative(date) })
+      /* @__PURE__ */ jsx11("div", { className: "body-small-bold break-all line-clamp-1", children: leftText }),
+      /* @__PURE__ */ jsx11("div", { className: "label-3 text-center", children: seperator }),
+      /* @__PURE__ */ jsx11("div", { className: "label-3 text-center", children: rightText })
     ] }),
-    /* @__PURE__ */ jsx12("div", { onClick, children: /* @__PURE__ */ jsx12(ExternalLink, { size: shrunk ? 16 : 24 }) })
+    /* @__PURE__ */ jsx11("div", { className: "label-3 flex flex-nowrap flex-none", children: date && formatCustomRelative(date) })
   ] });
 }
 
 // src/components/molecules/text_content/subject_line_row/subject_line_row.tsx
-import { jsx as jsx13 } from "react/jsx-runtime";
+import { jsx as jsx12 } from "react/jsx-runtime";
 function SubjectLineRow({ text }) {
-  return /* @__PURE__ */ jsx13("div", { className: "flex h-[17px]", children: /* @__PURE__ */ jsx13("div", { className: "text-neutral-900 body-small-bold", children: text }) });
+  return /* @__PURE__ */ jsx12("div", { className: "flex h-[17px]", children: /* @__PURE__ */ jsx12("div", { className: "text-neutral-900 body-small", children: text }) });
 }
 
-// src/components/molecules/text_content/metadata_row/metadata_row.tsx
-import { jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
-function MetadataRow({ metadata }) {
-  return /* @__PURE__ */ jsxs10("div", { className: "flex w-full flex-wrap break-all body-small text-neutral-900 gap-2", children: [
-    metadata && /* @__PURE__ */ jsx14("div", { children: metadata[0] + (metadata.length == 2 ? "," : "") }),
-    metadata?.length == 2 && /* @__PURE__ */ jsx14("div", { children: metadata[1] })
+// src/components/organisms/preview_card/preview_card.tsx
+import clsx4 from "clsx";
+
+// src/components/molecules/dropdown/dropdown.tsx
+import clsx2 from "clsx";
+import { jsx as jsx13, jsxs as jsxs10 } from "react/jsx-runtime";
+function DropDown({
+  title,
+  items,
+  activeItem,
+  direction = "left",
+  onItemClick
+}) {
+  return /* @__PURE__ */ jsxs10("div", { className: "relative inline-block", children: [
+    /* @__PURE__ */ jsx13(
+      "div",
+      {
+        className: clsx2(
+          "absolute w-3.5 h-3.5 bg-black rotate-45 shadow-md z-0 -top-2 left-22"
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxs10("div", { className: "bg-white rounded-2xl shadow-lg w-48 py-3 px-4 relative z-10", children: [
+      /* @__PURE__ */ jsx13("div", { className: "text-xs font-bold text-gray-900 tracking-wide mb-2", children: title.toUpperCase() }),
+      /* @__PURE__ */ jsx13("ul", { className: "text-sm text-gray-800 space-y-2", children: items.map((item) => /* @__PURE__ */ jsx13(
+        "li",
+        {
+          onClick: (e) => {
+            e.stopPropagation();
+            onItemClick?.(item);
+          },
+          className: clsx2(
+            "border-t border-gray-200 pt-2 cursor-pointer label-2 text-qtneutral-800 hover:text-qtpurple-500 !hover:label-2-bold",
+            activeItem === item ? "text-indigo-600 font-semibold" : ""
+          ),
+          children: item
+        },
+        item
+      )) })
+    ] })
   ] });
 }
 
-// src/components/organisms/preview_card/preview_card.tsx
-import clsx5 from "clsx";
-
-// src/components/molecules/buttons/thumb_group/thumb_group.tsx
-import { useState } from "react";
+// src/components/atoms/category_badge/category_badge.tsx
+import clsx3 from "clsx";
 
-// src/components/atoms/icons/base_icons/ThumbUp.tsx
-import { jsx as jsx15 } from "react/jsx-runtime";
-function ThumbUp({
-  size = 24,
-  color = "#1D1D1F",
-  fillColor = "none"
-}) {
-  const getIconData = () => {
-    switch (size) {
-      case 16:
-        return {
-          viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsx15(
-            "path",
-            {
-              d: "M9.41146 6.66667H12.5874C13.5786 6.66667 14.2233 7.70975 13.78 8.59629L11.4466 13.263C11.2208 13.7147 10.7591 14 10.2541 14H7.5756C7.46658 14 7.35798 13.9866 7.25222 13.9602L4.74479 13.3333M9.41146 6.66667V3.33333C9.41146 2.59695 8.8145 2 8.07813 2H8.01448C7.68144 2 7.41146 2.26998 7.41146 2.60302C7.41146 3.07922 7.2705 3.54477 7.00635 3.94099L4.74479 7.33333V13.3333M9.41146 6.66667H8.07813M4.74479 13.3333H3.41146C2.67508 13.3333 2.07812 12.7364 2.07812 12V8C2.07812 7.26362 2.67508 6.66667 3.41146 6.66667H5.07813",
-              stroke: color,
-              "stroke-width": "1.25",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
-            }
-          )
-        };
-      case 20:
-        return {
-          viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsx15(
-            "path",
-            {
-              d: "M11.7643 8.33333H15.7343C16.9732 8.33333 17.7791 9.63719 17.225 10.7454L14.3083 16.5787C14.026 17.1433 13.4489 17.5 12.8176 17.5H9.4695C9.33323 17.5 9.19747 17.4833 9.06527 17.4502L5.93099 16.6667M11.7643 8.33333V4.16667C11.7643 3.24619 11.0181 2.5 10.0977 2.5H10.0181C9.6018 2.5 9.26432 2.83748 9.26432 3.25377C9.26432 3.84903 9.08813 4.43096 8.75794 4.92624L5.93099 9.16667V16.6667M11.7643 8.33333H10.0977M5.93099 16.6667H4.26432C3.34385 16.6667 2.59766 15.9205 2.59766 15V10C2.59766 9.07953 3.34385 8.33333 4.26432 8.33333H6.34766",
-              stroke: color,
-              "stroke-width": "1.5",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
-            }
-          )
-        };
-      case 24:
-        return {
-          viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsx15(
-            "path",
-            {
-              d: "M14.1172 10H18.8811C20.3679 10 21.3349 11.5646 20.67 12.8944L17.17 19.8944C16.8312 20.572 16.1387 21 15.3811 21H11.3634C11.1999 21 11.037 20.9799 10.8783 20.9403L7.11719 20M14.1172 10V5C14.1172 3.89543 13.2218 3 12.1172 3H12.0217C11.5222 3 11.1172 3.40497 11.1172 3.90453C11.1172 4.61883 10.9058 5.31715 10.5095 5.91149L7.11719 11V20M14.1172 10H12.1172M7.11719 20H5.11719C4.01262 20 3.11719 19.1046 3.11719 18V12C3.11719 10.8954 4.01262 10 5.11719 10H7.61719",
-              stroke: color,
-              "stroke-width": "2",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
-            }
-          )
-        };
-      case 36:
-        return {
-          viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsx15(
-            "path",
-            {
-              d: "M21.1748 15H28.3207C30.5508 15 32.0013 17.3469 31.004 19.3416L25.754 29.8416C25.2458 30.858 24.207 31.5 23.0707 31.5H17.0441C16.7988 31.5 16.5545 31.4699 16.3165 31.4104L10.6748 30M21.1748 15V7.5C21.1748 5.84315 19.8317 4.5 18.1748 4.5H18.0316C17.2823 4.5 16.6748 5.10746 16.6748 5.85679C16.6748 6.92825 16.3577 7.97573 15.7633 8.86723L10.6748 16.5V30M21.1748 15H18.1748M10.6748 30H7.6748C6.01795 30 4.6748 28.6569 4.6748 27V18C4.6748 16.3431 6.01795 15 7.6748 15H11.4248",
-              stroke: color,
-              "stroke-width": "2.25",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
-            }
-          )
-        };
+// src/components/atoms/icons/category_icons/category_icon.tsx
+import { jsx as jsx14 } from "react/jsx-runtime";
+function CategoryIcon({ size = 24, icon, variant }) {
+  return /* @__PURE__ */ jsx14(
+    "div",
+    {
+      className: `flex-none`,
+      style: { width: `${size}px`, height: `${size}px` },
+      children: /* @__PURE__ */ jsx14("div", { className: "w-full h-full", children: icon && getCategoryIcon(icon, variant, size) })
     }
-  };
-  const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx15(
-    "svg",
+  );
+}
+
+// src/components/atoms/category_badge/category_badge.tsx
+import { useState } from "react";
+import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+function CategoryBadge({ active }) {
+  const [hovering, setHovering] = useState(false);
+  return /* @__PURE__ */ jsxs11(
+    "div",
     {
-      width: size,
-      height: size,
-      viewBox,
-      fill: fillColor,
-      xmlns: "http://www.w3.org/2000/svg",
-      children: path
+      onMouseEnter: () => setHovering(true),
+      onMouseLeave: () => setHovering(false),
+      className: clsx3(
+        "flex place-content-center place-items-center w-[100px] h-6 flex-none rounded-lg border-[1.5px] px-2 py-0.5 gap-0.5 hover:border-qtpurple-500 hover:bg-white",
+        active ? "bg-qtred-50" : "bg-white",
+        active ? "border-qtred-400" : "border-qtneutral-700"
+      ),
+      children: [
+        !hovering && /* @__PURE__ */ jsx15(
+          CategoryIcon,
+          {
+            size: 16,
+            icon: "fire" /* FIRE */,
+            variant: active ? void 0 : "none" /* OUTLINED */
+          }
+        ),
+        /* @__PURE__ */ jsx15(
+          "div",
+          {
+            className: clsx3(
+              "category-badge-text select-none",
+              hovering ? "text-qtpurple-600" : "text-qtneutral-900"
+            ),
+            children: hovering ? "Modify" : active ? "High" : "No Fire"
+          }
+        )
+      ]
     }
   );
 }
 
-// src/components/atoms/icons/base_icons/ThumbDown.tsx
+// src/components/atoms/icons/base_icons/ExternalLink.tsx
 import { jsx as jsx16 } from "react/jsx-runtime";
-function ThumbDown({
+function ExternalLink({
   size = 24,
   color = "#1D1D1F",
   fillColor = "none"
@@ -15355,11 +15213,11 @@ function ThumbDown({
           path: /* @__PURE__ */ jsx16(
             "path",
             {
-              d: "M6.58913 9.33333H3.41318C2.422 9.33333 1.77734 8.29025 2.22061 7.40371L4.55394 2.73705C4.7798 2.28534 5.24148 2 5.74651 2H8.42499C8.53401 2 8.64261 2.01337 8.74837 2.03981L11.2558 2.66667M6.58913 9.33333V12.6667C6.58913 13.403 7.18609 14 7.92247 14H7.98612C8.31915 14 8.58913 13.73 8.58913 13.397C8.58913 12.9208 8.73009 12.4552 8.99424 12.059L11.2558 8.66667V2.66667M6.58913 9.33333H7.92247M11.2558 2.66667H12.5891C13.3255 2.66667 13.9225 3.26362 13.9225 4V8C13.9225 8.73638 13.3255 9.33333 12.5891 9.33333H10.9225",
+              d: "M6.66699 3.99996H4.00033C3.26395 3.99996 2.66699 4.59691 2.66699 5.33329V12C2.66699 12.7363 3.26395 13.3333 4.00033 13.3333H10.667C11.4034 13.3333 12.0003 12.7363 12.0003 12V9.33329M9.33366 2.66663H13.3337M13.3337 2.66663V6.66663M13.3337 2.66663L6.66699 9.33329",
               stroke: color,
-              "stroke-width": "1.25",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
+              strokeWidth: "1.25",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
             }
           )
         };
@@ -15369,11 +15227,11 @@ function ThumbDown({
           path: /* @__PURE__ */ jsx16(
             "path",
             {
-              d: "M8.23642 11.6667H4.26647C3.0275 11.6667 2.22168 10.3628 2.77576 9.25464L5.69243 3.42131C5.97475 2.85667 6.55185 2.5 7.18314 2.5H10.5312C10.6675 2.5 10.8033 2.51671 10.9355 2.54976L14.0697 3.33333M8.23642 11.6667V15.8333C8.23642 16.7538 8.98261 17.5 9.90308 17.5H9.98264C10.3989 17.5 10.7364 17.1625 10.7364 16.7462C10.7364 16.151 10.9126 15.569 11.2428 15.0738L14.0697 10.8333V3.33333M8.23642 11.6667H9.90308M14.0697 3.33333H15.7364C16.6569 3.33333 17.4031 4.07952 17.4031 5V10C17.4031 10.9205 16.6569 11.6667 15.7364 11.6667H13.6531",
+              d: "M8.33301 5.00004H4.99967C4.0792 5.00004 3.33301 5.74623 3.33301 6.66671V15C3.33301 15.9205 4.0792 16.6667 4.99967 16.6667H13.333C14.2535 16.6667 14.9997 15.9205 14.9997 15V11.6667M11.6663 3.33337H16.6663M16.6663 3.33337V8.33337M16.6663 3.33337L8.33301 11.6667",
               stroke: color,
-              "stroke-width": "1.5",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
+              strokeWidth: "1.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
             }
           )
         };
@@ -15383,11 +15241,11 @@ function ThumbDown({
           path: /* @__PURE__ */ jsx16(
             "path",
             {
-              d: "M9.8837 14H5.11977C3.633 14 2.66601 12.4354 3.33091 11.1056L6.83091 4.10557C7.1697 3.42801 7.86222 3 8.61977 3H12.6375C12.801 3 12.9639 3.02005 13.1226 3.05972L16.8837 4M9.8837 14V19C9.8837 20.1046 10.7791 21 11.8837 21H11.9792C12.4787 21 12.8837 20.595 12.8837 20.0955C12.8837 19.3812 13.0951 18.6828 13.4914 18.0885L16.8837 13V4M9.8837 14H11.8837M16.8837 4H18.8837C19.9883 4 20.8837 4.89543 20.8837 6V12C20.8837 13.1046 19.9883 14 18.8837 14H16.3837",
+              d: "M10 6H6C4.89543 6 4 6.89543 4 8V18C4 19.1046 4.89543 20 6 20H16C17.1046 20 18 19.1046 18 18V14M14 4H20M20 4V10M20 4L10 14",
               stroke: color,
-              "stroke-width": "2",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
             }
           )
         };
@@ -15397,11 +15255,11 @@ function ThumbDown({
           path: /* @__PURE__ */ jsx16(
             "path",
             {
-              d: "M14.8246 21H7.67868C5.44853 21 3.99804 18.6531 4.99539 16.6584L10.2454 6.15836C10.7536 5.14201 11.7924 4.5 12.9287 4.5H18.9553C19.2005 4.5 19.4449 4.53008 19.6829 4.58957L25.3246 6M14.8246 21V28.5C14.8246 30.1569 16.1677 31.5 17.8246 31.5H17.9678C18.7171 31.5 19.3246 30.8925 19.3246 30.1432C19.3246 29.0718 19.6417 28.0243 20.2361 27.1328L25.3246 19.5V6M14.8246 21H17.8246M25.3246 6H28.3246C29.9814 6 31.3246 7.34314 31.3246 9V18C31.3246 19.6569 29.9814 21 28.3246 21H24.5746",
+              d: "M15 9H9C7.34315 9 6 10.3431 6 12V27C6 28.6569 7.34315 30 9 30H24C25.6569 30 27 28.6569 27 27V21M21 6H30M30 6V15M30 6L15 21",
               stroke: color,
-              "stroke-width": "2.25",
-              "stroke-linecap": "round",
-              "stroke-linejoin": "round"
+              strokeWidth: "2.25",
+              strokeLinecap: "round",
+              strokeLinejoin: "round"
             }
           )
         };
@@ -15414,81 +15272,15 @@ function ThumbDown({
       width: size,
       height: size,
       viewBox,
-      fill: fillColor,
+      fill: "none",
       xmlns: "http://www.w3.org/2000/svg",
       children: path
     }
   );
 }
 
-// src/components/molecules/buttons/thumb_group/thumb_group.tsx
-import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
-function ThumbGroup({ onUpSelected, onDownSelected }) {
-  const [upHovering, setUpHovering] = useState(false);
-  const [downHovering, setDownHovering] = useState(false);
-  const [upSelected, setUpSelected] = useState(false);
-  const [downSelected, setDownSelected] = useState(false);
-  return /* @__PURE__ */ jsxs11("div", { className: "flex flex-none w-min place-items-center place-content-center gap-4", children: [
-    /* @__PURE__ */ jsx17(
-      "div",
-      {
-        onMouseOver: () => setUpHovering(true),
-        onMouseOut: () => setUpHovering(false),
-        onClick: (e) => {
-          e.stopPropagation();
-          if (!upSelected && onUpSelected) {
-            try {
-              onUpSelected();
-            } catch (e2) {
-              console.log(`Failed to execute: onUpSelected() | [${e2}]`);
-              return;
-            }
-          }
-          setUpSelected(!upSelected);
-        },
-        children: upSelected ? /* @__PURE__ */ jsx17(
-          ThumbUp,
-          {
-            fillColor: "#82818E",
-            color: upHovering ? "#6558FD" : "#FFFFFF"
-          }
-        ) : /* @__PURE__ */ jsx17(ThumbUp, { color: upHovering ? "#6558FD" : "#82818E" })
-      }
-    ),
-    /* @__PURE__ */ jsx17(
-      "div",
-      {
-        onMouseOver: () => setDownHovering(true),
-        onMouseOut: () => setDownHovering(false),
-        onClick: (e) => {
-          e.stopPropagation();
-          if (!downSelected && onDownSelected) {
-            try {
-              onDownSelected();
-            } catch (e2) {
-              console.log(`Failed to execute: onDownSelected() | [${e2}]`);
-              return;
-            }
-          }
-          setDownSelected(!downSelected);
-        },
-        children: downSelected ? /* @__PURE__ */ jsx17(
-          ThumbDown,
-          {
-            fillColor: "#82818E",
-            color: downHovering ? "#6558FD" : "#FFFFFF"
-          }
-        ) : /* @__PURE__ */ jsx17(ThumbDown, { color: downHovering ? "#6558FD" : "#82818E" })
-      }
-    )
-  ] });
-}
-
-// src/components/molecules/checkboxes/main_checkbox/secondary_checkbox.tsx
-import clsx2 from "clsx";
-
 // src/components/atoms/icons/base_icons/CheckBox.tsx
-import { jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
 function CheckBox({ size = 24, fillColor }) {
   const getIconData = () => {
     let viewBox2 = "";
@@ -15513,15 +15305,15 @@ function CheckBox({ size = 24, fillColor }) {
         break;
     }
     const path2 = /* @__PURE__ */ jsxs12("g", { transform: `scale(${scale})`, children: [
-      /* @__PURE__ */ jsx18("mask", { id: maskId, fill: "white", children: /* @__PURE__ */ jsx18("path", { d: "M4.5 11.25C4.5 7.52208 7.52208 4.5 11.25 4.5H24.75C28.4779 4.5 31.5 7.52208 31.5 11.25V24.75C31.5 28.4779 28.4779 31.5 24.75 31.5H11.25C7.52208 31.5 4.5 28.4779 4.5 24.75V11.25Z" }) }),
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx17("mask", { id: maskId, fill: "white", children: /* @__PURE__ */ jsx17("path", { d: "M4.5 11.25C4.5 7.52208 7.52208 4.5 11.25 4.5H24.75C28.4779 4.5 31.5 7.52208 31.5 11.25V24.75C31.5 28.4779 28.4779 31.5 24.75 31.5H11.25C7.52208 31.5 4.5 28.4779 4.5 24.75V11.25Z" }) }),
+      /* @__PURE__ */ jsx17(
         "path",
         {
           d: "M4.5 11.25C4.5 7.52208 7.52208 4.5 11.25 4.5H24.75C28.4779 4.5 31.5 7.52208 31.5 11.25V24.75C31.5 28.4779 28.4779 31.5 24.75 31.5H11.25C7.52208 31.5 4.5 28.4779 4.5 24.75V11.25Z",
           fill: fillColor
         }
       ),
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx17(
         "path",
         {
           d: "M11.25 4.5V6.75H24.75V4.5V2.25H11.25V4.5ZM31.5 11.25H29.25V24.75H31.5H33.75V11.25H31.5ZM24.75 31.5V29.25H11.25V31.5V33.75H24.75V31.5ZM4.5 24.75H6.75V11.25H4.5H2.25V24.75H4.5ZM11.25 31.5V29.25C8.76472 29.25 6.75 27.2353 6.75 24.75H4.5H2.25C2.25 29.7206 6.27944 33.75 11.25 33.75V31.5ZM31.5 24.75H29.25C29.25 27.2353 27.2353 29.25 24.75 29.25V31.5V33.75C29.7206 33.75 33.75 29.7206 33.75 24.75H31.5ZM24.75 4.5V6.75C27.2353 6.75 29.25 8.76472 29.25 11.25H31.5H33.75C33.75 6.27944 29.7206 2.25 24.75 2.25V4.5ZM11.25 4.5V2.25C6.27944 2.25 2.25 6.27944 2.25 11.25H4.5H6.75C6.75 8.76472 8.76472 6.75 11.25 6.75V4.5Z",
@@ -15529,7 +15321,7 @@ function CheckBox({ size = 24, fillColor }) {
           mask: `url(#${maskId})`
         }
       ),
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx17(
         "path",
         {
           d: "M13.9502 18L16.6502 20.7L22.0502 15.3",
@@ -15543,7 +15335,7 @@ function CheckBox({ size = 24, fillColor }) {
     return { viewBox: viewBox2, path: path2 };
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx17(
     "svg",
     {
       width: size,
@@ -15579,15 +15371,15 @@ function CheckBoxEmpty({ size = 24, fillColor }) {
         break;
     }
     const path2 = /* @__PURE__ */ jsxs12("g", { transform: `scale(${scale})`, children: [
-      /* @__PURE__ */ jsx18("mask", { id: maskId, fill: "white", children: /* @__PURE__ */ jsx18("path", { d: "M4.5 11.25C4.5 7.52208 7.52208 4.5 11.25 4.5H24.75C28.4779 4.5 31.5 7.52208 31.5 11.25V24.75C31.5 28.4779 28.4779 31.5 24.75 31.5H11.25C7.52208 31.5 4.5 28.4779 4.5 24.75V11.25Z" }) }),
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx17("mask", { id: maskId, fill: "white", children: /* @__PURE__ */ jsx17("path", { d: "M4.5 11.25C4.5 7.52208 7.52208 4.5 11.25 4.5H24.75C28.4779 4.5 31.5 7.52208 31.5 11.25V24.75C31.5 28.4779 28.4779 31.5 24.75 31.5H11.25C7.52208 31.5 4.5 28.4779 4.5 24.75V11.25Z" }) }),
+      /* @__PURE__ */ jsx17(
         "path",
         {
           d: "M4.5 11.25C4.5 7.52208 7.52208 4.5 11.25 4.5H24.75C28.4779 4.5 31.5 7.52208 31.5 11.25V24.75C31.5 28.4779 28.4779 31.5 24.75 31.5H11.25C7.52208 31.5 4.5 28.4779 4.5 24.75V11.25Z",
           fill: fillColor
         }
       ),
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx17(
         "path",
         {
           d: "M11.25 4.5V6.75H24.75V4.5V2.25H11.25V4.5ZM31.5 11.25H29.25V24.75H31.5H33.75V11.25H31.5ZM24.75 31.5V29.25H11.25V31.5V33.75H24.75V31.5ZM4.5 24.75H6.75V11.25H4.5H2.25V24.75H4.5ZM11.25 31.5V29.25C8.76472 29.25 6.75 27.2353 6.75 24.75H4.5H2.25C2.25 29.7206 6.27944 33.75 11.25 33.75V31.5ZM31.5 24.75H29.25C29.25 27.2353 27.2353 29.25 24.75 29.25V31.5V33.75C29.7206 33.75 33.75 29.7206 33.75 24.75H31.5ZM24.75 4.5V6.75C27.2353 6.75 29.25 8.76472 29.25 11.25H31.5H33.75C33.75 6.27944 29.7206 2.25 24.75 2.25V4.5ZM11.25 4.5V2.25C6.27944 2.25 2.25 6.27944 2.25 11.25H4.5H6.75C6.75 8.76472 8.76472 6.75 11.25 6.75V4.5Z",
@@ -15599,7 +15391,7 @@ function CheckBoxEmpty({ size = 24, fillColor }) {
     return { viewBox: viewBox2, path: path2 };
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx18(
+  return /* @__PURE__ */ jsx17(
     "svg",
     {
       width: size,
@@ -15612,135 +15404,37 @@ function CheckBoxEmpty({ size = 24, fillColor }) {
   );
 }
 
-// src/components/molecules/checkboxes/main_checkbox/secondary_checkbox.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
-function SecondaryCheckBox({ active, onClick }) {
-  return /* @__PURE__ */ jsx19(
-    "div",
-    {
-      className: clsx2(
-        "flex flex-none  w-min h-min place-items-center place-content-center p-0"
-      ),
-      onClick: (e) => {
-        e.stopPropagation();
-        onClick && onClick();
-      },
-      children: active ? /* @__PURE__ */ jsx19(CheckBox, { size: 36, fillColor: "#E8FE99" }) : /* @__PURE__ */ jsx19(CheckBoxEmpty, { size: 36, fillColor: "#FFFFFF" })
-    }
-  );
-}
-
-// src/components/molecules/buttons/icon_button/category_icon_button/category_icon_button.tsx
-import clsx3 from "clsx";
-import { jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
-function CategoryIconButton({ icon, label, active }) {
-  return /* @__PURE__ */ jsxs13(
-    "div",
-    {
-      className: `w-min h-min flex flex-none flex-col place-items-center gap-2 hover:grayscale-0 ${active ? "" : "grayscale"}`,
-      children: [
-        /* @__PURE__ */ jsx20(
-          "div",
-          {
-            className: clsx3(
-              "flex flex-none flex-col place-items-center place-content-center rounded-lg hover:bg-qtneutral-200 border-2 border-transparent hover:border-qtneutral-500 w-[36px] h-[36px]"
-            ),
-            children: icon
-          }
-        ),
-        label && /* @__PURE__ */ jsx20("div", { className: "font-medium text-[0.7rem] text-qtneutral-900", children: label })
-      ]
-    }
-  );
-}
-
-// src/components/molecules/dropdown/dropdown.tsx
-import clsx4 from "clsx";
-import { jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
-function DropDown({
-  title,
-  items,
-  activeItem,
-  direction = "left",
-  onItemClick
-}) {
-  return /* @__PURE__ */ jsxs14("div", { className: "relative inline-block", children: [
-    /* @__PURE__ */ jsx21(
-      "div",
-      {
-        className: clsx4(
-          "absolute w-3.5 h-3.5 bg-black rotate-45 shadow-md z-0",
-          direction === "left" ? "left-[-6px] top-3" : "right-0 top-3"
-        )
-      }
-    ),
-    /* @__PURE__ */ jsxs14("div", { className: "bg-white rounded-2xl shadow-lg w-48 py-3 px-4 relative z-10", children: [
-      /* @__PURE__ */ jsx21("div", { className: "text-xs font-bold text-gray-900 tracking-wide mb-2", children: title.toUpperCase() }),
-      /* @__PURE__ */ jsx21("ul", { className: "text-sm text-gray-800 space-y-2", children: items.map((item) => /* @__PURE__ */ jsx21(
-        "li",
-        {
-          onClick: (e) => {
-            e.stopPropagation();
-            onItemClick?.(item);
-          },
-          className: clsx4(
-            "border-t border-gray-200 pt-2 cursor-pointer label-2 text-qtneutral-800 hover:text-qtpurple-500 !hover:label-2-bold",
-            activeItem === item ? "text-indigo-600 font-semibold" : ""
-          ),
-          children: item
-        },
-        item
-      )) })
-    ] })
-  ] });
-}
-
 // src/components/organisms/preview_card/preview_card.tsx
-import { jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
 function PreviewCard({
   eventID,
   onSelected,
   selected,
   onChecked,
+  checked,
   service,
   subjectLine,
   body,
   sender,
   source,
-  metadata,
   date,
   onClickGoToSource,
-  urgencyLevel,
-  alert,
+  eventCategory,
   read,
   overrideItems,
   onOverride
 }) {
-  const [checked, setChecked] = useState2(false);
   const [overrideMenuOpen, setoverrideMenuOpen] = useState2(false);
-  function getColorVariant(urgency) {
-    switch (urgency) {
-      case "high" /* HIGH */:
-        return void 0;
-      case "medium" /* MEDIUM */:
-        return "#FFD481" /* YELLOW */;
-      case "low" /* LOW */:
-        return "#E8FE99" /* GREEN */;
-      default:
-        return void 0;
-    }
-  }
   function toggleChecked() {
-    setChecked(!checked);
     if (onChecked) {
       onChecked(eventID);
     }
   }
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs13(
     "div",
     {
-      className: clsx5(
-        " flex gap-4 h-min w-[409px] bg-neutral-6 rounded-3xl p-4 border-[2px] preview-card-shadow",
+      className: clsx4(
+        "flex gap-4 h-min w-[409px] bg-white rounded-3xl p-4 border-[2px] preview-card-shadow",
         selected ? "bg-qtpurple-200 border-qtpurple-200" : "",
         !read ? "border-qtpurple-500" : "border-neutral-6"
       ),
@@ -15749,33 +15443,33 @@ function PreviewCard({
         onSelected && onSelected(eventID);
       },
       children: [
-        /* @__PURE__ */ jsxs15("div", { className: "flex flex-col gap-4 place-items-center", children: [
-          /* @__PURE__ */ jsx22(SecondaryCheckBox, { active: checked, onClick: toggleChecked }),
-          /* @__PURE__ */ jsx22(BrandIcon, { service, size: 24 }),
-          urgencyLevel && /* @__PURE__ */ jsxs15("div", { className: "relative", children: [
-            /* @__PURE__ */ jsx22(
+        /* @__PURE__ */ jsx18("div", { className: "flex flex-col gap-4 place-items-center", children: /* @__PURE__ */ jsx18(BrandIcon, { service, size: 16 }) }),
+        /* @__PURE__ */ jsxs13("div", { className: "flex flex-col gap-2 grow ", children: [
+          /* @__PURE__ */ jsxs13("div", { className: "flex flex-col grow gap-1", children: [
+            /* @__PURE__ */ jsx18(
+              SenderSourceRow,
+              {
+                leftText: sender,
+                seperator: source ? "via" : "",
+                rightText: source,
+                date
+              }
+            ),
+            subjectLine && /* @__PURE__ */ jsx18(SubjectLineRow, { text: subjectLine })
+          ] }),
+          body && /* @__PURE__ */ jsx18("div", { className: "flex flex-col max-w-full w-full wrap-anywhere", children: /* @__PURE__ */ jsx18("p", { className: "line-clamp-2 body-small", children: body }) }),
+          /* @__PURE__ */ jsx18("div", { className: "flex", children: body && /* @__PURE__ */ jsxs13("div", { className: "w-full relative flex place-content-between place-items-center", children: [
+            /* @__PURE__ */ jsx18(
               "div",
               {
                 onClick: (e) => {
-                  if (!overrideItems || overrideItems.length == 0) {
-                    return;
-                  }
                   e.stopPropagation();
                   setoverrideMenuOpen(!overrideMenuOpen);
                 },
-                children: /* @__PURE__ */ jsx22(
-                  CategoryIconButton,
-                  {
-                    active: true,
-                    icon: getCategoryIcon(
-                      "fire" /* FIRE */,
-                      getColorVariant(urgencyLevel)
-                    )
-                  }
-                )
+                children: /* @__PURE__ */ jsx18(CategoryBadge, { active: eventCategory == "fire" })
               }
             ),
-            overrideMenuOpen && /* @__PURE__ */ jsx22("div", { className: "absolute left-full top-0 ml-2 z-50", children: /* @__PURE__ */ jsx22(
+            overrideMenuOpen && /* @__PURE__ */ jsx18("div", { className: "absolute right-[56%] top-[140%]", children: /* @__PURE__ */ jsx18(
               DropDown,
               {
                 items: overrideItems ? overrideItems : [],
@@ -15785,35 +15479,27 @@ function PreviewCard({
                   setoverrideMenuOpen(false);
                 }
               }
-            ) })
-          ] }),
-          alert && /* @__PURE__ */ jsx22(
-            CategoryIconButton,
-            {
-              active: true,
-              icon: getCategoryIcon("alert" /* ALERT */)
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsxs15("div", { className: "flex flex-col gap-2 grow ", children: [
-          /* @__PURE__ */ jsxs15("div", { className: "flex flex-col grow gap-1", children: [
-            /* @__PURE__ */ jsx22(
-              SenderSourceRow,
-              {
-                leftText: sender,
-                seperator: "via",
-                rightText: source,
-                date,
-                onClick: onClickGoToSource
-              }
-            ),
-            subjectLine && /* @__PURE__ */ jsx22(SubjectLineRow, { text: subjectLine }),
-            /* @__PURE__ */ jsx22(MetadataRow, { metadata })
-          ] }),
-          body && /* @__PURE__ */ jsxs15("div", { className: "bg-white flex flex-col max-w-full w-full gap-2 wrap-anywhere rounded-2xl text-sm p-4 leading-[120%] font-normal", children: [
-            /* @__PURE__ */ jsx22("p", { className: "line-clamp-4", children: body }),
-            /* @__PURE__ */ jsx22(ThumbGroup, {})
-          ] })
+            ) }),
+            /* @__PURE__ */ jsxs13("div", { className: "flex gap-2", children: [
+              /* @__PURE__ */ jsx18(
+                "div",
+                {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    toggleChecked();
+                  },
+                  children: /* @__PURE__ */ jsx18(
+                    CheckBox,
+                    {
+                      size: 16,
+                      fillColor: checked ? "#E8FE99" : void 0
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsx18("div", { onClick: onClickGoToSource, children: /* @__PURE__ */ jsx18(ExternalLink, { size: 16, color: "#82818E" }) })
+            ] })
+          ] }) })
         ] })
       ]
     }
@@ -15821,7 +15507,7 @@ function PreviewCard({
 }
 
 // src/components/atoms/icons/base_icons/Gear.tsx
-import { Fragment as Fragment9, jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
 function Gear({
   size = 24,
   color = "#1D1D1F",
@@ -15832,8 +15518,8 @@ function Gear({
       case 16:
         return {
           viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsxs16(Fragment9, { children: [
-            /* @__PURE__ */ jsx23(
+          path: /* @__PURE__ */ jsxs14(Fragment9, { children: [
+            /* @__PURE__ */ jsx19(
               "path",
               {
                 d: "M6.88309 2.87821C7.16735 1.70726 8.83265 1.70726 9.11692 2.87821C9.30055 3.63462 10.1672 3.99358 10.8319 3.58857C11.8609 2.96159 13.0384 4.13914 12.4114 5.16812C12.0064 5.83284 12.3654 6.69945 13.1218 6.88308C14.2927 7.16735 14.2927 8.83265 13.1218 9.11692C12.3654 9.30055 12.0064 10.1672 12.4114 10.8319C13.0384 11.8609 11.8609 13.0384 10.8319 12.4114C10.1672 12.0064 9.30055 12.3654 9.11692 13.1218C8.83265 14.2927 7.16735 14.2927 6.88309 13.1218C6.69945 12.3654 5.83284 12.0064 5.16812 12.4114C4.13914 13.0384 2.96159 11.8609 3.58857 10.8319C3.99358 10.1672 3.63462 9.30055 2.87821 9.11692C1.70726 8.83265 1.70726 7.16735 2.87821 6.88308C3.63462 6.69945 3.99358 5.83284 3.58857 5.16812C2.96159 4.13914 4.13914 2.96159 5.16812 3.58857C5.83284 3.99358 6.69945 3.63462 6.88309 2.87821Z",
@@ -15843,7 +15529,7 @@ function Gear({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx19(
               "path",
               {
                 d: "M10 8C10 9.10457 9.10457 10 8 10C6.89543 10 6 9.10457 6 8C6 6.89543 6.89543 6 8 6C9.10457 6 10 6.89543 10 8Z",
@@ -15858,8 +15544,8 @@ function Gear({
       case 20:
         return {
           viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsxs16(Fragment9, { children: [
-            /* @__PURE__ */ jsx23(
+          path: /* @__PURE__ */ jsxs14(Fragment9, { children: [
+            /* @__PURE__ */ jsx19(
               "path",
               {
                 d: "M8.60386 3.59776C8.95919 2.13408 11.0408 2.13408 11.3961 3.59776C11.6257 4.54327 12.709 4.99198 13.5398 4.48571C14.8261 3.70199 16.298 5.17392 15.5143 6.46015C15.008 7.29105 15.4567 8.37431 16.4022 8.60386C17.8659 8.95919 17.8659 11.0408 16.4022 11.3961C15.4567 11.6257 15.008 12.709 15.5143 13.5398C16.298 14.8261 14.8261 16.298 13.5398 15.5143C12.709 15.008 11.6257 15.4567 11.3961 16.4022C11.0408 17.8659 8.95919 17.8659 8.60386 16.4022C8.37431 15.4567 7.29105 15.008 6.46016 15.5143C5.17392 16.298 3.70199 14.8261 4.48571 13.5398C4.99198 12.709 4.54327 11.6257 3.59776 11.3961C2.13408 11.0408 2.13408 8.95919 3.59776 8.60386C4.54327 8.37431 4.99198 7.29105 4.48571 6.46015C3.70199 5.17392 5.17392 3.70199 6.46015 4.48571C7.29105 4.99198 8.37431 4.54327 8.60386 3.59776Z",
@@ -15869,7 +15555,7 @@ function Gear({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx19(
               "path",
               {
                 d: "M12.5 10C12.5 11.3807 11.3807 12.5 10 12.5C8.61929 12.5 7.5 11.3807 7.5 10C7.5 8.61929 8.61929 7.5 10 7.5C11.3807 7.5 12.5 8.61929 12.5 10Z",
@@ -15884,8 +15570,8 @@ function Gear({
       case 24:
         return {
           viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsxs16(Fragment9, { children: [
-            /* @__PURE__ */ jsx23(
+          path: /* @__PURE__ */ jsxs14(Fragment9, { children: [
+            /* @__PURE__ */ jsx19(
               "path",
               {
                 d: "M10.3246 4.31731C10.751 2.5609 13.249 2.5609 13.6754 4.31731C13.9508 5.45193 15.2507 5.99038 16.2478 5.38285C17.7913 4.44239 19.5576 6.2087 18.6172 7.75218C18.0096 8.74925 18.5481 10.0492 19.6827 10.3246C21.4391 10.751 21.4391 13.249 19.6827 13.6754C18.5481 13.9508 18.0096 15.2507 18.6172 16.2478C19.5576 17.7913 17.7913 19.5576 16.2478 18.6172C15.2507 18.0096 13.9508 18.5481 13.6754 19.6827C13.249 21.4391 10.751 21.4391 10.3246 19.6827C10.0492 18.5481 8.74926 18.0096 7.75219 18.6172C6.2087 19.5576 4.44239 17.7913 5.38285 16.2478C5.99038 15.2507 5.45193 13.9508 4.31731 13.6754C2.5609 13.249 2.5609 10.751 4.31731 10.3246C5.45193 10.0492 5.99037 8.74926 5.38285 7.75218C4.44239 6.2087 6.2087 4.44239 7.75219 5.38285C8.74926 5.99037 10.0492 5.45193 10.3246 4.31731Z",
@@ -15895,7 +15581,7 @@ function Gear({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx19(
               "path",
               {
                 d: "M15 12C15 13.6569 13.6569 15 12 15C10.3431 15 9 13.6569 9 12C9 10.3431 10.3431 9 12 9C13.6569 9 15 10.3431 15 12Z",
@@ -15910,8 +15596,8 @@ function Gear({
       case 36:
         return {
           viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsxs16(Fragment9, { children: [
-            /* @__PURE__ */ jsx23(
+          path: /* @__PURE__ */ jsxs14(Fragment9, { children: [
+            /* @__PURE__ */ jsx19(
               "path",
               {
                 d: "M15.4869 6.47596C16.1265 3.84134 19.8735 3.84135 20.5131 6.47596C20.9262 8.17789 22.8761 8.98556 24.3717 8.07427C26.6869 6.66359 29.3364 9.31305 27.9257 11.6283C27.0144 13.1239 27.8221 15.0738 29.524 15.4869C32.1587 16.1265 32.1587 19.8735 29.524 20.5131C27.8221 20.9262 27.0144 22.8761 27.9257 24.3717C29.3364 26.6869 26.6869 29.3364 24.3717 27.9257C22.8761 27.0144 20.9262 27.8221 20.5131 29.524C19.8735 32.1587 16.1265 32.1587 15.4869 29.524C15.0738 27.8221 13.1239 27.0144 11.6283 27.9257C9.31306 29.3364 6.66359 26.6869 8.07428 24.3717C8.98556 22.8761 8.17789 20.9262 6.47596 20.5131C3.84135 19.8735 3.84134 16.1265 6.47596 15.4869C8.17789 15.0738 8.98556 13.1239 8.07427 11.6283C6.66358 9.31305 9.31305 6.66358 11.6283 8.07427C13.1239 8.98556 15.0738 8.17789 15.4869 6.47596Z",
@@ -15921,7 +15607,7 @@ function Gear({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx23(
+            /* @__PURE__ */ jsx19(
               "path",
               {
                 d: "M22.5 18C22.5 20.4853 20.4853 22.5 18 22.5C15.5147 22.5 13.5 20.4853 13.5 18C13.5 15.5147 15.5147 13.5 18 13.5C20.4853 13.5 22.5 15.5147 22.5 18Z",
@@ -15936,7 +15622,7 @@ function Gear({
     }
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx23(
+  return /* @__PURE__ */ jsx19(
     "svg",
     {
       width: size,
@@ -15950,7 +15636,7 @@ function Gear({
 }
 
 // src/components/atoms/icons/base_icons/Logout.tsx
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx20 } from "react/jsx-runtime";
 function Logout({
   size = 24,
   color = "#1D1D1F",
@@ -15961,7 +15647,7 @@ function Logout({
       case 16:
         return {
           viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsx24(
+          path: /* @__PURE__ */ jsx20(
             "path",
             {
               d: "M11.3333 10.6666L14 7.99996M14 7.99996L11.3333 5.33329M14 7.99996L4.66667 7.99996M8.66667 10.6666V11.3333C8.66667 12.4379 7.77124 13.3333 6.66667 13.3333H4C2.89543 13.3333 2 12.4379 2 11.3333V4.66663C2 3.56206 2.89543 2.66663 4 2.66663H6.66667C7.77124 2.66663 8.66667 3.56206 8.66667 4.66663V5.33329",
@@ -15975,7 +15661,7 @@ function Logout({
       case 20:
         return {
           viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsx24(
+          path: /* @__PURE__ */ jsx20(
             "path",
             {
               d: "M14.1667 13.3334L17.5 10M17.5 10L14.1667 6.66671M17.5 10L5.83333 10M10.8333 13.3334V14.1667C10.8333 15.5474 9.71405 16.6667 8.33333 16.6667H5C3.61929 16.6667 2.5 15.5474 2.5 14.1667V5.83337C2.5 4.45266 3.61929 3.33337 5 3.33337H8.33333C9.71405 3.33337 10.8333 4.45266 10.8333 5.83337V6.66671",
@@ -15989,7 +15675,7 @@ function Logout({
       case 24:
         return {
           viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsx24(
+          path: /* @__PURE__ */ jsx20(
             "path",
             {
               d: "M17 16L21 12M21 12L17 8M21 12L7 12M13 16V17C13 18.6569 11.6569 20 10 20H6C4.34315 20 3 18.6569 3 17V7C3 5.34315 4.34315 4 6 4H10C11.6569 4 13 5.34315 13 7V8",
@@ -16003,7 +15689,7 @@ function Logout({
       case 36:
         return {
           viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsx24(
+          path: /* @__PURE__ */ jsx20(
             "path",
             {
               d: "M25.5 24L31.5 18M31.5 18L25.5 12M31.5 18L10.5 18M19.5 24V25.5C19.5 27.9853 17.4853 30 15 30H9C6.51472 30 4.5 27.9853 4.5 25.5V10.5C4.5 8.01472 6.51472 6 9 6H15C17.4853 6 19.5 8.01472 19.5 10.5V12",
@@ -16017,7 +15703,7 @@ function Logout({
     }
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx20(
     "svg",
     {
       width: size,
@@ -16031,7 +15717,7 @@ function Logout({
 }
 
 // src/components/atoms/icons/base_icons/Queue.tsx
-import { Fragment as Fragment10, jsx as jsx25, jsxs as jsxs17 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
 function Queue({
   size = 24,
   color = "#1D1D1F",
@@ -16042,8 +15728,8 @@ function Queue({
       case 16:
         return {
           viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsxs17(Fragment10, { children: [
-            /* @__PURE__ */ jsx25(
+          path: /* @__PURE__ */ jsxs15(Fragment10, { children: [
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M6.86628 11.4002H5.73294C5.10702 11.4002 4.59961 10.8928 4.59961 10.2669V5.73355C4.59961 5.10763 5.10702 4.60022 5.73294 4.60022H10.2663C10.8922 4.60022 11.3996 5.10763 11.3996 5.73355V6.86689M7.99961 13.6669H12.5329C13.1589 13.6669 13.6663 13.1595 13.6663 12.5336V8.00022C13.6663 7.3743 13.1589 6.86689 12.5329 6.86689H7.99961C7.37369 6.86689 6.86628 7.3743 6.86628 8.00022V12.5336C6.86628 13.1595 7.37369 13.6669 7.99961 13.6669Z",
@@ -16053,7 +15739,7 @@ function Queue({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx25(
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M4.59967 9.13325H3.46634C2.84042 9.13325 2.33301 8.62584 2.33301 7.99992V3.46659C2.33301 2.84066 2.84042 2.33325 3.46634 2.33325H7.99967C8.6256 2.33325 9.13301 2.84066 9.13301 3.46659V4.59992M11.4626 6.74066L11.3997 5.73325C11.3997 5.10733 10.8923 4.59992 10.2663 4.59992H5.73301C5.10709 4.59992 4.59967 5.10733 4.59967 5.73325V10.2666C4.59967 10.8925 5.10709 11.3999 5.73301 11.3999H6.74042",
@@ -16063,7 +15749,7 @@ function Queue({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx25(
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M6.86621 7.99918C6.86621 7.37326 7.37362 6.86584 7.99954 6.86584H12.5329C13.1588 6.86584 13.6662 7.37326 13.6662 7.99918V12.5325C13.6662 13.1584 13.1588 13.6658 12.5329 13.6658H7.99954C7.37362 13.6658 6.86621 13.1584 6.86621 12.5325V7.99918Z",
@@ -16078,8 +15764,8 @@ function Queue({
       case 20:
         return {
           viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsxs17(Fragment10, { children: [
-            /* @__PURE__ */ jsx25(
+          path: /* @__PURE__ */ jsxs15(Fragment10, { children: [
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M8.58333 14.2501H7.16667C6.38426 14.2501 5.75 13.6159 5.75 12.8335V7.16679C5.75 6.38439 6.38426 5.75012 7.16667 5.75012H12.8333C13.6157 5.75012 14.25 6.38439 14.25 7.16679V8.58346M10 17.0835H15.6667C16.4491 17.0835 17.0833 16.4492 17.0833 15.6668V10.0001C17.0833 9.21772 16.4491 8.58346 15.6667 8.58346H10C9.2176 8.58346 8.58333 9.21772 8.58333 10.0001V15.6668C8.58333 16.4492 9.2176 17.0835 10 17.0835Z",
@@ -16089,7 +15775,7 @@ function Queue({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx25(
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M5.75033 11.4165H4.33366C3.55126 11.4165 2.91699 10.7822 2.91699 9.99984V4.33317C2.91699 3.55077 3.55126 2.9165 4.33366 2.9165H10.0003C10.7827 2.9165 11.417 3.55077 11.417 4.33317V5.74984M14.329 8.42576L14.2503 7.1665C14.2503 6.3841 13.6161 5.74984 12.8337 5.74984H7.16699C6.38459 5.74984 5.75033 6.3841 5.75033 7.1665V12.8332C5.75033 13.6156 6.38459 14.2498 7.16699 14.2498H8.42625",
@@ -16099,7 +15785,7 @@ function Queue({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx25(
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M8.58398 9.99882C8.58398 9.21642 9.21825 8.58215 10.0007 8.58215H15.6673C16.4497 8.58215 17.084 9.21642 17.084 9.99882V15.6655C17.084 16.4479 16.4497 17.0822 15.6673 17.0822H10.0007C9.21825 17.0822 8.58398 16.4479 8.58398 15.6655V9.99882Z",
@@ -16114,8 +15800,8 @@ function Queue({
       case 24:
         return {
           viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsxs17(Fragment10, { children: [
-            /* @__PURE__ */ jsx25(
+          path: /* @__PURE__ */ jsxs15(Fragment10, { children: [
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M10.2994 17.0997H8.59941C7.66053 17.0997 6.89941 16.3385 6.89941 15.3997V8.59966C6.89941 7.66077 7.66053 6.89966 8.59941 6.89966H15.3994C16.3383 6.89966 17.0994 7.66077 17.0994 8.59966V10.2997M11.9994 20.4997H18.7994C19.7383 20.4997 20.4994 19.7385 20.4994 18.7997V11.9997C20.4994 11.0608 19.7383 10.2997 18.7994 10.2997H11.9994C11.0605 10.2997 10.2994 11.0608 10.2994 11.9997V18.7997C10.2994 19.7385 11.0605 20.4997 11.9994 20.4997Z",
@@ -16125,7 +15811,7 @@ function Queue({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx25(
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M6.9 13.7H5.2C4.26112 13.7 3.5 12.9389 3.5 12V5.2C3.5 4.26112 4.26112 3.5 5.2 3.5H12C12.9389 3.5 13.7 4.26112 13.7 5.2V6.9M17.1944 10.1111L17.1 8.6C17.1 7.66112 16.3389 6.9 15.4 6.9H8.6C7.66112 6.9 6.9 7.66112 6.9 8.6V15.4C6.9 16.3389 7.66112 17.1 8.6 17.1H10.1111",
@@ -16135,7 +15821,7 @@ function Queue({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx25(
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M10.2998 11.9993C10.2998 11.0604 11.0609 10.2993 11.9998 10.2993H18.7998C19.7387 10.2993 20.4998 11.0604 20.4998 11.9993V18.7993C20.4998 19.7382 19.7387 20.4993 18.7998 20.4993H11.9998C11.0609 20.4993 10.2998 19.7382 10.2998 18.7993V11.9993Z",
@@ -16150,8 +15836,8 @@ function Queue({
       case 36:
         return {
           viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsxs17(Fragment10, { children: [
-            /* @__PURE__ */ jsx25(
+          path: /* @__PURE__ */ jsxs15(Fragment10, { children: [
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M15.4496 25.6511H12.8996C11.4913 25.6511 10.3496 24.5094 10.3496 23.1011V12.9011C10.3496 11.4927 11.4913 10.3511 12.8996 10.3511H23.0996C24.5079 10.3511 25.6496 11.4927 25.6496 12.9011V15.4511M17.9996 30.7511H28.1996C29.6079 30.7511 30.7496 29.6094 30.7496 28.2011V18.0011C30.7496 16.5927 29.6079 15.4511 28.1996 15.4511H17.9996C16.5913 15.4511 15.4496 16.5927 15.4496 18.0011V28.2011C15.4496 29.6094 16.5913 30.7511 17.9996 30.7511Z",
@@ -16161,7 +15847,7 @@ function Queue({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx25(
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M10.35 20.549H7.8C6.39167 20.549 5.25 19.4073 5.25 17.999V7.79902C5.25 6.3907 6.39167 5.24902 7.8 5.24902H18C19.4083 5.24902 20.55 6.3907 20.55 7.79902V10.349M25.7917 15.1657L25.65 12.899C25.65 11.4907 24.5083 10.349 23.1 10.349H12.9C11.4917 10.349 10.35 11.4907 10.35 12.899V23.099C10.35 24.5073 11.4917 25.649 12.9 25.649H15.1667",
@@ -16171,7 +15857,7 @@ function Queue({
                 strokeLinejoin: "round"
               }
             ),
-            /* @__PURE__ */ jsx25(
+            /* @__PURE__ */ jsx21(
               "path",
               {
                 d: "M15.4492 17.9987C15.4492 16.5904 16.5909 15.4487 17.9992 15.4487H28.1992C29.6075 15.4487 30.7492 16.5904 30.7492 17.9987V28.1987C30.7492 29.6071 29.6075 30.7487 28.1992 30.7487H17.9992C16.5909 30.7487 15.4492 29.6071 15.4492 28.1987V17.9987Z",
@@ -16186,7 +15872,7 @@ function Queue({
     }
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx25(
+  return /* @__PURE__ */ jsx21(
     "svg",
     {
       width: size,
@@ -16200,17 +15886,17 @@ function Queue({
 }
 
 // src/components/atoms/qtalo_logo/qtalo_logo.tsx
-import { jsx as jsx26 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function QTLogo({ variant }) {
   if (variant == "monogram") {
-    return /* @__PURE__ */ jsx26(
+    return /* @__PURE__ */ jsx22(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
         width: "40",
         height: "40",
         viewBox: "0 0 40 40",
-        children: /* @__PURE__ */ jsx26(
+        children: /* @__PURE__ */ jsx22(
           "image",
           {
             href: "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAAAAXNSR0IArs4c6QAABApJREFUWEfNWV1SGkEQ/npXTcUnvAGeIHKCyAnUEwguIsmLeILgCcSXhL9VPIF6ArmBeoJwg1CpPEV2O9ULu7WsuzOzSCWZKl5gpvubnu6vfyAsuRoNLk5/Y98mfGDGLhMKBBREHAMTAsby8Rn39gZGnQ6Nl1FFeQ41m1z49RMVm7DHwG6eswCemHHZv6JhnnPGAE8cPvWBVmilPEoSe8fMODcFqgUoT8kvuF7CYro7jK11lHVPrwT4yeHDKdBegdWywIpfnvVcusvakAlQnpSBts4Mq/jdBirfXLpJk5UK8G+CC0FlgXwF8PiYd8jHo6lliDBiH/dsY2TbmATnpij6PnbIwp5QkKmsNQulr316iu9fACgB4b/gAUBRJ5SAy/ceWu0hzUBlrEaFi76NFoBDnUwA400PpbjMBYAnDku0VlSCAgImVDsDGhkojLbUHd4n4IJ1lye0ewM6Cw9GAOfW+64F56HcGS6XFcSabONBBzL+1BFAE+tZHraXBRde3MTHCbjrunQgZwKAJtYD4bw3IPGlN696jVtgfFEJ2vSwJb4YADw+4goRrhVkOe66tP1mZHMBlQoX3tl4VD414aw3IEkSwInD4heZdGAxqp2cSV53GZ0VCRh1XSoHAOsOs0rgKnwvKV+suGHjh0LvpOfSFn0+5p2pgpiFiLsDKusssszv9Ro/grGTdVaimYSfANwq/O+y61JzGQC6M3WHpTbMJHC2UCVdgKwyepOAdX4YADTZ1O/nq4J1los4UcMeYpx/CrBe4yYYF5kXEoD//xPrg2TYdalq+mx59p04fMuABGnqsghlmpdDqiJh3MuZRcLuT7SubeAuq+8wopk5UQthBj1t2rLWsa1rbsJzkte9FzzG+5i0atkg/8+Iep7qlKbOQzVZVkmC1FVPBNx3XZIaUl8sAJhsetjWVc+6tBmCNKncw/wfAJznRfHDzGdGotLNcoe6wyp3maxZKHs+pGNUVe6RQaKCVUfYAkjVHoaAdanTJMoJiJgjAmhkRQRdW1XVaAuAxhFXfEV9qQE5sTyUwsp9oWmqH3ETpGD2UDKj1buic5UiY1lJIYnK/VVfrCteY/K0QyATt4njI8JTd0Clhe+SFzDtvOJApfr1GM80cwGZDxZkbugDQhPZgRcTErSzKR1j6uhj3nlJA28k3MTxDfYcpPl25vBIQFo+hMC1UwYD5SZbAgpSjj5W8NwmQFR7XuV97QAzyDQOS/t3+lbtJueTAyQjgAG3zcYWMlvJLI9MAEgT5s8CKvXCUmLF5z7GAEPl4bSKgI85/FMmBDdEuAuVp72KRHJyQJAbYNxKjRrvBnNAQhGEDxGPU/A3xIQ9PMvcsJ+Y+UVpscYtYhwKLQkH0hTV5OznD06t70w92gcAAAAAAElFTkSuQmCC",
@@ -16223,14 +15909,14 @@ function QTLogo({ variant }) {
       }
     );
   } else {
-    return /* @__PURE__ */ jsx26(
+    return /* @__PURE__ */ jsx22(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
         width: "140",
         height: "40",
         viewBox: "0 0 140 40",
-        children: /* @__PURE__ */ jsx26(
+        children: /* @__PURE__ */ jsx22(
           "image",
           {
             href: "data:image/png;base64,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",
@@ -16246,63 +15932,63 @@ function QTLogo({ variant }) {
 }
 
 // src/components/molecules/buttons/nav_button/main_nav_button/main_nav_button.tsx
-import clsx6 from "clsx";
-import { jsx as jsx27, jsxs as jsxs18 } from "react/jsx-runtime";
+import clsx5 from "clsx";
+import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
 function MainNavButton({ icon, label, active, onClick }) {
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs16(
     "div",
     {
       className: "w-min h-min flex flex-none flex-col place-items-center gap-2",
       onClick,
       children: [
-        /* @__PURE__ */ jsx27(
+        /* @__PURE__ */ jsx23(
           "div",
           {
-            className: clsx6(
+            className: clsx5(
               "w-[44px] h-[44px] flex flex-none flex-col place-items-center place-content-center rounded-xl border-2 hover:border-qtpurple-500",
               active ? "border-qtpurple-500 qt-drop-shadow-100 bg-qtpurple-200" : "border-qtpurple-300 bg-white"
             ),
             children: icon
           }
         ),
-        /* @__PURE__ */ jsx27("div", { className: "label-3-bold text-qtpurple-500 select-none", children: label })
+        /* @__PURE__ */ jsx23("div", { className: "label-3-bold text-qtpurple-500 select-none", children: label })
       ]
     }
   );
 }
 
 // src/components/organisms/nav_bar/nav_bar.tsx
-import { jsx as jsx28, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
 function NavBar({ buttons = {} }) {
-  return /* @__PURE__ */ jsxs19("div", { className: "flex flex-col w-[66px] bg-qtneutral-100 navbar-shadow h-full py-12 place-items-center place-content-between gap-8", children: [
-    /* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-8", children: [
-      /* @__PURE__ */ jsx28(QTLogo, { variant: "monogram" }),
-      /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col w-[66px] bg-qtneutral-100 navbar-shadow h-full py-12 place-items-center place-content-between gap-8", children: [
+    /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-8", children: [
+      /* @__PURE__ */ jsx24(QTLogo, { variant: "monogram" }),
+      /* @__PURE__ */ jsx24(
         MainNavButton,
         {
           active: buttons.queue?.active,
           label: "Queue",
-          icon: /* @__PURE__ */ jsx28(Queue, { color: "#6558FD" }),
+          icon: /* @__PURE__ */ jsx24(Queue, { color: "#6558FD" }),
           onClick: buttons.queue?.onClick
         }
       )
     ] }),
-    /* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-8", children: [
-      /* @__PURE__ */ jsx28(
+    /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-8", children: [
+      /* @__PURE__ */ jsx24(
         MainNavButton,
         {
           active: buttons.account?.active,
           label: "Account",
-          icon: /* @__PURE__ */ jsx28(Gear, { color: "#6558FD" }),
+          icon: /* @__PURE__ */ jsx24(Gear, { color: "#6558FD" }),
           onClick: buttons.account?.onClick
         }
       ),
-      /* @__PURE__ */ jsx28(
+      /* @__PURE__ */ jsx24(
         MainNavButton,
         {
           active: buttons.logout?.active,
           label: "Logout",
-          icon: /* @__PURE__ */ jsx28(Logout, { color: "#6558FD" }),
+          icon: /* @__PURE__ */ jsx24(Logout, { color: "#6558FD" }),
           onClick: buttons.logout?.onClick
         }
       )
@@ -16310,15 +15996,21 @@ function NavBar({ buttons = {} }) {
   ] });
 }
 
-// src/components/atoms/icons/category_icons/category_icon.tsx
-import { jsx as jsx29 } from "react/jsx-runtime";
-function CategoryIcon({ size = 24, icon, variant }) {
-  return /* @__PURE__ */ jsx29(
+// src/components/molecules/checkboxes/main_checkbox/secondary_checkbox.tsx
+import clsx6 from "clsx";
+import { jsx as jsx25 } from "react/jsx-runtime";
+function SecondaryCheckBox({ active, onClick }) {
+  return /* @__PURE__ */ jsx25(
     "div",
     {
-      className: `flex-none`,
-      style: { width: `${size}px`, height: `${size}px` },
-      children: /* @__PURE__ */ jsx29("div", { className: "w-full h-full", children: icon && getCategoryIcon(icon, variant, size) })
+      className: clsx6(
+        "flex flex-none  w-min h-min place-items-center place-content-center p-0"
+      ),
+      onClick: (e) => {
+        e.stopPropagation();
+        onClick && onClick();
+      },
+      children: active ? /* @__PURE__ */ jsx25(CheckBox, { size: 36, fillColor: "#E8FE99" }) : /* @__PURE__ */ jsx25(CheckBoxEmpty, { size: 36, fillColor: "#FFFFFF" })
     }
   );
 }
@@ -16330,10 +16022,10 @@ import { useEffect, useState as useState3 } from "react";
 import clsx7 from "clsx";
 
 // src/components/molecules/text_content/intel_row/intel_row.tsx
-import { jsx as jsx30, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs18 } from "react/jsx-runtime";
 function IntelRow({ boldText, text }) {
-  return /* @__PURE__ */ jsx30("div", { className: "flex w-max body-small text-neutral-1 gap-2 max-w-full", children: /* @__PURE__ */ jsx30("div", { className: "flex break-words", children: /* @__PURE__ */ jsxs20("p", { children: [
-    /* @__PURE__ */ jsxs20("strong", { className: "body-small-bold", children: [
+  return /* @__PURE__ */ jsx26("div", { className: "flex w-max body-small text-neutral-1 gap-2 max-w-full", children: /* @__PURE__ */ jsx26("div", { className: "flex break-words", children: /* @__PURE__ */ jsxs18("p", { children: [
+    /* @__PURE__ */ jsxs18("strong", { className: "body-small-bold", children: [
       boldText,
       ":"
     ] }),
@@ -16343,7 +16035,7 @@ function IntelRow({ boldText, text }) {
 }
 
 // src/components/organisms/intel_card/intel_card.tsx
-import { jsx as jsx31, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs19 } from "react/jsx-runtime";
 function IntelCard({
   onRead,
   onSelected,
@@ -16364,7 +16056,7 @@ function IntelCard({
         return "";
     }
   };
-  return /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs19(
     "div",
     {
       className: clsx7(
@@ -16377,10 +16069,10 @@ function IntelCard({
         reversed ? "rounded-b-2xl border-t-[2px]" : "rounded-t-2xl border-b-[2px]"
       ),
       children: [
-        /* @__PURE__ */ jsx31("div", { className: "flex flex-col gap-4 place-items-center" }),
-        /* @__PURE__ */ jsxs21("div", { className: "flex flex-col gap-2 max-w-full", children: [
-          urgency && /* @__PURE__ */ jsx31(IntelRow, { boldText: urgencyPrefix(), text: urgencyText }),
-          /* @__PURE__ */ jsx31(IntelRow, { boldText: "Summary", text: summary })
+        /* @__PURE__ */ jsx27("div", { className: "flex flex-col gap-4 place-items-center" }),
+        /* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-2 max-w-full", children: [
+          urgency && /* @__PURE__ */ jsx27(IntelRow, { boldText: urgencyPrefix(), text: urgencyText }),
+          /* @__PURE__ */ jsx27(IntelRow, { boldText: "Summary", text: summary })
         ] })
       ]
     }
@@ -16388,7 +16080,7 @@ function IntelCard({
 }
 
 // src/components/organisms/emails/single_event.tsx
-import { Fragment as Fragment11, jsx as jsx32, jsxs as jsxs22 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx28, jsxs as jsxs20 } from "react/jsx-runtime";
 function SingleEvent({
   urgency,
   service,
@@ -16408,7 +16100,7 @@ function SingleEvent({
       setExpanded(true);
     }
   }, [startExpanded]);
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs20(
     "div",
     {
       className: "flex flex-col rounded-3xl bg-qtneutral-200 py-4 px-4 gap-4 h-min",
@@ -16418,15 +16110,15 @@ function SingleEvent({
         }
       },
       children: [
-        /* @__PURE__ */ jsxs22("div", { className: "flex gap-2 place-items-center", children: [
-          /* @__PURE__ */ jsx32(
+        /* @__PURE__ */ jsxs20("div", { className: "flex gap-2 place-items-center", children: [
+          /* @__PURE__ */ jsx28(
             SecondaryCheckBox,
             {
               active: selected,
               onClick: () => setSelected(!selected)
             }
           ),
-          /* @__PURE__ */ jsx32(
+          /* @__PURE__ */ jsx28(
             CategoryIcon,
             {
               size: 30,
@@ -16434,8 +16126,8 @@ function SingleEvent({
               variant: urgency == "high" ? void 0 : urgency == "medium" ? "#FFD481" /* YELLOW */ : urgency == void 0 ? "none" /* OUTLINED */ : void 0
             }
           ),
-          /* @__PURE__ */ jsxs22("div", { className: "flex flex-col w-full h-min", children: [
-            /* @__PURE__ */ jsx32(
+          /* @__PURE__ */ jsxs20("div", { className: "flex flex-col w-full h-min", children: [
+            /* @__PURE__ */ jsx28(
               SenderSourceRow,
               {
                 leftText: sender,
@@ -16445,12 +16137,12 @@ function SingleEvent({
                 onClick: onExternal
               }
             ),
-            /* @__PURE__ */ jsx32(SubjectLineRow, { text: subjectLine })
+            /* @__PURE__ */ jsx28(SubjectLineRow, { text: subjectLine })
           ] })
         ] }),
-        expanded && /* @__PURE__ */ jsxs22(Fragment11, { children: [
-          /* @__PURE__ */ jsxs22("div", { children: [
-            /* @__PURE__ */ jsx32(
+        expanded && /* @__PURE__ */ jsxs20(Fragment11, { children: [
+          /* @__PURE__ */ jsxs20("div", { children: [
+            /* @__PURE__ */ jsx28(
               IntelCard,
               {
                 urgencyText: urgencyExplanation,
@@ -16460,7 +16152,7 @@ function SingleEvent({
             ),
             body
           ] }),
-          /* @__PURE__ */ jsx32(BrandIcon, { service })
+          /* @__PURE__ */ jsx28(BrandIcon, { service })
         ] })
       ]
     }
@@ -16469,7 +16161,7 @@ function SingleEvent({
 
 // src/components/organisms/event_card/event_card.tsx
 import clsx8 from "clsx";
-import { Fragment as Fragment12, jsx as jsx33, jsxs as jsxs23 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx29, jsxs as jsxs21 } from "react/jsx-runtime";
 function EventCard({
   eventType,
   eventData,
@@ -16480,9 +16172,9 @@ function EventCard({
   function getEventBody() {
     switch (eventType) {
       case "message" /* MESSAGE */:
-        return eventData ? eventData[0].eventBody : /* @__PURE__ */ jsx33(Fragment12, {});
+        return eventData ? eventData[0].eventBody : /* @__PURE__ */ jsx29(Fragment12, {});
       case "email" /* EMAIL */:
-        return /* @__PURE__ */ jsx33(Fragment12, { children: eventData ? eventData.map((d, i) => /* @__PURE__ */ jsx33(
+        return /* @__PURE__ */ jsx29(Fragment12, { children: eventData ? eventData.map((d, i) => /* @__PURE__ */ jsx29(
           SingleEvent,
           {
             urgency: d.urgency,
@@ -16497,9 +16189,9 @@ function EventCard({
             summary: d.summary
           },
           d.id
-        )) : /* @__PURE__ */ jsx33(Fragment12, { children: " " }) });
+        )) : /* @__PURE__ */ jsx29(Fragment12, { children: " " }) });
       case "ticket" /* TICKET */:
-        return /* @__PURE__ */ jsx33(Fragment12, { children: eventData ? eventData.map((d, i) => /* @__PURE__ */ jsx33(
+        return /* @__PURE__ */ jsx29(Fragment12, { children: eventData ? eventData.map((d, i) => /* @__PURE__ */ jsx29(
           SingleEvent,
           {
             urgency: d.urgency,
@@ -16513,12 +16205,12 @@ function EventCard({
             summary: d.summary
           },
           d.id
-        )) : /* @__PURE__ */ jsx33(Fragment12, { children: " " }) });
+        )) : /* @__PURE__ */ jsx29(Fragment12, { children: " " }) });
       default:
-        return /* @__PURE__ */ jsx33(Fragment12, {});
+        return /* @__PURE__ */ jsx29(Fragment12, {});
     }
   }
-  return /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsxs21(
     "div",
     {
       className: clsx8(
@@ -16526,8 +16218,17 @@ function EventCard({
         eventType == "message" /* MESSAGE */ ? "bg-qtneutral-200" : "bg-white py-4 pl-4 pr-2"
       ),
       children: [
-        /* @__PURE__ */ jsx33("div", { className: "overflow-y-auto flex flex-col gap-4 w-full", children: getEventBody() }),
-        eventType == "message" /* MESSAGE */ && /* @__PURE__ */ jsx33(
+        /* @__PURE__ */ jsx29(
+          "div",
+          {
+            className: clsx8(
+              eventType == "message" /* MESSAGE */ ? "flex-col-reverse" : "flex-col",
+              "overflow-y-auto flex gap-4 w-full"
+            ),
+            children: getEventBody()
+          }
+        ),
+        eventType == "message" /* MESSAGE */ && /* @__PURE__ */ jsx29(
           IntelCard,
           {
             urgency: groupUrgency,
@@ -16541,11 +16242,20 @@ function EventCard({
   );
 }
 
+// src/components/molecules/text_content/metadata_row/metadata_row.tsx
+import { jsx as jsx30, jsxs as jsxs22 } from "react/jsx-runtime";
+function MetadataRow({ metadata }) {
+  return /* @__PURE__ */ jsxs22("div", { className: "flex w-full flex-wrap break-all body-small text-neutral-900 gap-2", children: [
+    metadata && /* @__PURE__ */ jsx30("div", { children: metadata[0] + (metadata.length == 2 ? "," : "") }),
+    metadata?.length == 2 && /* @__PURE__ */ jsx30("div", { children: metadata[1] })
+  ] });
+}
+
 // src/components/organisms/message_body/email_body.tsx
 import DOMPurify from "dompurify";
 import ReactMarkdown from "react-markdown";
 import rehypeRaw from "rehype-raw";
-import { jsx as jsx34, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs23 } from "react/jsx-runtime";
 function EmailBody({
   subjectLine,
   to,
@@ -16557,24 +16267,24 @@ function EmailBody({
   body
 }) {
   const clean = DOMPurify.sanitize(body ?? "");
-  return /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-4 bg-white p-4 rounded-b-2xl overflow-auto", children: [
-    /* @__PURE__ */ jsxs24("div", { className: "flex flex-col gap-0.5", children: [
-      /* @__PURE__ */ jsx34(MetadataRow, { metadata: [`Subject: ${subjectLine}`] }),
-      /* @__PURE__ */ jsx34(MetadataRow, { metadata: [`To: ${to}`] }),
-      /* @__PURE__ */ jsx34(MetadataRow, { metadata: [`Date: ${date}`] }),
-      /* @__PURE__ */ jsx34(MetadataRow, { metadata: [`From: ${from}`] }),
-      /* @__PURE__ */ jsx34(MetadataRow, { metadata: [`CC: ${CC}`] }),
-      /* @__PURE__ */ jsx34(MetadataRow, { metadata: [`BCC: ${BCC}`] }),
-      /* @__PURE__ */ jsx34(MetadataRow, { metadata: [`Attachments: ${attachments}`] })
+  return /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-4 bg-white p-4 rounded-b-2xl overflow-auto", children: [
+    /* @__PURE__ */ jsxs23("div", { className: "flex flex-col gap-0.5", children: [
+      /* @__PURE__ */ jsx31(MetadataRow, { metadata: [`Subject: ${subjectLine}`] }),
+      /* @__PURE__ */ jsx31(MetadataRow, { metadata: [`To: ${to}`] }),
+      /* @__PURE__ */ jsx31(MetadataRow, { metadata: [`Date: ${date}`] }),
+      /* @__PURE__ */ jsx31(MetadataRow, { metadata: [`From: ${from}`] }),
+      /* @__PURE__ */ jsx31(MetadataRow, { metadata: [`CC: ${CC}`] }),
+      /* @__PURE__ */ jsx31(MetadataRow, { metadata: [`BCC: ${BCC}`] }),
+      /* @__PURE__ */ jsx31(MetadataRow, { metadata: [`Attachments: ${attachments}`] })
     ] }),
-    /* @__PURE__ */ jsx34("hr", { className: "text-qtneutral-500" }),
-    /* @__PURE__ */ jsx34("div", { className: "body-medium prose break-all whitespace-pre-line", children: body && /* @__PURE__ */ jsx34(
+    /* @__PURE__ */ jsx31("hr", { className: "text-qtneutral-500" }),
+    /* @__PURE__ */ jsx31("div", { className: "body-medium prose break-all whitespace-pre-line", children: body && /* @__PURE__ */ jsx31(
       ReactMarkdown,
       {
         children: body,
         rehypePlugins: [rehypeRaw],
         components: {
-          img: ({ node, ...props }) => /* @__PURE__ */ jsx34("img", { style: { maxWidth: "100%" }, ...props })
+          img: ({ node, ...props }) => /* @__PURE__ */ jsx31("img", { style: { maxWidth: "100%" }, ...props })
           // Apply custom components/styling
         }
       }
@@ -16588,11 +16298,11 @@ import { useEffect as useEffect2, useState as useState4 } from "react";
 
 // src/components/atoms/emoji_pill/emoji_pill.tsx
 var import_emoji_dictionary = __toESM(require_lib7());
-import { jsx as jsx35, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs24 } from "react/jsx-runtime";
 function EmojiPill({ emoji, count }) {
-  return /* @__PURE__ */ jsxs25("div", { className: "flex rounded-2xl bg-qtneutral-300 w-min py-0.5 px-4 place-items-center place-content-center gap-1", children: [
+  return /* @__PURE__ */ jsxs24("div", { className: "flex rounded-2xl bg-qtneutral-300 w-min py-0.5 px-4 place-items-center place-content-center gap-1", children: [
     emoji && import_emoji_dictionary.default.getUnicode(emoji),
-    /* @__PURE__ */ jsx35("div", { className: "label-3-bold text-qtneutral-900", children: count })
+    /* @__PURE__ */ jsx32("div", { className: "label-3-bold text-qtneutral-900", children: count })
   ] });
 }
 
@@ -16600,22 +16310,22 @@ function EmojiPill({ emoji, count }) {
 import clsx9 from "clsx";
 import ReactMarkdown2 from "react-markdown";
 import remarkGfm from "remark-gfm";
-import { jsx as jsx36 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 function MarkdownRenderer({ content, truncated }) {
-  return /* @__PURE__ */ jsx36(
+  return /* @__PURE__ */ jsx33(
     "div",
     {
       className: clsx9(
         "flex flex-col markdown break-all",
         truncated && "line-clamp-3"
       ),
-      children: /* @__PURE__ */ jsx36(ReactMarkdown2, { remarkPlugins: [remarkGfm], children: content })
+      children: /* @__PURE__ */ jsx33(ReactMarkdown2, { remarkPlugins: [remarkGfm], children: content })
     }
   );
 }
 
 // src/components/organisms/chat_messages/chat_bubble/chat_bubble.tsx
-import { jsx as jsx37, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs25 } from "react/jsx-runtime";
 function ChatBubble({
   summary,
   text,
@@ -16645,7 +16355,7 @@ function ChatBubble({
       setUniqueEmojis(ue);
     }
   }, [emojis]);
-  return /* @__PURE__ */ jsx37("div", { className: clsx10(outbound ? "pl-8" : "pr-8"), children: /* @__PURE__ */ jsxs26(
+  return /* @__PURE__ */ jsx34("div", { className: clsx10(outbound ? "pl-8" : "pr-8"), children: /* @__PURE__ */ jsxs25(
     "div",
     {
       className: clsx10(
@@ -16654,29 +16364,29 @@ function ChatBubble({
         outbound ? "rounded-bl-3xl" : "rounded-br-3xl"
       ),
       children: [
-        /* @__PURE__ */ jsxs26("div", { className: "flex place-content-between", children: [
-          /* @__PURE__ */ jsxs26("div", { className: "flex gap-2 place-items-center", children: [
-            /* @__PURE__ */ jsx37("div", { className: "body-small-bold", children: name }),
-            /* @__PURE__ */ jsx37("div", { className: "text-qtneutral-700 label-3", children: timestamp })
+        /* @__PURE__ */ jsxs25("div", { className: "flex place-content-between", children: [
+          /* @__PURE__ */ jsxs25("div", { className: "flex gap-2 place-items-center", children: [
+            /* @__PURE__ */ jsx34("div", { className: "body-small-bold", children: name }),
+            /* @__PURE__ */ jsx34("div", { className: "text-qtneutral-700 label-3", children: timestamp })
           ] }),
-          /* @__PURE__ */ jsx37("div", { onClick: onExternal, children: /* @__PURE__ */ jsx37(ExternalLink, { size: 16 }) })
+          /* @__PURE__ */ jsx34("div", { onClick: onExternal, children: /* @__PURE__ */ jsx34(ExternalLink, { size: 16 }) })
         ] }),
-        /* @__PURE__ */ jsxs26("div", { className: clsx10("flex flex-col gap-2", !expanded && " "), children: [
-          summary && truncatedText && /* @__PURE__ */ jsxs26("div", { children: [
-            /* @__PURE__ */ jsxs26("p", { className: "body-small mb-2", children: [
-              /* @__PURE__ */ jsx37("strong", { className: "body-small-bold", children: "Summary:" }),
+        /* @__PURE__ */ jsxs25("div", { className: clsx10("flex flex-col gap-2", !expanded && " "), children: [
+          summary && truncatedText && /* @__PURE__ */ jsxs25("div", { children: [
+            /* @__PURE__ */ jsxs25("p", { className: "body-small mb-2", children: [
+              /* @__PURE__ */ jsx34("strong", { className: "body-small-bold", children: "Summary:" }),
               " ",
               summary
             ] }),
-            /* @__PURE__ */ jsx37("hr", { className: "border-qtneutral-500" })
+            /* @__PURE__ */ jsx34("hr", { className: "border-qtneutral-500" })
           ] }),
-          /* @__PURE__ */ jsx37(
+          /* @__PURE__ */ jsx34(
             "div",
             {
               className: clsx10(
                 "flex flex-none text-qtneutral-900 body-medium w-full"
               ),
-              children: /* @__PURE__ */ jsx37(
+              children: /* @__PURE__ */ jsx34(
                 MarkdownRenderer,
                 {
                   content: text || "",
@@ -16686,7 +16396,7 @@ function ChatBubble({
             }
           )
         ] }),
-        truncatedText && /* @__PURE__ */ jsx37(
+        truncatedText && /* @__PURE__ */ jsx34(
           "div",
           {
             className: "qt-link select-none",
@@ -16694,9 +16404,9 @@ function ChatBubble({
             children: `${!expanded ? "Show" : "Hide"} full message`
           }
         ),
-        image && /* @__PURE__ */ jsx37("img", { src: image, alt: "", className: "rounded-xl" }),
-        /* @__PURE__ */ jsxs26("div", { className: "flex gap-2", children: [
-          /* @__PURE__ */ jsx37(
+        image && /* @__PURE__ */ jsx34("img", { src: image, alt: "", className: "rounded-xl" }),
+        /* @__PURE__ */ jsxs25("div", { className: "flex gap-2", children: [
+          /* @__PURE__ */ jsx34(
             "div",
             {
               className: clsx10(
@@ -16706,7 +16416,7 @@ function ChatBubble({
               children: name ? name[0].toUpperCase() : ""
             }
           ),
-          uniqueEmojis.entries().map(([e, c]) => /* @__PURE__ */ jsx37(EmojiPill, { emoji: e, count: c }))
+          uniqueEmojis.entries().map(([e, c]) => /* @__PURE__ */ jsx34(EmojiPill, { emoji: e, count: c }))
         ] })
       ]
     }
@@ -16714,10 +16424,10 @@ function ChatBubble({
 }
 
 // src/components/organisms/message_body/chat_body.tsx
-import { jsx as jsx38 } from "react/jsx-runtime";
+import { jsx as jsx35 } from "react/jsx-runtime";
 function ChatBody({ messages }) {
-  return /* @__PURE__ */ jsx38("div", { className: "p-4 rounded-2xl w-full", children: /* @__PURE__ */ jsx38("div", { className: "flex flex-col place-content-center gap-4", children: messages && messages.map((msg) => {
-    return /* @__PURE__ */ jsx38(
+  return /* @__PURE__ */ jsx35("div", { className: "p-4 rounded-2xl w-full", children: /* @__PURE__ */ jsx35("div", { className: "flex flex-col place-content-center gap-4", children: messages && messages.map((msg) => {
+    return /* @__PURE__ */ jsx35(
       ChatBubble,
       {
         summary: msg.summary,
@@ -16736,7 +16446,7 @@ function ChatBody({ messages }) {
 
 // src/components/organisms/message_body/ticket_body.tsx
 import clsx11 from "clsx";
-import { jsx as jsx39, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs26 } from "react/jsx-runtime";
 function TicketBody({
   issueNumber,
   notification,
@@ -16752,53 +16462,53 @@ function TicketBody({
   description,
   comments
 }) {
-  return /* @__PURE__ */ jsxs27("div", { className: "flex flex-col gap-4 bg-white p-4 rounded-b-2xl max-w-full", children: [
-    /* @__PURE__ */ jsxs27("div", { className: "flex flex-col gap-0.5", children: [
-      /* @__PURE__ */ jsx39(MetadataRow, { metadata: [`Issue: ${issueNumber}`] }),
-      /* @__PURE__ */ jsx39(MetadataRow, { metadata: [`Notification: ${notification}`] }),
-      /* @__PURE__ */ jsx39(MetadataRow, { metadata: [`Project: ${project}`] }),
-      /* @__PURE__ */ jsx39(MetadataRow, { metadata: [`Task: ${task}`] })
+  return /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-4 bg-white p-4 rounded-b-2xl max-w-full", children: [
+    /* @__PURE__ */ jsxs26("div", { className: "flex flex-col gap-0.5", children: [
+      /* @__PURE__ */ jsx36(MetadataRow, { metadata: [`Issue: ${issueNumber}`] }),
+      /* @__PURE__ */ jsx36(MetadataRow, { metadata: [`Notification: ${notification}`] }),
+      /* @__PURE__ */ jsx36(MetadataRow, { metadata: [`Project: ${project}`] }),
+      /* @__PURE__ */ jsx36(MetadataRow, { metadata: [`Task: ${task}`] })
     ] }),
-    /* @__PURE__ */ jsx39("hr", { className: "text-qtneutral-500" }),
-    /* @__PURE__ */ jsx39("div", { className: "body-bold", children: "Issue" }),
-    /* @__PURE__ */ jsxs27("div", { className: "grid grid-cols-2 gap-4 body-small", children: [
-      /* @__PURE__ */ jsxs27("div", { className: "", children: [
-        /* @__PURE__ */ jsx39("div", { children: "Due Date: " }),
-        /* @__PURE__ */ jsx39("div", { children: "Start Date: " }),
-        /* @__PURE__ */ jsx39("div", { children: "Assignees: " }),
-        /* @__PURE__ */ jsx39("div", { children: "Reporter: " }),
-        /* @__PURE__ */ jsx39("div", { children: "Team: " }),
-        /* @__PURE__ */ jsx39("div", { children: "Location: " }),
-        /* @__PURE__ */ jsx39("div", { children: "Related: " }),
-        /* @__PURE__ */ jsx39("div", { children: "Description: " })
+    /* @__PURE__ */ jsx36("hr", { className: "text-qtneutral-500" }),
+    /* @__PURE__ */ jsx36("div", { className: "body-bold", children: "Issue" }),
+    /* @__PURE__ */ jsxs26("div", { className: "grid grid-cols-2 gap-4 body-small", children: [
+      /* @__PURE__ */ jsxs26("div", { className: "", children: [
+        /* @__PURE__ */ jsx36("div", { children: "Due Date: " }),
+        /* @__PURE__ */ jsx36("div", { children: "Start Date: " }),
+        /* @__PURE__ */ jsx36("div", { children: "Assignees: " }),
+        /* @__PURE__ */ jsx36("div", { children: "Reporter: " }),
+        /* @__PURE__ */ jsx36("div", { children: "Team: " }),
+        /* @__PURE__ */ jsx36("div", { children: "Location: " }),
+        /* @__PURE__ */ jsx36("div", { children: "Related: " }),
+        /* @__PURE__ */ jsx36("div", { children: "Description: " })
       ] }),
-      /* @__PURE__ */ jsxs27("div", { className: "", children: [
-        /* @__PURE__ */ jsx39("div", { children: dueDate || "None" }),
-        /* @__PURE__ */ jsx39("div", { children: startDate || "None" }),
-        /* @__PURE__ */ jsx39("div", { children: assignees || "None" }),
-        /* @__PURE__ */ jsx39("div", { children: reporter || "None" }),
-        /* @__PURE__ */ jsx39("div", { children: team || "None" }),
-        /* @__PURE__ */ jsx39("div", { children: location || "None" }),
-        /* @__PURE__ */ jsx39("div", { children: related || "None" }),
-        /* @__PURE__ */ jsx39("div", { children: description || "None" })
+      /* @__PURE__ */ jsxs26("div", { className: "", children: [
+        /* @__PURE__ */ jsx36("div", { children: dueDate || "None" }),
+        /* @__PURE__ */ jsx36("div", { children: startDate || "None" }),
+        /* @__PURE__ */ jsx36("div", { children: assignees || "None" }),
+        /* @__PURE__ */ jsx36("div", { children: reporter || "None" }),
+        /* @__PURE__ */ jsx36("div", { children: team || "None" }),
+        /* @__PURE__ */ jsx36("div", { children: location || "None" }),
+        /* @__PURE__ */ jsx36("div", { children: related || "None" }),
+        /* @__PURE__ */ jsx36("div", { children: description || "None" })
       ] }),
       comments && comments.map((c, i) => {
-        return /* @__PURE__ */ jsxs27("div", { className: "flex col-span-2 flex-col gap-2 w-full", children: [
-          /* @__PURE__ */ jsx39("hr", { className: "text-qtneutral-500" }),
-          /* @__PURE__ */ jsx39("div", { className: `${i == 0 ? "body-bold" : "body "}`, children: `${i == 0 ? "New" : ""} Comment` }),
-          /* @__PURE__ */ jsxs27(
+        return /* @__PURE__ */ jsxs26("div", { className: "flex col-span-2 flex-col gap-2 w-full", children: [
+          /* @__PURE__ */ jsx36("hr", { className: "text-qtneutral-500" }),
+          /* @__PURE__ */ jsx36("div", { className: `${i == 0 ? "body-bold" : "body "}`, children: `${i == 0 ? "New" : ""} Comment` }),
+          /* @__PURE__ */ jsxs26(
             "div",
             {
               className: `flex gap-2 ${i == 0 ? "body-small-bold" : "body-small"}`,
               children: [
-                /* @__PURE__ */ jsx39("div", { children: c.name }),
-                /* @__PURE__ */ jsx39("div", { children: c.timestamp })
+                /* @__PURE__ */ jsx36("div", { children: c.name }),
+                /* @__PURE__ */ jsx36("div", { children: c.timestamp })
               ]
             }
           ),
-          /* @__PURE__ */ jsx39("div", { children: c.text }),
-          /* @__PURE__ */ jsxs27("div", { className: "flex gap-2", children: [
-            /* @__PURE__ */ jsx39(
+          /* @__PURE__ */ jsx36("div", { children: c.text }),
+          /* @__PURE__ */ jsxs26("div", { className: "flex gap-2", children: [
+            /* @__PURE__ */ jsx36(
               "div",
               {
                 className: clsx11(
@@ -16811,7 +16521,7 @@ function TicketBody({
               acc.set(str, (acc.get(str) || 0) + 1);
               return acc;
             }, /* @__PURE__ */ new Map()).entries().map(([e, c2]) => {
-              return /* @__PURE__ */ jsx39(EmojiPill, { emoji: e, count: c2 });
+              return /* @__PURE__ */ jsx36(EmojiPill, { emoji: e, count: c2 });
             })
           ] })
         ] });
@@ -16821,7 +16531,7 @@ function TicketBody({
 }
 
 // src/components/atoms/icons/base_icons/CircleX.tsx
-import { jsx as jsx40 } from "react/jsx-runtime";
+import { jsx as jsx37 } from "react/jsx-runtime";
 function CircleX({
   size = 24,
   color = "#1D1D1F",
@@ -16832,27 +16542,27 @@ function CircleX({
       case 16:
         return {
           viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsx40("path", { d: "M6.66667 9.33333L8 8M8 8L9.33333 6.66667M8 8L6.66667 6.66667M8 8L9.33333 9.33333M14 8C14 8.78793 13.8448 9.56815 13.5433 10.2961C13.2417 11.0241 12.7998 11.6855 12.2426 12.2426C11.6855 12.7998 11.0241 13.2417 10.2961 13.5433C9.56815 13.8448 8.78793 14 8 14C7.21207 14 6.43185 13.8448 5.7039 13.5433C4.97595 13.2417 4.31451 12.7998 3.75736 12.2426C3.20021 11.6855 2.75825 11.0241 2.45672 10.2961C2.15519 9.56815 2 8.78793 2 8C2 6.4087 2.63214 4.88258 3.75736 3.75736C4.88258 2.63214 6.4087 2 8 2C9.5913 2 11.1174 2.63214 12.2426 3.75736C13.3679 4.88258 14 6.4087 14 8Z", stroke: color, "stroke-width": "1.25", "stroke-linecap": "round", "stroke-linejoin": "round" })
+          path: /* @__PURE__ */ jsx37("path", { d: "M6.66667 9.33333L8 8M8 8L9.33333 6.66667M8 8L6.66667 6.66667M8 8L9.33333 9.33333M14 8C14 8.78793 13.8448 9.56815 13.5433 10.2961C13.2417 11.0241 12.7998 11.6855 12.2426 12.2426C11.6855 12.7998 11.0241 13.2417 10.2961 13.5433C9.56815 13.8448 8.78793 14 8 14C7.21207 14 6.43185 13.8448 5.7039 13.5433C4.97595 13.2417 4.31451 12.7998 3.75736 12.2426C3.20021 11.6855 2.75825 11.0241 2.45672 10.2961C2.15519 9.56815 2 8.78793 2 8C2 6.4087 2.63214 4.88258 3.75736 3.75736C4.88258 2.63214 6.4087 2 8 2C9.5913 2 11.1174 2.63214 12.2426 3.75736C13.3679 4.88258 14 6.4087 14 8Z", stroke: color, "stroke-width": "1.25", "stroke-linecap": "round", "stroke-linejoin": "round" })
         };
       case 20:
         return {
           viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsx40("path", { d: "M8.33333 11.6667L10 10M10 10L11.6667 8.33333M10 10L8.33333 8.33333M10 10L11.6667 11.6667M17.5 10C17.5 10.9849 17.306 11.9602 16.9291 12.8701C16.5522 13.7801 15.9997 14.6069 15.3033 15.3033C14.6069 15.9997 13.7801 16.5522 12.8701 16.9291C11.9602 17.306 10.9849 17.5 10 17.5C9.01509 17.5 8.03982 17.306 7.12987 16.9291C6.21993 16.5522 5.39314 15.9997 4.6967 15.3033C4.00026 14.6069 3.44781 13.7801 3.0709 12.8701C2.69399 11.9602 2.5 10.9849 2.5 10C2.5 8.01088 3.29018 6.10322 4.6967 4.6967C6.10322 3.29018 8.01088 2.5 10 2.5C11.9891 2.5 13.8968 3.29018 15.3033 4.6967C16.7098 6.10322 17.5 8.01088 17.5 10Z", stroke: color, "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })
+          path: /* @__PURE__ */ jsx37("path", { d: "M8.33333 11.6667L10 10M10 10L11.6667 8.33333M10 10L8.33333 8.33333M10 10L11.6667 11.6667M17.5 10C17.5 10.9849 17.306 11.9602 16.9291 12.8701C16.5522 13.7801 15.9997 14.6069 15.3033 15.3033C14.6069 15.9997 13.7801 16.5522 12.8701 16.9291C11.9602 17.306 10.9849 17.5 10 17.5C9.01509 17.5 8.03982 17.306 7.12987 16.9291C6.21993 16.5522 5.39314 15.9997 4.6967 15.3033C4.00026 14.6069 3.44781 13.7801 3.0709 12.8701C2.69399 11.9602 2.5 10.9849 2.5 10C2.5 8.01088 3.29018 6.10322 4.6967 4.6967C6.10322 3.29018 8.01088 2.5 10 2.5C11.9891 2.5 13.8968 3.29018 15.3033 4.6967C16.7098 6.10322 17.5 8.01088 17.5 10Z", stroke: color, "stroke-width": "1.5", "stroke-linecap": "round", "stroke-linejoin": "round" })
         };
       case 24:
         return {
           viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsx40("path", { d: "M10 14L12 12M12 12L14 10M12 12L10 10M12 12L14 14M21 12C21 13.1819 20.7672 14.3522 20.3149 15.4442C19.8626 16.5361 19.1997 17.5282 18.364 18.364C17.5282 19.1997 16.5361 19.8626 15.4442 20.3149C14.3522 20.7672 13.1819 21 12 21C10.8181 21 9.64778 20.7672 8.55585 20.3149C7.46392 19.8626 6.47177 19.1997 5.63604 18.364C4.80031 17.5282 4.13738 16.5361 3.68508 15.4442C3.23279 14.3522 3 13.1819 3 12C3 9.61305 3.94821 7.32387 5.63604 5.63604C7.32387 3.94821 9.61305 3 12 3C14.3869 3 16.6761 3.94821 18.364 5.63604C20.0518 7.32387 21 9.61305 21 12Z", stroke: color, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })
+          path: /* @__PURE__ */ jsx37("path", { d: "M10 14L12 12M12 12L14 10M12 12L10 10M12 12L14 14M21 12C21 13.1819 20.7672 14.3522 20.3149 15.4442C19.8626 16.5361 19.1997 17.5282 18.364 18.364C17.5282 19.1997 16.5361 19.8626 15.4442 20.3149C14.3522 20.7672 13.1819 21 12 21C10.8181 21 9.64778 20.7672 8.55585 20.3149C7.46392 19.8626 6.47177 19.1997 5.63604 18.364C4.80031 17.5282 4.13738 16.5361 3.68508 15.4442C3.23279 14.3522 3 13.1819 3 12C3 9.61305 3.94821 7.32387 5.63604 5.63604C7.32387 3.94821 9.61305 3 12 3C14.3869 3 16.6761 3.94821 18.364 5.63604C20.0518 7.32387 21 9.61305 21 12Z", stroke: color, "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" })
         };
       case 36:
         return {
           viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsx40("path", { d: "M15 21L18 18M18 18L21 15M18 18L15 15M18 18L21 21M31.5 18C31.5 19.7728 31.1508 21.5283 30.4724 23.1662C29.7939 24.8041 28.7995 26.2923 27.5459 27.5459C26.2923 28.7995 24.8041 29.7939 23.1662 30.4724C21.5283 31.1508 19.7728 31.5 18 31.5C16.2272 31.5 14.4717 31.1508 12.8338 30.4724C11.1959 29.7939 9.70765 28.7995 8.45406 27.5459C7.20047 26.2923 6.20606 24.8041 5.52763 23.1662C4.84919 21.5283 4.5 19.7728 4.5 18C4.5 14.4196 5.92232 10.9858 8.45406 8.45406C10.9858 5.92232 14.4196 4.5 18 4.5C21.5804 4.5 25.0142 5.92232 27.5459 8.45406C30.0777 10.9858 31.5 14.4196 31.5 18Z", stroke: color, "stroke-width": "2.25", "stroke-linecap": "round", "stroke-linejoin": "round" })
+          path: /* @__PURE__ */ jsx37("path", { d: "M15 21L18 18M18 18L21 15M18 18L15 15M18 18L21 21M31.5 18C31.5 19.7728 31.1508 21.5283 30.4724 23.1662C29.7939 24.8041 28.7995 26.2923 27.5459 27.5459C26.2923 28.7995 24.8041 29.7939 23.1662 30.4724C21.5283 31.1508 19.7728 31.5 18 31.5C16.2272 31.5 14.4717 31.1508 12.8338 30.4724C11.1959 29.7939 9.70765 28.7995 8.45406 27.5459C7.20047 26.2923 6.20606 24.8041 5.52763 23.1662C4.84919 21.5283 4.5 19.7728 4.5 18C4.5 14.4196 5.92232 10.9858 8.45406 8.45406C10.9858 5.92232 14.4196 4.5 18 4.5C21.5804 4.5 25.0142 5.92232 27.5459 8.45406C30.0777 10.9858 31.5 14.4196 31.5 18Z", stroke: color, "stroke-width": "2.25", "stroke-linecap": "round", "stroke-linejoin": "round" })
         };
     }
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsx37(
     "svg",
     {
       width: size,
@@ -16866,7 +16576,7 @@ function CircleX({
 }
 
 // src/components/atoms/icons/base_icons/Loading.tsx
-import { Fragment as Fragment13, jsx as jsx41, jsxs as jsxs28 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx38, jsxs as jsxs27 } from "react/jsx-runtime";
 function Loading({
   size = 24,
   color = "#1D1D1F",
@@ -16877,8 +16587,8 @@ function Loading({
       case 16:
         return {
           viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsxs28(Fragment13, { children: [
-            /* @__PURE__ */ jsx41(
+          path: /* @__PURE__ */ jsxs27(Fragment13, { children: [
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M11.4209 4.85221C10.466 3.81296 9.13351 3.19329 7.72528 3.13377C6.31705 3.07424 4.93704 3.57926 3.89779 4.53422C2.85854 5.48917 2.23887 6.82165 2.17935 8.22988C2.11983 9.63811 2.62485 11.0181 3.5798 12.0574C4.05501 12.5745 4.62461 12.9868 5.26063 13.2835C5.89665 13.5802 6.581 13.7417 7.28038 13.7713C7.97977 13.8008 8.68023 13.6932 9.33409 13.4557C9.99289 13.2137 10.5952 12.851 11.1124 12.3758C11.6296 11.9005 12.0418 11.3309 12.3385 10.6949C12.6353 10.0589 12.7968 9.37456 12.8263 8.67517",
@@ -16888,7 +16598,7 @@ function Loading({
                 "stroke-linejoin": "round"
               }
             ),
-            /* @__PURE__ */ jsx41(
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M10.4362 5.7666L12.3556 5.49268L12.0771 3.56836",
@@ -16903,8 +16613,8 @@ function Loading({
       case 20:
         return {
           viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsxs28(Fragment13, { children: [
-            /* @__PURE__ */ jsx41(
+          path: /* @__PURE__ */ jsxs27(Fragment13, { children: [
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M14.2757 6.06538C13.082 4.76633 11.4164 3.99174 9.65611 3.91733C7.89583 3.84293 6.17081 4.4742 4.87175 5.6679C3.57269 6.86159 2.7981 8.52718 2.7237 10.2875C2.64929 12.0478 3.28057 13.7728 4.47426 15.0718C5.06828 15.7183 5.78027 16.2336 6.5753 16.6045C7.37033 16.9754 8.22576 17.1773 9.09999 17.2142C9.97423 17.2512 10.8498 17.1166 11.6671 16.8197C12.4906 16.5172 13.2436 16.0638 13.89 15.4698C14.5365 14.8758 15.0518 14.1638 15.4227 13.3688C15.7936 12.5738 15.9955 11.7183 16.0324 10.8441",
@@ -16914,7 +16624,7 @@ function Loading({
                 "stroke-linejoin": "round"
               }
             ),
-            /* @__PURE__ */ jsx41(
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M13.0445 7.20838L15.4438 6.86597L15.0957 4.46057",
@@ -16929,8 +16639,8 @@ function Loading({
       case 24:
         return {
           viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsxs28(Fragment13, { children: [
-            /* @__PURE__ */ jsx41(
+          path: /* @__PURE__ */ jsxs27(Fragment13, { children: [
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M17.1304 7.27831C15.698 5.71944 13.6993 4.78994 11.5869 4.70065C9.4746 4.61137 7.40458 5.3689 5.84571 6.80133C4.28684 8.23376 3.35733 10.2325 3.26805 12.3448C3.17876 14.4572 3.93629 16.5272 5.36872 18.086C6.08155 18.8618 6.93594 19.4802 7.88997 19.9253C8.844 20.3704 9.87052 20.6126 10.9196 20.6569C11.9687 20.7013 13.0194 20.5397 14.0002 20.1835C14.9884 19.8206 15.8919 19.2765 16.6676 18.5636C17.4434 17.8508 18.0618 16.9964 18.5068 16.0424C18.9519 15.0884 19.1942 14.0618 19.2385 13.0128",
@@ -16940,7 +16650,7 @@ function Loading({
                 "stroke-linejoin": "round"
               }
             ),
-            /* @__PURE__ */ jsx41(
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M15.6528 8.65003L18.5319 8.23914L18.1143 5.35266",
@@ -16955,8 +16665,8 @@ function Loading({
       case 36:
         return {
           viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsxs28(Fragment13, { children: [
-            /* @__PURE__ */ jsx41(
+          path: /* @__PURE__ */ jsxs27(Fragment13, { children: [
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M25.6966 10.9176C23.548 8.57929 20.5499 7.18503 17.3814 7.0511C14.2129 6.91717 11.1078 8.05347 8.76954 10.2021C6.43124 12.3508 5.03697 15.3488 4.90305 18.5173C4.76912 21.6859 5.90541 24.7909 8.05406 27.1292C9.1233 28.2928 10.4049 29.2204 11.8359 29.888C13.267 30.5557 14.8068 30.919 16.3804 30.9855C17.954 31.052 19.53 30.8097 21.0012 30.2754C22.4835 29.7309 23.8388 28.9148 25.0024 27.8456C26.166 26.7763 27.0936 25.4948 27.7612 24.0637C28.4289 22.6327 28.7922 21.0929 28.8587 19.5193",
@@ -16966,7 +16676,7 @@ function Loading({
                 "stroke-linejoin": "round"
               }
             ),
-            /* @__PURE__ */ jsx41(
+            /* @__PURE__ */ jsx38(
               "path",
               {
                 d: "M23.4797 12.975L27.7984 12.3587L27.1719 8.02893",
@@ -16981,7 +16691,7 @@ function Loading({
     }
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx41(
+  return /* @__PURE__ */ jsx38(
     "svg",
     {
       width: size,
@@ -16995,7 +16705,7 @@ function Loading({
 }
 
 // src/components/atoms/icons/base_icons/Search.tsx
-import { jsx as jsx42 } from "react/jsx-runtime";
+import { jsx as jsx39 } from "react/jsx-runtime";
 function Search({
   size = 24,
   color = "#1D1D1F",
@@ -17006,7 +16716,7 @@ function Search({
       case 16:
         return {
           viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsx42(
+          path: /* @__PURE__ */ jsx39(
             "path",
             {
               d: "M14 14L10 10M11.3333 6.66667C11.3333 9.244 9.244 11.3333 6.66667 11.3333C4.08934 11.3333 2 9.244 2 6.66667C2 4.08934 4.08934 2 6.66667 2C9.244 2 11.3333 4.08934 11.3333 6.66667Z",
@@ -17020,7 +16730,7 @@ function Search({
       case 20:
         return {
           viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsx42(
+          path: /* @__PURE__ */ jsx39(
             "path",
             {
               d: "M17.5 17.5L12.5 12.5M14.1667 8.33333C14.1667 11.555 11.555 14.1667 8.33333 14.1667C5.11167 14.1667 2.5 11.555 2.5 8.33333C2.5 5.11167 5.11167 2.5 8.33333 2.5C11.555 2.5 14.1667 5.11167 14.1667 8.33333Z",
@@ -17034,7 +16744,7 @@ function Search({
       case 24:
         return {
           viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsx42(
+          path: /* @__PURE__ */ jsx39(
             "path",
             {
               d: "M21 21L15 15M17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z",
@@ -17048,7 +16758,7 @@ function Search({
       case 36:
         return {
           viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsx42(
+          path: /* @__PURE__ */ jsx39(
             "path",
             {
               d: "M31.5 31.5L22.5 22.5M25.5 15C25.5 20.799 20.799 25.5 15 25.5C9.20101 25.5 4.5 20.799 4.5 15C4.5 9.20101 9.20101 4.5 15 4.5C20.799 4.5 25.5 9.20101 25.5 15Z",
@@ -17062,7 +16772,7 @@ function Search({
     }
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx39(
     "svg",
     {
       width: size,
@@ -17077,7 +16787,7 @@ function Search({
 
 // src/components/organisms/search_bar/search_bar.tsx
 import { useState as useState5, useEffect as useEffect3 } from "react";
-import { jsx as jsx43, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs28 } from "react/jsx-runtime";
 function SearchBar({ loading, results, onUpdate }) {
   const [query, setQuery] = useState5("");
   useEffect3(() => {
@@ -17089,10 +16799,10 @@ function SearchBar({ loading, results, onUpdate }) {
   const clearQuery = () => {
     setQuery("");
   };
-  return /* @__PURE__ */ jsxs29("div", { className: "w-full space-y-3", children: [
-    /* @__PURE__ */ jsxs29("div", { className: "flex items-center px-4 py-2 rounded-full bg-gray-100 gap-2 text-gray-900", children: [
-      loading ? /* @__PURE__ */ jsx43(Loading, {}) : /* @__PURE__ */ jsx43(Search, {}),
-      /* @__PURE__ */ jsx43(
+  return /* @__PURE__ */ jsxs28("div", { className: "w-full space-y-3", children: [
+    /* @__PURE__ */ jsxs28("div", { className: "flex items-center px-4 py-2 rounded-full bg-gray-100 gap-2 text-gray-900", children: [
+      loading ? /* @__PURE__ */ jsx40(Loading, {}) : /* @__PURE__ */ jsx40(Search, {}),
+      /* @__PURE__ */ jsx40(
         "input",
         {
           type: "text",
@@ -17102,15 +16812,15 @@ function SearchBar({ loading, results, onUpdate }) {
           onChange: (e) => setQuery(e.target.value)
         }
       ),
-      query && /* @__PURE__ */ jsx43("button", { onClick: clearQuery, children: /* @__PURE__ */ jsx43(CircleX, {}) })
+      query && /* @__PURE__ */ jsx40("button", { onClick: clearQuery, children: /* @__PURE__ */ jsx40(CircleX, {}) })
     ] }),
-    results && /* @__PURE__ */ jsxs29("div", { className: "text-sm", children: [
-      /* @__PURE__ */ jsxs29("p", { className: "text-gray-700 font-medium", children: [
+    results && /* @__PURE__ */ jsxs28("div", { className: "text-sm", children: [
+      /* @__PURE__ */ jsxs28("p", { className: "text-gray-700 font-medium", children: [
         "Search results (",
         results.reduce((acc, r) => acc + r.count, 0),
         "):"
       ] }),
-      /* @__PURE__ */ jsx43("div", { className: "flex flex-wrap gap-2 mt-2", children: results.map((r) => /* @__PURE__ */ jsxs29(
+      /* @__PURE__ */ jsx40("div", { className: "flex flex-wrap gap-2 mt-2", children: results.map((r) => /* @__PURE__ */ jsxs28(
         "span",
         {
           className: "px-3 py-1 rounded-full bg-gray-100 text-gray-700",
@@ -17128,7 +16838,7 @@ function SearchBar({ loading, results, onUpdate }) {
 }
 
 // src/components/atoms/icons/base_icons/Mail.tsx
-import { jsx as jsx44 } from "react/jsx-runtime";
+import { jsx as jsx41 } from "react/jsx-runtime";
 function Mail({
   size = 24,
   color = "#1D1D1F",
@@ -17139,7 +16849,7 @@ function Mail({
       case 16:
         return {
           viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsx44(
+          path: /* @__PURE__ */ jsx41(
             "path",
             {
               d: "M2 5.33337L7.2604 8.84031C7.70827 9.13888 8.29173 9.13888 8.7396 8.84031L14 5.33337M3.33333 12.6667H12.6667C13.403 12.6667 14 12.0698 14 11.3334V4.66671C14 3.93033 13.403 3.33337 12.6667 3.33337H3.33333C2.59695 3.33337 2 3.93033 2 4.66671V11.3334C2 12.0698 2.59695 12.6667 3.33333 12.6667Z",
@@ -17153,7 +16863,7 @@ function Mail({
       case 20:
         return {
           viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsx44(
+          path: /* @__PURE__ */ jsx41(
             "path",
             {
               d: "M2.5 6.66663L9.0755 11.0503C9.63533 11.4235 10.3647 11.4235 10.9245 11.0503L17.5 6.66663M4.16667 15.8333H15.8333C16.7538 15.8333 17.5 15.0871 17.5 14.1666V5.83329C17.5 4.91282 16.7538 4.16663 15.8333 4.16663H4.16667C3.24619 4.16663 2.5 4.91282 2.5 5.83329V14.1666C2.5 15.0871 3.24619 15.8333 4.16667 15.8333Z",
@@ -17167,7 +16877,7 @@ function Mail({
       case 24:
         return {
           viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsx44(
+          path: /* @__PURE__ */ jsx41(
             "path",
             {
               d: "M3 8L10.8906 13.2604C11.5624 13.7083 12.4376 13.7083 13.1094 13.2604L21 8M5 19H19C20.1046 19 21 18.1046 21 17V7C21 5.89543 20.1046 5 19 5H5C3.89543 5 3 5.89543 3 7V17C3 18.1046 3.89543 19 5 19Z",
@@ -17181,7 +16891,7 @@ function Mail({
       case 36:
         return {
           viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsx44(
+          path: /* @__PURE__ */ jsx41(
             "path",
             {
               d: "M4.5 12L16.3359 19.8906C17.3436 20.5624 18.6564 20.5624 19.6641 19.8906L31.5 12M7.5 28.5H28.5C30.1569 28.5 31.5 27.1569 31.5 25.5V10.5C31.5 8.84315 30.1569 7.5 28.5 7.5H7.5C5.84315 7.5 4.5 8.84315 4.5 10.5V25.5C4.5 27.1569 5.84315 28.5 7.5 28.5Z",
@@ -17195,7 +16905,7 @@ function Mail({
     }
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx44(
+  return /* @__PURE__ */ jsx41(
     "svg",
     {
       width: size,
@@ -17209,7 +16919,7 @@ function Mail({
 }
 
 // src/components/atoms/icons/base_icons/PlusLarge.tsx
-import { jsx as jsx45 } from "react/jsx-runtime";
+import { jsx as jsx42 } from "react/jsx-runtime";
 function PlusLarge({
   size = 24,
   color = "#1D1D1F",
@@ -17220,7 +16930,7 @@ function PlusLarge({
       case 16:
         return {
           viewBox: "0 0 16 16",
-          path: /* @__PURE__ */ jsx45(
+          path: /* @__PURE__ */ jsx42(
             "path",
             {
               d: "M8.00033 2.66663V13.3333M13.3337 7.99996L2.66699 7.99996",
@@ -17234,7 +16944,7 @@ function PlusLarge({
       case 20:
         return {
           viewBox: "0 0 20 20",
-          path: /* @__PURE__ */ jsx45(
+          path: /* @__PURE__ */ jsx42(
             "path",
             {
               d: "M9.99967 3.33337V16.6667M16.6663 10L3.33301 10",
@@ -17248,7 +16958,7 @@ function PlusLarge({
       case 24:
         return {
           viewBox: "0 0 24 24",
-          path: /* @__PURE__ */ jsx45(
+          path: /* @__PURE__ */ jsx42(
             "path",
             {
               d: "M12 4V20M20 12L4 12",
@@ -17262,7 +16972,7 @@ function PlusLarge({
       case 36:
         return {
           viewBox: "0 0 36 36",
-          path: /* @__PURE__ */ jsx45(
+          path: /* @__PURE__ */ jsx42(
             "path",
             {
               d: "M18 6V30M30 18L6 18",
@@ -17276,7 +16986,7 @@ function PlusLarge({
     }
   };
   const { viewBox, path } = getIconData();
-  return /* @__PURE__ */ jsx45(
+  return /* @__PURE__ */ jsx42(
     "svg",
     {
       width: size,
@@ -17291,15 +17001,15 @@ function PlusLarge({
 
 // src/components/molecules/buttons/nav_button/filter_nav_button/filter_nav_button.tsx
 import clsx12 from "clsx";
-import { jsx as jsx46, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs29 } from "react/jsx-runtime";
 function FilterNavButton({ icon, label, active, onClick }) {
-  return /* @__PURE__ */ jsxs30(
+  return /* @__PURE__ */ jsxs29(
     "div",
     {
       className: "w-min h-min flex flex-none flex-col place-items-center gap-2",
       onClick,
       children: [
-        /* @__PURE__ */ jsx46(
+        /* @__PURE__ */ jsx43(
           "div",
           {
             className: clsx12(
@@ -17308,20 +17018,20 @@ function FilterNavButton({ icon, label, active, onClick }) {
             children: icon
           }
         ),
-        /* @__PURE__ */ jsx46("div", { className: "font-medium text-[9px] text-qtneutral-900 w-full text-center", children: label })
+        /* @__PURE__ */ jsx43("div", { className: "font-medium text-[9px] text-qtneutral-900 w-full text-center", children: label })
       ]
     }
   );
 }
 
 // src/components/organisms/filter_bar/filter_bar.tsx
-import { jsx as jsx47, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs30 } from "react/jsx-runtime";
 function FilterBar({ buttons }) {
-  return /* @__PURE__ */ jsxs31("div", { className: "flex flex-col w-[54px] place-items-center gap-4", children: [
-    /* @__PURE__ */ jsx47(
+  return /* @__PURE__ */ jsxs30("div", { className: "flex flex-col w-[54px] place-items-center gap-4", children: [
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsx47(
+        icon: /* @__PURE__ */ jsx44(
           FireIcon,
           {
             variant: buttons?.fires?.active ? void 0 : "none" /* OUTLINED */
@@ -17331,10 +17041,10 @@ function FilterBar({ buttons }) {
         onClick: buttons?.fires?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsx47(
+        icon: /* @__PURE__ */ jsx44(
           Mail,
           {
             size: 36,
@@ -17345,10 +17055,10 @@ function FilterBar({ buttons }) {
         onClick: buttons?.unread?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsx47(
+        icon: /* @__PURE__ */ jsx44(
           CheckBox,
           {
             size: 36,
@@ -17359,57 +17069,57 @@ function FilterBar({ buttons }) {
         onClick: buttons?.incomplete?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47("hr", { className: "w-full border-0.5 text-qtneutral-700" }),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44("hr", { className: "w-full border-0.5 text-qtneutral-700" }),
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsx47("div", { className: buttons?.slack?.active ? "" : "grayscale", children: /* @__PURE__ */ jsx47(SlackIcon, {}) }),
+        icon: /* @__PURE__ */ jsx44("div", { className: buttons?.slack?.active ? "" : "grayscale", children: /* @__PURE__ */ jsx44(SlackIcon, {}) }),
         onClick: buttons?.slack?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsx47("div", { className: buttons?.google_mail?.active ? "" : "grayscale", children: /* @__PURE__ */ jsx47(GoogleMailIcon, {}) }),
+        icon: /* @__PURE__ */ jsx44("div", { className: buttons?.google_mail?.active ? "" : "grayscale", children: /* @__PURE__ */ jsx44(GoogleMailIcon, {}) }),
         onClick: buttons?.google_mail?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsx47("div", { className: buttons?.google_calendar?.active ? "" : "grayscale", children: /* @__PURE__ */ jsx47(GoogleCalendarIcon, {}) }),
+        icon: /* @__PURE__ */ jsx44("div", { className: buttons?.google_calendar?.active ? "" : "grayscale", children: /* @__PURE__ */ jsx44(GoogleCalendarIcon, {}) }),
         onClick: buttons?.google_calendar?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsxs31("div", { className: buttons?.atlassian_jira?.active ? "" : "grayscale", children: [
-          /* @__PURE__ */ jsx47(AtlassianIcon, {}),
+        icon: /* @__PURE__ */ jsxs30("div", { className: buttons?.atlassian_jira?.active ? "" : "grayscale", children: [
+          /* @__PURE__ */ jsx44(AtlassianIcon, {}),
           " "
         ] }),
         onClick: buttons?.atlassian_jira?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsxs31("div", { className: buttons?.microsoft_teams?.active ? "" : "grayscale", children: [
-          /* @__PURE__ */ jsx47(MicrosoftTeamsIcon, {}),
+        icon: /* @__PURE__ */ jsxs30("div", { className: buttons?.microsoft_teams?.active ? "" : "grayscale", children: [
+          /* @__PURE__ */ jsx44(MicrosoftTeamsIcon, {}),
           " "
         ] }),
         onClick: buttons?.microsoft_teams?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsxs31(
+        icon: /* @__PURE__ */ jsxs30(
           "div",
           {
             className: buttons?.microsoft_calendar?.active || buttons?.microsoft_mail?.active ? "" : "grayscale",
             children: [
-              /* @__PURE__ */ jsx47(MicrosoftOutlookMailIcon, {}),
+              /* @__PURE__ */ jsx44(MicrosoftOutlookMailIcon, {}),
               " "
             ]
           }
@@ -17417,15 +17127,15 @@ function FilterBar({ buttons }) {
         onClick: buttons?.microsoft_mail?.onClick || buttons?.microsoft_calendar?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47(
+    /* @__PURE__ */ jsx44(
       FilterNavButton,
       {
-        icon: /* @__PURE__ */ jsxs31(
+        icon: /* @__PURE__ */ jsxs30(
           "div",
           {
             className: buttons?.clickup?.active || buttons?.clickup?.active ? "" : "grayscale",
             children: [
-              /* @__PURE__ */ jsx47(ClickupIcon, {}),
+              /* @__PURE__ */ jsx44(ClickupIcon, {}),
               " "
             ]
           }
@@ -17433,8 +17143,8 @@ function FilterBar({ buttons }) {
         onClick: buttons?.clickup?.onClick
       }
     ),
-    /* @__PURE__ */ jsx47("hr", { className: "w-full border-0.5 text-qtneutral-700" }),
-    /* @__PURE__ */ jsx47("div", { onClick: buttons?.more?.onClick, children: /* @__PURE__ */ jsx47(FilterNavButton, { icon: /* @__PURE__ */ jsx47(PlusLarge, { size: 36 }) }) })
+    /* @__PURE__ */ jsx44("hr", { className: "w-full border-0.5 text-qtneutral-700" }),
+    /* @__PURE__ */ jsx44("div", { onClick: buttons?.more?.onClick, children: /* @__PURE__ */ jsx44(FilterNavButton, { icon: /* @__PURE__ */ jsx44(PlusLarge, { size: 36 }) }) })
   ] });
 }