Update GIF button not displaying

src/components/giphy-toolbar-item.js

@@ -2,9 +2,9 @@
 import React from 'dom-chef'
 
 export default (
-  <details class="details-reset details-overlay toolbar-item select-menu select-menu-modal-right ghg-trigger btn-octicon">
+  <details class=" details-reset details-overlay toolbar-item select-menu select-menu-modal-right ghg-trigger">
     <summary
-      class="menu-target p-2 p-md-1 mx-1"
+      class="menu-target Button Button--iconOnly Button--invisible Button--medium"
       aria-label="Insert a GIF"
       aria-haspopup="menu"
     >

src/main.js

@@ -80,7 +80,7 @@ function addToolbarButton() {
     const form = toolbar.closest('form')
 
     const reviewChangesModal = toolbar.closest(
-      '#review-changes-modal .SelectMenu-modal'
+      '#review-changes-modal'
     )
     const reviewChangesList = toolbar.closest(
       '#review-changes-modal .SelectMenu-list'
@@ -90,6 +90,16 @@ function addToolbarButton() {
     // Otherwise the GIF selection popover will not be visible.
     if (reviewChangesModal !== null) {
       reviewChangesModal.classList.add('ghg-in-review-changes-modal')
+
+      // The Review changes modal sets an inline width of min(640px, 100vw - 2rem);
+      // our button takes up another 32px so we need to adjust the inline style to account for that, otherwise it's hidden.
+      let currentWidth = reviewChangesModal.style.width;
+      if (currentWidth.includes('px')) {
+          // Extracts the value from the string (e.g., 640 from "min(640px, 100vw - 2rem)")
+          let widthValue = parseInt(currentWidth.match(/\d+/)[0]);
+          let modifiedWidth = currentWidth.replace(widthValue + 'px', `${widthValue + 32}px`);
+          reviewChangesModal.style.width = modifiedWidth;
+      }
     }
 
     if (reviewChangesList !== null) {

src/style.css

@@ -29,8 +29,6 @@
 }
 
 .ghg-in-review-changes-modal {
-  /* Fixes the GIF button dropping to a new line in the review modal */
-  width: 678px !important;
   /* Fixes the GIF dropdown being hidden by the review modal's overflow */
   overflow: unset !important;
 }