From 14929ba18f1443ba93538aebee9181d31584764c Mon Sep 17 00:00:00 2001 From: Philippe Perrin Date: Thu, 21 Nov 2019 17:39:49 +0100 Subject: [PATCH] Move favorite button side by side with the breadcrumb --- .../components/nav/component/ComponentNav.tsx | 4 +-- .../nav/component/ComponentNavMeta.tsx | 10 +------- .../{ComponentNavHeader.tsx => Header.tsx} | 25 ++++++++++++++++--- ...nentNavHeader-test.tsx => Header-test.tsx} | 17 +++++++++---- .../__snapshots__/ComponentNav-test.tsx.snap | 2 +- ...der-test.tsx.snap => Header-test.tsx.snap} | 6 +++++ 6 files changed, 43 insertions(+), 21 deletions(-) rename server/sonar-web/src/main/js/app/components/nav/component/{ComponentNavHeader.tsx => Header.tsx} (69%) rename server/sonar-web/src/main/js/app/components/nav/component/__tests__/{ComponentNavHeader-test.tsx => Header-test.tsx} (71%) rename server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/{ComponentNavHeader-test.tsx.snap => Header-test.tsx.snap} (96%) diff --git a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.tsx b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.tsx index 19b3f24aaf9..775ac1fc23c 100644 --- a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.tsx +++ b/server/sonar-web/src/main/js/app/components/nav/component/ComponentNav.tsx @@ -25,9 +25,9 @@ import { rawSizes } from '../../../theme'; import RecentHistory from '../../RecentHistory'; import './ComponentNav.css'; import ComponentNavBgTaskNotif from './ComponentNavBgTaskNotif'; -import ComponentNavHeader from './ComponentNavHeader'; import ComponentNavMenu from './ComponentNavMenu'; import ComponentNavMeta from './ComponentNavMeta'; +import Header from './Header'; interface Props { branchLikes: BranchLike[]; @@ -88,7 +88,7 @@ export default class ComponentNav extends React.PureComponent { id="context-navigation" notif={notifComponent}>
- - {mainBranch && ( - - )} - {isABranch && currentPage !== undefined && ( + {mainBranch && currentPage !== undefined && ( )}
diff --git a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavHeader.tsx b/server/sonar-web/src/main/js/app/components/nav/component/Header.tsx similarity index 69% rename from server/sonar-web/src/main/js/app/components/nav/component/ComponentNavHeader.tsx rename to server/sonar-web/src/main/js/app/components/nav/component/Header.tsx index dec1d32e10d..0ed44b073ce 100644 --- a/server/sonar-web/src/main/js/app/components/nav/component/ComponentNavHeader.tsx +++ b/server/sonar-web/src/main/js/app/components/nav/component/Header.tsx @@ -19,25 +19,38 @@ */ import * as React from 'react'; import { Helmet } from 'react-helmet-async'; +import { connect } from 'react-redux'; +import Favorite from '../../../../components/controls/Favorite'; +import { isLoggedIn } from '../../../../helpers/users'; +import { getCurrentUser, Store } from '../../../../store/rootReducer'; import { BranchLike } from '../../../../types/branch-like'; import BranchLikeNavigation from './branch-like/BranchLikeNavigation'; import CurrentBranchLikeMergeInformation from './branch-like/CurrentBranchLikeMergeInformation'; import { ComponentBreadcrumb } from './ComponentBreadcrumb'; -export interface ComponentNavHeaderProps { +export interface HeaderProps { branchLikes: BranchLike[]; component: T.Component; currentBranchLike: BranchLike | undefined; + currentUser: T.CurrentUser; } -export function ComponentNavHeader(props: ComponentNavHeaderProps) { - const { branchLikes, component, currentBranchLike } = props; +export function Header(props: HeaderProps) { + const { branchLikes, component, currentBranchLike, currentUser } = props; return ( <>
+ {isLoggedIn(currentUser) && ( + + )} {currentBranchLike && ( <> ({ + currentUser: getCurrentUser(state) +}); + +export default connect(mapStateToProps)(React.memo(Header)); diff --git a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/ComponentNavHeader-test.tsx b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/Header-test.tsx similarity index 71% rename from server/sonar-web/src/main/js/app/components/nav/component/__tests__/ComponentNavHeader-test.tsx rename to server/sonar-web/src/main/js/app/components/nav/component/__tests__/Header-test.tsx index 31fbec9001d..aff2c9336f0 100644 --- a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/ComponentNavHeader-test.tsx +++ b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/Header-test.tsx @@ -19,23 +19,30 @@ */ import { shallow } from 'enzyme'; import * as React from 'react'; +import Favorite from '../../../../../components/controls/Favorite'; import { mockSetOfBranchAndPullRequest } from '../../../../../helpers/mocks/branch-like'; -import { mockComponent } from '../../../../../helpers/testMocks'; -import { ComponentNavHeader, ComponentNavHeaderProps } from '../ComponentNavHeader'; +import { mockComponent, mockCurrentUser } from '../../../../../helpers/testMocks'; +import { Header, HeaderProps } from '../Header'; it('should render correctly', () => { - const wrapper = shallowRender(); + const wrapper = shallowRender({ currentUser: mockCurrentUser({ isLoggedIn: true }) }); expect(wrapper).toMatchSnapshot(); }); -function shallowRender(props?: Partial) { +it('should not render favorite button if the user is not logged in', () => { + const wrapper = shallowRender(); + expect(wrapper.find(Favorite).exists()).toBeFalsy(); +}); + +function shallowRender(props?: Partial) { const branchLikes = mockSetOfBranchAndPullRequest(); return shallow( - ); diff --git a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNav-test.tsx.snap b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNav-test.tsx.snap index 8052b0bf3bd..42b3f9dc55f 100644 --- a/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNav-test.tsx.snap +++ b/server/sonar-web/src/main/js/app/components/nav/component/__tests__/__snapshots__/ComponentNav-test.tsx.snap @@ -8,7 +8,7 @@ exports[`renders 1`] = `
- +