title: TypeError: __WEBPACK_IMPORTED_MODULE_3__ is not a function
body: <p>I'm working on a todo list in my current project.
  I can display the todo list but when I click the checkbox to mark a task as complete I get this <code>TypeError</code>:</p>
  <p><img src="https://i.stack.imgur.com/QR3hX.png" alt="this TypeError" /></p>
  <p>I've tried to use Google and Stack to find an answer but still can't figure out what it is I'm doing wrong. Why is <code>toggleComplete</code> not a function?</p>
  <p><strong>Reducer / todosOne.js</strong></p>
  <pre><code>    import { createSlice } from '@reduxjs/toolkit'
  
  export const todosOne = createSlice({
      name: 'todos',
      initialState: [
          { id: 1, text: 'This is a todo item', complete: false },
          { id: 2, text: 'This is a todo item', complete: false },
          { id: 3, text: 'This is a todo item', complete: false },
          { id: 4, text: 'This is a todo item', complete: false },
          { id: 5, text: 'This is a todo item', complete: false },
      ],
  
      toggleComplete: (store, action) =&gt; {
          const checkedItem = store.items.find(item =&gt; item.id === action.payload)
          if (checkedItem) {
              checkedItem.complete = !checkedItem.complete
          }
      }
  })
  </code></pre>
  <p><strong>Component / TodoListOne.js</strong></p>
  <pre><code>import React from 'react'
  import styled from 'styled-components'
  import { useSelector, useDispatch } from 'react-redux'
  
  import { todosOne } from '../Reducers/todosOne'
  
  export const TodoListOne = () =&gt; {
      const dispatch = useDispatch();
  
      const items = useSelector(store =&gt; store.todos);
  
      const onChecked = complete =&gt; {
          dispatch(todosOne.actions.toggleComplete(complete))
      }
  
      return (
          &lt;&gt;
              {items.map(todos =&gt; (
                  &lt;TodoContainer key={todos.id}&gt;
                      &lt;List&gt;
                          &lt;label&gt;
                              &lt;input type=&quot;checkbox&quot;
                              checked={todos.complete}
                              onChange={() =&gt; onChecked(todos.id)}
                              /&gt;
                          &lt;/label&gt;
                      &lt;/List&gt;
                      &lt;TodoText&gt;{todos.text}&lt;/TodoText&gt;
                  &lt;/TodoContainer&gt;
              ))}
          &lt;/&gt;
      )
  }
  </code></pre>