fix(ui): fix meta popup

frontend/app/components/shared/SessionItem/MetaMoreButton/MetaMoreButton.tsx

@@ -10,14 +10,8 @@ export default function MetaMoreButton(props: Props) {
     const { list, maxLength } = props
     return (
         <Popup
-            trigger={ (
-                <div className="flex items-center">
-                <span className="rounded bg-active-blue color-teal px-2 color-gray-dark cursor-pointer">
-                    +{list.length - maxLength} More
-                </span>
-                </div>
-            ) }
             className="p-0"
+            theme="light"
             content={ 
                 <div className="text-sm grid grid-col p-4 gap-3" style={{ maxHeight: '200px', overflowY: 'auto'}}>
                     {list.slice(maxLength).map(({ label, value }, index) => (
@@ -27,6 +21,12 @@ export default function MetaMoreButton(props: Props) {
             }
             on="click"
             position="center center"
-        />
+        >
+            <div className=" flex items-center">
+                    <span className="rounded bg-active-blue color-teal p-2 color-gray-dark cursor-pointer whitespace-nowrap">
+                        +{list.length - maxLength} More
+                    </span>
+                </div>
+        </Popup>
     )
 }

frontend/app/components/shared/SessionItem/SessionMetaList/SessionMetaList.tsx

@@ -12,6 +12,7 @@ interface Props {
 
 export default function SessionMetaList(props: Props) {
   const { className = '', metaList, maxLength = 4 } = props
+
   return (
     <div className={cn("text-sm flex items-center", className)}>
       {metaList.slice(0, maxLength).map(({ label, value }, index) => (