IF YOU WOULD LIKE TO GET AN ACCOUNT, please write an email to s dot adaszewski at gmail dot com. User accounts are meant only to report issues and/or generate pull requests. This is a purpose-specific Git hosting for ADARED projects. Thank you for your understanding!
Bladeren bron

Added breadcrumbs.

master
Stanislaw Adaszewski 4 jaren geleden
bovenliggende
commit
6a306e6183
5 gewijzigde bestanden met toevoegingen van 123 en 5 verwijderingen
  1. +34
    -0
      frontend/src/js/component/wb-project-crumbs.js
  2. +43
    -0
      frontend/src/js/misc/fetch-project-parents.js
  3. +8
    -2
      frontend/src/js/page/wb-app.js
  4. +7
    -3
      frontend/src/js/page/wb-browse.js
  5. +31
    -0
      frontend/src/js/widget/wb-breadcrumbs.js

+ 34
- 0
frontend/src/js/component/wb-project-crumbs.js Bestand weergeven

@@ -0,0 +1,34 @@
import { h, Component } from 'preact';
import WBBreadcrumbs from 'wb-breadcrumbs';
import fetchProjectParents from 'fetch-project-parents';
class WBProjectCrumbs extends Component {
constructor(...args) {
super(...args);
this.state.items = [];
}
fetchCrumbs() {
let { arvHost, arvToken } = this.props.appState;
let prom = fetchProjectParents(arvHost, arvToken, this.props.uuid);
prom = prom.then(parents => this.setState({ 'items': parents }));
}
componentDidMount() {
this.fetchCrumbs();
}
componentWillReceiveProps(nextProps) {
this.props = nextProps;
this.fetchCrumbs();
}
render({ onItemClicked }, { items }) {
return (
<WBBreadcrumbs items={ items }
onItemClicked={ onItemClicked } />
);
}
}
export default WBProjectCrumbs;

+ 43
- 0
frontend/src/js/misc/fetch-project-parents.js Bestand weergeven

@@ -0,0 +1,43 @@
import makeArvadosRequest from 'make-arvados-request';
function fetchProjectParents(arvHost, arvToken, uuid) {
let parents = [];
let cb = xhr => {
let objectType = xhr.response['uuid'].split('-')[1];
if (objectType === 'tpzed') {
let name = xhr.response['first_name'] + ' ' + xhr.response['last_name'];
parents.push({ 'name': name, 'uuid': xhr.response['uuid'] });
} else {
parents.push({ 'name': xhr.response['name'],
'uuid': xhr.response['uuid'] });
}
if (!xhr.response['owner_uuid'] ||
xhr.response['owner_uuid'].endsWith('-tpzed-000000000000000')) {
return parents.reverse();
}
objectType = xhr.response['owner_uuid'].split('-')[1];
if (objectType === 'tpzed') {
return makeArvadosRequest(arvHost, arvToken,
'/arvados/v1/users/' + xhr.response['owner_uuid']).then(cb);
} else {
return makeArvadosRequest(arvHost, arvToken,
'/arvados/v1/groups/' + xhr.response['owner_uuid']).then(cb);
}
};
let objectType = uuid.split('-')[1];
let prom = makeArvadosRequest(arvHost, arvToken,
'/arvados/v1/' + (objectType === 'tpzed' ? 'users' : 'groups') + '/' + uuid);
prom = prom.then(cb);
return prom;
}
export default fetchProjectParents;

+ 8
- 2
frontend/src/js/page/wb-app.js Bestand weergeven

@@ -12,6 +12,10 @@ class WBApp extends Component {
this.appCallbacks = {
'navbarItemClicked': this.navbarItemClicked
};
this.appState = {
'arvHost': this.state.arvHost,
'arvToken': this.state.arvToken
};
}
navbarItemClicked(item) {
@@ -23,14 +27,16 @@ class WBApp extends Component {
}
}
render({}, { activePage, arvHost, arvToken }) {
render() {
return (
<Router>
<WBLandingPage path="/" />
<WBSignIn path="/sign-in" />
<WBBrowse path="/browse/:ownerUuid?/:activePage?" appCallbacks={ this.appCallbacks } />
<WBBrowse path="/browse/:ownerUuid?/:activePage?"
appCallbacks={ this.appCallbacks }
appState={ this.appState } />
</Router>
);
}


+ 7
- 3
frontend/src/js/page/wb-browse.js Bestand weergeven

@@ -3,9 +3,10 @@ import { route } from 'preact-router';
import WBNavbar from 'wb-navbar';
import WBProjectListing from 'wb-project-listing';
import WBInlineSearch from 'wb-inline-search';
import WBProjectCrumbs from 'wb-project-crumbs';
class WBBrowse extends Component {
render({ ownerUuid, activePage, appCallbacks }) {
render({ ownerUuid, activePage, appCallbacks, appState }) {
return (
<div>
<WBNavbar items={ [
@@ -15,8 +16,11 @@ class WBBrowse extends Component {
<WBInlineSearch />
) } onItemClicked={ appCallbacks.navbarItemClicked } />
<WBProjectListing arvHost="api.arkau.roche.com"
arvToken="v2/arkau-gj3su-uf4hnu2o2qkvm8j/15kla38mafzq6b31d5t74ynhk6iuy32v1ticslodr0obvvhde9"
<WBProjectCrumbs uuid={ ownerUuid } appState={ appState }
onItemClicked={ item => route('/browse/' + item['uuid']) } />
<WBProjectListing arvHost={ appState.arvHost }
arvToken={ appState.arvToken }
ownerUuid={ ownerUuid }
itemsPerPage="5"
activePage={ Number(activePage || 0) }


+ 31
- 0
frontend/src/js/widget/wb-breadcrumbs.js Bestand weergeven

@@ -0,0 +1,31 @@
import { h, Component } from 'preact';
class WBBreadcrumbs extends Component {
render({ items, onItemClicked }) {
return (
<nav aria-label="breadcrumb">
<ol class="breadcrumb">
{ items.map((item, idx) => (
<li class={ 'breadcrumb-item' +
(idx == items.length - 1 ? ' active' : '') }>
{
(idx < items.length - 1) ? (
<a href="#" onclick={ e => { e.preventDefault();
onItemClicked(item); } }>{ typeof(item) === 'string' ? item : item['name'] }</a>
) : (
typeof(item) === 'string' ? item : item['name']
)
}
</li>
)) }
</ol>
</nav>
);
}
}
WBBreadcrumbs.defaultProps = {
'onItemClicked': () => {}
}
export default WBBreadcrumbs;

Laden…
Annuleren
Opslaan