rework catalogs/apps/tools nav menus

rancher/rancher#18847
This commit is contained in:
Westly Wright 2019-03-13 11:39:41 -07:00
parent 6d6b14e780
commit 39fe8156f0
No known key found for this signature in database
GPG Key ID: 4FAB3D8673DC54A3
4 changed files with 111 additions and 97 deletions

View File

@ -1,23 +1,22 @@
{{#hover-dropdown {{#hover-dropdown
horizontalPosition="left" horizontalPosition="left"
verticalPosition="below" verticalPosition="below"
renderInPlace=true renderInPlace=true
onOpen=(action "onOpen") onOpen=(action "onOpen")
onClose=(action "onClose") onClose=(action "onClose")
as |dd| as |dd|
}} }}
{{#dd.trigger {{#dd.trigger
ariaLabel=(t 'nav.projectDropdown.label') ariaLabel=(t "nav.projectDropdown.label")
}} }}
<a class="{{if twoLine 'two-line'}} text-white"> <a class="{{if twoLine "two-line"}} text-white">
{{#if (eq pageScope "project")}} {{#if (eq pageScope "project")}}
<div class="clip"> <div class="clip">
<span>{{project.cluster.displayName}}</span> <span>{{project.cluster.displayName}}</span>
</div> </div>
<div class="pl-15 clip text-muted"> <div class="pl-15 clip text-muted">
<i class="{{project.icon}} project-icon icon-fw"></i>
<span>{{project.displayName}}</span> <span>{{project.displayName}}</span>
</div> </div>
{{else if (eq pageScope "cluster")}} {{else if (eq pageScope "cluster")}}
@ -26,17 +25,15 @@
</div> </div>
{{else if (eq pageScope "global")}} {{else if (eq pageScope "global")}}
<div class="clip"> <div class="clip">
<i class="icon icon-globe icon-fw"></i> <span>{{t "nav.admin.tab"}}</span>
<span>{{t 'nav.admin.tab'}}</span>
</div> </div>
{{else}} {{else}}
<div class="clip"> <div class="clip">
<i class="icon icon-question icon-fw"></i>
<span>{{pageScope}}</span> <span>{{pageScope}}</span>
</div> </div>
{{/if}} {{/if}}
<span class="sr-only">{{t 'nav.srToggleDropdown'}}</span> <span class="sr-only">{{t "nav.srToggleDropdown"}}</span>
<i class="icon icon-chevron-down chevron"></i> <i class="icon icon-chevron-down chevron"></i>
</a> </a>
@ -44,56 +41,68 @@
{{/dd.trigger}} {{/dd.trigger}}
{{#dd.content {{#dd.content
class="project-menu" class="project-menu"
style=menuStyle style=menuStyle
}} }}
<div class="global"> <div class="global">
<ul class="list-unstyled"> <ul class="list-unstyled">
<li class="item clip {{if (eq pageScope 'global') 'active selected' 'inactive'}}"> <li class="item clip {{if (eq pageScope "global") "active selected" "inactive"}}">
<a href="{{href-to "global-admin"}}" class="{{if (eq pageScope "global") 'active selected' 'inactive'}}"> <a href="{{href-to "global-admin"}}" class="{{if (eq pageScope "global") "active selected" "inactive"}}">
<i class="icon icon-globe icon-fw"></i> {{t "nav.admin.tab"}}
{{t 'nav.admin.tab'}}
</a> </a>
</li> </li>
</ul> </ul>
</div> </div>
<div class="search"> <div class="search">
{{input type="text" placeholder=(t 'nav.projectDropdown.search') value=searchInput}} {{input
type="text"
placeholder=(t "nav.projectDropdown.search")
value=searchInput
}}
</div> </div>
<div class="clusters"> <div class="clusters">
<label>{{t 'nav.projectDropdown.clusters'}}</label> <label class="acc-label">
{{t "nav.projectDropdown.clusters"}}
</label>
<ul class="list-unstyled" style="{{columnStyle}}"> <ul class="list-unstyled" style="{{columnStyle}}">
{{#if searchInput}} {{#if searchInput}}
{{#each clusterSearchResults as |entry|}} {{#each clusterSearchResults as |entry|}}
<li data-cluster-id={{entry.cluster.id}} class="item clip cluster"> <li data-cluster-id={{entry.cluster.id}} class="item clip cluster">
{{#link-to {{#link-to
'authenticated.cluster' "authenticated.cluster"
entry.cluster.id entry.cluster.id
class="top" class="top"
}} }}
{{entry.searchMatch}} {{entry.searchMatch}}
{{/link-to}} {{/link-to}}
<p class="state">{{entry.cluster.displayState}}</p> <p class="state">{{entry.cluster.displayState}}</p>
</li> </li>
{{else}} {{else}}
<li class="text-muted p-10">{{t 'nav.projectDropdown.clustersNoMatch' searchInput=searchInput}}</li> <li class="text-muted p-10">
{{t "nav.projectDropdown.clustersNoMatch" searchInput=searchInput}}
</li>
{{/each}} {{/each}}
{{else}} {{else}}
{{#each byCluster as |entry|}} {{#each byCluster as |entry|}}
<li data-cluster-id={{entry.cluster.id}} class="item clip cluster {{if entry.active 'active' 'inactive'}} {{if (eq hoverEntry entry) 'hover'}}"> <li
data-cluster-id={{entry.cluster.id}}
class="item clip cluster {{if entry.active "active" "inactive"}} {{if (eq hoverEntry entry) "hover"}}"
>
{{#link-to {{#link-to
'authenticated.cluster' "authenticated.cluster"
entry.cluster.id entry.cluster.id
class="top" class="top"
}} }}
{{entry.cluster.displayName}} {{entry.cluster.displayName}}
{{/link-to}} {{/link-to}}
<p class="state">{{entry.cluster.displayState}}</p> <p class="state">{{entry.cluster.displayState}}</p>
</li> </li>
{{else}} {{else}}
<li class="text-muted p-10">{{t 'nav.projectDropdown.clustersNoData'}}</li> <li class="text-muted p-10">
{{t "nav.projectDropdown.clustersNoData"}}
</li>
{{/each}} {{/each}}
{{/if}} {{/if}}
</ul> </ul>
@ -101,39 +110,48 @@
<div class="projects"> <div class="projects">
{{#if (or searchInput (not clusterEntry)) }} {{#if (or searchInput (not clusterEntry)) }}
<label>{{t 'nav.projectDropdown.projects'}}</label> <label class="acc-label">
{{t "nav.projectDropdown.projects"}}
</label>
{{else}} {{else}}
<label>{{t 'nav.projectDropdown.projectsIn' cluster=clusterEntry.cluster.displayName}}</label> <label class="acc-label">
{{t "nav.projectDropdown.projectsIn" cluster=clusterEntry.cluster.displayName}}
</label>
{{/if}} {{/if}}
<ul class="list-unstyled" style="{{columnStyle}}"> <ul class="list-unstyled" style="{{columnStyle}}">
{{#if searchInput}} {{#if searchInput}}
{{#each projectSearchResults as |entry|}} {{#each projectSearchResults as |entry|}}
<li class="item clip project {{unless entry.project.isReady 'not-ready'}}"> <li class="item clip project {{unless entry.project.isReady "not-ready"}}">
{{#link-to {{#link-to
'authenticated.project' "authenticated.project"
entry.project.id entry.project.id
class="top" class="top"
}} }}
{{entry.searchMatch}} {{entry.searchMatch}}
{{/link-to}} {{/link-to}}
<p class="state"> <p class="state">
{{t 'nav.projectDropdown.projectInCluster' cluster=entry.cluster.displayName}} {{t "nav.projectDropdown.projectInCluster" cluster=entry.cluster.displayName}}
{{~#unless entry.project.isReady~}} {{~#unless entry.project.isReady~}}
, {{t 'nav.projectDropdown.projectNotReady'}} , {{t "nav.projectDropdown.projectNotReady"}}
{{/unless}} {{/unless}}
</p> </p>
</li> </li>
{{else}} {{else}}
<li class="text-muted p-10">{{t 'nav.projectDropdown.projectsNoMatch' searchInput=searchInput}}</li> <li class="text-muted p-10">
{{t "nav.projectDropdown.projectsNoMatch" searchInput=searchInput}}
</li>
{{/each}} {{/each}}
{{else if clusterEntry}} {{else if clusterEntry}}
{{#each clusterEntry.projects as |project|}} {{#each clusterEntry.projects as |project|}}
<li data-project-id={{project.id}} class="item clip project {{unless project.isReady 'not-ready'}} {{if project.active 'active' 'inactive'}}"> <li
data-project-id={{project.id}}
class="item clip project {{unless project.isReady "not-ready"}} {{if project.active "active" "inactive"}}"
>
{{#link-to {{#link-to
'authenticated.project' "authenticated.project"
project.id project.id
class="top" class="top"
}} }}
{{project.displayName}} {{project.displayName}}
{{/link-to}} {{/link-to}}
@ -141,15 +159,19 @@
{{#if project.isReady}} {{#if project.isReady}}
{{project.displayState}} {{project.displayState}}
{{else}} {{else}}
{{t 'nav.projectDropdown.projectNotReady'}} {{t "nav.projectDropdown.projectNotReady"}}
{{/if}} {{/if}}
</p> </p>
</li> </li>
{{else}} {{else}}
<li class="text-muted p-10">{{t 'nav.projectDropdown.projectNoData'}}</li> <li class="text-muted p-10">
{{t "nav.projectDropdown.projectNoData"}}
</li>
{{/each}} {{/each}}
{{else}} {{else}}
<li class="text-muted p-10">{{t 'nav.projectDropdown.projectsNoData'}}</li> <li class="text-muted p-10">
{{t "nav.projectDropdown.projectsNoData"}}
</li>
{{/if}} {{/if}}
</ul> </ul>
</div> </div>

View File

@ -147,32 +147,28 @@
<li> <li>
{{#link-to "authenticated.apikeys"}} {{#link-to "authenticated.apikeys"}}
<span>{{t "nav.api.link"}}</span> <span>{{t "nav.api.link"}}</span>
<i class="icon icon-key icon-fw"/>{{/link-to}} {{/link-to}}
</li> </li>
<li> <li>
{{#link-to "global-admin.security.cloud-credentials"}} {{#link-to "global-admin.security.cloud-credentials"}}
<span>{{t "nav.admin.security.cloudCredentials"}}</span> <span>{{t "nav.admin.security.cloudCredentials"}}</span>
<i class="icon icon-secrets icon-fw"/>
{{/link-to}} {{/link-to}}
</li> </li>
<li> <li>
{{#link-to "nodes.node-templates"}} {{#link-to "nodes.node-templates"}}
<span>{{t "nav.nodeTemplates.link"}}</span> <span>{{t "nav.nodeTemplates.link"}}</span>
<i class="icon icon-host icon-fw"/>
{{/link-to}} {{/link-to}}
</li> </li>
<li role="separator" class="divider"></li> <li role="separator" class="divider"></li>
<li> <li>
{{#link-to "authenticated.prefs"}} {{#link-to "authenticated.prefs"}}
<span>{{t "nav.userPreferences.link"}}</span> <span>{{t "nav.userPreferences.link"}}</span>
<i class="icon icon-gear icon-fw"/>
{{/link-to}} {{/link-to}}
</li> </li>
<li role="separator" class="divider"></li> <li role="separator" class="divider"></li>
<li> <li>
{{#link-to "logout" class="user-logout"}} {{#link-to "logout" class="user-logout"}}
<span>{{t "nav.user.logout"}}</span> <span>{{t "nav.user.logout"}}</span>
<i class="icon icon-logout icon-fw"/>
{{/link-to}} {{/link-to}}
</li> </li>
{{/dd.content}} {{/dd.content}}

View File

@ -40,7 +40,6 @@ const rootNav = [
{ {
id: 'infra-certificates', id: 'infra-certificates',
localizedLabel: 'nav.infra.certificates', localizedLabel: 'nav.infra.certificates',
icon: 'icon icon-certificate',
route: 'authenticated.project.certificates', route: 'authenticated.project.certificates',
ctx: [getProjectId], ctx: [getProjectId],
resource: ['certificate'], resource: ['certificate'],
@ -49,7 +48,6 @@ const rootNav = [
{ {
id: 'infra-config-maps', id: 'infra-config-maps',
localizedLabel: 'nav.infra.configMaps', localizedLabel: 'nav.infra.configMaps',
icon: 'icon icon-file',
route: 'authenticated.project.config-maps', route: 'authenticated.project.config-maps',
ctx: [getProjectId], ctx: [getProjectId],
resource: ['configmap'], resource: ['configmap'],
@ -58,7 +56,6 @@ const rootNav = [
{ {
id: 'infra-registries', id: 'infra-registries',
localizedLabel: 'nav.infra.registries', localizedLabel: 'nav.infra.registries',
icon: 'icon icon-database',
route: 'authenticated.project.registries', route: 'authenticated.project.registries',
ctx: [getProjectId], ctx: [getProjectId],
resource: ['dockercredential'], resource: ['dockercredential'],
@ -67,7 +64,6 @@ const rootNav = [
{ {
id: 'infra-secrets', id: 'infra-secrets',
localizedLabel: 'nav.infra.secrets', localizedLabel: 'nav.infra.secrets',
icon: 'icon icon-secrets',
route: 'authenticated.project.secrets', route: 'authenticated.project.secrets',
ctx: [getProjectId], ctx: [getProjectId],
resource: ['namespacedsecret', 'secret'], resource: ['namespacedsecret', 'secret'],
@ -88,7 +84,6 @@ const rootNav = [
scope: 'project', scope: 'project',
id: 'project-security-roles', id: 'project-security-roles',
localizedLabel: 'nav.infra.members', localizedLabel: 'nav.infra.members',
icon: 'icon icon-users',
route: 'authenticated.project.security.members', route: 'authenticated.project.security.members',
resource: ['projectroletemplatebinding'], resource: ['projectroletemplatebinding'],
resourceScope: 'global', resourceScope: 'global',
@ -111,6 +106,14 @@ const rootNav = [
ctx: [getProjectId], ctx: [getProjectId],
resourceScope: 'global', resourceScope: 'global',
}, },
{
id: 'manage-catalogs',
localizedLabel: 'nav.tools.catalogs',
route: 'authenticated.project.project-catalogs',
ctx: [getProjectId],
resource: ['catalog', 'project-catalog'],
resourceScope: 'global',
},
{ {
id: 'tools-logging', id: 'tools-logging',
localizedLabel: 'nav.tools.logging', localizedLabel: 'nav.tools.logging',
@ -194,20 +197,10 @@ const rootNav = [
resource: ['project'], resource: ['project'],
resourceScope: 'global', resourceScope: 'global',
}, },
{
scope: 'cluster',
id: 'cluster-catalogs',
localizedLabel: 'nav.admin.catalogs',
route: 'authenticated.cluster.cluster-catalogs',
ctx: [getClusterId],
resource: ['catalog', 'cluster-catalog'],
resourceScope: 'global',
},
{ {
scope: 'cluster', scope: 'cluster',
id: 'cluster-security-roles', id: 'cluster-security-roles',
localizedLabel: 'nav.cluster.members', localizedLabel: 'nav.cluster.members',
icon: 'icon icon-users',
route: 'authenticated.cluster.security.members.index', route: 'authenticated.cluster.security.members.index',
resource: ['clusterroletemplatebinding'], resource: ['clusterroletemplatebinding'],
resourceScope: 'global', resourceScope: 'global',
@ -225,7 +218,6 @@ const rootNav = [
{ {
id: 'cluster-tools-alert', id: 'cluster-tools-alert',
localizedLabel: 'nav.tools.alerts', localizedLabel: 'nav.tools.alerts',
// icon: 'icon icon-key',
route: 'authenticated.cluster.alert', route: 'authenticated.cluster.alert',
resourceScope: 'global', resourceScope: 'global',
resource: [], resource: [],
@ -242,6 +234,15 @@ const rootNav = [
return get(this, 'cluster.rancherKubernetesEngineConfig') return get(this, 'cluster.rancherKubernetesEngineConfig')
} }
}, },
{
scope: 'cluster',
id: 'cluster-catalogs',
localizedLabel: 'nav.admin.catalogs',
route: 'authenticated.cluster.cluster-catalogs',
ctx: [getClusterId],
resource: ['catalog', 'cluster-catalog'],
resourceScope: 'global',
},
{ {
id: 'cluster-tools-notifiers', id: 'cluster-tools-notifiers',
localizedLabel: 'nav.tools.notifiers', localizedLabel: 'nav.tools.notifiers',
@ -280,18 +281,10 @@ const rootNav = [
}, },
{ {
scope: 'global', scope: 'global',
id: 'nodes-node-drivers', id: 'multi-cluster-apps',
localizedLabel: 'nav.admin.drivers', localizedLabel: 'nav.admin.multiClusterApps',
route: 'nodes.custom-drivers', route: 'global-admin.multi-cluster-apps',
resource: ['nodedriver', 'kontainerdriver'], resource: ['multiclusterapp'],
resourceScope: 'global',
},
{
scope: 'global',
id: 'global-catalogs',
localizedLabel: 'nav.admin.catalogs',
route: 'global-admin.catalog',
resource: ['catalog'],
resourceScope: 'global', resourceScope: 'global',
}, },
{ {
@ -318,7 +311,6 @@ const rootNav = [
{ {
id: 'global-security-roles', id: 'global-security-roles',
localizedLabel: 'nav.admin.security.roles', localizedLabel: 'nav.admin.security.roles',
icon: 'icon icon-users',
route: 'global-admin.security.roles', route: 'global-admin.security.roles',
resource: ['roletemplate'], resource: ['roletemplate'],
resourceScope: 'global', resourceScope: 'global',
@ -326,7 +318,6 @@ const rootNav = [
{ {
id: 'global-security-roles', id: 'global-security-roles',
localizedLabel: 'nav.admin.security.podSecurityPolicies', localizedLabel: 'nav.admin.security.podSecurityPolicies',
icon: 'icon icon-files',
route: 'global-admin.security.policies', route: 'global-admin.security.policies',
resource: ['podsecuritypolicytemplate'], resource: ['podsecuritypolicytemplate'],
resourceScope: 'global', resourceScope: 'global',
@ -334,7 +325,6 @@ const rootNav = [
{ {
id: 'global-security-authentication', id: 'global-security-authentication',
localizedLabel: 'nav.admin.security.authentication', localizedLabel: 'nav.admin.security.authentication',
icon: 'icon icon-users',
route: 'global-admin.security.authentication', route: 'global-admin.security.authentication',
condition() { condition() {
const authConfigs = this.get('globalStore').all('authConfig'); const authConfigs = this.get('globalStore').all('authConfig');
@ -349,11 +339,26 @@ const rootNav = [
id: 'global-tools', id: 'global-tools',
localizedLabel: 'nav.tools.tab', localizedLabel: 'nav.tools.tab',
submenu: [ submenu: [
{
scope: 'global',
id: 'global-catalogs',
localizedLabel: 'nav.admin.catalogs',
route: 'global-admin.catalog',
resource: ['catalog'],
resourceScope: 'global',
},
{
scope: 'global',
id: 'nodes-node-drivers',
localizedLabel: 'nav.admin.drivers',
route: 'nodes.custom-drivers',
resource: ['nodedriver', 'kontainerdriver'],
resourceScope: 'global',
},
{ {
id: 'global-dns-entries', id: 'global-dns-entries',
localizedLabel: 'nav.admin.globalDnsEntries', localizedLabel: 'nav.admin.globalDnsEntries',
route: 'global-admin.global-dns.entries', route: 'global-admin.global-dns.entries',
icon: 'icon icon-network',
resource: ['globaldns'], resource: ['globaldns'],
resourceScope: 'global', resourceScope: 'global',
}, },
@ -361,19 +366,9 @@ const rootNav = [
id: 'global-dns-providers', id: 'global-dns-providers',
localizedLabel: 'nav.admin.globalDnsProviders', localizedLabel: 'nav.admin.globalDnsProviders',
route: 'global-admin.global-dns.providers', route: 'global-admin.global-dns.providers',
icon: 'icon icon-globe',
resource: ['globaldnsprovider'], resource: ['globaldnsprovider'],
resourceScope: 'global', resourceScope: 'global',
}, },
{
scope: 'global',
id: 'multi-cluster-apps',
localizedLabel: 'nav.admin.multiClusterApps',
route: 'global-admin.multi-cluster-apps',
icon: 'icon icon-catalog',
resource: ['multiclusterapp'],
resourceScope: 'global',
},
], ],
}, },
// { // {

View File

@ -7011,8 +7011,8 @@ nav:
library: Library library: Library
community: Community community: Community
apps: apps:
tab: Catalog Apps tab: Apps
apps: Catalog Apps apps: Apps
launch: Launch launch: Launch
manage: Manage Catalogs manage: Manage Catalogs
infra: infra:
@ -7033,7 +7033,7 @@ nav:
globalDns: Global DNS globalDns: Global DNS
globalDnsEntries: Global DNS Entries globalDnsEntries: Global DNS Entries
globalDnsProviders: Global DNS Providers globalDnsProviders: Global DNS Providers
multiClusterApps: Multi-Cluster Apps multiClusterApps: Apps
security: security:
cloudCredentials: Cloud Credentials cloudCredentials: Cloud Credentials
tab: Security tab: Security
@ -7061,6 +7061,7 @@ nav:
tools: tools:
alerts: Alerts alerts: Alerts
backups: Snapshots backups: Snapshots
catalogs: Catalogs
logging: Logging logging: Logging
monitoring: Monitoring monitoring: Monitoring
notifiers: Notifiers notifiers: Notifiers