Add components for Act management and integrate Electron setup

2025-11-16 11:00:04 -05:00
parent e192b6dcc2
commit 8167948881
97 changed files with 25378 additions and 3 deletions
--- a/components/Collapse.tsx
+++ b/components/Collapse.tsx
@@ -0,0 +1,39 @@
+import React, {JSX, useState} from "react";
+import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
+import {faChevronDown, faChevronRight} from '@fortawesome/free-solid-svg-icons';
+
+export interface CollapseProps {
+    title: string;
+    content: JSX.Element;
+}
+
+export default function Collapse({title, content}: CollapseProps) {
+    const [isOpen, setIsOpen] = useState<boolean>(false);
+    
+    function toggleCollapse(): void {
+        setIsOpen(!isOpen);
+    }
+    
+    return (
+        <div className="mb-4 shadow-md hover:shadow-lg transition-all duration-200">
+            <button
+                onClick={toggleCollapse}
+                className={`w-full text-left bg-secondary/50 hover:bg-secondary transition-all duration-200 p-4 flex items-center justify-between group border border-secondary/50 ${
+                    isOpen ? 'rounded-t-xl' : 'rounded-xl'
+                }`}
+            >
+                <span className="text-text-primary font-medium">{title}</span>
+                <FontAwesomeIcon
+                    icon={isOpen ? faChevronDown : faChevronRight}
+                    className="text-primary w-4 h-4 transition-transform group-hover:scale-110"
+                />
+            </button>
+            {isOpen && (
+                <div
+                    className="bg-secondary/30 border-l-4 border-primary p-4 rounded-b-xl border border-t-0 border-secondary/50 animate-fadeIn">
+                    <div className="text-text-primary">{content}</div>
+                </div>
+            )}
+        </div>
+    );
+}