Repository: Avaiga/taipy
File: frontend/taipy-gui/src/components/Taipy/Metric.tsx (TypeScript)

Code before:
        const mode = (props.type === "none") ? [] : ["gauge"];
        showValue && mode.push("number");
        (delta !== undefined) && mode.push("delta");
        const deltaIncreasing = positiveDeltaColor?{
            color: positiveDeltaColor
        } : undefined
        const deltaDecreasing =negativeDeltaColor?{
                color: negativeDeltaColor
            } : undefined
        return [
            {
                domain: {x: [0, 1], y: [0, 1]},
                value: value,
                type: "indicator",
                mode: mode.join("+"),
                number: {
                    prefix: extractPrefix(props.format),
                    suffix: extractSuffix(props.format),
                    valueformat: sprintfToD3Converter(props.format),
                },
                delta: {
                    reference: typeof value === 'number' && typeof delta === 'number' ? value - delta : undefined,
                    prefix: extractPrefix(props.deltaFormat),
                    suffix: extractSuffix(props.deltaFormat),
                    valueformat: sprintfToD3Converter(props.deltaFormat),
                    increasing:deltaIncreasing,
                    decreasing: deltaDecreasing

                } as Partial<Delta>,
                gauge: {
                    axis: {
                        range: [
                            props.min || 0,
                            props.max || 100
                        ]
                    },
                    steps: colorMap,
                    shape: props.type === "linear" ? "bullet" : "angular",
                    threshold: {
                        line: {color: "red", width: 4},
                        thickness: 0.75,
                        value: threshold
                    }
                },
            }
        ] as Data[];
    }, [
        props.format,
        props.deltaFormat,
        props.min,
        props.max,

Review comment (suggestion):
```suggestion
                    increasing: deltaIncreasing,
```

Code after:
        const mode = (props.type === "none") ? [] : ["gauge"];
        showValue && mode.push("number");
        (delta !== undefined) && mode.push("delta");
        const deltaIncreasing = deltaColor ? {
            color: deltaColor == "invert" ? "#FF4136" : deltaColor } : undefined
        const deltaDecreasing = deltaColor == "invert" ? {
                color: "#3D9970"
            } : negativeDeltaColor ? { color: negativeDeltaColor } : undefined;
        return [
            {
                domain: {x: [0, 1], y: [0, 1]},
                value: value,
                type: "indicator",
                mode: mode.join("+"),
                number: {
                    prefix: extractPrefix(props.format),
                    suffix: extractSuffix(props.format),
                    valueformat: sprintfToD3Converter(props.format),
                },
                delta: {
                    reference: typeof value === 'number' && typeof delta === 'number' ? value - delta : undefined,
                    prefix: extractPrefix(props.deltaFormat),
                    suffix: extractSuffix(props.deltaFormat),
                    valueformat: sprintfToD3Converter(props.deltaFormat),
                    increasing: deltaIncreasing,
                    decreasing: deltaDecreasing

                } as Partial<Delta>,
                gauge: {
                    axis: {
                        range: [
                            props.min || 0,
                            props.max || 100
                        ]
                    },
                    steps: colorMap,
                    shape: props.type === "linear" ? "bullet" : "angular",
                    threshold: {
                        line: {color: "red", width: 4},
                        thickness: 0.75,
                        value: threshold
                    }
                },
            }
        ] as Data[];
    }, [
        props.format,
        props.deltaFormat,
        props.min,
        props.max,
        props.type,