ClusterCockpit/cc-backend
1
0
Fork 0
mirror of https://github.com/ClusterCockpit/cc-backend synced 2026-01-15 17:21:46 +01:00
Code Issues Packages Releases Activity

adapt frontend to backend config changes, clarify variable names

Browse Source
This commit is contained in:
Christoph Kluge
2026-01-14 11:25:40 +01:00
parent 0ea0270fe1
commit 4cb8d648cb
9 changed files with 58 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/frontend/src/Config.root.svelte
View File

@@ -7,7 +7,7 @@
- `isApi Bool!`: Is currently logged in user api authority
- `username String!`: Empty string if auth. is disabled, otherwise the username as string
- `ncontent String!`: The currently displayed message on the homescreen
- `clusters [String]`: The available clusternames
- `clusterNames [String]`: The available clusternames
-->
<script>
@@ -23,7 +23,7 @@
isApi,
username,
ncontent,
clusters
clusterNames
} = $props();
</script>
@@ -32,7 +32,7 @@
<CardHeader>
<CardTitle class="mb-1">Admin Options</CardTitle>
</CardHeader>
<AdminSettings {ncontent} {clusters}/>
<AdminSettings {ncontent} {clusterNames}/>
</Card>
{/if}

36
web/frontend/src/Header.svelte
View File

