@bherila/react-native-otp-inputs/src/reducer.ts

One-time password inputs built in pure JS for React-Native

import { fillOtpCode } from './helpers';
import { ActionTypes, ReducerState, Actions } from './types';

const ACTION_TYPES: ActionTypes = {
  setHandleChange: 'setHandleChange',
  setOtpTextForIndex: 'setOtpTextForIndex',
  setOtpCode: 'setOtpCode',
  clearOtp: 'clearOtp',
  setHasKeySupport: 'setHasKeySupport',
};

export default (state: ReducerState, { type, payload }: Actions) => {
  switch (type) {
    case ACTION_TYPES.setOtpTextForIndex: {
      const otpCode = {
        ...state.otpCode,
        [`${payload.index}`]: payload.text,
      };
      state.handleChange(Object.values(otpCode).join(''));

      return {
        ...state,
        otpCode,
      };
    }

    case ACTION_TYPES.setOtpCode: {
      const otpCode = fillOtpCode(payload.numberOfInputs, payload.code);

      state.handleChange(Object.values(otpCode).join(''));

      return {
        ...state,
        otpCode,
      };
    }

    case ACTION_TYPES.clearOtp: {
      const otpCode = fillOtpCode(payload);
      state.handleChange(Object.values(otpCode).join(''));

      return { ...state, otpCode };
    }

    case ACTION_TYPES.setHandleChange: {
      return { ...state, handleChange: payload };
    }

    case ACTION_TYPES.setHasKeySupport: {
      return { ...state, hasKeySupport: payload };
    }

    default:
      return state;
  }
};