Geomap: show delete button (#49125)

This commit is contained in:
Ryan McKinley 2022-05-17 23:39:54 -07:00 committed by GitHub
parent 9bbe951ec6
commit 30e4e9399b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 15 additions and 20 deletions

View File

@ -16,7 +16,7 @@ type LayerDragDropListProps<T extends LayerElement> = {
onSelect: (element: T) => any;
onDelete: (element: T) => any;
onDuplicate?: (element: T) => any;
isFrame: (element: T) => boolean;
showActions: (element: T) => boolean;
selection?: string[]; // list of unique ids (names)
excludeBaseLayer?: boolean;
onNameChange: (element: T, newName: string) => any;
@ -30,7 +30,7 @@ export const LayerDragDropList = <T extends LayerElement>({
onSelect,
onDelete,
onDuplicate,
isFrame,
showActions,
selection,
excludeBaseLayer,
onNameChange,
@ -74,7 +74,7 @@ export const LayerDragDropList = <T extends LayerElement>({
/>
<div className={style.textWrapper}>&nbsp; {getLayerInfo(element)}</div>
{isFrame(element) && (
{showActions(element) && (
<>
{onDuplicate ? (
<IconButton
@ -93,16 +93,16 @@ export const LayerDragDropList = <T extends LayerElement>({
onClick={() => onDelete(element)}
surface="header"
/>
{layers.length > shouldRenderDragIconLengthThreshold && (
<Icon
title="Drag and drop to reorder"
name="draggabledots"
size="lg"
className={style.dragIcon}
/>
)}
</>
)}
{layers.length > shouldRenderDragIconLengthThreshold && (
<Icon
title="Drag and drop to reorder"
name="draggabledots"
size="lg"
className={style.dragIcon}
/>
)}
</div>
)}
</Draggable>

View File

@ -215,8 +215,8 @@ export class LayerElementListEditor extends PureComponent<Props> {
element.onChange({ ...element.options, name });
};
const isFrame = (element: ElementState) => {
return element instanceof FrameState;
const showActions = (element: ElementState) => {
return !(element instanceof FrameState);
};
const verifyLayerNameUniqueness = (nameToVerify: string) => {
@ -252,7 +252,7 @@ export class LayerElementListEditor extends PureComponent<Props> {
getLayerInfo={getLayerInfo}
onNameChange={onNameChange}
verifyLayerNameUniqueness={verifyLayerNameUniqueness}
isFrame={isFrame}
showActions={showActions}
layers={layer.elements}
selection={selection}
/>

View File

@ -5,7 +5,6 @@ import { StandardEditorProps } from '@grafana/data';
import { Container } from '@grafana/ui';
import { AddLayerButton } from 'app/core/components/Layers/AddLayerButton';
import { LayerDragDropList } from 'app/core/components/Layers/LayerDragDropList';
import { FrameState } from 'app/features/canvas/runtime/frame';
import { GeomapInstanceState } from '../GeomapPanel';
import { geomapLayerRegistry } from '../layers/registry';
@ -55,10 +54,6 @@ export const LayersEditor = (props: LayersEditorProps) => {
element.onChange({ ...element.options, name });
};
const isFrame = (element: MapLayerState<any>) => {
return element instanceof FrameState;
};
const selection = selected ? [layers[selected]?.getName()] : [];
return (
@ -74,12 +69,12 @@ export const LayersEditor = (props: LayersEditorProps) => {
<LayerDragDropList
layers={layers}
showActions={() => layers.length > 2} // 2 because base layer is not counted!
getLayerInfo={getLayerInfo}
onDragEnd={onDragEnd}
onSelect={onSelect}
onDelete={onDelete}
selection={selection}
isFrame={isFrame}
excludeBaseLayer
onNameChange={onNameChange}
verifyLayerNameUniqueness={actions.canRename}