Some bug and visuals improvements.

src/components/wrappers/dashboard/admin/admin-tabs.tsx

@@ -5,26 +5,40 @@ import { SettingsEmailTab } from "@/components/wrappers/dashboard/admin/AdminEma
 import { SettingsStorageTab } from "@/components/wrappers/dashboard/admin/AdminStorageTab/SettingsStorageTab";
 import { AdminUsersTable } from "@/components/wrappers/dashboard/admin/admin-user-table";
 import { User } from "@/db/schema/01_user";
-import {Setting} from "@/db/schema/00_setting";
+import { Setting } from "@/db/schema/00_setting";
+import { useEffect, useState } from "react";
+import { useRouter, useSearchParams } from "next/navigation";
 
 export type AdminTabsProps = {
     users: User[];
     settings: Setting;
 };
 
-export const AdminTabs = (props: AdminTabsProps) => {
-    const { users, settings } = props;
+export const AdminTabs = ({ users, settings }: AdminTabsProps) => {
+    const router = useRouter();
+    const searchParams = useSearchParams();
+
+    const [tab, setTab] = useState<string>(() => searchParams.get("tab") ?? "users");
+
+    useEffect(() => {
+        const newTab = searchParams.get("tab") ?? "users";
+        setTab(newTab);
+    }, [searchParams]);
+
+    const handleChangeTab = (value: string) => {
+        router.push(`?tab=${value}`);
+    };
 
     return (
-        <Tabs defaultValue="users">
+        <Tabs className="h-full" value={tab} onValueChange={handleChangeTab}>
             <TabsList className="w-full">
-                <TabsTrigger className="w-full " value="users">
+                <TabsTrigger className="w-full" value="users">
                     Users
                 </TabsTrigger>
-                <TabsTrigger className="w-full " value="email">
+                <TabsTrigger className="w-full" value="email">
                     Email
                 </TabsTrigger>
-                <TabsTrigger className="w-full " value="storage">
+                <TabsTrigger className="w-full" value="storage">
                     Storage
                 </TabsTrigger>
             </TabsList>

src/components/wrappers/dashboard/admin/admin-user-table.tsx

@@ -13,7 +13,7 @@ export const AdminUsersTable = (props: AdminUsersTableProps) => {
             <div className="flex gap-4 h-fit justify-between">
                 <h1>List of Portabase's users</h1>
             </div>
-            <div className="mt-5">
+            <div className="mt-5 h-full">
                 <DataTable columns={usersColumnsAdmin} data={users} />
             </div>
         </div>

src/components/wrappers/dashboard/admin/columns-users.tsx

@@ -19,6 +19,8 @@ export const usersColumnsAdmin: ColumnDef<User>[] = [
         header: "Role",
         cell: ({row}) => {
             const [role, setRole] = useState<string>(row.getValue("role"));
+            const { data: session } = useSession();
+            const isCurrentUser = session?.user.email === row.original.email;
 
             const updateMutation = useMutation({
                 mutationFn: () => updateUserAction({id: row.original.id, data: {role: role}}),
@@ -37,7 +39,11 @@ export const usersColumnsAdmin: ColumnDef<User>[] = [
             };
 
             return (
-                <Badge className="cursor-pointer" onClick={() => handleUpdateRole()} variant="outline">
+                <Badge
+                    className={isCurrentUser ? "cursor-not-allowed opacity-50" : "cursor-pointer"}
+                    onClick={isCurrentUser ? undefined : () => handleUpdateRole()}
+                    variant="outline"
+                >
                     {role}
                 </Badge>
             );
@@ -73,23 +79,18 @@ export const usersColumnsAdmin: ColumnDef<User>[] = [
                 },
             });
 
-
-
             return (
                 <div className="flex items-center gap-2">
-                    {!session || session?.user.email === row.original.email ? null :
                         <ButtonWithLoading
+                            disabled={!session || session?.user.email === row.original.email}
                             variant="outline"
                             text=""
                             icon={<Trash2 color="red" size={15}/>}
                             onClick={async () => {
                                 await mutation.mutateAsync();
                             }}
-                            size="icon"
+                            size="sm"
                         />
-
-                    }
-
                 </div>
             );
         },