Skip to content

Commit 8b3cfac

Browse files
author
weinStag
committed
fix: address CodeRabbit review feedback
1 parent 682db12 commit 8b3cfac

File tree

6 files changed

+52
-54
lines changed

6 files changed

+52
-54
lines changed

src/components/ChartVisualization/ChartVisualization.react.js

Lines changed: 23 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@
55
* This source code is licensed under the license found in the LICENSE file in
66
* the root directory of this source tree.
77
*/
8+
import PropTypes from 'lib/PropTypes';
89
import React, { useMemo, useState } from 'react';
910
import {
1011
Chart as ChartJS,
@@ -23,7 +24,7 @@ import { Bar, Line, Pie } from 'react-chartjs-2';
2324
import 'chartjs-adapter-date-fns';
2425
import styles from './ChartVisualization.scss';
2526

26-
// Registrar os componentes necessários do Chart.js
27+
// Register necessary Chart.js components
2728
ChartJS.register(
2829
CategoryScale,
2930
LinearScale,
@@ -48,7 +49,7 @@ const ChartVisualization = ({
4849

4950
// Processar dados selecionados para determinar o tipo de visualização
5051
const chartData = useMemo(() => {
51-
// Validação inicial mais rigorosa
52+
// More rigorous initial validation
5253
if (!selectedData || selectedData.length === 0 || !selectedCells || !data || !Array.isArray(data)) {
5354
return null;
5455
}
@@ -207,7 +208,7 @@ const ChartVisualization = ({
207208

208209
// Se múltiplas colunas, criar datasets separados para cada coluna
209210
if (colEnd > colStart) {
210-
// CORREÇÃO: Em vez de calcular médias, mostrar todos os valores
211+
// FIX: Instead of calculating averages, show all values
211212
const datasets = [];
212213

213214
for (let colIndex = colStart; colIndex <= colEnd; colIndex++) {
@@ -297,7 +298,7 @@ const ChartVisualization = ({
297298
}
298299
};
299300
} else {
300-
// Única coluna: usar índices das linhas como rótulos (MANTER COMO ESTÁ)
301+
// Single column: use row indices as labels (KEEP AS IS)
301302
const columnName = order[colStart]?.name;
302303
if (columnName) {
303304
for (let rowIndex = rowStart; rowIndex <= rowEnd; rowIndex++) {
@@ -347,7 +348,7 @@ const ChartVisualization = ({
347348
color: '#333'
348349
},
349350
legend: {
350-
display: false // Uma coluna não precisa de legenda
351+
display: false // Single column doesn't need legend
351352
},
352353
tooltip: {
353354
backgroundColor: 'rgba(0, 0, 0, 0.8)',
@@ -390,13 +391,13 @@ const ChartVisualization = ({
390391
/>
391392
);
392393
} else {
393-
// Para number series, suportar bar, line e pie charts
394+
// For number series, support bar, line and pie charts
394395
if (chartType === 'pie') {
395-
// Para pie chart, verificar se temos dados válidos
396+
// For pie chart, verify if we have valid data
396397
const values = chartData.data.datasets[0].data;
397398
const labels = chartData.data.labels;
398399

399-
// Filtrar valores válidos (> 0) para pie chart
400+
// Filter valid values (> 0) for pie chart
400401
const validData = [];
401402
const validLabels = [];
402403
const validColors = [];
@@ -619,4 +620,18 @@ const ChartVisualization = ({
619620
);
620621
};
621622

623+
ChartVisualization.propTypes = {
624+
selectedData: PropTypes.array.isRequired,
625+
selectedCells: PropTypes.shape({
626+
list: PropTypes.instanceOf(Set),
627+
rowStart: PropTypes.number.isRequired,
628+
rowEnd: PropTypes.number.isRequired,
629+
colStart: PropTypes.number.isRequired,
630+
colEnd: PropTypes.number.isRequired,
631+
}).isRequired,
632+
data: PropTypes.array.isRequired,
633+
order: PropTypes.array.isRequired,
634+
columns: PropTypes.object.isRequired
635+
};
636+
622637
export default ChartVisualization;

src/components/ChartVisualization/ChartVisualization.scss

Lines changed: 1 addition & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -127,24 +127,7 @@
127127
}
128128
}
129129

130-
.noData {
131-
display: flex;
132-
align-items: center;
133-
justify-content: center;
134-
height: 200px;
135-
color: #999;
136-
font-style: italic;
137-
background: #f9f9f9;
138-
border-radius: 8px;
139-
margin: 20px;
140-
141-
p {
142-
margin: 0;
143-
font-size: 16px;
144-
}
145-
}
146-
147-
// Responsividade
130+
// Responsive design
148131
@media (max-width: 1200px) {
149132
.chartContainer {
150133
max-width: 100%;

src/components/Toolbar/Toolbar.react.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ const Stats = ({ data, classwiseCloudFunctions, className, appId, appName }) =>
3838
},
3939
{
4040
type: 'p99',
41-
label: 'P999',
41+
label: 'P99',
4242
getValue: data => {
4343
const sorted = data.sort((a, b) => a - b);
4444
return sorted[Math.floor(sorted.length * 0.99)];

src/components/Toolbar/Toolbar.scss

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -163,7 +163,7 @@ body:global(.expanded) {
163163
.dataControls {
164164
position: absolute;
165165
right: 20px;
166-
bottom: 10px; // Movido para a mesma linha do stats
166+
bottom: 10px; // Moved to the same line as stats
167167
display: flex;
168168
align-items: center;
169169
gap: 16px;
@@ -255,7 +255,7 @@ body:global(.expanded) {
255255
}
256256

257257
.stats {
258-
right: 80px; // Posição ajustada para mobile
258+
right: 80px; // Position adjusted for mobile
259259
bottom: 10px;
260260
font-size: 12px;
261261
padding: 5px 8px;

src/dashboard/Data/Browser/DataBrowser.react.js

Lines changed: 14 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -46,8 +46,8 @@ export default class DataBrowser extends React.Component {
4646
selectedCells: { list: new Set(), rowStart: -1, rowEnd: -1, colStart: -1, colEnd: -1 },
4747
firstSelectedCell: null,
4848
selectedData: [],
49-
numericSelectedData: [], // Dados apenas numéricos para operações Sum
50-
hasDateInSelection: false, // Flag para detectar se há datas na seleção
49+
numericSelectedData: [], // Numeric data only for Sum operations
50+
hasDateInSelection: false, // Flag to detect if there are dates in selection
5151
prevClassName: props.className,
5252
panelWidth: 300,
5353
isResizing: false,
@@ -588,7 +588,7 @@ export default class DataBrowser extends React.Component {
588588
for (let i = colStart; i <= colEnd; i++) {
589589
const name = this.state.order[i].name;
590590
const columnType = this.props.columns[name].type;
591-
// Permitir Number, Date, String (que pode conter números) para visualização
591+
// Allow Number, Date, String (which can contain numbers) for visualization
592592
if (columnType !== 'Number' && columnType !== 'Date' && columnType !== 'String') {
593593
validColumns = false;
594594
break;
@@ -597,7 +597,7 @@ export default class DataBrowser extends React.Component {
597597

598598
const newSelection = new Set();
599599
const selectedData = [];
600-
let hasDateColumns = false; // Flag para detectar se há colunas de data
600+
let hasDateColumns = false; // Flag to detect if there are date columns
601601

602602
for (let x = rowStart; x <= rowEnd; x++) {
603603
let rowData = null;
@@ -609,30 +609,30 @@ export default class DataBrowser extends React.Component {
609609
const value = rowData.attributes[this.state.order[y].name];
610610
const columnType = this.props.columns[this.state.order[y].name].type;
611611

612-
// Incluir diferentes tipos de dados para visualização
612+
// Include different data types for visualization
613613
if (columnType === 'Number' && typeof value === 'number' && !isNaN(value)) {
614614
selectedData.push(value);
615615
} else if (columnType === 'Date' && value instanceof Date) {
616616
selectedData.push(value);
617-
hasDateColumns = true; // Marcar que há datas
617+
hasDateColumns = true; // Mark that there are dates
618618
} else if (columnType === 'Date' && typeof value === 'string' && !isNaN(Date.parse(value))) {
619619
selectedData.push(new Date(value));
620-
hasDateColumns = true; // Marcar que há datas
620+
hasDateColumns = true; // Mark that there are dates
621621
} else if (columnType === 'String' && typeof value === 'string') {
622-
// Para strings, incluir apenas se puderem ser interpretadas como números
622+
// For strings, include only if they can be interpreted as numbers
623623
const numValue = parseFloat(value);
624624
if (!isNaN(numValue)) {
625625
selectedData.push(numValue);
626626
} else {
627-
selectedData.push(value); // Incluir strings para labels em time series
627+
selectedData.push(value); // Include strings for labels in time series
628628
}
629629
}
630630
}
631631
newSelection.add(`${x}-${y}`);
632632
}
633633
}
634634

635-
// Criar array apenas com números para operações de soma (excluindo datas)
635+
// Create array with only numbers for sum operations (excluding dates)
636636
const numericData = selectedData.filter(value =>
637637
typeof value === 'number' && !isNaN(value)
638638
);
@@ -650,8 +650,8 @@ export default class DataBrowser extends React.Component {
650650
},
651651
selectedObjectId: undefined,
652652
selectedData,
653-
numericSelectedData: numericData, // Dados apenas numéricos para Sum
654-
hasDateInSelection: hasDateColumns, // Flag para saber se há datas
653+
numericSelectedData: numericData, // Numeric data only for Sum
654+
hasDateInSelection: hasDateColumns, // Flag to know if there are dates
655655
});
656656
} else {
657657
this.setCurrent({ row, col });
@@ -660,8 +660,8 @@ export default class DataBrowser extends React.Component {
660660
this.setState({
661661
selectedCells: { list: new Set(), rowStart: -1, rowEnd: -1, colStart: -1, colEnd: -1 },
662662
selectedData: [],
663-
numericSelectedData: [], // Limpar dados numéricos
664-
hasDateInSelection: false, // Limpar flag de datas
663+
numericSelectedData: [], // Clear numeric data
664+
hasDateInSelection: false, // Clear dates flag
665665
current: { row, col },
666666
firstSelectedCell: clickedCellKey,
667667
});

src/dashboard/Data/Browser/Databrowser.scss

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -19,22 +19,22 @@
1919
}
2020

2121
.chartPanel {
22-
position: fixed !important;
22+
position: fixed;
2323
top: 262px;
2424
right: 0%;
2525
bottom: 40px;
26-
width: 700px !important;
27-
max-height: 620px !important;
28-
height: auto !important;
29-
background-color: red !important;
26+
width: 700px;
27+
max-height: 620px;
28+
height: auto;
29+
background-color: white;
3030
box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1);
3131
z-index: 1000;
3232

33-
// Garantir que não seja colapsado
34-
flex-shrink: 0 !important;
35-
flex-grow: 0 !important;
36-
min-width: 400px !important;
37-
max-width: 800px !important;
33+
// Ensure it doesn't collapse
34+
flex-shrink: 0;
35+
flex-grow: 0;
36+
min-width: 400px;
37+
max-width: 800px;
3838
}
3939

4040
.chartPanelContainer {
@@ -57,7 +57,7 @@
5757
display: flex;
5858
flex-direction: column;
5959

60-
// Garantir que não seja colapsado
60+
// Ensure it doesn't collapse
6161
flex-shrink: 0;
6262
flex-grow: 0;
6363
}

0 commit comments

Comments
 (0)