7 files changed, 18 insertions, 13 deletions
diff --git a/client/src/components/Admin.tsx b/client/src/components/Admin.tsx
index ab75976..eec675a 100644
--- a/client/src/components/Admin.tsx
+++ b/client/src/components/Admin.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
 import { useMemo } from 'react';
 import { useLocation, Navigate, Outlet } from 'react-router-dom';
-import { useSelector } from 'react-redux';
+import { useAppSelector } from '../hooks';
 import { selectGuests } from '../slices/auth/adminSlice';
 
 const authenticate = () => {
-  const guests = useSelector(selectGuests);
+  const guests = useAppSelector(selectGuests);
   return useMemo(() => ({ guests }), [guests]);
 };
 
diff --git a/client/src/components/AdminLogin.tsx b/client/src/components/AdminLogin.tsx
index 83b7de4..405cfb6 100644
--- a/client/src/components/AdminLogin.tsx
+++ b/client/src/components/AdminLogin.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import { useNavigate } from 'react-router-dom';
-import { useDispatch } from 'react-redux';
 import { Button, Paper, TextField, Typography } from '@mui/material';
 import { useForm } from 'react-hook-form';
+import { useAppDispatch } from '../hooks';
 import { setAdmin } from '../slices/auth/adminSlice';
 import { useLoginAdminMutation } from '../slices/api/adminSlice';
 import { showSnackbar } from '../slices/snackbarSlice';
@@ -11,7 +11,7 @@ import type { Credentials } from '../models';
 import type { Data } from '../error';
 
 function GuestLogin() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const [login] = useLoginAdminMutation();
 
diff --git a/client/src/components/GlobalSnackbar.tsx b/client/src/components/GlobalSnackbar.tsx
index f0019fa..c4457af 100644
--- a/client/src/components/GlobalSnackbar.tsx
+++ b/client/src/components/GlobalSnackbar.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
-import { useDispatch, useSelector } from 'react-redux';
 import { Alert, Snackbar } from '@mui/material';
+import { useAppDispatch, useAppSelector } from '../hooks';
 import { hideSnackbar, selectSnackbarState } from '../slices/snackbarSlice';
 
 function GlobalSnackbar() {
-  const dispatch = useDispatch();
-  const { open, message, severity } = useSelector(selectSnackbarState);
+  const dispatch = useAppDispatch();
+  const { open, message, severity } = useAppSelector(selectSnackbarState);
 
   const handleClose = () => {
     dispatch(hideSnackbar());
diff --git a/client/src/components/GuestLogin.tsx b/client/src/components/GuestLogin.tsx
index 9a9bf8e..d0270cb 100644
--- a/client/src/components/GuestLogin.tsx
+++ b/client/src/components/GuestLogin.tsx
@@ -1,8 +1,8 @@
 import React from 'react';
 import { useNavigate } from 'react-router-dom';
-import { useDispatch } from 'react-redux';
 import { Button, Paper, TextField, Typography } from '@mui/material';
 import { useForm } from 'react-hook-form';
+import { useAppDispatch } from '../hooks';
 import { setGuest } from '../slices/auth/guestSlice';
 import { useLoginGuestMutation } from '../slices/api/guestSlice';
 import { showSnackbar } from '../slices/snackbarSlice';
@@ -11,7 +11,7 @@ import type { Data } from '../error';
 import type { Name } from '../models';
 
 function GuestLogin() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const navigate = useNavigate();
   const [login] = useLoginGuestMutation();
 
diff --git a/client/src/components/Rsvp.tsx b/client/src/components/Rsvp.tsx
index 602f159..5b0ba02 100644
--- a/client/src/components/Rsvp.tsx
+++ b/client/src/components/Rsvp.tsx
@@ -1,11 +1,11 @@
 import React from 'react';
 import { useMemo } from 'react';
 import { useLocation, Navigate, Outlet } from 'react-router-dom';
-import { useSelector } from 'react-redux';
+import { useAppSelector } from '../hooks';
 import { selectGuest } from '../slices/auth/guestSlice';
 
 const authenticate = () => {
-  const guest = useSelector(selectGuest);
+  const guest = useAppSelector(selectGuest);
   return useMemo(() => ({ guest }), [guest]);
 };
 
diff --git a/client/src/components/RsvpForm.tsx b/client/src/components/RsvpForm.tsx
index b3ff0db..8dc105a 100644
--- a/client/src/components/RsvpForm.tsx
+++ b/client/src/components/RsvpForm.tsx
@@ -1,7 +1,6 @@
 import React from 'react';
 import { useRef } from 'react';
 import { useOutletContext } from 'react-router-dom';
-import { useDispatch } from 'react-redux';
 import {
   Button,
   FormControl,
@@ -15,6 +14,7 @@ import {
 } from '@mui/material';
 import MailIcon from '@mui/icons-material/Mail';
 import { useForm, Controller, useFieldArray } from 'react-hook-form';
+import { useAppDispatch } from '../hooks';
 import { useUpdateGuestMutation } from '../slices/api/guestSlice';
 import { isFetchBaseQueryError } from '../error';
 import { showSnackbar } from '../slices/snackbarSlice';
@@ -22,7 +22,7 @@ import type { Data } from '../error';
 import type { Guest } from '../models';
 
 function RsvpForm() {
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
   const [updateGuest] = useUpdateGuestMutation();
   const guest: Guest = useOutletContext();
   const previousPartySize = useRef((guest.partySize ?? 1) - 1);
diff --git a/client/src/hooks.ts b/client/src/hooks.ts
new file mode 100644
index 0000000..7988133
--- /dev/null
+++ b/client/src/hooks.ts
@@ -0,0 +1,5 @@
+import { useDispatch, useSelector } from 'react-redux';
+import type { AppDispatch, RootState } from './store';
+
+export const useAppDispatch = useDispatch.withTypes<AppDispatch>();
+export const useAppSelector = useSelector.withTypes<RootState>();