Use typed dispatch hook.

src/modules/login/LoginStatusPane.tsx

@@ -1,6 +1,6 @@
 import { FC, useEffect } from "react";
-import { useDispatch } from "react-redux";
 
+import { useAppDispatch } from "app/hooks";
 import {
   loginFetchStatus,
   LoginStatus,
@@ -12,7 +12,7 @@ interface Props {
 }
 
 const LoginStatusPane: FC<Props> = ({ login }) => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   // Asynchronously fetch the login status if it is still unknown.
   useEffect(() => {

src/modules/room/RoomChat.tsx

@@ -1,6 +1,6 @@
 import { FC, useEffect, useState } from "react";
-import { useDispatch } from "react-redux";
 
+import { useAppDispatch } from "app/hooks";
 import {
   RoomState,
   RoomMembership,
@@ -52,7 +52,7 @@ const RoomChatInner: FC<Props> = ({ loginUserName, room }) => {
 
 // TODO: Back button on small-enough screens (below `md`).
 const RoomChat: FC<Props> = ({ loginUserName, room }) => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   useEffect(() => {
     if (room.membership === RoomMembership.Left) {

src/modules/room/RoomChatForm.tsx

@@ -1,7 +1,7 @@
 import { FC } from "react";
 import { Form, Field } from "react-final-form";
-import { useDispatch } from "react-redux";
 
+import { useAppDispatch } from "app/hooks";
 import { roomSendMessage } from "modules/room/slice";
 
 interface Props {
@@ -14,7 +14,7 @@ interface Fields {
 }
 
 const RoomChatForm: FC<Props> = ({ roomName, loginUserName }) => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const onSubmit = ({ message }: Fields, form: any) => {
     dispatch(

src/modules/room/RoomChatHeader.tsx

@@ -1,7 +1,7 @@
 import { FC, ReactEventHandler } from "react";
-import { useDispatch } from "react-redux";
 import { useHistory } from "react-router";
 
+import { useAppDispatch } from "app/hooks";
 import {
   RoomState,
   RoomMembership,
@@ -26,7 +26,7 @@ interface Props {
 
 const RoomChatHeader: FC<Props> = ({ room, toggleDetails }) => {
   const history = useHistory();
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   if (room === undefined) {
     return <InnerHeader title="Select a room" />;

src/modules/room/RoomList.tsx

@@ -1,6 +1,6 @@
 import { FC, ReactEventHandler } from "react";
-import { useDispatch } from "react-redux";
 
+import { useAppDispatch } from "app/hooks";
 import SearchableList from "components/SearchableList";
 import RoomListEntry from "modules/room/RoomListEntry";
 import { RoomMap, roomGetAll } from "modules/room/slice";
@@ -10,7 +10,7 @@ interface Props {
 }
 
 const RoomList: FC<Props> = ({ rooms }) => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const onRefresh: ReactEventHandler = (event) => {
     event.preventDefault();

src/modules/user/UserList.tsx

@@ -1,6 +1,6 @@
 import { FC, ReactEventHandler } from "react";
-import { useDispatch } from "react-redux";
 
+import { useAppDispatch } from "app/hooks";
 import SearchableList from "components/SearchableList";
 import { UserMap, userGetAll } from "modules/user/slice";
 import UserListEntry from "modules/user/UserListEntry";
@@ -10,7 +10,7 @@ interface Props {
 }
 
 const UserList: FC<Props> = ({ users }) => {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const onRefresh: ReactEventHandler = (event) => {
     event.preventDefault();