diff --git a/grafana-plugin/src/containers/IntegrationContainers/RouteHeading.tsx b/grafana-plugin/src/containers/IntegrationContainers/RouteHeading.tsx index f55317cee5..38fd9d06e1 100644 --- a/grafana-plugin/src/containers/IntegrationContainers/RouteHeading.tsx +++ b/grafana-plugin/src/containers/IntegrationContainers/RouteHeading.tsx @@ -55,32 +55,42 @@ const RouteHeadingDisplay: React.FC<{ channelFilter: ChannelFilter }> = ({ chann const styles = useStyles2(getStyles); const hasLabels = store.hasFeature(AppFeature.Labels); + const renderWarning = (text: string) => ( + <> +
+ +
+ {text} + + ); + if (channelFilter?.filtering_term || channelFilter?.filtering_labels) { return ( <> - - {channelFilter.filtering_term} - + {channelFilter.filtering_term && ( + + {channelFilter.filtering_term} + + )} + + {/* Show missing template warning */} + {!channelFilter.filtering_term && renderWarning('Routing template not set')} - + {channelFilter.filtering_labels?.length > 0 && } + + {/* Show missing labels warning */} + {!channelFilter.filtering_labels?.length && renderWarning('Routing labels not set')} ); } - return ( - <> -
- -
- Routing template not set - - ); + return renderWarning('Routing template not set'); }; const getStyles = (theme: GrafanaTheme2) => { diff --git a/grafana-plugin/src/containers/RouteLabelsDisplay/RouteLabelsDisplay.tsx b/grafana-plugin/src/containers/RouteLabelsDisplay/RouteLabelsDisplay.tsx index cd3c64fcd5..18692e91c7 100644 --- a/grafana-plugin/src/containers/RouteLabelsDisplay/RouteLabelsDisplay.tsx +++ b/grafana-plugin/src/containers/RouteLabelsDisplay/RouteLabelsDisplay.tsx @@ -82,6 +82,6 @@ export const RouteLabelsDisplay: React.FC = ({ labels, }; const getIsAddBtnDisabled = (labels: Array = []) => { - const lastItem = labels.at(-1); + const lastItem = labels?.at(-1); return lastItem && (lastItem.key?.id === undefined || lastItem.value?.id === undefined); }; diff --git a/grafana-plugin/src/pages/integration/Integration.tsx b/grafana-plugin/src/pages/integration/Integration.tsx index 6f2ec9b696..8d78a98bc0 100644 --- a/grafana-plugin/src/pages/integration/Integration.tsx +++ b/grafana-plugin/src/pages/integration/Integration.tsx @@ -654,6 +654,7 @@ class _IntegrationPage extends React.Component ( (