External-Mirrors/awx
2
0
Fork 0
mirror of https://github.com/ansible/awx.git synced 2026-03-04 02:01:01 -03:30
Code Issues Packages Projects Releases Wiki Activity

make tabs of the project detail view card full width

Browse Source
This commit is contained in:
John Mitchell
2020-06-16 11:53:30 -04:00
parent a5576d2ae9
commit 173d058d88
1 changed files with 16 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

37
awx/ui_next/src/screens/Project/Project.jsx
View File

@@ -2,9 +2,8 @@ import React, { Component } from 'react';
import { withI18n } from '@lingui/react'; import { withI18n } from '@lingui/react';
import { t } from '@lingui/macro'; import { t } from '@lingui/macro';
import { Switch, Route, withRouter, Redirect, Link } from 'react-router-dom'; import { Switch, Route, withRouter, Redirect, Link } from 'react-router-dom';
import { Card, CardActions, PageSection } from '@patternfly/react-core'; import { CaretLeftIcon } from '@patternfly/react-icons';
import { TabbedCardHeader } from '../../components/Card'; import { Card, PageSection } from '@patternfly/react-core';
import CardCloseButton from '../../components/CardCloseButton';
import RoutedTabs from '../../components/RoutedTabs'; import RoutedTabs from '../../components/RoutedTabs';
import ContentError from '../../components/ContentError'; import ContentError from '../../components/ContentError';
import NotificationList from '../../components/NotificationList'; import NotificationList from '../../components/NotificationList';
@@ -121,6 +120,16 @@ class Project extends Component {
const canToggleNotifications = isNotifAdmin; const canToggleNotifications = isNotifAdmin;
const tabsArray = [ const tabsArray = [
{
name: (
<>
<CaretLeftIcon />
{i18n._(t`Back to Projects`)}
</>
),
link: `/projects`,
id: 99,
},
{ name: i18n._(t`Details`), link: `${match.url}/details` }, { name: i18n._(t`Details`), link: `${match.url}/details` },
{ name: i18n._(t`Access`), link: `${match.url}/access` }, { name: i18n._(t`Access`), link: `${match.url}/access` },
]; ];
@@ -148,24 +157,10 @@ class Project extends Component {
tab.id = n; tab.id = n;
}); });
let cardHeader = ( let showCardHeader = true;
<TabbedCardHeader>
<RoutedTabs tabsArray={tabsArray} />
<CardActions>
<CardCloseButton linkTo="/projects" />
</CardActions>
</TabbedCardHeader>
);
if (!isInitialized) { if (!isInitialized || location.pathname.endsWith('edit') || location.pathname.includes('schedules/')) {
cardHeader = null; showCardHeader = false;
}
if (
location.pathname.endsWith('edit') ||
location.pathname.includes('schedules/')
) {
cardHeader = null;
} }
if (!hasContentLoading && contentError) { if (!hasContentLoading && contentError) {
@@ -188,7 +183,7 @@ class Project extends Component {
return ( return (
<PageSection> <PageSection>
<Card> <Card>
{cardHeader} {showCardHeader && <RoutedTabs tabsArray={tabsArray} />}
<Switch> <Switch>
<Redirect from="/projects/:id" to="/projects/:id/details" exact /> <Redirect from="/projects/:id" to="/projects/:id/details" exact />
{project && ( {project && (