diff --git a/src/components/IconButton/IconButton.tsx b/src/components/IconButton/IconButton.tsx index b4d710c0..973c2fa8 100644 --- a/src/components/IconButton/IconButton.tsx +++ b/src/components/IconButton/IconButton.tsx @@ -7,7 +7,7 @@ import styles from "./IconButton.module.scss"; type Props = { Icon: Icon; - onClick: () => void; + onClick: React.MouseEventHandler; isLoading: boolean; tooltipText?: string; className?: string; diff --git a/src/components/RandomReviewerButton/RandomReviewerButton.module.scss b/src/components/RandomReviewerButton/RandomReviewerButton.module.scss index 644a77ac..1a0dc5d4 100644 --- a/src/components/RandomReviewerButton/RandomReviewerButton.module.scss +++ b/src/components/RandomReviewerButton/RandomReviewerButton.module.scss @@ -1,4 +1,3 @@ .icon { display: inline-flex; - margin-right: 16px; } diff --git a/src/components/RandomReviewerButton/RandomReviewerButton.tsx b/src/components/RandomReviewerButton/RandomReviewerButton.tsx index 68345449..b6b5ec2e 100644 --- a/src/components/RandomReviewerButton/RandomReviewerButton.tsx +++ b/src/components/RandomReviewerButton/RandomReviewerButton.tsx @@ -14,7 +14,8 @@ type Props = { export const RandomReviewerButton = ({ octokit, instanceConfig }: Props) => { const [isLoading, isLoadingSet] = useState(false); - const handleClick = () => { + const handleClick: React.MouseEventHandler = (e) => { + e.preventDefault(); void assignRandomReviewer(octokit, instanceConfig, isLoadingSet); }; diff --git a/src/content/handleRandomReviewer.tsx b/src/content/handleRandomReviewer.tsx index 9dcc7d9e..a043972c 100644 --- a/src/content/handleRandomReviewer.tsx +++ b/src/content/handleRandomReviewer.tsx @@ -14,28 +14,36 @@ export const handleRandomReviewer = ( const urlUiPr = isOnPrPage(instanceConfig); if (!urlUiPr) return; - const topRightSection = document.getElementsByClassName("tabnav-extra")[0]; - if (!topRightSection) return; - - createRandomReviewerButton(topRightSection, octokit, instanceConfig); + const detailsEl = document.getElementById("reviewers-select-menu"); + createRandomReviewerButton(detailsEl, octokit, instanceConfig); }; const createRandomReviewerButton = ( - parent: Element, + detailsEl: Element | null, octokit: OctokitWithCache, instanceConfig: InstanceConfig, ) => { - if (parent.querySelector(`.${RANDOM_REVIEWER_BUTTON_CLASS}`)) return; + if (!detailsEl || !detailsEl.parentNode) return; + + if (detailsEl.parentNode?.querySelector(`.${RANDOM_REVIEWER_BUTTON_CLASS}`)) + return; + + const wrapperDiv = document.createElement("div"); + wrapperDiv.style.cssText = ` + display: grid; + grid-template-columns: 1fr auto; + gap: 1rem; + `; - // make parent a flex container to align all children in it - if (parent instanceof HTMLElement) - parent.style.setProperty("display", "flex", "important"); + // move detailsEl inside the wrapperDiv + detailsEl.parentNode?.insertBefore(wrapperDiv, detailsEl); + wrapperDiv.appendChild(detailsEl); - const spanContainer = document.createElement("span"); - spanContainer.classList.add(RANDOM_REVIEWER_BUTTON_CLASS); - parent.insertBefore(spanContainer, parent.firstChild); + const spanEl = document.createElement("span"); + spanEl.classList.add(RANDOM_REVIEWER_BUTTON_CLASS); + wrapperDiv.appendChild(spanEl); - const root = createRoot(spanContainer); + const root = createRoot(spanEl); root.render( diff --git a/src/content_compare_page.tsx b/src/content_compare_page.tsx index dd3153e2..3078ded4 100644 --- a/src/content_compare_page.tsx +++ b/src/content_compare_page.tsx @@ -1,8 +1,10 @@ +import { handleRandomReviewer } from "./content"; import { addPrTitleFromJira } from "./content/addPrTitleFromJira"; import { addDescriptionTemplate } from "./content/addDescriptionTemplate"; import { isOnComparePage } from "./content/utils/comparePageUtils"; import { getInstanceConfig } from "./getInstanceConfig"; import { getSettings, InstanceConfig, Settings } from "./services"; +import { getOctoInstance } from "./services/getOctoInstance"; getSettings({ onSuccess: handleContentChange, @@ -22,12 +24,17 @@ async function executeScripts( if (!isOnComparePage(instanceConfig)) return; try { + const octokit = getOctoInstance(instanceConfig); + if (settings.features.descriptionTemplate) { addDescriptionTemplate(settings); } if (settings.features.prTitleFromJira) { await addPrTitleFromJira(settings); } + if (instanceConfig.randomReviewers) { + handleRandomReviewer(octokit, instanceConfig); + } } catch (err) { alert( "Error in content_compare_page-script. Check console and report if the issue persists.",