Compare commits

..

12 Commits

Author SHA1 Message Date
github-actions[bot] 375132bdc3 chore: release v0.2.0 2026-02-19 16:36:38 +00:00
Chris Farhood 0b5ca61785 docs: add v0.2.0 changelog entry
Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
2026-02-19 11:35:55 -05:00
Chris Farhood 300c705033 chore: rename plugin to headlamp-rook-plugin
Renames the plugin from headlamp-rook-ceph-plugin to headlamp-rook-plugin
across all files: package.json, package-lock.json, artifacthub-pkg.yml,
release workflow, README, CHANGELOG, CLAUDE.md, CONTRIBUTING, SECURITY,
and src/index.tsx.

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
2026-02-19 11:26:33 -05:00
Chris Farhood ea587c149f docs: add v0.1.1/0.1.2/0.1.3 changelog entries
Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
2026-02-19 07:07:42 -05:00
github-actions[bot] 4468396e52 chore: release v0.1.3 2026-02-19 12:06:38 +00:00
github-actions[bot] ead81a51a9 chore: release v0.1.1 2026-02-19 12:05:27 +00:00
Chris Farhood 8e0b95ed64 fix: rename Type -> Protocol with RBD/CephFS values to match tns-csi convention
Both plugins now inject a 'Protocol' column into the shared native tables,
so mixed-driver clusters see consistent naming. Rook values: RBD, CephFS.
tns-csi values: NFS, NVMe-oF, iSCSI. Removes unused formatStorageType import
from the column processor.

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
2026-02-19 06:53:54 -05:00
Chris Farhood e54caa7be4 fix: rename 'Rook Type' -> 'Type' and 'Cluster ID' -> 'Cluster' in column processors
Cleaner column headers that don't redundantly prefix with 'Rook'.

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
2026-02-19 06:48:08 -05:00
github-actions[bot] b77ecf66e7 chore: release v0.1.2 2026-02-19 02:24:36 +00:00
Chris Farhood c30fc18b43 feat: add Filesystems/ObjectStores pages, fix CSI selectors, remove app bar badge (#2)
- Remove AppBarClusterBadge registration (top-bar health bubble)
- Fix CSI pod selectors to match actual pod labels in this cluster
  (was: csi-rbdplugin-provisioner, now: rook-ceph.rbd.csi.ceph.com-ctrlplugin)
- Add FilesystemsPage with detail drawer (Active MDS, data pools, status)
- Add ObjectStoresPage with detail drawer (gateway port, instances, endpoints)
- Register Filesystems and Object Stores as sidebar entries with routes
- Enhance PodsPage OSD table with OSD ID, device class, store type,
  and failure domain columns from pod labels

Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-authored-by: Claude <noreply@anthropic.com>
Co-authored-by: Happy <yesreply@happy.engineering>
2026-02-18 21:23:53 -05:00
Chris Farhood 91e50fc316 Merge pull request #1 from privilegedescalation/fix/ci-eslint-config 2026-02-18 19:47:53 -05:00
Chris Farhood 7860778920 fix(ci): add .eslintrc.js and remove unused imports
Generated with [Claude Code](https://claude.ai/code)
via [Happy](https://happy.engineering)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
2026-02-18 19:42:02 -05:00
24 changed files with 503 additions and 81 deletions
+3
View File
@@ -0,0 +1,3 @@
module.exports = {
extends: ['@headlamp-k8s/eslint-config'],
};
+4 -4
View File
@@ -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
View File
@@ -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
+1 -1
View File
@@ -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
View File
@@ -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
```
+8 -8
View File
@@ -1,6 +1,6 @@
# Headlamp Rook-Ceph Plugin
# Headlamp Rook Plugin
[![CI](https://github.com/cpfarhood/headlamp-rook-ceph-plugin/actions/workflows/ci.yaml/badge.svg)](https://github.com/cpfarhood/headlamp-rook-ceph-plugin/actions/workflows/ci.yaml)
[![CI](https://github.com/cpfarhood/headlamp-rook-plugin/actions/workflows/ci.yaml/badge.svg)](https://github.com/cpfarhood/headlamp-rook-plugin/actions/workflows/ci.yaml)
[![License: Apache-2.0](https://img.shields.io/badge/License-Apache_2.0-blue.svg)](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
View File
@@ -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
View File
@@ -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"
+2 -2
View File
@@ -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
View File
@@ -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": {
+5 -5
View File
@@ -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
View File
@@ -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
View File
@@ -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
+1 -1
View File
@@ -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 (
+1 -1
View File
@@ -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: {
+164
View File
@@ -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)} />
</>
)}
</>
);
}
+160
View File
@@ -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)} />
</>
)}
</>
);
}
+1 -1
View File
@@ -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() {
+1 -1
View File
@@ -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: {
+36 -2
View File
@@ -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" />
+1 -1
View File
@@ -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);
+1 -1
View File
@@ -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
View File
@@ -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>
));