[FE] 지출에 멤버가 1명일 때, 금액이 수정되는 오류

[Todari]

issue

• close [FE] 지출에 멤버가 1명일 때, 금액이 수정되는 오류 #621

구현 목적

지출에서 수정되지 않은 멤버가 1명일 때 이 한명이 내야 하는 금액은 총 금액에서 고정된 멤버들을 뺀 금액과 같을 수 밖에 없어서 별도의 수정이 가능하지 않도록 막아야 합니다.
현재 수정이 가능하고, 이를 요청보내면 app이 터져버리는 버그가 있습니다.

구현 사항

기존 구현 상황에서, 수정되지 않은 멤버가 1명을 판단하는 로직 자체가 없었습니다.
이를 판단하는 로직을 추가하고, 해당 상황이라면 금액이 변경되지 않게 수정했습니다.

// useEditBillState.ts
// ...
  const isLastUnfixedMember = (keyboardTargetId: number) =>
    !newBillDetails.find(({id}) => id === keyboardTargetId)?.isFixed &&
    newBillDetails.filter(({isFixed}) => isFixed === false).length === 1;

  const handleChangeBillDetails = ({value, keyboardTargetId}: HandleChangeBillDetailsProps) => {
    if (isLastUnfixedMember(keyboardTargetId)) return;
    if (Number(value.replace(/,/g, '')) === newBillDetails.find(({id}) => id === keyboardTargetId)?.price) return;
    setNewBillDetails(prev => {
      const updatedDetails = prev.map(detail =>
        detail.id === keyboardTargetId ? {...detail, price: Number(value.replace(/,/g, '')), isFixed: true} : detail,
      );

      const totalFixedPrice = updatedDetails.reduce((sum, detail) => (detail.isFixed ? sum + detail.price : sum), 0);

      const remainingPrice = newBill.price - totalFixedPrice;
      const unfixedCount = updatedDetails.filter(detail => !detail.isFixed).length;

      const unfixedPrice = Math.floor(remainingPrice / unfixedCount);
      const lastUnfixedIndex = updatedDetails.map(detail => !detail.isFixed).lastIndexOf(true);

      return updatedDetails.map((detail, index) => {
        if (detail.isFixed) return detail;
        if (index === lastUnfixedIndex) {
          return {...detail, price: remainingPrice - unfixedPrice * (unfixedCount - 1)};
        }
        return {...detail, price: unfixedPrice};
      });
    });
  };
// ...

[github-actions]

🚀 storybook: https://66a9dea5db27afc2b8f91ba7-wgfgoclhkq.chromatic.com/