@@ -4,8 +4,8 @@
Properties:
- `username String`: Empty string if auth. is disabled, otherwise the username as string
- `authlevel Number`: The current users authentication level
- `clusters [String]`: List of cluster names
- `subClusters [String]`: List of subCluster names
- `clusterNames [String]`: List of cluster names
- `subclusterMap map[String][]string`: Map of subclusters by cluster names
- `roles [Number]`: Enum containing available roles
-->
@@ -28,8 +28,8 @@
let {
username,
authlevel,
clusters,
subClusters,
clusterNames,
subclusterMap,
roles
} = $props();
@@ -152,15 +152,15 @@
<Nav navbar>
{#if showMax || showBrg}
<NavbarLinks
{clusters}
{subClusters}
{clusterNames}
{subclusterMap}
links={views.filter((item) => item.requiredRole <= authlevel)}
/>
{:else if showMid}
<NavbarLinks
{clusters}
{subClusters}
{clusterNames}
{subclusterMap}
links={views.filter(
(item) => item.requiredRole <= authlevel && item.menu != "Info",
)}
@@ -173,8 +173,8 @@
</DropdownToggle>
<DropdownMenu class="dropdown-menu-lg-end">
<NavbarLinks
{clusters}
{subClusters}
{clusterNames}
{subclusterMap}
direction="right"
links={views.filter(
(item) =>
@@ -187,8 +187,8 @@
{:else if showSml}
<NavbarLinks
{clusters}
{subClusters}
{clusterNames}
{subclusterMap}
links={views.filter(
(item) => item.requiredRole <= authlevel && item.menu == "none",
)}
@@ -200,8 +200,8 @@
</DropdownToggle>
<DropdownMenu class="dropdown-menu-lg-end">
<NavbarLinks
{clusters}
{subClusters}
{clusterNames}
{subclusterMap}
direction="right"
links={views.filter(
(item) => item.requiredRole <= authlevel && item.menu == 'Jobs',
@@ -217,8 +217,8 @@
</DropdownToggle>
<DropdownMenu class="dropdown-menu-lg-end">
<NavbarLinks
{clusters}
{subClusters}
{clustersNames}
{subclusterMap}
direction="right"
links={views.filter(
(item) => item.requiredRole <= authlevel && item.menu == 'Groups',
@@ -234,8 +234,8 @@
</DropdownToggle>
<DropdownMenu class="dropdown-menu-lg-end">
<NavbarLinks
{clusters}
{subClusters}
{clusterNames}
{subclusterMap}
direction="right"
links={views.filter(
(item) => item.requiredRole <= authlevel && item.menu == 'Info',

2
web/frontend/src/config.entrypoint.js
View File

@@ -10,7 +10,7 @@ mount(Config, {
isApi: isApi,
username: username,
ncontent: ncontent,
clusters: hClusters.map((c) => c.name) // Defined in Header Template
clusterNames: hClusterNames
},
context: new Map([
['cc-config', clusterCockpitConfig],

6
web/frontend/src/config/AdminSettings.svelte
View File

@@ -3,7 +3,7 @@
Properties:
- `ncontent String`: The homepage notice content
- `clusters [String]`: The available clusternames
- `clusterNames [String]`: The available clusternames
-->
<script>
@@ -19,7 +19,7 @@
/* Svelte 5 Props */
let {
ncontent,
clusters
clusterNames
} = $props();
/* Const Init*/
@@ -68,6 +68,6 @@
<Col>
<EditProject reloadUser={() => getUserList()} />
</Col>
<Options config={ccconfig} {clusters}/>
<Options config={ccconfig} {clusterNames}/>
<NoticeEdit {ncontent}/>
</Row>

12
web/frontend/src/config/admin/Options.svelte
View File

@@ -2,7 +2,7 @@
@component Admin option select card
Properties:
- `clusters [String]`: The available clusternames
- `clusterNames [String]`: The available clusternames
-->
<script>
@@ -11,7 +11,7 @@
/* Svelte 5 Props */
let {
clusters,
clusterNames,
} = $props();
/*Const Init */
@@ -52,17 +52,17 @@
</Card>
</Col>
{#if clusters?.length > 0}
{#if clusterNames?.length > 0}
<Col>
<Card class="h-100">
<CardBody>
<CardTitle class="mb-3">Public Dashboard Links</CardTitle>
<Row>
{#each clusters as cluster}
{#each clusterNames as cn}
<Col>
<Button color="info" class="mb-2 mb-xl-0" href={`/monitoring/dashboard/${cluster}`} target="_blank">
<Button color="info" class="mb-2 mb-xl-0" href={`/monitoring/dashboard/${cn}`} target="_blank">
<Icon name="clipboard-pulse" class="mr-2"/>
{cluster.charAt(0).toUpperCase() + cluster.slice(1)} Public Dashboard
{cn.charAt(0).toUpperCase() + cn.slice(1)} Public Dashboard
</Button>
</Col>
{/each}

20
web/frontend/src/generic/filters/Resources.svelte
View File

@@ -76,7 +76,7 @@
/* State Init*/
// Counts
let minNumNodes = $state(1);
let maxNumNodes = $state(0);
let maxNumNodes = $state(128);
let maxNumHWThreads = $state(0);
let maxNumAccelerators = $state(0);
// Pending
@@ -107,24 +107,6 @@
/* Reactive Effects | Svelte 5 onMount */
$effect(() => {
if ($initialized) {
// 'hClusters' defined in templates/base.tmpl
if (activeCluster != null) {
const { filterRanges } = hClusters.find((c) => c.name == activeCluster);
minNumNodes = filterRanges.numNodes.from;
maxNumNodes = filterRanges.numNodes.to;
} else if (clusters.length > 0) {
for (let hc of hClusters) {
const { filterRanges } = hc;
minNumNodes = Math.min(minNumNodes, filterRanges.numNodes.from);
maxNumNodes = Math.max(maxNumNodes, filterRanges.numNodes.to);
};
};
};
});
$effect(() => {
if ($initialized) {
// 'hClusters' defined in templates/base.tmpl
if (activeCluster != null) {
const { subClusters } = clusters.find((c) => c.name == activeCluster);
maxNumAccelerators = findMaxNumAccels([{ subClusters }]);

4
web/frontend/src/header.entrypoint.js
View File

@@ -9,8 +9,8 @@ if (headerDomTarget != null) {
props: {
username: hUsername,
authlevel: hAuthlevel,
clusters: hClusters,
subClusters: hSubClusters,
clusterNames: hClusterNames,
subclusterMap: hSubclusterMap,
roles: hRoles,
},
});

44
web/frontend/src/header/NavbarLinks.svelte
View File

@@ -2,8 +2,8 @@
@component Navbar component; renders in app navigation links as received from upstream
Properties:
- `clusters [String]`: List of cluster names
- `subClusters map[String][]string`: Map of subclusters by cluster names
- `clusterNames [String]`: List of cluster names
- `subclusterMap map[String][]string`: Map of subclusters by cluster names
- `links [Object]`: Pre-filtered link objects based on user auth
- `direction String?`: The direcion of the drop-down menue [default: down]
-->
@@ -20,8 +20,8 @@
/* Svelte 5 Props */
let {
clusters,
subClusters,
clusterNames,
subclusterMap,
links,
direction = "down"
} = $props();
@@ -36,25 +36,25 @@
{item.title}
</DropdownToggle>
<DropdownMenu class="dropdown-menu-lg-end">
{#each clusters as cluster}
{#each clusterNames as cn}
<Dropdown nav direction="right">
<DropdownToggle nav caret class="dropdown-item py-1 px-2">
{cluster.name}
{cn}
</DropdownToggle>
<DropdownMenu>
<DropdownItem class="py-1 px-2"
href={item.href + cluster.name}
href={item.href + cn}
>
Node Overview
</DropdownItem>
<DropdownItem class="py-1 px-2"
href={item.href + 'list/' + cluster.name}
href={`${item.href}list/${cn}`}
>
Node List
</DropdownItem>
{#each subClusters[cluster.name] as subCluster}
{#each subclusterMap[cn] as scn}
<DropdownItem class="py-1 px-2"
href={item.href + 'list/' + cluster.name + '/' + subCluster}
href={`${item.href}list/${cn}/${scn}`}
>
{subCluster} Node List
</DropdownItem>
@@ -71,19 +71,19 @@
{item.title}
</DropdownToggle>
<DropdownMenu class="dropdown-menu-lg-end">
{#each clusters as cluster}
{#each clusterNames as cn}
<Dropdown nav direction="right">
<DropdownToggle nav caret class="dropdown-item py-1 px-2">
{cluster.name}
{cn}
</DropdownToggle>
<DropdownMenu>
<DropdownItem class="py-1 px-2"
href={item.href + cluster.name}
href={item.href + cn}
>
Status Dashboard
</DropdownItem>
<DropdownItem class="py-1 px-2"
href={item.href + 'detail/' + cluster.name}
href={`${item.href}detail/${cn}`}
>
Status Details
</DropdownItem>
@@ -105,19 +105,19 @@
All Clusters
</DropdownItem>
<DropdownItem divider />
{#each clusters as cluster}
{#each clusterNames as cn}
<Dropdown nav direction="right">
<DropdownToggle nav caret class="dropdown-item py-1 px-2">
{cluster.name}
{cn}
</DropdownToggle>
<DropdownMenu>
<DropdownItem class="py-1 px-2"
href={item.href + '?cluster=' + cluster.name}
href={`${item.href}?cluster=${cn}`}
>
All Jobs
</DropdownItem>
<DropdownItem class="py-1 px-2"
href={item.href + '?cluster=' + cluster.name + '&state=running'}
href={`${item.href}?cluster=${cn}&state=running`}
>
Running Jobs
</DropdownItem>
@@ -138,12 +138,12 @@
{item.title}
</DropdownToggle>
<DropdownMenu class="dropdown-menu-lg-end">
{#each clusters as cluster}
{#each clusterNames as cn}
<DropdownItem
href={item.href + cluster.name}
active={window.location.pathname == item.href + cluster.name}
href={item.href + cn}
active={window.location.pathname == item.href + cn}
>
{cluster.name}
{cn}
</DropdownItem>
{/each}
</DropdownMenu>

4
web/templates/base.tmpl
View File

@@ -17,8 +17,8 @@
// Used for header.entrypoint.js mount and filters/Resources.svelte
const hUsername = {{ .User.Username }};
const hAuthlevel = {{ .User.GetAuthLevel }};
const hClusters = {{ .Clusters }};
const hSubClusters = {{ .SubClusters }};
const hClusterNames = {{ .Clusters }};
const hSubclusterMap = {{ .SubClusters }};
const hRoles = {{ .Roles }};
</script>
</head>