Skip to content
Merged
5 changes: 3 additions & 2 deletions frontend/src/renderer/components/grid/GridLayoutPlot.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import {
Axis,
Configuration,
Coordinates,
CustomizedGridType,
DataGridPlot,
DataPlotly,
GridLayoutPlotProps,
Expand Down Expand Up @@ -338,10 +339,10 @@ export const GridLayoutPlot = ({
* Customize plot
*/
const handleCustomization = useCallback(
(id: string) => {
(id: string, typeOfEdition: CustomizedGridType) => {
const updatedActive: Configuration = {
...active,
customizedGridLayout: id,
customizedGridLayout: { id: id, type: typeOfEdition },
};
updatedConfiguration(updatedActive);
},
Expand Down
33 changes: 26 additions & 7 deletions frontend/src/renderer/components/grid/HoverButtons.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -12,12 +12,13 @@ import {
import {
IconBrandDatabricks,
IconCheck,
IconDatabaseEdit,
IconEdit,
IconPalette,
IconEyeEdit,
IconTrash,
} from '@tabler/icons-react';
import { useHover } from '@mantine/hooks';
import { Configuration, DataGridPlot } from '../../types';
import { Configuration, CustomizedGridType, DataGridPlot } from '../../types';
import {
applyRange,
containsFloat,
Expand All @@ -30,7 +31,7 @@ interface HoverButtonsProps {
shouldDisplayMetadata: boolean;
handleEditGrid: (id: string) => void;
handleInspectMetadata: (id: string) => void;
handleCustomization: (id: string) => void;
handleCustomization: (id: string, typeOfEdition: CustomizedGridType) => void;
handleDeleteGrid: (id: string) => void;
is3DView: boolean;
active3DTab: string;
Expand Down Expand Up @@ -275,15 +276,33 @@ export const HoverButtons = React.memo(

{data.coordinates.length && !shouldDisplayMetadata && (
// Show customization button only if plottable
<Tooltip label="Customize the grid">
<Tooltip label="Data manipulation">
<ActionIcon
variant="filled"
aria-label="Metadatas"
data-testid="customization-access-button"
onClick={() => handleCustomization(data.i)}
data-testid="data-customization-access-button"
onClick={() => handleCustomization(data.i, 'data')}
className={classes.actionButton}
>
<IconPalette
<IconDatabaseEdit
style={{ width: '70%', height: '70%' }}
stroke={1.5}
/>
</ActionIcon>
</Tooltip>
)}

{data.coordinates.length && !shouldDisplayMetadata && (
// Show customization button only if plottable
<Tooltip label="Visual customization">
<ActionIcon
variant="filled"
aria-label="Metadatas"
data-testid="visual-customization-access-button"
onClick={() => handleCustomization(data.i, 'visual')}
className={classes.actionButton}
>
<IconEyeEdit
style={{ width: '70%', height: '70%' }}
stroke={1.5}
/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -124,7 +124,7 @@ export const TreeLibrariesAccordion = ({
editedDataPlot={editedDataPlot}
checkedNodes={checkedNodes}
metadataGridLayout={stableMetadataGridLayout}
customizedGridLayout={stableCustomizedGridLayout}
customizedGridLayout={stableCustomizedGridLayout?.id}
previousEditedIdRef={previousEditedIdRef}
handleSelectChildren={handleSelectChildren}
getCheckedNodes={getNodesChecked}
Expand Down
1 change: 1 addition & 0 deletions frontend/src/renderer/layout/MainLayout.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -105,6 +105,7 @@ export function MainLayout() {
synchronizedGrids: dataGrid.synchronizedGrids,
downsampled_method: dataGrid?.downsampled_method,
downsampled_size: dataGrid?.downsampled_size,
interpolated_method: dataGrid.interpolated_method,
xAxisData: dataGrid.xAxisData,
yAxisData: dataGrid.yAxisData,
y2AxisData: dataGrid?.y2AxisData,
Expand Down
Loading
Loading