import { Outlet, useSearchParams } from 'react-router-dom';
import { useLocation } from '../../../components/hoc/withRouter';
import ProfileHeader from '../details/ProfileHeader';
-import { QualityProfilesContextProps, withQualityProfilesContext } from '../qualityProfilesContext';
+import { useQualityProfilesContext } from '../qualityProfilesContext';
import ProfileNotFound from './ProfileNotFound';
-export function ProfileContainer(props: QualityProfilesContextProps) {
+export default function ProfileContainer() {
const [_, setSearchParams] = useSearchParams();
const location = useLocation();
const { key, language, name } = location.query;
- const { profiles } = props;
+ const context = useQualityProfilesContext();
+ const { profiles } = context;
// try to find a quality profile with the given key
// if managed to find one, redirect to a new version
return <ProfileNotFound />;
}
- const context: QualityProfilesContextProps = {
- profile,
- ...props,
- };
-
return (
<div id="quality-profile">
<Helmet defer={false} title={profile.name} />
<ProfileHeader
profile={profile}
isComparable={filteredProfiles.length > 1}
- updateProfiles={props.updateProfiles}
+ updateProfiles={context.updateProfiles}
/>
- <Outlet context={context} />
+ <Outlet context={{ profile, ...context }} />
</div>
);
}
-
-export default withQualityProfilesContext(ProfileContainer);
import { render, screen } from '@testing-library/react';
import * as React from 'react';
import { HelmetProvider } from 'react-helmet-async';
-import { MemoryRouter, Route, Routes } from 'react-router-dom';
+import { MemoryRouter, Outlet, Route, Routes } from 'react-router-dom';
import { mockQualityProfile } from '../../../../helpers/testMocks';
import {
QualityProfilesContextProps,
withQualityProfilesContext,
} from '../../qualityProfilesContext';
import { Profile } from '../../types';
-import { ProfileContainer } from '../ProfileContainer';
+import ProfileContainer from '../ProfileContainer';
it('should render the header and child', () => {
const targetProfile = mockQualityProfile({ name: 'profile1' });
const WrappedChild = withQualityProfilesContext(Child);
function renderProfileContainer(path: string, overrides: Partial<QualityProfilesContextProps>) {
+ function ProfileOutlet(props: Partial<QualityProfilesContextProps>) {
+ const context = {
+ actions: {},
+ exporters: [],
+ languages: [],
+ profiles: [],
+ updateProfiles: jest.fn(),
+ ...props,
+ };
+
+ return <Outlet context={context} />;
+ }
+
return render(
<HelmetProvider context={{}}>
<MemoryRouter initialEntries={[path]}>
<Routes>
- <Route
- element={
- <ProfileContainer
- actions={{}}
- exporters={[]}
- languages={[]}
- profiles={[]}
- updateProfiles={jest.fn()}
- {...overrides}
- />
- }
- >
- <Route path="*" element={<WrappedChild />} />
+ <Route element={<ProfileOutlet {...overrides} />}>
+ <Route element={<ProfileContainer />}>
+ <Route path="*" element={<WrappedChild />} />
+ </Route>
</Route>
</Routes>
</MemoryRouter>
* Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
*/
import * as React from 'react';
+import { Helmet } from 'react-helmet-async';
import { FormattedMessage } from 'react-intl';
import { NavLink } from 'react-router-dom';
import Link from '../../../components/common/Link';
import ProfileActions from '../components/ProfileActions';
import ProfileLink from '../components/ProfileLink';
import { PROFILE_PATH } from '../constants';
+import { QualityProfilePath } from '../routes';
import { Profile } from '../types';
import {
getProfileChangelogPath,
export default function ProfileHeader(props: Props) {
const { profile, isComparable, updateProfiles } = props;
const location = useLocation();
+ const isComparePage = location.pathname.endsWith(`/${QualityProfilePath.COMPARE}`);
+ const isChangeLogPage = location.pathname.endsWith(`/${QualityProfilePath.CHANGELOG}`);
return (
<div className="page-header quality-profile-header">
+ {(isComparePage || isChangeLogPage) && (
+ <Helmet
+ defer={false}
+ title={translateWithParameters(
+ isChangeLogPage
+ ? 'quality_profiles.page_title_changelog_x'
+ : 'quality_profiles.page_title_compare_x',
+ profile.name
+ )}
+ />
+ )}
<div className="note spacer-bottom">
<NavLink end={true} to={PROFILE_PATH}>
{translate('quality_profiles.page')}
import ProfileDetails from './details/ProfileDetails';
import HomeContainer from './home/HomeContainer';
+export enum QualityProfilePath {
+ SHOW = 'show',
+ CHANGELOG = 'changelog',
+ COMPARE = 'compare',
+}
const routes = () => (
<Route path="profiles" element={<QualityProfilesApp />}>
<Route index={true} element={<HomeContainer />} />
<Route element={<ProfileContainer />}>
- <Route path="show" element={<ProfileDetails />} />
- <Route path="changelog" element={<ChangelogContainer />} />
- <Route path="compare" element={<ComparisonContainer />} />
+ <Route path={QualityProfilePath.SHOW} element={<ProfileDetails />} />
+ <Route path={QualityProfilePath.CHANGELOG} element={<ChangelogContainer />} />
+ <Route path={QualityProfilePath.COMPARE} element={<ComparisonContainer />} />
</Route>
</Route>
);
#
#------------------------------------------------------------------------------
+quality_profiles.page_title_changelog_x={0} - Quality profile changelog
+quality_profiles.page_title_compare_x={0} - Quality profile comparaison
quality_profiles.new_profile=New Quality Profile
quality_profiles.compare_with=Compare with
quality_profiles.filter_by=Filter profiles by