Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Security: Ensure type safety of dependent fields #33486

Merged
merged 5 commits into from
Dec 19, 2024
Merged

Security: Ensure type safety of dependent fields #33486

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
6d704d2
Ensure type safety of dependent fields
Anush2303 Dec 18, 2024
b90ec2a
Add change file
Anush2303 Dec 18, 2024
76d5ba3
controlled legend multi select fix
Anush2303 Dec 18, 2024
c4f017c
resolve comments
Anush2303 Dec 18, 2024
14b236e
resolve comments
Anush2303 Dec 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 7 additions & 0 deletions change/@fluentui-react-charting-f56dc096-9891-4d5c-ae30-4d8a6ac5b481.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
{
Anush2303 marked this conversation as resolved.
Show resolved Hide resolved
"type": "patch",
"comment": "Ensure type safety of dependent fields",
"packageName": "@fluentui/react-charting",
"email": "74965306+Anush2303@users.noreply.github.com",
"dependentChangeType": "patch"
}
2 changes: 1 addition & 1 deletion packages/charts/react-charting/src/components/DeclarativeChart/DeclarativeChart.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,7 @@ export const DeclarativeChart: React.FunctionComponent<DeclarativeChartProps> =
<LineChart
{...transformPlotlyJsonToScatterChartProps({ data, layout }, false, colorMap, isDarkTheme)}
legendProps={{
...legendProps,
onChange: onActiveLegendsChange,
canSelectMultipleLegends: true,
selectedLegends: activeLegends,
}}
Expand Down
56 changes: 28 additions & 28 deletions packages/charts/react-charting/src/components/DeclarativeChart/PlotlySchemaAdapter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,19 +65,19 @@ export const transformPlotlyJsonToDonutProps = (
};
});

const width: number = layout?.width || 440;
const height: number = layout?.height || 220;
const hideLabels = firstData.textinfo ? !['value', 'percent'].includes(firstData.textinfo) : false;
const donutMarginHorizontal = hideLabels ? 0 : 80;
const donutMarginVertical = 40 + (hideLabels ? 0 : 40);
const width: number = typeof layout?.width === 'number' ? layout?.width : 440;
const height: number = typeof layout?.height === 'number' ? layout?.height : 220;
const hideLabels: boolean = firstData.textinfo ? !['value', 'percent'].includes(firstData.textinfo) : false;
const donutMarginHorizontal: number = hideLabels ? 0 : 80;
const donutMarginVertical: number = 40 + (hideLabels ? 0 : 40);
const innerRadius: number = firstData.hole
? firstData.hole * (Math.min(width - donutMarginHorizontal, height - donutMarginVertical) / 2)
: 0;

