Customizing the Left Navigation

This guide explains how to customize the Administrator view and Projects view left navigation by modifying custom-navconfig-platform and custom-navconfig-project ConfigMaps.


TOC

Where to configure

In the cpaas-system namespace of the global cluster, you can find:

  • custom-navconfig-platform: for Administrator view navigation customization
  • custom-navconfig-project: for Projects view navigation customization

Basic operation example

Example: Hide the Licenses menu

To hide Licenses in the Administrator view, add the following to custom-navconfig-platform:

apiVersion: v1
data:
  buildIn: |
    {
      "license_manage": {
        "hidden": true
      }
    }
kind: ConfigMap
metadata:
  name: custom-navconfig-platform
  namespace: cpaas-system

Field description

  • buildIn: Modifies built-in navigation.
  • license_manage: The Licenses menu.
  • hidden: true: Hides this navigation item.

Refresh your browser to see changes after editing.


Supported customization capabilities

You can:

  • Hide navigation items
  • Add custom top-level navigation
  • Modify navigation labels
  • Modify navigation icons

Example configuration:

apiVersion: v1
kind: ConfigMap
metadata:
  name: custom-navconfig-platform
  namespace: cpaas-system
data:
  buildIn: |
    {
      "<name>": {
        "label": "<Example Name>",
        "hidden": true
      }
    }
  customs: |
    [
      {
        "label": "<Example>",
        "iconData": "<Base64 encoded icon>",
        "hidden": false,
        "href": "http://www.example.com"
      }
    ]

Reference

The following YAML illustrates the navigation structure syntax with comments to guide users on how to write and understand navigation configurations:

- name: cluster         # Top-level navigation name. If no translation is available, this name is displayed.
  icon: basic:server_s  # (Optional) Navigation icon.
  children:
    - name: cluster     # Sub-navigation name. Displays as is if no translation exists.
      href: cluster     # Navigation link. Use absolute URLs (http:// or https://) for non-platform functions.
    - name: resource_management
      href: resource_management

# If there is no `children` field, you can define direct links, for example:
- name: notification    # Top-level navigation name
  icon: basic:notice_s  # (Optional) Icon
  href: notification    # Navigation link, can be an internal route or external URL
  label: Notification    # (Optional) Display label; if set, this overrides translation
  gate: notification    # (Optional) Feature flag controlling display visibility
  • name: Unique identifier for navigation. Displays as is if no translation is found.
  • icon: Optional navigation icon.
  • children: List of sub-navigation items.
  • href: Route path or external URL.
  • label: Optional display label that overrides the default translation.
  • gate: Optional feature flag that controls whether this navigation item is displayed.

Default left navigation

Below are the full name, href, gate, and structure references for direct copy and modification.

Administrator view

# Clusters
- name: cluster_management
  icon: server
  children:
    # Clusters
    - name: clusters
      href: cluster-management/cluster
    # Cloud Credentials
    - name: cloud_credentials
      href: cluster-management/cloud-credential
    # CRDs
    - name: crds
      href: $cluster/cluster-management/crd
    # Resources
    - name: resource_management
      href: $cluster/cluster-management/resource
      gate: acp-safemode
      negate: true
    # Backup & Recovery
    - name: backup_recover
      gate: backup-recovery
      children:
        - name: backup_manage
          href: $cluster/cluster-management/backup-restore/backup-manage
        - name: restore_manage
          href: $cluster/cluster-management/backup-restore/restore-manage
        - name: backup_warehouse
          href: cluster-management/backup-restore/backup-warehouse
    # Config
    - name: cluster_config_manage
      href: cluster-management/config-manage
      gate: config-manage

# Networking
- name: network_management
  icon: internet
  children:
    # Domains
    - name: domains
      href: network-management/domain
    # Certificates
    - name: certificates
      href: network-management/certificate
    # Subnets
    - name: subnets
      href: $cluster/network-management/subnet
      publicCloud: false
      gate: acp-safemode
      negate: true
    # Bridge Networks
    - name: bridge_network
      href: $cluster/network-management/bridge-network
      publicCloud: false
      gate: acp-safemode
      negate: true
    # VLANs
    - name: vlan
      href: $cluster/network-management/vlan
      publicCloud: false
      gate: acp-safemode
      negate: true
    # Load Balancers
    - name: alb2
      gate: alb2
      href: $cluster/network-management/load-balancer
    # Network Policies
    - name: cluster_network_policy
      href: $cluster/network-management/cluster-network-policy
      gate: cluster-network-policy

# Storage
- name: storage_management
  icon: storage
  children:
    # StorageClasses
    - name: storageclasses
      href: $cluster/storage-management/storageclass
    # PersistentVolumes
    - name: nav_pv
      href: $cluster/storage-management/pv
    # Object StorageClass
    - name: object_storage_class
      href: $cluster/storage-management/object-storageclass
      gate: cosi
    # Buckets
    - name: bucket
      href: $cluster/storage-management/bucket
      gate: cosi

# Security Settings
- name: security_setting
  icon: security
  children:
    # Node Isolation Policies
    - name: node_isolation_policy
      href: $cluster/security-management/node-isolation-policy
      gate: node-isolation

# DevOps Toolchain
- name: toolchain_management
  icon: devops_tools
  gate: katanomi
  href: /console-devops/platform/integration
# Pipelines
- name: pipeline_management
  icon: pipeline
  gate: katanomi
  href: /console-devops/platform/jenkins-custom-template

# Certificates
- name: platform_certificate_manage
  icon: certificate
  href: certificate
  gate: legacy-certificate-manage

# System Settings
- name: platform_setting
  icon: platform_settings
  children:
    # Licenses
    - name: license_manage
      href: platform-setting/license
      gate: license-manage
    # Platform Parameters
    - name: platform_parameters
      href: platform-setting/params
    # Login Page
    - name: login_page
      href: platform-setting/login-page
    # Portal
    - name: portal
      href: platform-setting/portal
    # Logo
    - name: logo
      href: platform-setting/logo
    # Regions
    - name: manage_region
      href: platform-setting/manage-region
    # Platform Maintenance
    - name: platform_ops
      href: platform-setting/online-ops

Projects view

# Overview
- name: project_overview
  icon: bar_chart
  href: overview

# Details
- name: project_detail
  icon: project
  href: detail

# Members
- name: project_member
  icon: member
  href: member

# DevOps Toolchain
- name: toolchain_management
  icon: devops_tools
  gate: katanomi
  href: /console-devops/project/$project/integration
# Pipelines
- name: pipeline_management
  icon: pipeline
  gate: katanomi
  href: /console-devops/project/$project/source-management