grafana/public/app/plugins/panel/debug/StateView.tsx

37 lines
1.0 KiB
TypeScript

import { FormEvent } from 'react';
import { PanelOptionsEditorProps, PanelProps } from '@grafana/data';
import { Trans, useTranslate } from '@grafana/i18n';
import { Field, Input, usePanelContext } from '@grafana/ui';
import { Options } from './panelcfg.gen';
export function StateView(props: PanelProps<Options>) {
const { t } = useTranslate();
const context = usePanelContext();
const onChangeName = (e: FormEvent<HTMLInputElement>) => {
context.onInstanceStateChange!({
name: e.currentTarget.value,
});
};
return (
<>
<Field label={t('debug.state-view.label-state-name', 'State name')}>
<Input value={context.instanceState?.name ?? ''} onChange={onChangeName} />
</Field>
</>
);
}
export function StateViewEditor({ value, context, onChange, item }: PanelOptionsEditorProps<string>) {
return (
<div>
<Trans i18nKey="debug.state-view.current-value" values={{ currentValue: context.instanceState?.name }}>
Current value: {'{{currentValue}}'}{' '}
</Trans>
</div>
);
}