From 77bd483ce41db64aba6f99493bbbddfa2e065744 Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Sun, 28 Sep 2025 19:17:24 -0700
Subject: [PATCH] add 2xl, 3xl to container query hook

---
 src/renderer/hooks/use-container-query.ts | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/src/renderer/hooks/use-container-query.ts b/src/renderer/hooks/use-container-query.ts
index dc0b80a49..d9ec53260 100644
--- a/src/renderer/hooks/use-container-query.ts
+++ b/src/renderer/hooks/use-container-query.ts
@@ -1,6 +1,8 @@
 import { useElementSize } from '@mantine/hooks';
 
 interface UseContainerQueryProps {
+    '2xl'?: number;
+    '3xl'?: number;
     lg?: number;
     md?: number;
     sm?: number;
@@ -8,7 +10,7 @@ interface UseContainerQueryProps {
 }
 
 export const useContainerQuery = (props?: UseContainerQueryProps) => {
-    const { lg, md, sm, xl } = props || {};
+    const { '2xl': xxl, '3xl': xxxl, lg, md, sm, xl } = props || {};
     const { height, ref, width } = useElementSize();
 
     const isXs = width >= 0;
@@ -16,6 +18,8 @@ export const useContainerQuery = (props?: UseContainerQueryProps) => {
     const isMd = width >= (md || 768);
     const isLg = width >= (lg || 1200);
     const isXl = width >= (xl || 1500);
+    const is2xl = width >= (xxl || 1920);
+    const is3xl = width >= (xxxl || 2560);
 
-    return { height, isLg, isMd, isSm, isXl, isXs, ref, width };
+    return { height, is2xl, is3xl, isLg, isMd, isSm, isXl, isXs, ref, width };
 };