ui: fix sankey crash, fix journey startpoint size

This commit is contained in:
nick-delirium 2025-03-03 12:36:26 +01:00
parent 6af9f719c8
commit 83f8b67f74
No known key found for this signature in database
GPG key ID: 93ABD695DF5FDBA0
2 changed files with 18 additions and 21 deletions

View file

@ -39,26 +39,10 @@ const EChartsSankey: React.FC<Props> = (props) => {
const { data, height = 240, onChartClick, isUngrouped } = props; const { data, height = 240, onChartClick, isUngrouped } = props;
const chartRef = React.useRef<HTMLDivElement>(null); const chartRef = React.useRef<HTMLDivElement>(null);
if (data.nodes.length === 0 || data.links.length === 0) {
return (
<NoContent
style={{ minHeight: height }}
title={
<div className="flex items-center relative">
<InfoCircleOutlined className="hidden md:inline-block mr-1" />
Set a start or end point to visualize the journey. If set, try
adjusting filters.
</div>
}
show={true}
/>
);
}
const [finalNodeCount, setFinalNodeCount] = React.useState(data.nodes.length); const [finalNodeCount, setFinalNodeCount] = React.useState(data.nodes.length);
React.useEffect(() => { React.useEffect(() => {
if (!chartRef.current) return; if (!chartRef.current || data.nodes.length === 0 || data.links.length === 0) return;
let finalNodes = data.nodes; let finalNodes = data.nodes;
let finalLinks = data.links; let finalLinks = data.links;
@ -440,6 +424,21 @@ const EChartsSankey: React.FC<Props> = (props) => {
}; };
}, [data, height, onChartClick]); }, [data, height, onChartClick]);
if (data.nodes.length === 0 || data.links.length === 0) {
return (
<NoContent
style={{ minHeight: height }}
title={
<div className="flex items-center relative">
<InfoCircleOutlined className="hidden md:inline-block mr-1" />
Set a start or end point to visualize the journey. If set, try
adjusting filters.
</div>
}
show={true}
/>
);
}
let containerStyle: React.CSSProperties; let containerStyle: React.CSSProperties;
if (isUngrouped) { if (isUngrouped) {
const dynamicMinHeight = finalNodeCount * 15; const dynamicMinHeight = finalNodeCount * 15;

View file

@ -207,7 +207,7 @@ const PathAnalysisFilter = observer(({ metric, writeOption }: any) => {
<span className="font-medium">Journeys With </span> <span className="font-medium">Journeys With </span>
<div className="flex gap-2 items-center"> <div className="flex gap-2 items-center">
<Select <Select
className="w-36 rounded-lg !h-[26px]" className="w-36 rounded-lg"
name="startType" name="startType"
options={[ options={[
{ value: 'start', label: 'Start Point' }, { value: 'start', label: 'Start Point' },
@ -216,21 +216,19 @@ const PathAnalysisFilter = observer(({ metric, writeOption }: any) => {
defaultValue={metric.startType || 'start'} defaultValue={metric.startType || 'start'}
onChange={onPointChange} onChange={onPointChange}
placeholder="Select Start Type" placeholder="Select Start Type"
size="small"
/> />
<span className="">showing</span> <span className="">showing</span>
<Select <Select
mode="multiple" mode="multiple"
className="rounded-lg h-[26px] w-max min-w-44 max-w-58" className="rounded-lg w-max min-w-44 max-w-58"
allowClear allowClear
name="metricValue" name="metricValue"
options={metricValueOptions} options={metricValueOptions}
value={metric.metricValue || []} value={metric.metricValue || []}
onChange={(value) => writeOption({ name: 'metricValue', value })} onChange={(value) => writeOption({ name: 'metricValue', value })}
placeholder="Select Metrics" placeholder="Select Metrics"
size="small"
maxTagCount={'responsive'} maxTagCount={'responsive'}
showSearch={false} showSearch={false}
/> />