add current gallery board name

invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/AddBoardButton.tsx

@@ -5,16 +5,16 @@ import { PiPlusBold } from 'react-icons/pi';
 import { useCreateBoardMutation } from 'services/api/endpoints/boards';
 
 type Props = {
-  privateBoard: boolean;
+  isPrivateBoard: boolean;
 };
 
-const AddBoardButton = ({ privateBoard }: Props) => {
+const AddBoardButton = ({ isPrivateBoard }: Props) => {
   const { t } = useTranslation();
   const [createBoard, { isLoading }] = useCreateBoardMutation();
   const DEFAULT_BOARD_NAME = t('boards.myBoard');
   const handleCreateBoard = useCallback(() => {
-    createBoard({ board_name: DEFAULT_BOARD_NAME, private_board: privateBoard });
-  }, [createBoard, DEFAULT_BOARD_NAME, privateBoard]);
+    createBoard({ board_name: DEFAULT_BOARD_NAME, is_private: isPrivateBoard });
+  }, [createBoard, DEFAULT_BOARD_NAME, isPrivateBoard]);
 
   return (
     <IconButton

invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/BoardsList.tsx

@@ -72,7 +72,7 @@ const BoardsList = () => {
                       {t('boards.private')}
                     </Text>
                   </Flex>
-                  <AddBoardButton privateBoard={true} />
+                  <AddBoardButton isPrivateBoard={true} />
                 </Flex>
                 <Collapse in={isPrivateBoardsOpen} animateOpacity>
                   <Flex direction="column">
@@ -104,7 +104,7 @@ const BoardsList = () => {
                   {allowPrivateBoards ? t('boards.shared') : t('boards.boards')}
                 </Text>
               </Flex>
-              <AddBoardButton privateBoard={false} />
+              <AddBoardButton isPrivateBoard={false} />
             </Flex>
             <Collapse in={isSharedBoardsOpen} animateOpacity>
               <Flex direction="column">

invokeai/frontend/web/src/features/gallery/components/GalleryBoardName.tsx

@@ -1,16 +1,9 @@
-import { Button, Flex, Icon, Spacer } from '@invoke-ai/ui-library';
+import { Flex } from '@invoke-ai/ui-library';
 import { useAppSelector } from 'app/store/storeHooks';
 import { memo, useMemo } from 'react';
-import { PiCaretUpBold } from 'react-icons/pi';
 import { useBoardName } from 'services/api/hooks/useBoardName';
 
-type Props = {
-  isOpen: boolean;
-  onToggle: () => void;
-};
-
-const GalleryBoardName = (props: Props) => {
-  const { isOpen, onToggle } = props;
+const GalleryBoardName = () => {
   const selectedBoardId = useAppSelector((s) => s.gallery.selectedBoardId);
   const boardName = useBoardName(selectedBoardId);
 
@@ -23,26 +16,15 @@ const GalleryBoardName = (props: Props) => {
 
   return (
     <Flex
-      as={Button}
-      onClick={onToggle}
-      size="sm"
-      position="relative"
-      gap={2}
-      w="full"
+      my="1"
       justifyContent="center"
-      alignItems="center"
-      px={2}
+      fontSize="md"
+      fontWeight="bold"
+      borderWidth="thin"
+      borderStyle="solid"
+      borderRadius="base"
     >
-      <Spacer />
       {formattedBoardName}
-      <Spacer />
-      <Icon
-        as={PiCaretUpBold}
-        boxSize={4}
-        transform={isOpen ? 'rotate(0deg)' : 'rotate(180deg)'}
-        transitionProperty="common"
-        transitionDuration="normal"
-      />
     </Flex>
   );
 };

invokeai/frontend/web/src/features/gallery/components/ImageGalleryContent.tsx

@@ -9,6 +9,7 @@ import { PiImagesBold } from 'react-icons/pi';
 import { RiServerLine } from 'react-icons/ri';
 
 import BoardsList from './Boards/BoardsList/BoardsList';
+import GalleryBoardName from './GalleryBoardName';
 import GalleryImageGrid from './ImageGrid/GalleryImageGrid';
 import { GalleryPagination } from './ImageGrid/GalleryPagination';
 import { GallerySearch } from './ImageGrid/GallerySearch';
@@ -42,6 +43,7 @@ const ImageGalleryContent = () => {
       {galleryHeader}
       <Box>
         <BoardsList isOpen={isBoardListOpen} />
+        <GalleryBoardName />
       </Box>
       <Flex alignItems="center" justifyContent="space-between" gap={2}>
         <Tabs index={galleryView === 'images' ? 0 : 1} variant="unstyled" size="sm" w="full">