const styles: IDonutChartProps['styles'] = {
root: {
'[class^="arcLabel"]': {
fontSize: firstData.textfont?.size,
fontSize: typeof firstData.textfont?.size === 'number' ? firstData.textfont?.size : undefined,
Anush2303 marked this conversation as resolved.
Show resolved Hide resolved
},
},
};
Expand Down Expand Up @@ -222,8 +222,8 @@ export const transformPlotlyJsonToVBCProps = (
const totalDataPoints = d3Merge(buckets).length;

buckets.forEach(bucket => {
const legend = series.name || `Series ${index + 1}`;
const color = getColor(legend, colorMap, isDarkTheme);
const legend: string = series.name || `Series ${index + 1}`;
const color: string = getColor(legend, colorMap, isDarkTheme);
let y = bucket.length;

if (series.histnorm === 'percent') {
Expand Down Expand Up @@ -256,7 +256,7 @@ export const transformPlotlyJsonToVBCProps = (

return {
data: vbcData,
chartTitle: layout?.title,
chartTitle: typeof layout?.title === 'string' ? layout?.title : '',
// width: layout?.width,
// height: layout?.height,
hideLegend: true,
Expand All @@ -278,7 +278,7 @@ export const transformPlotlyJsonToScatterChartProps = (
const isString = typeof xValues[0] === 'string';
const isXDate = isDateArray(xValues);
const isXNumber = isNumberArray(xValues);
const legend = series.name || `Series ${index + 1}`;
const legend: string = series.name || `Series ${index + 1}`;
const lineColor = getColor(legend, colorMap, isDarkTheme);

return {
Expand All @@ -292,7 +292,7 @@ export const transformPlotlyJsonToScatterChartProps = (
});

const chartProps: IChartProps = {
chartTitle: layout.title || '',
chartTitle: typeof layout.title === 'string' ? layout.title : '',
lineChartData: chartData,
};

Expand Down Expand Up @@ -330,24 +330,24 @@ export const transformPlotlyJsonToHorizontalBarWithAxisProps = (
})
.flat();

const chartHeight = layout.height || 450;
const margin = layout.margin?.l || 0;
const padding = layout.margin?.pad || 0;
const availableHeight = chartHeight - margin - padding;
const chartHeight: number = typeof layout.height === 'number' ? layout.height : 450;
const margin: number = typeof layout.margin?.l === 'number' ? layout.margin?.l : 0;
const padding: number = typeof layout.margin?.pad === 'number' ? layout.margin?.pad : 0;
const availableHeight: number = chartHeight - margin - padding;
const numberOfBars = data[0].y.length;
const scalingFactor = 0.01;
const gapFactor = 1 / (1 + scalingFactor * numberOfBars);
const barHeight = availableHeight / (numberOfBars * (1 + gapFactor));

return {
data: chartData,
chartTitle: layout.title || '',
chartTitle: typeof layout.title === 'string' ? layout.title : '',
barHeight,
showYAxisLables: true,
styles: {
root: {
height: chartHeight,
width: layout.width || 600,
width: typeof layout.width === 'number' ? layout.width : 600,
},
},
};
Expand Down Expand Up @@ -375,7 +375,7 @@ export const transformPlotlyJsonToHeatmapProps = (jsonObj: any): IHeatMapChartPr
});
});
const heatmapData: IHeatMapChartData = {
legend: firstData.name || '',
legend: typeof firstData.name === 'string' ? firstData.name : '',
data: heatmapDataPoints,
value: 0,
};
Expand Down Expand Up @@ -429,17 +429,17 @@ export const transformPlotlyJsonToSankeyProps = (
}),
};

const width: number = layout?.width || 440;
const height: number = layout?.height || 220;
const width: number = typeof layout?.width === 'number' ? layout?.width : 440;
AtishayMsft marked this conversation as resolved.
Show resolved Hide resolved
const height: number = typeof layout?.height === 'number' ? layout?.height : 220;
const styles: ISankeyChartProps['styles'] = {
root: {
fontSize: layout.font?.size,
fontSize: typeof layout.font?.size === 'number' ? layout.font?.size : undefined,
},
};
const shouldResize: number = width + height;
return {
data: {
chartTitle: layout?.title,
chartTitle: typeof layout?.title === 'string' ? layout?.title : '',
SankeyChartData: sankeyChartData,
},
width,
Expand Down Expand Up @@ -491,15 +491,15 @@ export const transformPlotlyJsonToGaugeProps = (

return {
segments,
chartValue: firstData.value,
chartTitle: firstData.title?.text,
chartValue: typeof firstData.value === 'number' ? firstData.value : 0,
chartTitle: typeof firstData.title?.text === 'string' ? firstData.title?.text : '',
sublabel,
// range values can be null
minValue: firstData.gauge?.axis?.range?.[0] ?? undefined,
maxValue: firstData.gauge?.axis?.range?.[1] ?? undefined,
minValue: typeof firstData.gauge?.axis?.range?.[0] === 'number' ? firstData.gauge?.axis?.range?.[0] : undefined,
maxValue: typeof firstData.gauge?.axis?.range?.[1] === 'number' ? firstData.gauge?.axis?.range?.[1] : undefined,
chartValueFormat: () => firstData.value,
width: layout?.width,
height: layout?.height,
width: typeof layout?.width === 'number' ? layout?.width : 0,
height: typeof layout?.height === 'number' ? layout?.height : 0,
hideLegend: true,
styles,
};
Expand Down
Loading