Price chart - Disabled fixed Y axis scale

BeanstalkFarms · Jul 6, 2023 · acc0890 · acc0890
1 parent 76091a1
commit acc0890
Show file tree

Hide file tree

Showing 5 changed files with 10 additions and 4 deletions.
diff --git a/projects/ui/src/components/Analytics/Bean/Price.tsx b/projects/ui/src/components/Analytics/Bean/Price.tsx
@@ -19,7 +19,7 @@ const statProps = {
   gap: 0.25,
 };
 const lineChartProps: Partial<LineChartProps> = {
-  isTWAP: true,
+  pegLine: true,
   yTickFormat: tickFormatBeanPrice,
 };
 

diff --git a/projects/ui/src/components/Common/Charts/ChartPropProvider.tsx b/projects/ui/src/components/Common/Charts/ChartPropProvider.tsx
@@ -105,6 +105,7 @@ type UtilProps = {
     width: number,
     keys: string[],
     stackedArea?: boolean,
+    pegLine?: boolean,
     isTWAP?: boolean
   ) => Scales[];
   getPointerValue: (
@@ -136,6 +137,7 @@ export type BaseChartProps = {
   keys: string[];
   curve?: CurveFactory | keyof typeof CURVES;
   scale?: keyof typeof SCALES;
+  pegLine?: boolean;
   isTWAP?: boolean;
   horizontalLineNumber?: number;
   stylesConfig?: ChartMultiStyles;
@@ -389,6 +391,7 @@ const generateScale = (
   width: number,
   keys: string[],
   isStackedArea?: boolean,
+  pegLine?: boolean,
   isTWAP?: boolean
 ) =>
   seriesData.map((data) => {

diff --git a/projects/ui/src/components/Common/Charts/LineChart.tsx b/projects/ui/src/components/Common/Charts/LineChart.tsx
@@ -50,6 +50,7 @@ export type DataRegion = {
 export type LineChartProps = {
   series: BaseDataPoint[][];
   onCursor?: (ds?: BaseDataPoint[]) => void;
+  pegLine?: boolean; // used to display a line at the $1 peg
   isTWAP?: boolean; // used to indicate if we are displaying TWAP price
   curve?: CurveFactory | keyof typeof CURVES;
   children?: (
@@ -103,6 +104,7 @@ const Graph: React.FC<GraphProps> = (props) => {
     // Line Chart Props
     series: _series,
     onCursor,
+    pegLine,
     isTWAP,
     curve: _curve = 'linear',
     children,
@@ -234,7 +236,7 @@ const Graph: React.FC<GraphProps> = (props) => {
           width={width - yAxisWidth}
           height={dataRegion.yBottom - dataRegion.yTop}
         >
-          {isTWAP && (
+          {(isTWAP || pegLine) && (
             <Line
               from={{ x: 0, y: scales[0].yScale(1) }}
               to={{ x: width - yAxisWidth, y: scales[0].yScale(1) }}

diff --git a/projects/ui/src/components/Common/Charts/MultiLineChart.tsx b/projects/ui/src/components/Common/Charts/MultiLineChart.tsx
@@ -33,6 +33,7 @@ const MultiLineChartInner: React.FC<Props> = (props) => {
     // Line Chart Props
     series,
     onCursor,
+    pegLine,
     isTWAP,
     curve: _curve,
     children,
@@ -170,7 +171,7 @@ const MultiLineChartInner: React.FC<Props> = (props) => {
           height={dataRegion.yBottom - dataRegion.yTop}
         >
           {/** Add TWAP line */}
-          {isTWAP && (
+          {(isTWAP || pegLine) && (
             <Line
               from={{ x: 0, y: scales[0].yScale(1) }}
               to={{ x: width - common.yAxisWidth, y: scales[0].yScale(1) }}

diff --git a/projects/ui/src/components/Common/Charts/SeasonPlot.tsx b/projects/ui/src/components/Common/Charts/SeasonPlot.tsx
@@ -62,7 +62,7 @@ type SeasonPlotFinalProps<T extends MinimumViableSnapshotQuery> =
     dateKey?: 'timestamp' | 'createdAt';
     queryConfig?: Partial<QueryOptions>;
     StatProps: Omit<StatProps, 'amount' | 'subtitle'>;
-    LineChartProps?: Pick<BaseChartProps, 'curve' | 'isTWAP'>;
+    LineChartProps?: Pick<BaseChartProps, 'curve' | 'isTWAP' | 'pegLine'>;
     statsRowFullWidth?: boolean;
   };