back-testing-react 1.0.5 → 1.0.7

package/src/components/back-testing-wizard/back-testing-wizard.tsx

@@ -0,0 +1,103 @@
+import "./back-testing-wizard.css"
+
+import React from "react";
+import { BackTestingMap } from "../back-testing-map";
+import { generateInitialPayoutRequest, PayoutRequest } from "../back-testing-map/back-testing-map.types";
+import BackTestingStepper from "../back-testing-stepper/back-testing-stepper";
+import { BackTestingWizardProps } from "./back-testing-wizard.types";
+import { StormPayout } from "../back-testing-map/back-testing-map.service";
+import { PayoutWizardStepType, RadioChoice } from "../back-testing-stepper/steps/step.types";
+
+function BackTestingWizard(props: BackTestingWizardProps){
+
+    const [payoutRequest, setPayoutRequest] = React.useState(generateInitialPayoutRequest());
+    const [stormPayouts, setStormPayouts] = React.useState<StormPayout[]>([])
+    const [mapInstanceRef, setMapInstanceRef] = React.useState<React.MutableRefObject<mapboxgl.Map | undefined>>();
+
+    const [wizardStep, setWizardStep] = React.useState<PayoutWizardStepType>(PayoutWizardStepType.INPUT_LOCATION);
+    const [proxyChoice, setProxyChoice] = React.useState<RadioChoice>(RadioChoice.DEFAULT);
+    const [anemometerChoice, setAnemometerChoice] = React.useState<RadioChoice>(RadioChoice.DEFAULT);
+    const [ciacChoice, setCIACChoice] = React.useState<RadioChoice>(RadioChoice.DEFAULT);
+    const [selectedProxyPayoutOption, setProxyPayoutOption] = React.useState<number>(props.selectedProxyPayoutOptionIndex);
+    const [selectedAnemometerPayoutOption, setAnemometerPayoutOption] = React.useState<number>(props.selectedAnemometerPayoutOptionIndex);
+    const [selectedCIACPayoutOption, setCIACPayoutOption] = React.useState<number>(props.selectedCIACPayoutOptionIndex);
+    const [isCalculatePayoutsEnabled, setCalculatePayoutsEnabled] = React.useState<boolean>(false);
+    const [appStatus, setAppStatus] = React.useState<'loading'|'idle'>('idle');
+
+
+    const handlePayoutRequestChange = (e: PayoutRequest) => {
+        setPayoutRequest(e);
+    }
+
+    const handleStormPayoutsChange = (e:StormPayout[]) => {
+        setStormPayouts(e);
+    }
+
+    return (
+        <div className="wizard-container">
+            <aside className="side-panel">
+                {props.apiAccessToken && mapInstanceRef && mapInstanceRef.current &&
+                <BackTestingStepper 
+                    mapAccessToken={props.mapAccessToken} 
+                    apiKey={props.apiAccessToken}
+                    mapInstanceRef={mapInstanceRef}
+                    payoutRequest={payoutRequest}
+                    onPayoutRequestChange={handlePayoutRequestChange}
+                    stormPayouts={stormPayouts}
+                    currentStep={wizardStep}
+                    onCurrentStepChange={setWizardStep}
+                    proxyChoice={proxyChoice}
+                    onProxyChoiceChange={setProxyChoice}
+                    anemometerChoice={anemometerChoice}
+                    onAnemometerChoiceChange={setAnemometerChoice}
+                    ciacChoice={ciacChoice}
+                    onCIACChoiceChange={setCIACChoice}
+                    proxyPayoutOptions={props.proxyPayoutOptions}
+                    anemometerPayoutOptions={props.anemometerPayoutOptions}
+                    ciacPayoutOptions={props.ciacPayoutOptions}
+                    selectedProxyPayoutOptionIndex={selectedProxyPayoutOption}
+                    selectedAnemometerPayoutOptionIndex={selectedAnemometerPayoutOption}
+                    selectedCIACPayoutOptionIndex={selectedCIACPayoutOption}
+                    onProxyPayoutOptionChange={setProxyPayoutOption}
+                    onAnemometerPayoutOptionChange={setAnemometerPayoutOption}
+                    onCIACPayoutOptionChange={setCIACPayoutOption}
+                    onStormPayoutsChanged={setStormPayouts}
+                    onCalculatePayoutEnabledChanged={setCalculatePayoutsEnabled}
+                    appStatus={appStatus}
+                    >
+                </BackTestingStepper>
+                }
+            </aside>
+            <section className="main-panel">
+                {props.apiAccessToken && 
+                <BackTestingMap 
+                    apiAccessToken={props.apiAccessToken} 
+                    mapAccessToken={props.mapAccessToken}
+                    env={props.env}
+                    appStatus={appStatus}
+                    onAppStatusChange={setAppStatus}
+                    location={payoutRequest.longitude && payoutRequest.latitude ? {longitude: payoutRequest.longitude, latitude:payoutRequest.latitude} : undefined}
+                    ciacRadius={payoutRequest.ciac.shapes[0].radius}
+                    anemometerCode={payoutRequest.anemometer.code}
+                    proxyPayouts={payoutRequest.proxy.payouts}
+                    anemometerPayouts={payoutRequest.anemometer.payouts}
+                    stormPayouts={stormPayouts}
+                    ciacPayouts={payoutRequest.ciac.payouts}
+                    proxyEnabled={payoutRequest.proxy.enabled}
+                    anemometerEnabled={payoutRequest.anemometer.enabled}
+                    ciacEnabled={payoutRequest.ciac.enabled}
+                    includeNoNameStorms={payoutRequest.ciac.includeNotNamedStorms}
+                    includeZeroPayouts={payoutRequest.includeZeroPayouts}
+                    limit={payoutRequest.limit}
+                    isCalculatePayoutEnabled={isCalculatePayoutsEnabled}
+                    onCalculatePayouts={(e:StormPayout[]) => {handleStormPayoutsChange(e)}}
+                    onCalculatePayoutEnabledChanged={setCalculatePayoutsEnabled}
+                    onLoad={(e:React.MutableRefObject<mapboxgl.Map | undefined>) => setMapInstanceRef(e)}>
+                </BackTestingMap>
+                }
+            </section>
+        </div>
+    )
+}
+
+export default BackTestingWizard

package/src/components/back-testing-wizard/back-testing-wizard.types.ts

@@ -0,0 +1,13 @@
+import { Payout } from "../back-testing-map/back-testing-map.types";
+
+export interface BackTestingWizardProps {
+    apiAccessToken:string,
+    mapAccessToken:string,
+    env: 'dev'|'uat'|'prod',
+    selectedProxyPayoutOptionIndex:number;
+    proxyPayoutOptions: {key:string,value: Payout[]}[],
+    selectedAnemometerPayoutOptionIndex:number;
+    anemometerPayoutOptions: {key:string,value: Payout[]}[],
+    selectedCIACPayoutOptionIndex:number;
+    ciacPayoutOptions: {key:string,value: Payout[]}[],
+}