SONAR-11410 fix issue popups placement

diff --git a/server/sonar-web/src/main/js/components/issue/components/IssueCommentLine.tsx b/server/sonar-web/src/main/js/components/issue/components/IssueCommentLine.tsx
index 9e3c10690b03ed9f88ee04a4bc7b37022f383916..660a5f2f1b240eea869701f658605181c809f527 100644 (file)
--- a/server/sonar-web/src/main/js/components/issue/components/IssueCommentLine.tsx
+++ b/server/sonar-web/src/main/js/components/issue/components/IssueCommentLine.tsx
@@ -24,6 +24,7 @@ import { EditButton, DeleteButton } from '../../ui/buttons';
 import CommentDeletePopup from '../popups/CommentDeletePopup';
 import CommentPopup from '../popups/CommentPopup';
 import DateFromNow from '../../intl/DateFromNow';
+import { PopupPlacement } from '../../ui/popups';
 
 interface Props {
   comment: T.IssueComment;
@@ -104,6 +105,7 @@ export default class IssueCommentLine extends React.PureComponent<Props, State>
                     comment={comment}
                     onComment={this.handleEdit}
                     placeholder=""
+                    placement={PopupPlacement.BottomRight}
                     toggleComment={this.toggleEditPopup}
                   />
                 }>

diff --git a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentLine-test.tsx.snap b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentLine-test.tsx.snap
index f32c48771644afc0422d378ecd7e1191383dae57..b823f6b919d41e3f083fb2e32b28275f39772b93 100644 (file)
--- a/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentLine-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/issue/components/__tests__/__snapshots__/IssueCommentLine-test.tsx.snap
@@ -67,6 +67,7 @@ exports[`should open the right popups when the buttons are clicked 3`] = `
             }
             onComment={[Function]}
             placeholder=""
+            placement="bottom-right"
             toggleComment={[Function]}
           />
         }
@@ -191,6 +192,7 @@ exports[`should render correctly a comment that is updatable 1`] = `
             }
             onComment={[Function]}
             placeholder=""
+            placement="bottom-right"
             toggleComment={[Function]}
           />
         }

diff --git a/server/sonar-web/src/main/js/components/issue/popups/ChangelogPopup.tsx b/server/sonar-web/src/main/js/components/issue/popups/ChangelogPopup.tsx
index d8ee5dcd7631793e32fca3fbc99c5778d1139c4a..2667f9358d124903ab6a7172cee5e9602176ac8c 100644 (file)
--- a/server/sonar-web/src/main/js/components/issue/popups/ChangelogPopup.tsx
+++ b/server/sonar-web/src/main/js/components/issue/popups/ChangelogPopup.tsx
@@ -24,6 +24,7 @@ import Avatar from '../../ui/Avatar';
 import DateTimeFormatter from '../../intl/DateTimeFormatter';
 import IssueChangelogDiff, { ChangelogDiff } from '../components/IssueChangelogDiff';
 import { DropdownOverlay } from '../../controls/Dropdown';
+import { PopupPlacement } from '../../ui/popups';
 
 interface Changelog {
   avatar?: string;
@@ -71,7 +72,7 @@ export default class ChangelogPopup extends React.PureComponent<Props, State> {
     const { issue } = this.props;
     const { author } = issue;
     return (
-      <DropdownOverlay>
+      <DropdownOverlay placement={PopupPlacement.BottomRight}>
         <div className="menu is-container issue-changelog">
           <table className="spaced">
             <tbody>

diff --git a/server/sonar-web/src/main/js/components/issue/popups/CommentDeletePopup.tsx b/server/sonar-web/src/main/js/components/issue/popups/CommentDeletePopup.tsx
index 9f9c963f3939e5994fdc2cf70c4f0134f93473b5..7171ad069f80010c81eb5278859d44b7e98de56b 100644 (file)
--- a/server/sonar-web/src/main/js/components/issue/popups/CommentDeletePopup.tsx
+++ b/server/sonar-web/src/main/js/components/issue/popups/CommentDeletePopup.tsx
@@ -21,6 +21,7 @@ import * as React from 'react';
 import { Button } from '../../ui/buttons';
 import { translate } from '../../../helpers/l10n';
 import { DropdownOverlay } from '../../controls/Dropdown';
+import { PopupPlacement } from '../../ui/popups';
 
 interface Props {
   onDelete: () => void;
@@ -28,7 +29,7 @@ interface Props {
 
 export default function CommentDeletePopup({ onDelete }: Props) {
   return (
-    <DropdownOverlay>
+    <DropdownOverlay placement={PopupPlacement.BottomRight}>
       <div className="menu is-container">
         <div className="spacer-bottom">{translate('issue.comment.delete_confirm_message')}</div>
         <Button className="button-red" onClick={onDelete}>

diff --git a/server/sonar-web/src/main/js/components/issue/popups/CommentPopup.tsx b/server/sonar-web/src/main/js/components/issue/popups/CommentPopup.tsx
index 68d3933ee067f5b1446201cbb5dbd6bb36334a7b..14492654dcd91b68150f241caa533e17ac624777 100644 (file)
--- a/server/sonar-web/src/main/js/components/issue/popups/CommentPopup.tsx
+++ b/server/sonar-web/src/main/js/components/issue/popups/CommentPopup.tsx
@@ -22,13 +22,14 @@ import MarkdownTips from '../../common/MarkdownTips';
 import { Button, ResetButtonLink } from '../../ui/buttons';
 import { translate } from '../../../helpers/l10n';
 import { DropdownOverlay } from '../../controls/Dropdown';
+import { PopupPlacement } from '../../ui/popups';
 
 interface Props {
   comment?: Pick<T.IssueComment, 'markdown'>;
   onComment: (text: string) => void;
   toggleComment: (visible: boolean) => void;
   placeholder: string;
-  popupPosition?: {};
+  placement?: PopupPlacement;
 }
 
 interface State {
@@ -70,7 +71,7 @@ export default class CommentPopup extends React.PureComponent<Props, State> {
   render() {
     const { comment } = this.props;
     return (
-      <DropdownOverlay>
+      <DropdownOverlay placement={this.props.placement}>
         <div className="issue-comment-bubble-popup">
           <div className="issue-comment-form-text">
             <textarea

diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/ChangelogPopup-test.tsx.snap b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/ChangelogPopup-test.tsx.snap
index f54cfd88b778314d9d052abd044cd7e9149edd96..eb4ed4d2aedd171966b42659c8b923b2bc030834 100644 (file)
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/ChangelogPopup-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/ChangelogPopup-test.tsx.snap
@@ -1,7 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`should render the changelog popup correctly 1`] = `
-<DropdownOverlay>
+<DropdownOverlay
+  placement="bottom-right"
+>
   <div
     className="menu is-container issue-changelog"
   >

diff --git a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentDeletePopup-test.tsx.snap b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentDeletePopup-test.tsx.snap
index 43c009289439ec71e3ef8a65a291aaba5dd0a017..955955a8e5af5c5e4b8c29286d8d3d58f12d3281 100644 (file)
--- a/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentDeletePopup-test.tsx.snap
+++ b/server/sonar-web/src/main/js/components/issue/popups/__tests__/__snapshots__/CommentDeletePopup-test.tsx.snap
@@ -1,7 +1,9 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`should render the comment delete popup correctly 1`] = `
-<DropdownOverlay>
+<DropdownOverlay
+  placement="bottom-right"
+>
   <div
     className="menu is-container"
   >