diff --git a/ui/src/console/detail/environment/SharesTab.js b/ui/src/console/detail/environment/SharesTab.js
index 550a1e5c..e902529c 100644
--- a/ui/src/console/detail/environment/SharesTab.js
+++ b/ui/src/console/detail/environment/SharesTab.js
@@ -46,7 +46,7 @@ const SharesTab = (props) => {
             cell: row => {
                 return <ResponsiveContainer width={"100%"} height={"100%"}>
                     <AreaChart data={row.metrics}>
-                        <Area type="linearClosed" dataKey={(v) => v} stroke={"#231069"} fillOpacity={1} fill={"#655796"} isAnimationActive={false} dot={false} />
+                        <Area type="basis" dataKey={(v) => v} stroke={"#231069"} fillOpacity={1} fill={"#655796"} isAnimationActive={false} dot={false} />
                     </AreaChart>
                 </ResponsiveContainer>
             }
diff --git a/ui/src/console/detail/share/ShareDetail.js b/ui/src/console/detail/share/ShareDetail.js
index 8b86171c..78371e1f 100644
--- a/ui/src/console/detail/share/ShareDetail.js
+++ b/ui/src/console/detail/share/ShareDetail.js
@@ -42,7 +42,7 @@ const ShareDetail = (props) => {
         metrics: row => (
             <ResponsiveContainer width={"100%"} height={"100%"}>
                 <AreaChart data={row.value}>
-                    <Area type="linearClosed" dataKey={(v) => v} stroke={"#231069"} fillOpacity={1} fill={"#655796"} isAnimationActive={false} dot={false} />
+                    <Area type="basis" dataKey={(v) => v} stroke={"#231069"} fillOpacity={1} fill={"#655796"} isAnimationActive={false} dot={false} />
                 </AreaChart>
             </ResponsiveContainer>
         ),