diff --git a/src/main_window/routes/characters/character/rules/OptionalRulesItem.tsx b/src/main_window/routes/characters/character/rules/OptionalRulesItem.tsx index f9d49b4f..29385f60 100644 --- a/src/main_window/routes/characters/character/rules/OptionalRulesItem.tsx +++ b/src/main_window/routes/characters/character/rules/OptionalRulesItem.tsx @@ -1,12 +1,14 @@ import { OptionalRule, OptionalRuleTranslation } from "optolith-database-schema/types/rule/OptionalRule" import { FC, useCallback } from "react" import { Checkbox } from "../../../../../shared/components/checkbox/Checkbox.tsx" +import { Dropdown } from "../../../../../shared/components/dropdown/Dropdown.tsx" import { IconButton } from "../../../../../shared/components/iconButton/IconButton.tsx" +import { OptionalRuleIdentifier } from "../../../../../shared/domain/identifier.ts" import { useTranslate } from "../../../../../shared/hooks/translate.ts" import { useAppDispatch, useAppSelector } from "../../../../hooks/redux.ts" import { selectActiveOptionalRules } from "../../../../slices/characterSlice.ts" import { changeInlineLibraryEntry } from "../../../../slices/inlineWikiSlice.ts" -import { switchOptionalRule } from "../../../../slices/rulesSlice.ts" +import { changeOptionalRuleOption, switchOptionalRule } from "../../../../slices/rulesSlice.ts" type Props = { optionalRule: { @@ -35,23 +37,37 @@ export const OptionalRulesItem: FC = props => { [ dispatch, optionalRule.id ], ) + const handleChangeOption = useCallback( + (option: number) => dispatch(changeOptionalRuleOption({ + id: optionalRule.id, + option, + })), + [ dispatch, optionalRule.id ], + ) + + const isActive = Object.hasOwn(activeOptionalRules, optionalRule.id) + return (
  • - {/* TODO: */} + {optionalRule.id === OptionalRuleIdentifier.HigherDefenseStats + ? ( + + ) + : null} ("rules/switchIncludePublication") export const switchFocusRule = createAction("rules/switchFocusRule") export const switchOptionalRule = createAction("rules/switchOptionalRule") +export const changeOptionalRuleOption = createAction<{ id: number; option: number }>("rules/changeOptionalRuleOption") export const rulesReducer = createImmerReducer((state, action) => { @@ -35,10 +37,22 @@ export const rulesReducer = if (Object.hasOwn(state.rules.activeOptionalRules, action.payload)) { delete state.rules.activeOptionalRules[action.payload] } + else if (action.payload === OptionalRuleIdentifier.HigherDefenseStats) { + state.rules.activeOptionalRules[action.payload] = { + id: action.payload, + options: [ 2 ], + } + } else { state.rules.activeOptionalRules[action.payload] = { id: action.payload, } } } + else if (changeOptionalRuleOption.match(action)) { + if (Object.hasOwn(state.rules.activeOptionalRules, action.payload.id)) { + (state.rules.activeOptionalRules[action.payload.id]!.options ??= [])[0] = + action.payload.option + } + } })