users/ryan/modules/simple-bar/simple-bar-source/lib/components/yabai/space-options.jsx

cabf188ae487120d4b9ac1fe21fff45403a787b4 · 2.5 KB · 84 lines raw

1	import * as Uebersicht from "uebersicht";
2	import * as Icons from "../icons/icons.jsx";
3	import { SuspenseIcon } from "../icons/icon.jsx";
4	import { useSimpleBarContext } from "../simple-bar-context.jsx";
5	import * as Utils from "../../utils.js";
6	import * as Yabai from "../../yabai.js";
7
8	const { React } = Uebersicht;
9
10	/**
11	* SpaceOptions component provides options to manipulate spaces (move left, move right, remove).
12	* @param {Object} props - The component props.
13	* @param {number} props.index - The index of the space.
14	* @param {Function} props.setHovered - Function to set the hovered state.
15	* @returns {JSX.Element} The SpaceOptions component.
16	*/
17	export default function SpaceOptions({ index, setHovered }) {
18	// Get displayIndex from the context
19	const { displayIndex } = useSimpleBarContext();
20
21	/**
22	* Handles the click event to remove a space.
23	* @param {Event} e - The click event.
24	*/
25	const remove = async (e) => {
26	e.stopPropagation();
27	Utils.clickEffect(e);
28	setHovered(false);
29	await Yabai.removeSpace(index, displayIndex);
30	};
31
32	/**
33	* Returns a function to handle the click event to swap a space.
34	* @param {string} direction - The direction to swap the space ("left" or "right").
35	* @returns {Function} The click event handler.
36	*/
37	const moveTo = (direction) => async (e) => {
38	Utils.clickEffect(e);
39	setHovered(false);
40	await Yabai.swapSpace(index, direction);
41	};
42
43	/**
44	* Prevents the default behavior of the mouse down event.
45	* @param {Event} e - The mouse down event.
46	*/
47	const onMouseDown = (e) => e.preventDefault();
48
49	/**
50	* Handles the mouse leave event to unset the hovered state.
51	*/
52	const onMouseLeave = () => setHovered(false);
53
54	return (
55	<span className="space-options" onMouseLeave={onMouseLeave}>
56	<div
57	className="space-options__option space-options__option--move-prev"
58	onMouseDown={onMouseDown}
59	onClick={moveTo("left")}
60	>
61	<SuspenseIcon>
62	<Icons.ChevronLeft />
63	</SuspenseIcon>
64	</div>
65	<div
66	className="space-options__option space-options__option--move-next"
67	onMouseDown={onMouseDown}
68	onClick={moveTo("right")}
69	>
70	<SuspenseIcon>
71	<Icons.ChevronRight />
72	</SuspenseIcon>
73	</div>
74	<div
75	className="space-options__option space-options__option--remove"
76	onClick={remove}
77	>
78	<SuspenseIcon>
79	<Icons.Remove />
80	</SuspenseIcon>
81	</div>
82	</span>
83	);
84	}