Commit b7ba608b authored by René Dudfield's avatar René Dudfield Committed by Joaquim Rocha
Browse files

plugins: Show how to use styles inside a plugin

parent ac773fd1
Showing with 14 additions and 8 deletions
+14 -8
import React from 'react'; import { Headlamp, K8s, Plugin, Registry } from '@kinvolk/headlamp-plugin/lib';
import { Headlamp, Plugin, Registry, K8s } from '@kinvolk/headlamp-plugin/lib';
import { Typography } from '@material-ui/core'; import { Typography } from '@material-ui/core';
import { makeStyles } from '@material-ui/styles';
import React from 'react';
// import { SectionBox } from '@kinvolk/headlamp-plugin/lib/CommonComponents'; // import { SectionBox } from '@kinvolk/headlamp-plugin/lib/CommonComponents';
const useStyle = makeStyles(() => ({
pods: {
fontStyle: 'italic',
},
}));
function PodCounter() { function PodCounter() {
const classes = useStyle();
const [pods, error] = K8s.ResourceClasses.Pod.useList(); const [pods, error] = K8s.ResourceClasses.Pod.useList();
const msg = pods === null ? 'Loading…' : pods.length.toString(); const msg = pods === null ? 'Loading…' : pods.length.toString();
return ( return (
<Typography color="textPrimary">{!error ? `# Pods: ${msg}` : 'Uh, pods!?'}</Typography> <Typography color="textPrimary" className={classes.pods}>
{!error ? `# Pods: ${msg}` : 'Uh, pods!?'}
</Typography>
); );
} }
class PodCounterPlugin extends Plugin { class PodCounterPlugin extends Plugin {
initialize(registry: Registry) { initialize(registry: Registry) {
registry.registerAppBarAction('pod-counter-action', () => registry.registerAppBarAction('pod-counter-action', () => <PodCounter />);
<PodCounter />
);
return true; return true;
} }
} }
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment