From d7a5fe2805d581eb928cbc7cea8d12c45f183556 Mon Sep 17 00:00:00 2001
From: psychedelicious <4822129+psychedelicious@users.noreply.github.com>
Date: Wed, 24 Jul 2024 12:35:50 +1000
Subject: [PATCH] feat(ui): make arrow icon rotate on boards list

---
 .../gallery/components/Boards/BoardsList/BoardsList.tsx    | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/BoardsList.tsx b/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/BoardsList.tsx
index 4547033def..48ab1bca1a 100644
--- a/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/BoardsList.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/BoardsList.tsx
@@ -91,7 +91,12 @@ export const BoardsList = ({ isPrivate }: Props) => {
           {allowPrivateBoards ? (
             <Button variant="unstyled" onClick={onToggle}>
               <Flex gap="2" alignItems="center">
-                <Icon boxSize="5" as={isOpen ? PiCaretDownBold : PiCaretRightBold} fill="base.500" />
+                <Icon
+                  boxSize={4}
+                  as={PiCaretDownBold}
+                  transform={isOpen ? undefined : 'rotate(-90deg)'}
+                  fill="base.500"
+                />
                 <Text fontSize="sm" fontWeight="semibold" userSelect="none" color="base.500">
                   {boardListTitle}
                 </Text>