Implementing traders' strategies

rylorin · Jan 6, 2025 · 22b141c · 22b141c
1 parent c2142c5
commit 22b141c
Show file tree

Hide file tree

Showing 7 changed files with 359 additions and 258 deletions.
diff --git a/src/app/components/Portfolio/Setting/SettingEdit.tsx b/src/app/components/Portfolio/Setting/SettingEdit.tsx
@@ -3,7 +3,7 @@ import { Flex, IconButton, Select, Text, VStack } from "@chakra-ui/react";
 import { Field, Formik, FormikProps } from "formik";
 import React, { FunctionComponent } from "react";
 import { Form, useLoaderData, useNavigate, useSubmit } from "react-router-dom";
-import { StrategySetting } from "../../../../models/types";
+import { cspStrategy2String, CspStrategySetting, StrategySetting } from "../../../../models/types";
 import { SettingEntry } from "../../../../routers/";
 import { settingEditLoader } from "./loaders";
 
@@ -64,14 +64,6 @@ const SettingEdit: FunctionComponent<Props> = ({ ..._rest }): React.ReactNode =>
                   <Field name="lookupDays" type="number" />
                 </Text>
               </Flex>
-              <Flex justifyContent="center" gap="2">
-                <Text w="180px" as="b" textAlign="right">
-                  NAV ratio:
-                </Text>
-                <Text w="200px">
-                  <Field name="navRatio" type="number" />
-                </Text>
-              </Flex>
               <Flex justifyContent="center" gap="2">
                 <Text w="180px" as="b" textAlign="right">
                   Premium:
@@ -85,13 +77,21 @@ const SettingEdit: FunctionComponent<Props> = ({ ..._rest }): React.ReactNode =>
                   CSP strat.:
                 </Text>
                 <Field as={Select} name="cspStrategy" w="200px" type="number" variant="outline">
-                  {Object.entries(StrategySetting).map((v, k) => (
+                  {Object.entries(CspStrategySetting).map((v, k) => (
                     <option value={v[1]} key={`k${k}`}>
                       {v[0]} ({v[1]})
                     </option>
                   ))}
                 </Field>
               </Flex>
+              <Flex justifyContent="center" gap="2">
+                <Text w="180px" as="b" textAlign="right">
+                  {cspStrategy2String(setting.cspStrategy)} Ratio:
+                </Text>
+                <Text w="200px">
+                  <Field name="navRatio" type="number" />
+                </Text>
+              </Flex>
               <Flex justifyContent="center" gap="2">
                 <Text w="180px" as="b" textAlign="right">
                   CSP Roll:

diff --git a/src/app/components/Portfolio/Setting/SettingShow.tsx b/src/app/components/Portfolio/Setting/SettingShow.tsx
@@ -3,7 +3,7 @@ import { Flex, Text, VStack } from "@chakra-ui/layout";
 import { IconButton } from "@chakra-ui/react";
 import React, { FunctionComponent } from "react";
 import { Form, Link as RouterLink, useLoaderData, useNavigate, useParams } from "react-router-dom";
-import { strategy2String } from "../../../../models/types";
+import { cspStrategy2String, strategy2String } from "../../../../models/types";
 import Number from "../../Number/Number";
 import { settingLoader } from "./loaders";
 
@@ -57,7 +57,7 @@ const SettingShow: FunctionComponent<SettingShowProps> = ({ ..._rest }): React.R
           CSP strat.:
         </Text>
         <Text textAlign="left" w="120px">
-          {strategy2String(thisItem.cspStrategy)}
+          {cspStrategy2String(thisItem.cspStrategy)}
         </Text>
       </Flex>
       <Flex justifyContent="center" gap="2">

diff --git a/src/app/components/Portfolio/Setting/SettingsTable.tsx b/src/app/components/Portfolio/Setting/SettingsTable.tsx
@@ -3,7 +3,7 @@ import { DeleteIcon, EditIcon, PlusSquareIcon, SearchIcon } from "@chakra-ui/ico
 import { IconButton, Link, Table, TableCaption, TableContainer, Tbody, Td, Tfoot, Thead, Tr } from "@chakra-ui/react";
 import { FunctionComponent, default as React } from "react";
 import { Form, Link as RouterLink, useLoaderData, useParams } from "react-router-dom";
-import { strategy2String } from "../../../../models/setting.types";
+import { cspStrategy2String, strategy2String } from "../../../../models/setting.types";
 import Number from "../../Number/Number";
 import { SettingLink } from "./links";
 
@@ -29,9 +29,9 @@ const SettingsTable: FunctionComponent<Props> = ({ content, ..._rest }): React.R
             <Tr>
               <Td>Symbol</Td>
               <Td>Lookup</Td>
-              <Td>NAV Ratio</Td>
               <Td>Prem.</Td>
               <Td>CSP strat.</Td>
+              <Td>Ratio</Td>
               <Td>CSP Roll</Td>
               <Td>CC strat.</Td>
               <Td>CC delta</Td>
@@ -49,12 +49,12 @@ const SettingsTable: FunctionComponent<Props> = ({ content, ..._rest }): React.R
                     <Number value={item.lookupDays} color="-" />
                   </Td>
                   <Td isNumeric>
-                    <Number value={item.navRatio} isPercent color="-" />
+                    <Number value={item.minPremium} decimals={2} color="-" />
                   </Td>
+                  <Td>{cspStrategy2String(item.cspStrategy)}</Td>
                   <Td isNumeric>
-                    <Number value={item.minPremium} decimals={2} color="-" />
+                    <Number value={item.navRatio} isPercent color="-" />
                   </Td>
-                  <Td>{strategy2String(item.cspStrategy)}</Td>
                   <Td>{strategy2String(item.rollPutStrategy)}</Td>
                   <Td>{strategy2String(item.ccStrategy)}</Td>
                   <Td isNumeric>