feat: add keys & bucket permissions management

src/pages/buckets/manage/page.tsx

@@ -2,8 +2,10 @@ import { useParams } from "react-router-dom";
 import { useBucket } from "./hooks";
 import Page from "@/context/page-context";
 import TabView, { Tab } from "@/components/containers/tab-view";
-import { ChartLine, FolderSearch } from "lucide-react";
+import { ChartLine, LockKeyhole } from "lucide-react";
 import OverviewTab from "./components/overview-tab";
+import PermissionsTab from "./components/permissions-tab";
+import MenuButton from "./components/menu-button";
 
 const tabs: Tab[] = [
   {
@@ -12,6 +14,12 @@ const tabs: Tab[] = [
     icon: ChartLine,
     Component: OverviewTab,
   },
+  {
+    name: "permissions",
+    title: "Permissions",
+    icon: LockKeyhole,
+    Component: PermissionsTab,
+  },
   // {
   //   name: "browse",
   //   title: "Browse",
@@ -27,7 +35,11 @@ const ManageBucketPage = () => {
 
   return (
     <div className="container">
-      <Page title={name || "Manage Bucket"} prev="/buckets" />
+      <Page
+        title={name || "Manage Bucket"}
+        prev="/buckets"
+        actions={<MenuButton />}
+      />
       <TabView tabs={tabs} className="bg-base-100 h-14 px-1.5" />
     </div>
   );