diff --git a/src/components/AddTask.tsx b/src/components/AddTask.tsx
index f514345..0776c60 100644
--- a/src/components/AddTask.tsx
+++ b/src/components/AddTask.tsx
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React from "react";
 
 import SwipeableDrawer from "@mui/material/SwipeableDrawer";
 import InputBase from "@mui/material/InputBase";
@@ -6,11 +6,15 @@ import TrapFocus from "@mui/material/Unstable_TrapFocus";
 import Box from "@mui/material/Box";
 import Button from "@mui/material/Button";
 
-export const AddTask: React.FC = () => {
-  const [open, setOpen] = useState(true);
+import { useAppDispatch, useAppSelector } from "../hooks";
+import {
+  open as openAction,
+  close as closeAction,
+} from "../store/slices/uiState";
 
-  const onOpen = () => setOpen(true);
-  const onClose = () => setOpen(false);
+export const AddTask: React.FC = () => {
+  const open = useAppSelector((state) => state.uiState.addBarOpen);
+  const dispatch = useAppDispatch();
 
   return (
     <TrapFocus open={open}>
@@ -24,8 +28,8 @@ export const AddTask: React.FC = () => {
         }}
         anchor="bottom"
         open={open}
-        onOpen={onOpen}
-        onClose={onClose}
+        onOpen={() => dispatch(openAction())}
+        onClose={() => dispatch(closeAction())}
       >
         <Box
           sx={{
diff --git a/src/components/AppBar.tsx b/src/components/AppBar.tsx
index 4e490fc..14b079c 100644
--- a/src/components/AppBar.tsx
+++ b/src/components/AppBar.tsx
@@ -4,20 +4,28 @@ import Box from "@mui/material/Box";
 import Fab from "@mui/material/Fab";
 import Add from "@mui/icons-material/Add";
 
-export const AppBar: React.FC = () => (
-  <Box sx={{ width: "100%", justifyContent: "center", display: "flex" }}>
-    <Fab
-      variant="extended"
-      color="primary"
-      aria-label="add"
-      sx={{
-        position: "relative",
-        zIndex: 1,
-        top: -30,
-      }}
-    >
-      <Add sx={{ marginRight: 1 }} />
-      Add a new task
-    </Fab>
-  </Box>
-);
+import { useAppDispatch } from "../hooks";
+import { open } from "../store/slices/uiState";
+
+export const AppBar: React.FC = () => {
+  const dispatch = useAppDispatch();
+
+  return (
+    <Box sx={{ width: "100%", justifyContent: "center", display: "flex" }}>
+      <Fab
+        variant="extended"
+        color="primary"
+        aria-label="add"
+        sx={{
+          position: "relative",
+          zIndex: 1,
+          top: -30,
+        }}
+        onClick={() => dispatch(open())}
+      >
+        <Add sx={{ marginRight: 1 }} />
+        Add a new task
+      </Fab>
+    </Box>
+  );
+};