diff --git a/src/components/ToolBar/ToolBar.jsx b/src/components/ToolBar/ToolBar.tsx
similarity index 58%
rename from src/components/ToolBar/ToolBar.jsx
rename to src/components/ToolBar/ToolBar.tsx
index 548d567..2511d94 100644
--- a/src/components/ToolBar/ToolBar.jsx
+++ b/src/components/ToolBar/ToolBar.tsx
@@ -1,9 +1,20 @@
 import styles from "./ToolBar.module.css"
-import CreateEventBtn from "./tools/CreateEventBtn/CreateEventBtn.jsx";
+import CreateEventBtn from "./tools/CreateEventBtn/CreateEventBtn";
 import SearchBtn from "./tools/SearchBtn";
 import FilterBtn from "./tools/FilterBtn";
 
-function ToolBar({setFilters, filters, showCreate = true}) {
+interface Filters {
+    alphabetical: "asc" | "desc";
+    yearOrder: "asc" | "desc";
+}
+
+interface ToolBarProps {
+    setFilters: React.Dispatch<React.SetStateAction<Filters>>;
+    filters: Filters;
+    showCreate?: boolean;
+}
+
+function ToolBar({ setFilters, filters, showCreate = true }: ToolBarProps) {
 
     return (
         <div>
@@ -16,4 +27,4 @@ function ToolBar({setFilters, filters, showCreate = true}) {
     );
 }
 
-export default ToolBar;
\ No newline at end of file
+export default ToolBar;