- Replace all hand-written CSS with Tailwind utility classes - Upgrade CodeMirror 5 to CodeMirror 6 (scoped @codemirror/* packages) - Redesign layout with responsive sidebar navigation using JSX/Mithril - Flatten admin routes (e.g. /admin/presets -> /presets) - Add "remember me" login option with 2-week persistent cookie - Add delete confirmation dialogs across admin pages - Upgrade esbuild from 0.21 to 0.27 and update browser targets - Add Inter and Roboto Mono variable fonts with subset script
92 lines
3.1 KiB
TypeScript
92 lines
3.1 KiB
TypeScript
import { ClosureComponent, Component } from "mithril";
|
|
import { m } from "../components.ts";
|
|
import * as taskQueue from "../task-queue.ts";
|
|
import * as notifications from "../notifications.ts";
|
|
import * as store from "../store.ts";
|
|
|
|
const component: ClosureComponent = (): Component => {
|
|
return {
|
|
view: (vnode) => {
|
|
const device = vnode.attrs["device"];
|
|
|
|
const buttons = [];
|
|
|
|
buttons.push(
|
|
m(
|
|
"button.px-4 py-2 border border-stone-300 shadow-xs text-sm font-medium rounded-md text-stone-700 bg-white hover:bg-stone-50 focus:outline-hidden focus:ring-2 focus:ring-offset-2 focus:ring-cyan-500 disabled:opacity-50 disabled:cursor-not-allowed",
|
|
{
|
|
title: "Reboot device",
|
|
onclick: () => {
|
|
taskQueue.queueTask({
|
|
name: "reboot",
|
|
device: device["DeviceID.ID"].value[0],
|
|
});
|
|
},
|
|
},
|
|
"Reboot",
|
|
),
|
|
);
|
|
|
|
buttons.push(
|
|
m(
|
|
"button.px-4 py-2 border border-stone-300 shadow-xs text-sm font-medium rounded-md text-stone-700 bg-white hover:bg-stone-50 focus:outline-hidden focus:ring-2 focus:ring-offset-2 focus:ring-cyan-500 disabled:opacity-50 disabled:cursor-not-allowed",
|
|
{
|
|
title: "Factory reset device",
|
|
onclick: () => {
|
|
taskQueue.queueTask({
|
|
name: "factoryReset",
|
|
device: device["DeviceID.ID"].value[0],
|
|
});
|
|
},
|
|
},
|
|
"Reset",
|
|
),
|
|
);
|
|
|
|
buttons.push(
|
|
m(
|
|
"button.px-4 py-2 border border-stone-300 shadow-xs text-sm font-medium rounded-md text-stone-700 bg-white hover:bg-stone-50 focus:outline-hidden focus:ring-2 focus:ring-offset-2 focus:ring-cyan-500 disabled:opacity-50 disabled:cursor-not-allowed",
|
|
{
|
|
title: "Push a firmware or a config file",
|
|
onclick: () => {
|
|
taskQueue.stageDownload({
|
|
name: "download",
|
|
devices: [device["DeviceID.ID"].value[0]],
|
|
});
|
|
},
|
|
},
|
|
"Push file",
|
|
),
|
|
);
|
|
|
|
buttons.push(
|
|
m(
|
|
"button.px-4 py-2 border border-stone-300 shadow-xs text-sm font-medium rounded-md text-stone-700 bg-white hover:bg-stone-50 focus:outline-hidden focus:ring-2 focus:ring-offset-2 focus:ring-cyan-500 disabled:opacity-50 disabled:cursor-not-allowed",
|
|
{
|
|
title: "Delete device",
|
|
onclick: () => {
|
|
if (!confirm("Deleting this device. Are you sure?")) return;
|
|
const deviceId = device["DeviceID.ID"].value[0];
|
|
|
|
store
|
|
.deleteResource("devices", deviceId)
|
|
.then(() => {
|
|
notifications.push("success", `${deviceId}: Device deleted`);
|
|
m.route.set("/devices");
|
|
})
|
|
.catch((err) => {
|
|
notifications.push("error", err.message);
|
|
});
|
|
},
|
|
},
|
|
"Delete",
|
|
),
|
|
);
|
|
|
|
return m("div.flex gap-3 mt-4", buttons);
|
|
},
|
|
};
|
|
};
|
|
|
|
export default component;
|