06currencyConvertor : Improvement Point Ask ?

[microDotBuilder]

working on project

06currencyConvertor:

state update:

• rather then using all states to update the ui what if we used use reducer . will that be a overkill or a good idea ?
• or is it overkill for this particular project ?

sample implementation

export const initialState = {
  amount: "",
  from: "usd",
  to: "inr",
  convertedAmount: 0,
};

export default function useStateUpdater(state, action) {
  switch (action.type) {
    case "SET_AMOUNT":
      return { ...state, amount: action.payload };
    case "SET_FROM":
      return { ...state, from: action.payload };
    case "SET_TO":
      return { ...state, to: action.payload };
    case "CONVERT":
      return { ...state, convertedAmount: state.amount * action.payload };
    case "SWAP":
      return {
        ...state,
        from: state.to,
        to: state.from,
        amount: state.convertedAmount,
        convertedAmount: state.amount,
      };
    default:
      return state;
  }
}

and then in the App.jsx use something like

 const [state, dispatch] = useReducer(useStateUpdater, initialState);
  const { amount, from, to, convertedAmount } = state;
  
  //example of calling a dispatch function 
  <InputBox
                    label="From"
                    amount={amount}
                    currencyOptions={options}
                    onCurrencyChange={(currency) =>
                      dispatch({ type: "SET_FROM", payload: currency })
                    }
                    selectCurrency={from}
                    onAmountChange={(amount) =>
                      dispatch({ type: "SET_AMOUNT", payload: amount })
                    }
                  />