Merge pull request #12553 from iepn/ButtonDropdown

feat: add ButtonDropdown components state variable

Author: wackerow

src/components/ButtonDropdown.tsx

@@ -1,4 +1,4 @@
-import React, { MouseEvent } from "react"
+import React, { MouseEvent, useState } from "react"
 import { useTranslation } from "next-i18next"
 import { MdMenu } from "react-icons/md"
 import {
@@ -39,6 +39,7 @@ export type ButtonDropdownProps = ButtonProps & {
 
 const ButtonDropdown = ({ list, ...rest }: ButtonDropdownProps) => {
   const { t } = useTranslation("common")
+  const [selectedItem, setSelectedItem] = useState(list.text)
   const handleClick = (
     e: MouseEvent<HTMLElement>,
     item: ListItem,
@@ -54,6 +55,7 @@ const ButtonDropdown = ({ list, ...rest }: ButtonDropdownProps) => {
       e.preventDefault()
       callback(idx)
     }
+    setSelectedItem(item.text)
   }
 
   return (
@@ -65,7 +67,7 @@ const ButtonDropdown = ({ list, ...rest }: ButtonDropdownProps) => {
         _active={{ bg: "transparent" }}
         {...rest}
       >
-        {t(list.text)}
+        {t(selectedItem)}
       </MenuButton>
       <MenuList
         py={2}
@@ -119,4 +121,4 @@ const ButtonDropdown = ({ list, ...rest }: ButtonDropdownProps) => {
   )
 }
 
-export default ButtonDropdown
+export default ButtonDropdown