From 1aec85fb3eb3d4096e19a3f07df3948948ae655f Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Sun, 2 Jul 2023 16:19:56 -0700
Subject: [PATCH] Fix ExtendedMasterySelect styles

---
 .../ExtendedMasterySelect/index.module.scss   | 13 +-----------
 .../mastery/ExtendedMasterySelect/index.tsx   | 21 ++++++++++++-------
 2 files changed, 15 insertions(+), 19 deletions(-)

diff --git a/components/mastery/ExtendedMasterySelect/index.module.scss b/components/mastery/ExtendedMasterySelect/index.module.scss
index 4ce3e5d0..5ec7dbfd 100644
--- a/components/mastery/ExtendedMasterySelect/index.module.scss
+++ b/components/mastery/ExtendedMasterySelect/index.module.scss
@@ -1,17 +1,6 @@
-.SelectSet {
+.set {
   display: flex;
   flex-direction: row;
   gap: $unit;
   width: 100%;
-
-  .SelectTrigger.Left {
-    flex-grow: 1;
-    width: 100%;
-  }
-
-  .SelectTrigger.Right {
-    flex-grow: 0;
-    text-align: right;
-    min-width: 12rem;
-  }
 }
diff --git a/components/mastery/ExtendedMasterySelect/index.tsx b/components/mastery/ExtendedMasterySelect/index.tsx
index 08ef5802..3d0d5aab 100644
--- a/components/mastery/ExtendedMasterySelect/index.tsx
+++ b/components/mastery/ExtendedMasterySelect/index.tsx
@@ -125,7 +125,7 @@ const ExtendedMasterySelect = ({
   }
 
   return (
-    <div className="SelectSet">
+    <div className={styles.set}>
       <Select
         key={`${name}_type`}
         value={`${currentItemSkill ? currentItemSkill.id : 0}`}
@@ -134,7 +134,12 @@ const ExtendedMasterySelect = ({
         onValueChange={handleLeftSelectChange}
         onOpenChange={() => changeOpen('left')}
         onClose={onClose}
-        triggerClass="Left modal"
+        trigger={{
+          className: classNames({
+            left: true,
+            modal: true,
+          }),
+        }}
         overlayVisible={false}
       >
         {generateLeftOptions()}
@@ -148,11 +153,13 @@ const ExtendedMasterySelect = ({
         onOpenChange={() => changeOpen('right')}
         onClose={onClose}
         overlayVisible={false}
-        triggerClass={classNames({
-          Right: true,
-          modal: true,
-          hidden: currentItemSkill?.id === 0,
-        })}
+        trigger={{
+          className: classNames({
+            right: true,
+            modal: true,
+            hidden: currentItemSkill?.id === 0,
+          }),
+        }}
       >
         {generateRightOptions()}
       </Select>