From ca99393de7b2c0dfbece6fd2978bdeed4ba91c56 Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Mon, 7 Mar 2022 14:10:45 +0100
Subject: [PATCH] change(ui) - filter series name

---
 .../shared/CustomMetrics/FilterSeries/FilterSeries.tsx        | 2 +-
 .../CustomMetrics/FilterSeries/SeriesName/SeriesName.tsx      | 4 +++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/app/components/shared/CustomMetrics/FilterSeries/FilterSeries.tsx b/frontend/app/components/shared/CustomMetrics/FilterSeries/FilterSeries.tsx
index aea20aea1..34388ba63 100644
--- a/frontend/app/components/shared/CustomMetrics/FilterSeries/FilterSeries.tsx
+++ b/frontend/app/components/shared/CustomMetrics/FilterSeries/FilterSeries.tsx
@@ -55,7 +55,7 @@ function FilterSeries(props: Props) {
     <div className="border rounded bg-white">
       <div className={cn("border-b px-5 h-12 flex items-center relative", { 'hidden': hideHeader })}>
         <div className="mr-auto">
-          <SeriesName name={series.name} onUpdate={(name) => props.updateSeries(seriesIndex, { name }) } />
+          <SeriesName seriesIndex={seriesIndex} name={series.name} onUpdate={(name) => props.updateSeries(seriesIndex, { name }) } />
         </div>    
     
         <div className="flex items-center cursor-pointer" >
diff --git a/frontend/app/components/shared/CustomMetrics/FilterSeries/SeriesName/SeriesName.tsx b/frontend/app/components/shared/CustomMetrics/FilterSeries/SeriesName/SeriesName.tsx
index 75054fc6b..5b5d5463c 100644
--- a/frontend/app/components/shared/CustomMetrics/FilterSeries/SeriesName/SeriesName.tsx
+++ b/frontend/app/components/shared/CustomMetrics/FilterSeries/SeriesName/SeriesName.tsx
@@ -4,8 +4,10 @@ import { Icon } from 'UI';
 interface Props {
   name: string;
   onUpdate: (name) => void;
+  seriesIndex?: number;
 }
 function SeriesName(props: Props) {
+  const { seriesIndex } = props;
   const [editing, setEditing] = useState(false)
   const [name, setName] = useState(props.name)
   const ref = useRef<any>(null)
@@ -44,7 +46,7 @@ function SeriesName(props: Props) {
           onFocus={() => setEditing(true)}
         />
       ) : (
-        <div className="text-base h-8 flex items-center border-transparent">{name}</div>
+        <div className="text-base h-8 flex items-center border-transparent">{name.trim() === '' ? 'Seriess ' + (seriesIndex + 1) : name }</div>
       )}
       
       <div className="ml-3 cursor-pointer" onClick={() => setEditing(true)}><Icon name="pencil" size="14" /></div>