diff --git a/bun.lockb b/bun.lockb
index 03a73aa..4d78a20 100755
Binary files a/bun.lockb and b/bun.lockb differ
diff --git a/index.html b/index.html
index dc2dbee..432d397 100644
--- a/index.html
+++ b/index.html
@@ -7,11 +7,6 @@
     <meta name="theme-color" content="#000000" />
     <meta name="description" content="View soccer goals as they happen around the world" />
     <link rel="apple-touch-icon" href="/logo192.png" />
-    <script
-      src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
-      integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
-      crossorigin="anonymous"
-    ></script>
     <!--
       manifest.json provides metadata used when your web app is installed on a
       user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
diff --git a/package.json b/package.json
index 01a9edd..78621a2 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,8 @@
     "@types/react": "^18.0.21",
     "@types/react-dom": "^18.0.6",
     "axios": "^0.26.1",
+    "bootstrap": "^5.3.2",
+    "popper": "^1.0.1",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "react-paginate": "^8.1.3",
diff --git a/src/components/Select.tsx b/src/components/Select.tsx
index 8606c17..0fa921f 100644
--- a/src/components/Select.tsx
+++ b/src/components/Select.tsx
@@ -1,3 +1,4 @@
+import 'bootstrap/js/dist/dropdown';
 import {useState} from 'react';
 
 interface Option {