Skip to content

Commit

Permalink
wc: Implement new vertical menu in organization admin #TASK-7216 #TAS…
Browse files Browse the repository at this point in the history
…K-7100
  • Loading branch information
jmjuanes committed Dec 10, 2024
1 parent 081e8c8 commit f1d584b
Showing 1 changed file with 102 additions and 118 deletions.
220 changes: 102 additions & 118 deletions src/webcomponents/organization/admin/organization-admin.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import "../../project/projects-admin.js";
import "./project-admin-browser.js";
import "./organization-admin-detail.js";
import "../../commons/pages/restricted-access-page.js";
import "../../commons/vertical-navbar.js";

export default class OrganizationAdmin extends LitElement {

Expand All @@ -44,7 +45,6 @@ export default class OrganizationAdmin extends LitElement {

#init() {
this._config = this.getDefaultConfig();
this._activeMenuItem = "";
}

render() {
Expand All @@ -61,135 +61,119 @@ export default class OrganizationAdmin extends LitElement {
title="Organization Admin: ${this.opencgaSession?.user?.organization}"
icon="fas fa-sitemap">
</tool-header>
<custom-vertical-navbar
.organization="${this.opencgaSession.organization}"
<vertical-navbar
.opencgaSession="${this.opencgaSession}"
.config="${this._config}"
.activeMenuItem="${this._activeMenuItem}">
</custom-vertical-navbar>
.config="${this._config || {}}">
</vertical-navbar>
`;
}

getDefaultConfig() {
const menu = [
{
id: "general",
name: "General",
description: "",
icon: "",
featured: "",
visibility: "private",
submenu: [
// TODO
{
id: "dashboard",
name: "Dashboard (Coming soon)",
icon: "fas fa-vial",
visibility: "private",
render: () => html``,
},
// TODO
{
id: "audit",
name: "Audit (Coming soon)",
type: "category",
icon: "fas fa-vial",
visibility: "private",
render: () => html``,
},
],
return {
display: {
menuStyle: "width:200px;",
},
{
id: "manage",
name: "Manage",
description: "",
icon: "",
featured: "", // true | false
visibility: "private",
submenu: [
/* Vero Note: Maintained for future use in Organization Admin
{
id: "groups",
name: "Groups",
icon: "fas fa-vial",
visibility: "private",
render: (opencgaSession, organization) => html`
<group-admin-browser
.organization="${organization}"
.opencgaSession="${opencgaSession}">
</group-admin-browser>
`,
},
*/
{
id: "users",
name: "Users",
icon: "fas fa-users",
visibility: "private",
render: (opencgaSession, organization) => html`
<user-admin-browser
.organization="${organization}"
.opencgaSession="${opencgaSession}">
</user-admin-browser>
`,
},
{
id: "studies",
name: "Projects/Studies",
icon: "fas fa-project-diagram",
visibility: "private",
render: (opencgaSession, organization) => {
return html`
<project-admin-browser
menu: [
// {
// id: "general",
// name: "General",
// description: "",
// icon: "",
// featured: "",
// visibility: "private",
// submenu: [
// {
// id: "dashboard",
// name: "Dashboard (Coming soon)",
// icon: "fas fa-vial",
// visibility: "private",
// render: () => html``,
// },
// {
// id: "audit",
// name: "Audit (Coming soon)",
// type: "category",
// icon: "fas fa-vial",
// visibility: "private",
// render: () => html``,
// },
// ],
// },
{
id: "manage",
name: "Manage",
description: "",
icon: "",
featured: "", // true | false
visibility: "private",
submenu: [
/* Vero Note: Maintained for future use in Organization Admin
{
id: "groups",
name: "Groups",
icon: "fas fa-vial",
visibility: "private",
render: (opencgaSession, organization) => html`
<group-admin-browser
.organization="${organization}"
.opencgaSession="${opencgaSession}">
</project-admin-browser>
`;
</group-admin-browser>
`,
},
},
],
},
{
id: "configure",
name: "Configure",
description: "",
icon: "",
featured: "",
visibility: "private",
submenu: [
{
id: "settings",
name: "Organization",
icon: "fas fa-sitemap",
visibility: "private",
render: (opencgaSession, organization) => {
return html`
<organization-admin-detail
*/
{
id: "users",
name: "Users",
icon: "fas fa-users",
visibility: "private",
render: (opencgaSession, organization) => html`
<user-admin-browser
.organization="${organization}"
.opencgaSession="${opencgaSession}">
</organization-admin-detail>
`;
</user-admin-browser>
`,
},
},
/*
{
id: "optimization",
name: "Optimizations",
icon: "fas fa-vial",
visibility: "private",
render: (opencgaSession, study) => html``,
},
*/
],
},
];

return {
name: "Organization Admin",
logo: "",
icon: "",
visibility: "",
menu: menu,
{
id: "studies",
name: "Projects/Studies",
icon: "fas fa-project-diagram",
visibility: "private",
render: (opencgaSession, organization) => {
return html`
<project-admin-browser
.organization="${organization}"
.opencgaSession="${opencgaSession}">
</project-admin-browser>
`;
},
},
],
},
{
id: "configure",
name: "Configure",
description: "",
icon: "",
featured: "",
visibility: "private",
submenu: [
{
id: "settings",
name: "Organization",
icon: "fas fa-sitemap",
visibility: "private",
render: (opencgaSession, organization) => {
return html`
<organization-admin-detail
.organization="${organization}"
.opencgaSession="${opencgaSession}">
</organization-admin-detail>
`;
},
},
],
},
],
};
}

Expand Down

0 comments on commit f1d584b

Please sign in to comment.