Действие Redux возвращает undefined

У меня такой редуктор:

export const showResult = (state = [], action) => {
    switch (action.type) {
      case 'GET_NUMBER': 
        return [
          ...state,
          action.n
        ]
      case 'CLEAR_NUMBER':
         return [
          ...state
        ].pop()
      case 'RESET_RESULT': 
        return []
      default:
        return state
    }
  }

случай «CLEAR_NUMBER» выполняется при нажатии «deleteNumber»:

import React, { Component } from 'react'
import Display from './Container'
import Operator from './Container'
import { selectOperator } from './../util'

class Calculator extends Component {
    constructor(props) {
      super(props)

      this.state = {
          val1: '',
          val2: ''
      }

    }
    displayNumber = e => {
        const { getNumber, resetResult, getOperator } = this.props
        getNumber(parseInt(e.target.dataset.n))
    }

    getOperator = e => {
        const { getOperator, n, resetResult, resetOperator } = this.props
        resetOperator()
        getOperator(e.target.dataset.sign)

        if (this.state.val1 == "") {
            this.setState({
                val1: n
            })
            resetResult()
        }

    }
    getSum = val => {
        val.reduce((acc, val) => acc + val)
    }
    deleteNumber = () => {
        const { clearNumber } = this.props
        clearNumber()
    }
    getTotal = () => {
        const { n, operator, resetResult } = this.props,
            { val1, val2 } = this.state,
            value1 = this.getSum(val1),
            value2 = val2 != "" ? this.getSum(val2) : null;
        let operatorVal = operator[0]

        this.setState({ val2: n })
        resetResult()
        selectOperator(operatorVal, value1, value2)

    }
    render() {
        const { n, operator, getNumber } = this.props
        return (
            <div>
                <Display val = {n == "" ? null : n} />
                <Operator val = {operator} />

                {/* NUMBERS */}
                    <p data-n = "1" onClick = {this.displayNumber}>1</p>
                    <p data-n = "2" onClick = {this.displayNumber}>2</p>
                    <p data-n = "3" onClick = {this.displayNumber}>3</p>

                {/* OPERATORS */}
                    <p data-sign = "+" onClick = {this.getOperator}>+</p>
                    <p data-sign = "-" onClick = {this.getOperator}>-</p>
                    <p data-sign = "/" onClick = {this.getOperator}>/</p>
                    <p data-sign = "*" onClick = {this.getOperator}>*</p>
                    <p onClick = {this.getTotal}>equal</p>
                    <p onClick = {this.deleteNumber}>clear</p>
            </div>
        )
    }
}
   
export default Calculator

он по существу удаляет последний элемент из массива (как если бы у вас была четкая функция на калькуляторе).

Я получаю ошибку, когда в массиве остается один элемент: