1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
import type { Monitor } from "@/services/monitors";
import { bind, idle, register, Variable } from "astal";
import { App, Astal, Gdk, Gtk, Widget } from "astal/gtk3";
import { sidebar as config } from "config";
import Alerts from "./alerts";
import Audio from "./audio";
import Connectivity from "./connectivity";
import Dashboard from "./dashboard";
import Packages from "./packages";
import Time from "./time";
export const paneNames = ["dashboard", "audio", "connectivity", "packages", "alerts", "time"] as const;
export type PaneName = (typeof paneNames)[number];
export const switchPane = (monitor: Monitor, name: PaneName) => {
const sidebar = App.get_window(`sidebar${monitor.id}`) as SideBar | null;
if (sidebar) {
if (sidebar.visible && sidebar.shown.get() === name) sidebar.hide();
else sidebar.show();
sidebar.shown.set(name);
}
};
export const awaitSidebar = (monitor: Monitor) =>
new Promise<SideBar>(resolve => {
let sidebar: SideBar | null = null;
const awaitSidebar = () => {
sidebar = App.get_window(`sidebar${monitor.id}`) as SideBar | null;
if (sidebar) resolve(sidebar);
else idle(awaitSidebar);
};
idle(awaitSidebar);
});
const getPane = (monitor: Monitor, name: PaneName) => {
if (name === "dashboard") return <Dashboard />;
if (name === "audio") return <Audio />;
if (name === "connectivity") return <Connectivity />;
if (name === "packages") return <Packages monitor={monitor} />;
if (name === "alerts") return <Alerts monitor={monitor} />;
return <Time />;
};
@register()
export default class SideBar extends Widget.Window {
readonly shown: Variable<PaneName>;
constructor({ monitor }: { monitor: Monitor }) {
super({
application: App,
name: `sidebar${monitor.id}`,
namespace: "caelestia-sidebar",
monitor: monitor.id,
anchor: Astal.WindowAnchor.LEFT | Astal.WindowAnchor.TOP | Astal.WindowAnchor.BOTTOM,
exclusivity: Astal.Exclusivity.EXCLUSIVE,
visible: false,
});
this.shown = Variable(paneNames[0]);
this.add(
<eventbox
onScroll={(_, event) => {
if (event.modifier & Gdk.ModifierType.BUTTON1_MASK) {
const index = paneNames.indexOf(this.shown.get()) + (event.delta_y < 0 ? -1 : 1);
if (index < 0 || index >= paneNames.length) return;
this.shown.set(paneNames[index]);
}
}}
>
<box vertical className="sidebar">
<stack
vexpand
transitionType={Gtk.StackTransitionType.SLIDE_UP_DOWN}
transitionDuration={200}
shown={bind(this.shown)}
>
{paneNames.map(n => getPane(monitor, n))}
</stack>
</box>
</eventbox>
);
if (config.showOnStartup.get()) idle(() => this.show());
}
}
|
