chore: rabbit-review

Author: tractorss

src/lib/accordion/accordion-item.tsx

@@ -57,24 +57,19 @@ const AccordionItem: React.FC<AccordionItemProps> = ({
   setExpanded,
 }) => {
   const [ref, { height }] = useElementSize();
-  const ExpandButton = useMemo(
-    () =>
-      expandButton ? (
-        expandButton({
-          expanded,
-          toggle: () => setExpanded(expanded ? -1 : index),
-        })
-      ) : expanded ? (
-        <Minus
-          className={cn("fill-klerosUIComponentsPrimaryText size-4 shrink-0")}
-        />
-      ) : (
-        <Plus
-          className={cn("fill-klerosUIComponentsPrimaryText size-4 shrink-0")}
-        />
-      ),
-    [expanded, expandButton, index, setExpanded],
-  );
+  const ExpandButton = useMemo(() => {
+    if (expandButton) {
+      return expandButton({
+        expanded,
+        toggle: () => setExpanded(expanded ? -1 : index),
+      });
+    }
+    const IconComponent = expanded ? Minus : Plus;
+    return (
+      <IconComponent className="fill-klerosUIComponentsPrimaryText size-4 shrink-0" />
+    );
+  }, [expanded, expandButton, index, setExpanded]);
+
   return (
     <div className="my-2">
       <Button

src/lib/accordion/custom.tsx

@@ -35,7 +35,7 @@ export interface CustomAccordionProps {
    * expandButton={({ expanded, toggle }) => (
    *   <Button onPress={toggle}>
    *     {expanded ? <ChevronUp /> : <ChevronDown />}
-   *   <Button>
+   *   </Button>
    * )}
    * ```
    */
@@ -56,7 +56,7 @@ function CustomAccordion({
   ...props
 }: Readonly<CustomAccordionProps>) {
   const [expanded, setExpanded] = useState(
-    !isUndefined(defaultExpanded) ? defaultExpanded : -1,
+    isUndefined(defaultExpanded) ? -1 : defaultExpanded,
   );
   return (
     <div

src/lib/accordion/index.tsx

@@ -44,7 +44,7 @@ function Accordion({
   ...props
 }: Readonly<AccordionProps>) {
   const [expanded, setExpanded] = useState(
-    !isUndefined(defaultExpanded) ? defaultExpanded : -1,
+    isUndefined(defaultExpanded) ? -1 : defaultExpanded,
   );
   return (
     <div

src/stories/custom-accordion.stories.tsx

@@ -135,11 +135,11 @@ export const ItemExpandButton: Story = {
         ),
       },
     ],
-    expandButton: (expanded) => {
+    expandButton: ({ expanded, toggle }) => {
       return expanded ? (
-        <Button text="Close" variant="secondary" />
+        <Button text="Close" variant="secondary" onPress={toggle} />
       ) : (
-        <Button text="Expand" />
+        <Button text="Expand" onPress={toggle} />
       );
     },
     themeUI: "dark",