Compare commits
12 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 375132bdc3 | |||
| 0b5ca61785 | |||
| 300c705033 | |||
| ea587c149f | |||
| 4468396e52 | |||
| ead81a51a9 | |||
| 8e0b95ed64 | |||
| e54caa7be4 | |||
| b77ecf66e7 | |||
| c30fc18b43 | |||
| 91e50fc316 | |||
| 7860778920 |
@@ -0,0 +1,3 @@
|
||||
module.exports = {
|
||||
extends: ['@headlamp-k8s/eslint-config'],
|
||||
};
|
||||
@@ -37,7 +37,7 @@ jobs:
|
||||
- name: Update artifacthub-pkg.yml version and URL
|
||||
run: |
|
||||
VERSION="${{ inputs.version }}"
|
||||
RELEASE_URL="https://github.com/${{ github.repository }}/releases/download/v${VERSION}/headlamp-rook-ceph-plugin-${VERSION}.tar.gz"
|
||||
RELEASE_URL="https://github.com/${{ github.repository }}/releases/download/v${VERSION}/headlamp-rook-plugin-${VERSION}.tar.gz"
|
||||
|
||||
sed -i "s|^version:.*|version: \"${VERSION}\"|" artifacthub-pkg.yml
|
||||
sed -i "s|headlamp/plugin/archive-url:.*|headlamp/plugin/archive-url: \"${RELEASE_URL}\"|" artifacthub-pkg.yml
|
||||
@@ -59,7 +59,7 @@ jobs:
|
||||
|
||||
- name: Validate tarball name
|
||||
run: |
|
||||
EXPECTED="headlamp-rook-ceph-plugin-${{ inputs.version }}.tar.gz"
|
||||
EXPECTED="headlamp-rook-plugin-${{ inputs.version }}.tar.gz"
|
||||
ACTUAL=$(ls *.tar.gz)
|
||||
if [ "$EXPECTED" != "$ACTUAL" ]; then
|
||||
echo "::error::Tarball name mismatch! Expected: $EXPECTED, Got: $ACTUAL"
|
||||
@@ -70,7 +70,7 @@ jobs:
|
||||
- name: Compute checksum
|
||||
id: compute_checksum
|
||||
run: |
|
||||
TARBALL="headlamp-rook-ceph-plugin-${{ inputs.version }}.tar.gz"
|
||||
TARBALL="headlamp-rook-plugin-${{ inputs.version }}.tar.gz"
|
||||
CHECKSUM=$(sha256sum "$TARBALL" | awk '{print $1}')
|
||||
echo "checksum=${CHECKSUM}" >> $GITHUB_OUTPUT
|
||||
echo "Checksum: sha256:${CHECKSUM}"
|
||||
@@ -95,7 +95,7 @@ jobs:
|
||||
uses: softprops/action-gh-release@v2
|
||||
with:
|
||||
tag_name: "v${{ inputs.version }}"
|
||||
files: headlamp-rook-ceph-plugin-${{ inputs.version }}.tar.gz
|
||||
files: headlamp-rook-plugin-${{ inputs.version }}.tar.gz
|
||||
fail_on_unmatched_files: true
|
||||
draft: false
|
||||
prerelease: false
|
||||
|
||||
+31
-3
@@ -1,12 +1,36 @@
|
||||
# Changelog
|
||||
|
||||
All notable changes to the Headlamp Rook-Ceph Plugin will be documented in this file.
|
||||
All notable changes to the Headlamp Rook Plugin will be documented in this file.
|
||||
|
||||
The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
|
||||
and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
|
||||
|
||||
## [Unreleased]
|
||||
|
||||
## [0.2.0] - 2026-02-19
|
||||
|
||||
### Changed
|
||||
|
||||
- **Rename** — plugin renamed from `headlamp-rook-ceph-plugin` to `headlamp-rook-plugin`
|
||||
|
||||
## [0.1.3] - 2026-02-19
|
||||
|
||||
### Fixed
|
||||
|
||||
- **Protocol column** — renamed `Type` → `Protocol` with short values (`RBD`, `CephFS`) to match tns-csi column naming convention on shared native tables
|
||||
|
||||
## [0.1.2] - 2026-02-19
|
||||
|
||||
### Fixed
|
||||
|
||||
- **Column naming** — renamed `Rook Type` → `Type` and `Cluster ID` → `Cluster` in StorageClass and PV column processors
|
||||
|
||||
## [0.1.1] - 2026-02-19
|
||||
|
||||
### Fixed
|
||||
|
||||
- **StorageClass/PV column injection** — removed redundant `Rook Type` label prefix; standardized column headers across plugins
|
||||
|
||||
## [0.1.0] - 2026-02-18
|
||||
|
||||
### Added
|
||||
@@ -32,5 +56,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||
- TypeScript strict mode with zero `any` types
|
||||
- ESLint + Prettier code quality tooling
|
||||
|
||||
[Unreleased]: https://github.com/cpfarhood/headlamp-rook-ceph-plugin/compare/v0.1.0...HEAD
|
||||
[0.1.0]: https://github.com/cpfarhood/headlamp-rook-ceph-plugin/releases/tag/v0.1.0
|
||||
[Unreleased]: https://github.com/cpfarhood/headlamp-rook-plugin/compare/v0.2.0...HEAD
|
||||
[0.2.0]: https://github.com/cpfarhood/headlamp-rook-plugin/compare/v0.1.3...v0.2.0
|
||||
[0.1.3]: https://github.com/cpfarhood/headlamp-rook-plugin/compare/v0.1.2...v0.1.3
|
||||
[0.1.2]: https://github.com/cpfarhood/headlamp-rook-plugin/compare/v0.1.1...v0.1.2
|
||||
[0.1.1]: https://github.com/cpfarhood/headlamp-rook-plugin/compare/v0.1.0...v0.1.1
|
||||
[0.1.0]: https://github.com/cpfarhood/headlamp-rook-plugin/releases/tag/v0.1.0
|
||||
|
||||
@@ -6,7 +6,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
|
||||
|
||||
Headlamp plugin for Rook-Ceph cluster visibility.
|
||||
|
||||
- **Plugin name**: `headlamp-rook-ceph-plugin`
|
||||
- **Plugin name**: `headlamp-rook-plugin`
|
||||
- **Rook-Ceph API group**: `ceph.rook.io/v1`
|
||||
- **Default namespace**: `rook-ceph`
|
||||
- **Reference plugin**: `../headlamp-tns-csi-plugin`
|
||||
|
||||
+2
-2
@@ -5,8 +5,8 @@ Contributions are welcome! Please open an issue before submitting large PRs.
|
||||
## Development Setup
|
||||
|
||||
```bash
|
||||
git clone https://github.com/cpfarhood/headlamp-rook-ceph-plugin.git
|
||||
cd headlamp-rook-ceph-plugin
|
||||
git clone https://github.com/cpfarhood/headlamp-rook-plugin.git
|
||||
cd headlamp-rook-plugin
|
||||
npm install
|
||||
npm start # hot-reload dev server
|
||||
```
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
# Headlamp Rook-Ceph Plugin
|
||||
# Headlamp Rook Plugin
|
||||
|
||||
[](https://github.com/cpfarhood/headlamp-rook-ceph-plugin/actions/workflows/ci.yaml)
|
||||
[](https://github.com/cpfarhood/headlamp-rook-plugin/actions/workflows/ci.yaml)
|
||||
[](https://opensource.org/licenses/Apache-2.0)
|
||||
|
||||
A [Headlamp](https://headlamp.dev/) plugin that surfaces [Rook-Ceph](https://rook.io/) cluster health, storage resources, and CSI driver status directly in the Headlamp UI.
|
||||
@@ -53,16 +53,16 @@ Download the latest release tarball and place it in your Headlamp plugins direct
|
||||
|
||||
```bash
|
||||
# Download the latest release
|
||||
curl -L https://github.com/cpfarhood/headlamp-rook-ceph-plugin/releases/latest/download/headlamp-rook-ceph-plugin-<version>.tar.gz \
|
||||
-o headlamp-rook-ceph-plugin.tar.gz
|
||||
curl -L https://github.com/cpfarhood/headlamp-rook-plugin/releases/latest/download/headlamp-rook-plugin-<version>.tar.gz \
|
||||
-o headlamp-rook-plugin.tar.gz
|
||||
|
||||
# Extract to Headlamp plugins directory
|
||||
tar -xzf headlamp-rook-ceph-plugin.tar.gz -C ~/.config/Headlamp/plugins/
|
||||
tar -xzf headlamp-rook-plugin.tar.gz -C ~/.config/Headlamp/plugins/
|
||||
```
|
||||
|
||||
### Option 2: Headlamp In-App Plugin Manager
|
||||
|
||||
Browse the Headlamp Plugin Manager (Settings → Plugins) and install **headlamp-rook-ceph-plugin** directly.
|
||||
Browse the Headlamp Plugin Manager (Settings → Plugins) and install **headlamp-rook-plugin** directly.
|
||||
|
||||
## RBAC & Security Setup
|
||||
|
||||
@@ -117,8 +117,8 @@ subjects:
|
||||
### Setup
|
||||
|
||||
```bash
|
||||
git clone https://github.com/cpfarhood/headlamp-rook-ceph-plugin.git
|
||||
cd headlamp-rook-ceph-plugin
|
||||
git clone https://github.com/cpfarhood/headlamp-rook-plugin.git
|
||||
cd headlamp-rook-plugin
|
||||
npm install
|
||||
```
|
||||
|
||||
|
||||
+1
-1
@@ -8,7 +8,7 @@
|
||||
|
||||
## Reporting a Vulnerability
|
||||
|
||||
Please report security vulnerabilities by opening a [GitHub Security Advisory](https://github.com/cpfarhood/headlamp-rook-ceph-plugin/security/advisories/new) rather than a public issue.
|
||||
Please report security vulnerabilities by opening a [GitHub Security Advisory](https://github.com/cpfarhood/headlamp-rook-plugin/security/advisories/new) rather than a public issue.
|
||||
|
||||
## Scope
|
||||
|
||||
|
||||
+7
-7
@@ -1,12 +1,12 @@
|
||||
version: "0.1.1"
|
||||
name: headlamp-rook-ceph-plugin
|
||||
displayName: Rook-Ceph Plugin
|
||||
version: "0.2.0"
|
||||
name: headlamp-rook-plugin
|
||||
displayName: Rook Plugin
|
||||
createdAt: "2026-02-18T00:00:00Z"
|
||||
description: Headlamp plugin for Rook-Ceph cluster visibility — CephCluster health, pool status, CSI driver monitoring, and native Headlamp StorageClass/PV integrations.
|
||||
logoPath: ""
|
||||
digest: ""
|
||||
license: Apache-2.0
|
||||
homeURL: https://github.com/privilegedescalation/headlamp-rook-ceph-plugin
|
||||
homeURL: https://github.com/privilegedescalation/headlamp-rook-plugin
|
||||
keywords:
|
||||
- rook
|
||||
- ceph
|
||||
@@ -16,14 +16,14 @@ keywords:
|
||||
- kubernetes
|
||||
links:
|
||||
- name: source
|
||||
url: https://github.com/privilegedescalation/headlamp-rook-ceph-plugin
|
||||
url: https://github.com/privilegedescalation/headlamp-rook-plugin
|
||||
maintainers:
|
||||
- name: privilegedescalation
|
||||
email: privilegedescalation@users.noreply.github.com
|
||||
provider:
|
||||
name: privilegedescalation
|
||||
annotations:
|
||||
headlamp/plugin/archive-url: "https://github.com/privilegedescalation/headlamp-rook-ceph-plugin/releases/download/v0.1.1/headlamp-rook-ceph-plugin-0.1.1.tar.gz"
|
||||
headlamp/plugin/archive-checksum: "sha256:642863314b0879233b0341341c59a1d7b979b1668585c3dda1ab54e21e0136a0"
|
||||
headlamp/plugin/archive-url: "https://github.com/privilegedescalation/headlamp-rook-plugin/releases/download/v0.2.0/headlamp-rook-plugin-0.2.0.tar.gz"
|
||||
headlamp/plugin/archive-checksum: "sha256:2ef2efd810a512c13914a9ce74af23f6ec8ab0937d30cac1593a42dce5e9fe17"
|
||||
headlamp/plugin/distro-compat: ""
|
||||
headlamp/plugin/version-compat: ">=0.20"
|
||||
|
||||
Generated
+2
-2
@@ -1,11 +1,11 @@
|
||||
{
|
||||
"name": "headlamp-rook-ceph-plugin",
|
||||
"name": "headlamp-rook-plugin",
|
||||
"version": "0.1.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "headlamp-rook-ceph-plugin",
|
||||
"name": "headlamp-rook-plugin",
|
||||
"version": "0.1.0",
|
||||
"license": "Apache-2.0",
|
||||
"devDependencies": {
|
||||
|
||||
+5
-5
@@ -1,15 +1,15 @@
|
||||
{
|
||||
"name": "headlamp-rook-ceph-plugin",
|
||||
"version": "0.1.1",
|
||||
"name": "headlamp-rook-plugin",
|
||||
"version": "0.2.0",
|
||||
"description": "Headlamp plugin for Rook-Ceph cluster visibility and CSI driver monitoring",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://github.com/privilegedescalation/headlamp-rook-ceph-plugin.git"
|
||||
"url": "https://github.com/privilegedescalation/headlamp-rook-plugin.git"
|
||||
},
|
||||
"bugs": {
|
||||
"url": "https://github.com/privilegedescalation/headlamp-rook-ceph-plugin/issues"
|
||||
"url": "https://github.com/privilegedescalation/headlamp-rook-plugin/issues"
|
||||
},
|
||||
"homepage": "https://github.com/privilegedescalation/headlamp-rook-ceph-plugin#readme",
|
||||
"homepage": "https://github.com/privilegedescalation/headlamp-rook-plugin#readme",
|
||||
"author": "privilegedescalation",
|
||||
"license": "Apache-2.0",
|
||||
"scripts": {
|
||||
|
||||
@@ -18,16 +18,16 @@ import {
|
||||
filterRookCephStorageClasses,
|
||||
isKubeList,
|
||||
ROOK_CEPH_NAMESPACE,
|
||||
RookCephPersistentVolume,
|
||||
RookCephPVC,
|
||||
RookCephPod,
|
||||
RookCephStorageClass,
|
||||
ROOK_CSI_CEPHFS_SELECTOR,
|
||||
ROOK_CSI_RBD_SELECTOR,
|
||||
ROOK_MGR_SELECTOR,
|
||||
ROOK_MON_SELECTOR,
|
||||
ROOK_OSD_SELECTOR,
|
||||
ROOK_OPERATOR_SELECTOR,
|
||||
ROOK_OSD_SELECTOR,
|
||||
RookCephPersistentVolume,
|
||||
RookCephPod,
|
||||
RookCephPVC,
|
||||
RookCephStorageClass,
|
||||
} from './k8s';
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
+4
-4
@@ -1,11 +1,14 @@
|
||||
import { describe, expect, it } from 'vitest';
|
||||
import {
|
||||
filterRookCephPersistentVolumes,
|
||||
filterRookCephPVCs,
|
||||
filterRookCephStorageClasses,
|
||||
formatAge,
|
||||
findBoundPv,
|
||||
formatAccessModes,
|
||||
formatAge,
|
||||
formatBytes,
|
||||
formatStorageType,
|
||||
getPodRestarts,
|
||||
healthToStatus,
|
||||
isKubeList,
|
||||
isPodReady,
|
||||
@@ -17,9 +20,6 @@ import {
|
||||
ROOK_CEPH_CEPHFS_PROVISIONER,
|
||||
ROOK_CEPH_RBD_PROVISIONER,
|
||||
storageClassType,
|
||||
filterRookCephPVCs,
|
||||
findBoundPv,
|
||||
getPodRestarts,
|
||||
} from './k8s';
|
||||
|
||||
describe('isRookCephProvisioner', () => {
|
||||
|
||||
+2
-2
@@ -39,8 +39,8 @@ export const ROOK_OSD_SELECTOR = 'app=rook-ceph-osd';
|
||||
export const ROOK_MGR_SELECTOR = 'app=rook-ceph-mgr';
|
||||
export const ROOK_MDS_SELECTOR = 'app=rook-ceph-mds';
|
||||
export const ROOK_RGW_SELECTOR = 'app=rook-ceph-rgw';
|
||||
export const ROOK_CSI_RBD_SELECTOR = 'app=csi-rbdplugin-provisioner';
|
||||
export const ROOK_CSI_CEPHFS_SELECTOR = 'app=csi-cephfsplugin-provisioner';
|
||||
export const ROOK_CSI_RBD_SELECTOR = 'app=rook-ceph.rbd.csi.ceph.com-ctrlplugin';
|
||||
export const ROOK_CSI_CEPHFS_SELECTOR = 'app=rook-ceph.cephfs.csi.ceph.com-ctrlplugin';
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// Generic Kubernetes object base shapes
|
||||
|
||||
@@ -11,8 +11,8 @@ import {
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React, { useState } from 'react';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
import { CephBlockPool, formatAge, phaseToStatus } from '../api/k8s';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
|
||||
function BlockPoolDetail({ pool, onClose }: { pool: CephBlockPool; onClose: () => void }) {
|
||||
return (
|
||||
|
||||
@@ -11,7 +11,7 @@ import {
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React from 'react';
|
||||
import { formatAge, getPodRestarts } from '../api/k8s';
|
||||
import { formatAge } from '../api/k8s';
|
||||
|
||||
interface CephPodDetailSectionProps {
|
||||
resource: {
|
||||
|
||||
@@ -0,0 +1,164 @@
|
||||
/**
|
||||
* FilesystemsPage — lists CephFilesystem resources.
|
||||
*/
|
||||
|
||||
import {
|
||||
Loader,
|
||||
NameValueTable,
|
||||
SectionBox,
|
||||
SectionHeader,
|
||||
SimpleTable,
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React, { useState } from 'react';
|
||||
import { CephFilesystem, formatAge, phaseToStatus } from '../api/k8s';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
|
||||
function FilesystemDetail({ fs, onClose }: { fs: CephFilesystem; onClose: () => void }) {
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
position: 'fixed',
|
||||
top: 0, right: 0, bottom: 0, width: '480px',
|
||||
backgroundColor: 'var(--mui-palette-background-paper, #fff)',
|
||||
boxShadow: '-4px 0 16px rgba(0,0,0,0.15)',
|
||||
zIndex: 1300,
|
||||
overflowY: 'auto',
|
||||
padding: '24px',
|
||||
}}
|
||||
>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '16px' }}>
|
||||
<strong>{fs.metadata.name}</strong>
|
||||
<button
|
||||
onClick={onClose}
|
||||
aria-label="Close"
|
||||
style={{ background: 'none', border: 'none', cursor: 'pointer', fontSize: '18px' }}
|
||||
>
|
||||
✕
|
||||
</button>
|
||||
</div>
|
||||
<SectionBox title="Filesystem Details">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{ name: 'Name', value: fs.metadata.name },
|
||||
{ name: 'Namespace', value: fs.metadata.namespace ?? '—' },
|
||||
{
|
||||
name: 'Phase',
|
||||
value: (
|
||||
<StatusLabel status={phaseToStatus(fs.status?.phase)}>
|
||||
{fs.status?.phase ?? 'Unknown'}
|
||||
</StatusLabel>
|
||||
),
|
||||
},
|
||||
{ name: 'Age', value: formatAge(fs.metadata.creationTimestamp) },
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
<SectionBox title="Metadata Server">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{ name: 'Active Count', value: String(fs.spec?.metadataServer?.activeCount ?? '—') },
|
||||
{ name: 'Active Standby', value: String(fs.spec?.metadataServer?.activeStandby ?? '—') },
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
{fs.spec?.dataPools && fs.spec.dataPools.length > 0 && (
|
||||
<SectionBox title="Data Pools">
|
||||
{fs.spec.dataPools.map((pool, i) => (
|
||||
<NameValueTable
|
||||
key={pool.name ?? i}
|
||||
rows={[
|
||||
{ name: 'Pool Name', value: pool.name ?? '—' },
|
||||
{ name: 'Replicas', value: String(pool.replicated?.size ?? '—') },
|
||||
]}
|
||||
/>
|
||||
))}
|
||||
</SectionBox>
|
||||
)}
|
||||
{fs.spec?.metadataPool && (
|
||||
<SectionBox title="Metadata Pool">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{ name: 'Replicas', value: String(fs.spec.metadataPool.replicated?.size ?? '—') },
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
)}
|
||||
{fs.status?.info && Object.keys(fs.status.info).length > 0 && (
|
||||
<SectionBox title="Status Info">
|
||||
<NameValueTable
|
||||
rows={Object.entries(fs.status.info).map(([k, v]) => ({ name: k, value: v }))}
|
||||
/>
|
||||
</SectionBox>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default function FilesystemsPage() {
|
||||
const { filesystems, loading, error } = useRookCephContext();
|
||||
const [selected, setSelected] = useState<CephFilesystem | null>(null);
|
||||
|
||||
if (loading) return <Loader title="Loading filesystems..." />;
|
||||
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title="Filesystems" />
|
||||
|
||||
{error && (
|
||||
<SectionBox title="Error">
|
||||
<NameValueTable rows={[{ name: 'Status', value: <StatusLabel status="error">{error}</StatusLabel> }]} />
|
||||
</SectionBox>
|
||||
)}
|
||||
|
||||
{filesystems.length === 0 ? (
|
||||
<SectionBox title="No Filesystems">
|
||||
<NameValueTable
|
||||
rows={[{ name: 'Status', value: 'No CephFilesystem resources found in rook-ceph namespace.' }]}
|
||||
/>
|
||||
</SectionBox>
|
||||
) : (
|
||||
<SectionBox title={`Filesystems (${filesystems.length})`}>
|
||||
<SimpleTable
|
||||
columns={[
|
||||
{
|
||||
label: 'Name',
|
||||
getter: (f: CephFilesystem) => (
|
||||
<button
|
||||
onClick={() => setSelected(f)}
|
||||
style={{ border: 'none', background: 'transparent', color: 'var(--link-color, #1976d2)', cursor: 'pointer', textDecoration: 'underline', padding: 0, font: 'inherit' }}
|
||||
>
|
||||
{f.metadata.name}
|
||||
</button>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: 'Phase',
|
||||
getter: (f: CephFilesystem) => (
|
||||
<StatusLabel status={phaseToStatus(f.status?.phase)}>
|
||||
{f.status?.phase ?? 'Unknown'}
|
||||
</StatusLabel>
|
||||
),
|
||||
},
|
||||
{ label: 'Active MDS', getter: (f: CephFilesystem) => String(f.spec?.metadataServer?.activeCount ?? '—') },
|
||||
{ label: 'Active Standby', getter: (f: CephFilesystem) => String(f.spec?.metadataServer?.activeStandby ?? '—') },
|
||||
{ label: 'Data Pools', getter: (f: CephFilesystem) => String(f.spec?.dataPools?.length ?? 0) },
|
||||
{ label: 'Age', getter: (f: CephFilesystem) => formatAge(f.metadata.creationTimestamp) },
|
||||
]}
|
||||
data={filesystems}
|
||||
/>
|
||||
</SectionBox>
|
||||
)}
|
||||
|
||||
{selected && (
|
||||
<>
|
||||
<div
|
||||
style={{ position: 'fixed', inset: 0, backgroundColor: 'rgba(0,0,0,0.3)', zIndex: 1299 }}
|
||||
onClick={() => setSelected(null)}
|
||||
/>
|
||||
<FilesystemDetail fs={selected} onClose={() => setSelected(null)} />
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,160 @@
|
||||
/**
|
||||
* ObjectStoresPage — lists CephObjectStore resources.
|
||||
*/
|
||||
|
||||
import {
|
||||
Loader,
|
||||
NameValueTable,
|
||||
SectionBox,
|
||||
SectionHeader,
|
||||
SimpleTable,
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React, { useState } from 'react';
|
||||
import { CephObjectStore, formatAge, phaseToStatus } from '../api/k8s';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
|
||||
function ObjectStoreDetail({ store, onClose }: { store: CephObjectStore; onClose: () => void }) {
|
||||
const endpoints = (store.status as unknown as Record<string, unknown>)?.endpoints as
|
||||
| { insecure?: string[]; secure?: string[] }
|
||||
| undefined;
|
||||
|
||||
return (
|
||||
<div
|
||||
style={{
|
||||
position: 'fixed',
|
||||
top: 0, right: 0, bottom: 0, width: '480px',
|
||||
backgroundColor: 'var(--mui-palette-background-paper, #fff)',
|
||||
boxShadow: '-4px 0 16px rgba(0,0,0,0.15)',
|
||||
zIndex: 1300,
|
||||
overflowY: 'auto',
|
||||
padding: '24px',
|
||||
}}
|
||||
>
|
||||
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '16px' }}>
|
||||
<strong>{store.metadata.name}</strong>
|
||||
<button
|
||||
onClick={onClose}
|
||||
aria-label="Close"
|
||||
style={{ background: 'none', border: 'none', cursor: 'pointer', fontSize: '18px' }}
|
||||
>
|
||||
✕
|
||||
</button>
|
||||
</div>
|
||||
<SectionBox title="Object Store Details">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{ name: 'Name', value: store.metadata.name },
|
||||
{ name: 'Namespace', value: store.metadata.namespace ?? '—' },
|
||||
{
|
||||
name: 'Phase',
|
||||
value: (
|
||||
<StatusLabel status={phaseToStatus(store.status?.phase)}>
|
||||
{store.status?.phase ?? 'Unknown'}
|
||||
</StatusLabel>
|
||||
),
|
||||
},
|
||||
{ name: 'Age', value: formatAge(store.metadata.creationTimestamp) },
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
<SectionBox title="Gateway">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
{ name: 'Port', value: String(store.spec?.gateway?.port ?? '—') },
|
||||
{ name: 'Secure Port', value: String(store.spec?.gateway?.securePort ?? '—') },
|
||||
{ name: 'Instances', value: String(store.spec?.gateway?.instances ?? '—') },
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
{(endpoints?.insecure?.length || endpoints?.secure?.length) ? (
|
||||
<SectionBox title="Endpoints">
|
||||
<NameValueTable
|
||||
rows={[
|
||||
...(endpoints?.insecure?.length
|
||||
? [{ name: 'Insecure', value: endpoints.insecure.join(', ') }]
|
||||
: []),
|
||||
...(endpoints?.secure?.length
|
||||
? [{ name: 'Secure', value: endpoints.secure.join(', ') }]
|
||||
: []),
|
||||
]}
|
||||
/>
|
||||
</SectionBox>
|
||||
) : null}
|
||||
{store.status?.info && Object.keys(store.status.info).length > 0 && (
|
||||
<SectionBox title="Status Info">
|
||||
<NameValueTable
|
||||
rows={Object.entries(store.status.info).map(([k, v]) => ({ name: k, value: v }))}
|
||||
/>
|
||||
</SectionBox>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default function ObjectStoresPage() {
|
||||
const { objectStores, loading, error } = useRookCephContext();
|
||||
const [selected, setSelected] = useState<CephObjectStore | null>(null);
|
||||
|
||||
if (loading) return <Loader title="Loading object stores..." />;
|
||||
|
||||
return (
|
||||
<>
|
||||
<SectionHeader title="Object Stores" />
|
||||
|
||||
{error && (
|
||||
<SectionBox title="Error">
|
||||
<NameValueTable rows={[{ name: 'Status', value: <StatusLabel status="error">{error}</StatusLabel> }]} />
|
||||
</SectionBox>
|
||||
)}
|
||||
|
||||
{objectStores.length === 0 ? (
|
||||
<SectionBox title="No Object Stores">
|
||||
<NameValueTable
|
||||
rows={[{ name: 'Status', value: 'No CephObjectStore resources found in rook-ceph namespace.' }]}
|
||||
/>
|
||||
</SectionBox>
|
||||
) : (
|
||||
<SectionBox title={`Object Stores (${objectStores.length})`}>
|
||||
<SimpleTable
|
||||
columns={[
|
||||
{
|
||||
label: 'Name',
|
||||
getter: (o: CephObjectStore) => (
|
||||
<button
|
||||
onClick={() => setSelected(o)}
|
||||
style={{ border: 'none', background: 'transparent', color: 'var(--link-color, #1976d2)', cursor: 'pointer', textDecoration: 'underline', padding: 0, font: 'inherit' }}
|
||||
>
|
||||
{o.metadata.name}
|
||||
</button>
|
||||
),
|
||||
},
|
||||
{
|
||||
label: 'Phase',
|
||||
getter: (o: CephObjectStore) => (
|
||||
<StatusLabel status={phaseToStatus(o.status?.phase)}>
|
||||
{o.status?.phase ?? 'Unknown'}
|
||||
</StatusLabel>
|
||||
),
|
||||
},
|
||||
{ label: 'Gateway Port', getter: (o: CephObjectStore) => String(o.spec?.gateway?.port ?? '—') },
|
||||
{ label: 'Instances', getter: (o: CephObjectStore) => String(o.spec?.gateway?.instances ?? '—') },
|
||||
{ label: 'Age', getter: (o: CephObjectStore) => formatAge(o.metadata.creationTimestamp) },
|
||||
]}
|
||||
data={objectStores}
|
||||
/>
|
||||
</SectionBox>
|
||||
)}
|
||||
|
||||
{selected && (
|
||||
<>
|
||||
<div
|
||||
style={{ position: 'fixed', inset: 0, backgroundColor: 'rgba(0,0,0,0.3)', zIndex: 1299 }}
|
||||
onClick={() => setSelected(null)}
|
||||
/>
|
||||
<ObjectStoreDetail store={selected} onClose={() => setSelected(null)} />
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
}
|
||||
@@ -15,8 +15,8 @@ import {
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React from 'react';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
import { formatAge, formatBytes, healthToStatus, phaseToStatus, storageClassType } from '../api/k8s';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
import ClusterStatusCard from './ClusterStatusCard';
|
||||
|
||||
export default function OverviewPage() {
|
||||
|
||||
@@ -10,8 +10,8 @@ import {
|
||||
SectionBox,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React from 'react';
|
||||
import { findBoundPv, formatStorageType } from '../api/k8s';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
import { findBoundPv, formatStorageType, storageClassType } from '../api/k8s';
|
||||
|
||||
interface PVCDetailSectionProps {
|
||||
resource: {
|
||||
|
||||
@@ -11,8 +11,8 @@ import {
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React from 'react';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
import { formatAge, getPodRestarts, isPodReady, RookCephPod } from '../api/k8s';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
|
||||
function PodTable({ pods, title }: { pods: RookCephPod[]; title: string }) {
|
||||
if (pods.length === 0) return null;
|
||||
@@ -39,6 +39,40 @@ function PodTable({ pods, title }: { pods: RookCephPod[]; title: string }) {
|
||||
);
|
||||
}
|
||||
|
||||
function OsdTable({ pods }: { pods: RookCephPod[] }) {
|
||||
if (pods.length === 0) return null;
|
||||
return (
|
||||
<SectionBox title={`OSDs (${pods.length})`}>
|
||||
<SimpleTable
|
||||
columns={[
|
||||
{ label: 'OSD ID', getter: (p) => p.metadata.labels?.['osd'] ?? p.metadata.name },
|
||||
{
|
||||
label: 'Status',
|
||||
getter: (p) => {
|
||||
const st = isPodReady(p) ? 'success' : p.status?.phase === 'Pending' ? 'warning' : 'error';
|
||||
return (
|
||||
<StatusLabel status={st}>
|
||||
{p.status?.phase ?? 'Unknown'}
|
||||
</StatusLabel>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
label: 'Node',
|
||||
getter: (p) => p.spec?.nodeName ?? p.metadata.labels?.['topology-location-host'] ?? '—',
|
||||
},
|
||||
{ label: 'Device Class', getter: (p) => p.metadata.labels?.['device-class'] ?? '—' },
|
||||
{ label: 'Store', getter: (p) => p.metadata.labels?.['osd-store'] ?? '—' },
|
||||
{ label: 'Failure Domain', getter: (p) => p.metadata.labels?.['failure-domain'] ?? '—' },
|
||||
{ label: 'Restarts', getter: (p) => String(getPodRestarts(p)) },
|
||||
{ label: 'Age', getter: (p) => formatAge(p.metadata.creationTimestamp) },
|
||||
]}
|
||||
data={pods}
|
||||
/>
|
||||
</SectionBox>
|
||||
);
|
||||
}
|
||||
|
||||
export default function PodsPage() {
|
||||
const {
|
||||
operatorPods,
|
||||
@@ -84,7 +118,7 @@ export default function PodsPage() {
|
||||
<PodTable pods={operatorPods} title="Operator" />
|
||||
<PodTable pods={monPods} title="Monitors (MON)" />
|
||||
<PodTable pods={mgrPods} title="Managers (MGR)" />
|
||||
<PodTable pods={osdPods} title="OSDs" />
|
||||
<OsdTable pods={osdPods} />
|
||||
<PodTable pods={csiRbdPods} title="CSI RBD Provisioner" />
|
||||
<PodTable pods={csiCephfsPods} title="CSI CephFS Provisioner" />
|
||||
|
||||
|
||||
@@ -11,8 +11,8 @@ import {
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React, { useState } from 'react';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
import { formatAge, formatStorageType, RookCephStorageClass, storageClassType } from '../api/k8s';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
|
||||
function StorageClassDetail({ sc, pvCount, onClose }: { sc: RookCephStorageClass; pvCount: number; onClose: () => void }) {
|
||||
const type = storageClassType(sc);
|
||||
|
||||
@@ -11,8 +11,8 @@ import {
|
||||
StatusLabel,
|
||||
} from '@kinvolk/headlamp-plugin/lib/CommonComponents';
|
||||
import React, { useState } from 'react';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
import { formatAccessModes, formatAge, phaseToStatus, RookCephPersistentVolume } from '../api/k8s';
|
||||
import { useRookCephContext } from '../api/RookCephDataContext';
|
||||
|
||||
function PVDetail({ pv, onClose }: { pv: RookCephPersistentVolume; onClose: () => void }) {
|
||||
const attrs = pv.spec.csi?.volumeAttributes ?? {};
|
||||
|
||||
@@ -4,10 +4,14 @@
|
||||
* Adds Rook-Ceph-specific columns to the native Headlamp StorageClass table
|
||||
* ('headlamp-storageclasses') and PV table ('headlamp-persistentvolumes').
|
||||
* Non-Rook-Ceph rows show '—'.
|
||||
*
|
||||
* Column names (Protocol, Pool) are intentionally shared with the tns-csi
|
||||
* column processor so both plugins contribute to the same logical columns
|
||||
* on a mixed-driver cluster.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { isRookCephProvisioner, formatStorageType } from '../../api/k8s';
|
||||
import { isRookCephProvisioner } from '../../api/k8s';
|
||||
|
||||
/** Safely read a nested field from either a KubeObject instance or plain object. */
|
||||
function getField(item: unknown, ...path: string[]): unknown {
|
||||
@@ -36,23 +40,26 @@ function isRookPvRow(item: unknown): boolean {
|
||||
return typeof driver === 'string' && isRookCephProvisioner(driver);
|
||||
}
|
||||
|
||||
function rookProtocol(s: string | undefined): string {
|
||||
if (!s) return '—';
|
||||
if (s.includes('.rbd.')) return 'RBD';
|
||||
if (s.includes('.cephfs.')) return 'CephFS';
|
||||
return '—';
|
||||
}
|
||||
|
||||
export function buildStorageClassColumns() {
|
||||
return [
|
||||
{
|
||||
label: 'Rook Type',
|
||||
label: 'Protocol',
|
||||
getValue: (item: unknown) => {
|
||||
if (!isRookRow(item)) return null;
|
||||
const provisioner = getField(item, 'provisioner') as string | undefined;
|
||||
if (!provisioner) return null;
|
||||
const type = provisioner.includes('.rbd.') ? 'rbd' : provisioner.includes('.cephfs.') ? 'cephfs' : 'unknown';
|
||||
return formatStorageType(type as 'rbd' | 'cephfs' | 'unknown');
|
||||
return rookProtocol(provisioner);
|
||||
},
|
||||
render: (item: unknown) => {
|
||||
if (!isRookRow(item)) return <span>—</span>;
|
||||
const provisioner = getField(item, 'provisioner') as string | undefined;
|
||||
if (!provisioner) return <span>—</span>;
|
||||
const type = provisioner.includes('.rbd.') ? 'rbd' : provisioner.includes('.cephfs.') ? 'cephfs' : 'unknown';
|
||||
return <span style={{ color: '#1976d2', fontWeight: 500 }}>{formatStorageType(type as 'rbd' | 'cephfs' | 'unknown')}</span>;
|
||||
return <span>{rookProtocol(provisioner)}</span>;
|
||||
},
|
||||
},
|
||||
{
|
||||
@@ -65,13 +72,12 @@ export function buildStorageClassColumns() {
|
||||
},
|
||||
},
|
||||
{
|
||||
label: 'Cluster ID',
|
||||
label: 'Cluster',
|
||||
getValue: (item: unknown) => getField(item, 'parameters', 'clusterID') as string | null ?? null,
|
||||
render: (item: unknown) => {
|
||||
if (!isRookRow(item)) return <span>—</span>;
|
||||
const clusterID = getField(item, 'parameters', 'clusterID') as string | undefined;
|
||||
if (!clusterID) return <span>—</span>;
|
||||
// Truncate long cluster IDs
|
||||
return <span title={clusterID}>{clusterID.length > 16 ? `${clusterID.slice(0, 16)}…` : clusterID}</span>;
|
||||
},
|
||||
},
|
||||
@@ -81,20 +87,16 @@ export function buildStorageClassColumns() {
|
||||
export function buildPVColumns() {
|
||||
return [
|
||||
{
|
||||
label: 'Rook Type',
|
||||
label: 'Protocol',
|
||||
getValue: (item: unknown) => {
|
||||
if (!isRookPvRow(item)) return null;
|
||||
const driver = getField(item, 'spec', 'csi', 'driver') as string | undefined;
|
||||
if (!driver) return null;
|
||||
const type = driver.includes('.rbd.') ? 'rbd' : driver.includes('.cephfs.') ? 'cephfs' : 'unknown';
|
||||
return formatStorageType(type as 'rbd' | 'cephfs' | 'unknown');
|
||||
return rookProtocol(driver);
|
||||
},
|
||||
render: (item: unknown) => {
|
||||
if (!isRookPvRow(item)) return <span>—</span>;
|
||||
const driver = getField(item, 'spec', 'csi', 'driver') as string | undefined;
|
||||
if (!driver) return <span>—</span>;
|
||||
const type = driver.includes('.rbd.') ? 'rbd' : driver.includes('.cephfs.') ? 'cephfs' : 'unknown';
|
||||
return <span style={{ color: '#1976d2', fontWeight: 500 }}>{formatStorageType(type as 'rbd' | 'cephfs' | 'unknown')}</span>;
|
||||
return <span>{rookProtocol(driver)}</span>;
|
||||
},
|
||||
},
|
||||
{
|
||||
|
||||
+43
-12
@@ -1,12 +1,11 @@
|
||||
/**
|
||||
* headlamp-rook-ceph-plugin — entry point.
|
||||
* headlamp-rook-plugin — entry point.
|
||||
*
|
||||
* Registers sidebar entries, routes, detail view sections, table column
|
||||
* processors, and app bar action for Rook-Ceph visibility in Headlamp.
|
||||
*/
|
||||
|
||||
import {
|
||||
registerAppBarAction,
|
||||
registerDetailsViewSection,
|
||||
registerResourceTableColumnsProcessor,
|
||||
registerRoute,
|
||||
@@ -14,10 +13,11 @@ import {
|
||||
} from '@kinvolk/headlamp-plugin/lib';
|
||||
import React from 'react';
|
||||
import { RookCephDataProvider } from './api/RookCephDataContext';
|
||||
import AppBarClusterBadge from './components/AppBarClusterBadge';
|
||||
import BlockPoolsPage from './components/BlockPoolsPage';
|
||||
import CephPodDetailSection from './components/CephPodDetailSection';
|
||||
import FilesystemsPage from './components/FilesystemsPage';
|
||||
import { buildPVColumns, buildStorageClassColumns } from './components/integrations/StorageClassColumns';
|
||||
import ObjectStoresPage from './components/ObjectStoresPage';
|
||||
import OverviewPage from './components/OverviewPage';
|
||||
import PodsPage from './components/PodsPage';
|
||||
import PVCDetailSection from './components/PVCDetailSection';
|
||||
@@ -53,6 +53,22 @@ registerSidebarEntry({
|
||||
icon: 'mdi:database',
|
||||
});
|
||||
|
||||
registerSidebarEntry({
|
||||
parent: 'rook-ceph',
|
||||
name: 'rook-ceph-filesystems',
|
||||
label: 'Filesystems',
|
||||
url: '/rook-ceph/filesystems',
|
||||
icon: 'mdi:folder-network',
|
||||
});
|
||||
|
||||
registerSidebarEntry({
|
||||
parent: 'rook-ceph',
|
||||
name: 'rook-ceph-objectstores',
|
||||
label: 'Object Stores',
|
||||
url: '/rook-ceph/object-stores',
|
||||
icon: 'mdi:bucket',
|
||||
});
|
||||
|
||||
registerSidebarEntry({
|
||||
parent: 'rook-ceph',
|
||||
name: 'rook-ceph-pods',
|
||||
@@ -89,6 +105,30 @@ registerRoute({
|
||||
),
|
||||
});
|
||||
|
||||
registerRoute({
|
||||
path: '/rook-ceph/filesystems',
|
||||
sidebar: 'rook-ceph-filesystems',
|
||||
name: 'rook-ceph-filesystems',
|
||||
exact: true,
|
||||
component: () => (
|
||||
<RookCephDataProvider>
|
||||
<FilesystemsPage />
|
||||
</RookCephDataProvider>
|
||||
),
|
||||
});
|
||||
|
||||
registerRoute({
|
||||
path: '/rook-ceph/object-stores',
|
||||
sidebar: 'rook-ceph-objectstores',
|
||||
name: 'rook-ceph-objectstores',
|
||||
exact: true,
|
||||
component: () => (
|
||||
<RookCephDataProvider>
|
||||
<ObjectStoresPage />
|
||||
</RookCephDataProvider>
|
||||
),
|
||||
});
|
||||
|
||||
// Storage Classes and Volumes pages accessible via direct URL
|
||||
registerRoute({
|
||||
path: '/rook-ceph/storage-classes',
|
||||
@@ -172,12 +212,3 @@ registerResourceTableColumnsProcessor(({ id, columns }) => {
|
||||
return columns;
|
||||
});
|
||||
|
||||
// ---------------------------------------------------------------------------
|
||||
// App bar action — cluster health badge
|
||||
// ---------------------------------------------------------------------------
|
||||
|
||||
registerAppBarAction(() => (
|
||||
<RookCephDataProvider>
|
||||
<AppBarClusterBadge />
|
||||
</RookCephDataProvider>
|
||||
));
|
||||
|
||||
Reference in New Issue
Block a user