Developer
bea71ab85b
- Resolve 57 merge conflicts from codebase restructure - Port dev feature code to new directory structure: * Update import paths to use @/ aliases * Add backward-compatible API signatures (createInstance, startInstance, deleteInstance) * Add missing type exports (ProjectWithRepos, InstanceHealth, Branch, BranchesResponse) * Extend Session and GitRepository types for dev features * Extend TerminalComponent props for mobile terminal wrapper * Add missing icon names (bell, drag, undo) Quality gates: tsc pass (0 errors), build pass, 127/131 tests pass (4 pre-existing failures unrelated to merge)
63 lines
1.6 KiB
TypeScript
63 lines
1.6 KiB
TypeScript
import { useLocation, useNavigate } from "react-router-dom";
|
|
import { Icon } from "@/components/ui/Icon";
|
|
|
|
interface ToolsBottomSheetProps {
|
|
isOpen: boolean;
|
|
onClose: () => void;
|
|
}
|
|
|
|
const TOOLS_ITEMS = [
|
|
{ to: "/tool-workshop", label: "Tool Workshop" },
|
|
{ to: "/config-profiles", label: "Config Profiles" },
|
|
];
|
|
|
|
export const ToolsBottomSheet: React.FC<ToolsBottomSheetProps> = ({
|
|
isOpen,
|
|
onClose,
|
|
}) => {
|
|
const location = useLocation();
|
|
const navigate = useNavigate();
|
|
|
|
if (!isOpen) return null;
|
|
|
|
const handleSelect = (to: string) => {
|
|
onClose();
|
|
navigate(to);
|
|
};
|
|
|
|
return (
|
|
<div
|
|
className="mobile-bottom-sheet-overlay"
|
|
onClick={onClose}
|
|
role="presentation"
|
|
>
|
|
<div
|
|
className="mobile-bottom-sheet"
|
|
onClick={(e) => e.stopPropagation()}
|
|
role="dialog"
|
|
aria-label="Tools menu"
|
|
>
|
|
<div className="mobile-bottom-sheet-header">
|
|
<div className="mobile-bottom-sheet-handle" />
|
|
<h3 className="mobile-bottom-sheet-title">Tools</h3>
|
|
</div>
|
|
<div className="mobile-bottom-sheet-content">
|
|
{TOOLS_ITEMS.map((item) => (
|
|
<button
|
|
key={item.to}
|
|
className={`mobile-bottom-sheet-item ${
|
|
location.pathname === item.to ? "active" : ""
|
|
}`}
|
|
onClick={() => handleSelect(item.to)}
|
|
type="button"
|
|
>
|
|
<span className="mobile-bottom-sheet-item-label">{item.label}</span>
|
|
{location.pathname === item.to && <Icon name="success" size="sm" />}
|
|
</button>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|