From cc51f660d4e5436b21022ca62bb9240afe601392 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tr=C3=A8sAbhi?= <43380238+tresabhi@users.noreply.github.com>
Date: Sun, 7 Jul 2024 18:19:45 -0500
Subject: [PATCH] feat: smaller tank icons

---
 src/components/TankRowHeaderCell.tsx |  7 +++++--
 src/hooks/useIntersection.ts         | 12 +++++-------
 2 files changed, 10 insertions(+), 9 deletions(-)

diff --git a/src/components/TankRowHeaderCell.tsx b/src/components/TankRowHeaderCell.tsx
index b6e7c3468..b653cd615 100644
--- a/src/components/TankRowHeaderCell.tsx
+++ b/src/components/TankRowHeaderCell.tsx
@@ -14,12 +14,15 @@ export function TankRowHeaderCell({ tank }: TankRowHeaderCellProps) {
 
   return (
     <Table.RowHeaderCell
+      maxWidth={{
+        initial: '180px',
+        sm: '240px',
+      }}
       style={{
         display: 'flex',
         position: 'sticky',
         left: 0,
         backgroundColor: 'var(--color-background)',
-        maxWidth: 240,
         overflow: 'hidden',
       }}
     >
@@ -31,7 +34,7 @@ export function TankRowHeaderCell({ tank }: TankRowHeaderCellProps) {
           style={{
             margin: 'calc(-1 * var(--table-cell-padding)) 0',
             height: 'calc(100% + 2 * var(--table-cell-padding))',
-            aspectRatio: '16 / 9',
+            aspectRatio: '4 / 3',
             objectFit: 'cover',
           }}
         />
diff --git a/src/hooks/useIntersection.ts b/src/hooks/useIntersection.ts
index 2f2422f23..72573df06 100644
--- a/src/hooks/useIntersection.ts
+++ b/src/hooks/useIntersection.ts
@@ -17,14 +17,12 @@ export function useIntersection(
     const rect = ref.current.getBoundingClientRect();
     const visible = !(rect.bottom < 0 || rect.top - window.innerHeight >= 0);
 
-    if (visible) {
-      callback();
-    } else {
-      observer.current = new IntersectionObserver(callback, options);
-      observer.current.observe(ref.current);
+    if (visible) callback();
 
-      return () => observer.current!.disconnect();
-    }
+    observer.current = new IntersectionObserver(callback, options);
+    observer.current.observe(ref.current);
+
+    return () => observer.current!.disconnect();
   }, []);
 
   return observer;