Refactor breadcrumbs, tabs, routing.

* Cleanup previous params logic from Notificaitons list
* Add shared breadcrumbs and tabs components
* Structure Organization screens to render only cardBody content
* Add styles
* Fetch organization when location changes
This commit is contained in:
Marliana Lara
2019-01-24 23:53:10 -05:00
parent dd522c240e
commit b820e411d3
18 changed files with 363 additions and 356 deletions

View File

@@ -65,9 +65,7 @@ class Notifications extends Component {
componentDidMount () {
const queryParams = this.getQueryParams();
// TODO: remove this hack once tab query param is gone
const { tab, ...queryParamsWithoutTab } = queryParams;
this.fetchNotifications(queryParamsWithoutTab);
this.fetchNotifications(queryParams);
}
onSearch () {
@@ -81,10 +79,8 @@ class Notifications extends Component {
const { search } = location;
const searchParams = parseQueryString(search.substring(1));
// TODO: remove this hack once tab query param is gone
const { tab, ...queryParamsWithoutTab } = searchParams;
return Object.assign({}, this.defaultParams, queryParamsWithoutTab, overrides);
return Object.assign({}, this.defaultParams, searchParams, overrides);
}
onSort = (sortedColumnKey, sortOrder) => {
@@ -240,8 +236,6 @@ class Notifications extends Component {
}
this.setState(stateToUpdate);
// TODO: remove this hack once tab query param is gone
this.updateUrl({ ...queryParams, tab: 'notifications' });
const notificationTemplateIds = results
.map(notificationTemplate => notificationTemplate.id)
@@ -299,7 +293,7 @@ class Notifications extends Component {
<EmptyState>
<EmptyStateIcon icon={CubesIcon} />
<Title size="lg">
<Trans>No Notifictions Found</Trans>
<Trans>No Notifications Found</Trans>
</Title>
<EmptyStateBody>
<Trans>Please add a notification template to populate this list</Trans>
@@ -331,7 +325,7 @@ class Notifications extends Component {
itemId={o.id}
name={o.name}
notificationType={o.notification_type}
detailUrl={`notifications/${o.id}`}
detailUrl={`/notifications/${o.id}`}
isSelected={selected.includes(o.id)}
onSelect={() => this.onSelect(o.id)}
toggleNotification={this.toggleNotification}