This commit is contained in:
IGNY8 VPS (Salman)
2025-11-16 21:33:55 +00:00
parent 9ab87416d8
commit cb0e42bb8d
2 changed files with 12 additions and 4 deletions

View File

@@ -1,4 +1,4 @@
import { useState } from "react";
import { useState, useRef } from "react";
import { Dropdown } from "../ui/dropdown/Dropdown";
import { DropdownItem } from "../ui/dropdown/DropdownItem";
import { Link } from "react-router";
@@ -6,6 +6,7 @@ import { Link } from "react-router";
export default function NotificationDropdown() {
const [isOpen, setIsOpen] = useState(false);
const [notifying, setNotifying] = useState(true);
const buttonRef = useRef<HTMLButtonElement>(null);
function toggleDropdown() {
setIsOpen(!isOpen);
@@ -22,6 +23,7 @@ export default function NotificationDropdown() {
return (
<div className="relative">
<button
ref={buttonRef}
className="relative flex items-center justify-center text-gray-500 transition-colors bg-white border border-gray-200 rounded-full dropdown-toggle hover:text-gray-700 h-11 w-11 hover:bg-gray-100 dark:border-gray-800 dark:bg-gray-900 dark:text-gray-400 dark:hover:bg-gray-800 dark:hover:text-white"
onClick={handleClick}
>
@@ -50,7 +52,9 @@ export default function NotificationDropdown() {
<Dropdown
isOpen={isOpen}
onClose={closeDropdown}
className="absolute -right-[240px] mt-[17px] flex h-[480px] w-[350px] flex-col rounded-2xl border border-gray-200 bg-white p-3 shadow-theme-lg dark:border-gray-800 dark:bg-gray-dark sm:w-[361px] lg:right-0"
anchorRef={buttonRef}
placement="bottom-right"
className="flex h-[480px] w-[350px] flex-col rounded-2xl border border-gray-200 bg-white p-3 shadow-theme-lg dark:border-gray-800 dark:bg-gray-dark sm:w-[361px]"
>
<div className="flex items-center justify-between pb-3 mb-3 border-b border-gray-100 dark:border-gray-700">
<h5 className="text-lg font-semibold text-gray-800 dark:text-gray-200">

View File

@@ -1,4 +1,4 @@
import { useState } from "react";
import { useState, useRef } from "react";
import { useNavigate } from "react-router";
import { DropdownItem } from "../ui/dropdown/DropdownItem";
import { Dropdown } from "../ui/dropdown/Dropdown";
@@ -9,6 +9,7 @@ export default function UserDropdown() {
const [isOpen, setIsOpen] = useState(false);
const navigate = useNavigate();
const { user, logout } = useAuthStore();
const buttonRef = useRef<HTMLButtonElement>(null);
function toggleDropdown() {
setIsOpen(!isOpen);
@@ -26,6 +27,7 @@ export default function UserDropdown() {
return (
<div className="relative">
<button
ref={buttonRef}
onClick={toggleDropdown}
className="flex items-center text-gray-700 dropdown-toggle dark:text-gray-400"
>
@@ -65,7 +67,9 @@ export default function UserDropdown() {
<Dropdown
isOpen={isOpen}
onClose={closeDropdown}
className="absolute right-0 mt-[17px] flex w-[260px] flex-col rounded-2xl border border-gray-200 bg-white p-3 shadow-theme-lg dark:border-gray-800 dark:bg-gray-dark"
anchorRef={buttonRef}
placement="bottom-right"
className="flex w-[260px] flex-col rounded-2xl border border-gray-200 bg-white p-3 shadow-theme-lg dark:border-gray-800 dark:bg-gray-dark"
>
<div>
<span className="block font-medium text-gray-700 text-theme-sm dark:text-gray-400">