add dev envs; add lookbackPeriod

This commit is contained in:
Avraham Sakal
2024-02-04 18:15:38 -05:00
parent dc63f31647
commit 63185f485f
11 changed files with 82 additions and 5 deletions
@@ -32,12 +32,17 @@ const historicalCalendarQuoteChartData = signal([]);
const historicalCalendarExitQuoteChartData = signal([]);
const chosenLookbackPeriodStart = signal("2022-01-01");
const chosenLookbackPeriodEnd = signal("2024-01-01");
export function HistoricalCalendarPrices(){
const refreshHistoricalStockQuoteChartData = useCallback(()=>{
trpc.getHistoricalStockQuoteChartData
.query({
underlying:chosenUnderlying.value,
lookbackPeriodStart:chosenLookbackPeriodStart.value,
lookbackPeriodEnd:chosenLookbackPeriodEnd.value,
})
.then((getHistoricalStockQuoteChartDataResponse)=>{
historicalStockQuoteChartData.value = getHistoricalStockQuoteChartDataResponse;
@@ -51,6 +56,8 @@ export function HistoricalCalendarPrices(){
daysBetweenFrontAndBackExpiration:chosenDaysBetweenFrontAndBackExpiration.value,
strikePercentageFromUnderlyingPriceRangeMin:chosenStrikePercentageFromUnderlyingPrice.value - chosenStrikePercentageFromUnderlyingPriceRadius.value,
strikePercentageFromUnderlyingPriceRangeMax:chosenStrikePercentageFromUnderlyingPrice.value + chosenStrikePercentageFromUnderlyingPriceRadius.value,
lookbackPeriodStart:chosenLookbackPeriodStart.value,
lookbackPeriodEnd:chosenLookbackPeriodEnd.value,
})
.then((getHistoricalCalendarQuoteChartDataResponse)=>{
historicalCalendarQuoteChartData.value = getHistoricalCalendarQuoteChartDataResponse;
@@ -62,6 +69,8 @@ export function HistoricalCalendarPrices(){
underlying:chosenUnderlying.value,
daysToFrontExpiration:chosenExitToFrontExpiration.value,
daysBetweenFrontAndBackExpiration:chosenDaysBetweenFrontAndBackExpiration.value,
lookbackPeriodStart:chosenLookbackPeriodStart.value,
lookbackPeriodEnd:chosenLookbackPeriodEnd.value,
})
.then((getHistoricalCalendarExitQuoteChartDataResponse)=>{
historicalCalendarExitQuoteChartData.value = getHistoricalCalendarExitQuoteChartDataResponse;
@@ -106,6 +115,19 @@ export function HistoricalCalendarPrices(){
refreshHistoricalCalendarExitQuoteChartData();
},[]);
const handleLookbackPeriodStartChange = useCallback((e)=>{
chosenLookbackPeriodStart.value = e.target.value;
refreshHistoricalStockQuoteChartData();
refreshHistoricalCalendarQuoteChartData();
refreshHistoricalCalendarExitQuoteChartData();
},[]);
const handleLookbackPeriodEndChange = useCallback((e)=>{
chosenLookbackPeriodEnd.value = e.target.value;
refreshHistoricalStockQuoteChartData();
refreshHistoricalCalendarQuoteChartData();
refreshHistoricalCalendarExitQuoteChartData();
},[]);
useEffect(handleInit, []);
return (
@@ -145,6 +167,12 @@ export function HistoricalCalendarPrices(){
<input type="text" onChange={handleExitToFrontExpirationChange} value={chosenExitToFrontExpiration.value} />
Days
</div>
<div>
<label>Lookback Period</label>
<input type="text" onChange={handleLookbackPeriodStartChange} value={chosenLookbackPeriodStart.value} />
-
<input type="text" onChange={handleLookbackPeriodEndChange} value={chosenLookbackPeriodEnd.value} />
</div>
<div className="chart-container">
{chosenUnderlying.value!==null && historicalStockQuoteChartData.value.length>0
? <div className="chart">