From cf41f07bbd7639c3fa775289bd5d9331e8323fbf Mon Sep 17 00:00:00 2001 From: lllllllillllllillll Date: Fri, 3 May 2024 01:13:24 -0700 Subject: [PATCH] Multi-user dashboard --- controllers/apps.js | 4 + controllers/dashboard.js | 386 +++++++++++---------------- router/index.js | 17 +- utils/install.js | 4 +- views/dashboard.html | 10 +- views/modals/permissions.html | 6 +- views/partials/navbar.html | 11 - views/partials/user_permissions.html | 20 +- 8 files changed, 201 insertions(+), 257 deletions(-) diff --git a/controllers/apps.js b/controllers/apps.js index 360c814..3e71a96 100644 --- a/controllers/apps.js +++ b/controllers/apps.js @@ -28,6 +28,9 @@ let alert = ''; export const Apps = (req, res) => { let page = Number(req.params.page) || 1; + + console.log(req.params); + let list_start = (page-1)*28; let list_end = (page*28); let last_page = Math.ceil(templates.length/28); @@ -83,6 +86,7 @@ export const Apps = (req, res) => { export const AppTemplate = (req, res) => { let templateTest = Number(req.params.template) || 'template.json'; + console.log(templateTest); let page = Number(req.params.page) || 1; let list_start = (page-1)*28; let list_end = (page*28); diff --git a/controllers/dashboard.js b/controllers/dashboard.js index 7112f3b..28e94a6 100644 --- a/controllers/dashboard.js +++ b/controllers/dashboard.js @@ -1,22 +1,26 @@ import { Readable } from 'stream'; -import { Permission, Container, User } from '../database/models.js'; +import { Permission, User } from '../database/models.js'; import { docker } from '../server.js'; import { dockerContainerStats } from 'systeminformation'; import { readFileSync } from 'fs'; import { currentLoad, mem, networkStats, fsSize } from 'systeminformation'; +import { Op } from 'sequelize'; let hidden = ''; +let alert = ''; +let [ cardList, newCards, stats ] = [ '', '', {}]; // The page export const Dashboard = (req, res) => { let name = req.session.user; let role = req.session.role; + alert = req.session.alert; res.render("dashboard", { name: name, avatar: name.charAt(0).toUpperCase(), role: role, - alert: '' + alert: alert, }); } @@ -34,15 +38,10 @@ export const DashboardAction = async (req, res) => { let permissions_modal = readFileSync('./views/modals/permissions.html', 'utf8'); permissions_modal = permissions_modal.replace(/PermissionsTitle/g, title); let users = await User.findAll({ attributes: ['username', 'UUID']}); - for (let i = 0; i < users.length; i++) { let user_permissions = readFileSync('./views/partials/user_permissions.html', 'utf8'); let exists = await Permission.findOne({ where: {containerName: name, user: users[i].username}}); - - if (!exists) { - const newPermission = await Permission.create({ containerName: name, user: users[i].username, userID: users[i].UUID}); - } - + if (!exists) { const newPermission = await Permission.create({ containerName: name, user: users[i].username, userID: users[i].UUID}); } let permissions = await Permission.findOne({ where: {containerName: name, user: users[i].username}}); if (permissions.uninstall == true) { user_permissions = user_permissions.replace(/data-UninstallCheck/g, 'checked'); } if (permissions.edit == true) { user_permissions = user_permissions.replace(/data-EditCheck/g, 'checked'); } @@ -52,7 +51,7 @@ export const DashboardAction = async (req, res) => { if (permissions.pause == true) { user_permissions = user_permissions.replace(/data-PauseCheck/g, 'checked'); } if (permissions.restart == true) { user_permissions = user_permissions.replace(/data-RestartCheck/g, 'checked'); } if (permissions.logs == true) { user_permissions = user_permissions.replace(/data-LogsCheck/g, 'checked'); } - + if (permissions.view == true) { user_permissions = user_permissions.replace(/data-ViewCheck/g, 'checked'); } user_permissions = user_permissions.replace(/EntryNumber/g, i); user_permissions = user_permissions.replace(/EntryNumber/g, i); user_permissions = user_permissions.replace(/EntryNumber/g, i); @@ -62,17 +61,14 @@ export const DashboardAction = async (req, res) => { user_permissions = user_permissions.replace(/PermissionsContainer/g, name); user_permissions = user_permissions.replace(/PermissionsContainer/g, name); user_permissions = user_permissions.replace(/PermissionsContainer/g, name); - permissions_list += user_permissions; } - permissions_modal = permissions_modal.replace(/PermissionsList/g, permissions_list); res.send(permissions_modal); return; case 'uninstall': modal = readFileSync('./views/modals/uninstall.html', 'utf8'); modal = modal.replace(/AppName/g, name); - // let containerPermissions = await Permission.findAll({ where: {containerName: name}}); res.send(modal); return; case 'details': @@ -82,15 +78,13 @@ export const DashboardAction = async (req, res) => { modal = modal.replace(/AppImage/g, details.image); res.send(modal); return; - case 'containers': - res.send(cardList); - return; case 'updates': res.send(newCards); newCards = ''; return; case 'card': - if (hidden.includes(name) || !containersArray.find(c => c.container === name)) { + await userCards(req.session); + if (!req.session.container_list.find(c => c.container === name)) { res.send(''); return; } else { @@ -109,118 +103,60 @@ export const DashboardAction = async (req, res) => { logString += chunk.toString('utf8'); }); readableStream.on('end', function () { - res.send(`
${logString}
`); + res.send(`
${logString}
`); }); }); return; case 'hide': - let exists = await Container.findOne({ where: {name: name}}); - if (!exists) { - const newContainer = await Container.create({ name: name, visibility: false, }); - } else { - exists.update({ visibility: false }); - } - hidden = await Container.findAll({ where: {visibility:false}}); - hidden = hidden.map((container) => container.name); + let user = req.session.user; + let exists = await Permission.findOne({ where: {containerName: name, user: user}}); + if (!exists) { const newPermission = await Permission.create({ containerName: name, user: user, hide: true, userID: req.session.UUID}); } + else { exists.update({ hide: true }); } + hidden = await Permission.findAll({ where: {user: user, hide: true}}, { attributes: ['containerName'] }); + hidden = hidden.map((container) => container.containerName); res.send("ok"); return; case 'reset': - await Container.update({ visibility: true }, { where: {} }); - hidden = await Container.findAll({ where: {visibility:false}}); - hidden = hidden.map((container) => container.name); + await Permission.update({ hide: false }, { where: { user: req.session.user } }); res.send("ok"); return; - - } function status (state) { - let status = ` - + return(` ${state} - `; - return status; + `); } - // Start + // Container actions if ((action == 'start') && (value == 'stopped')) { docker.getContainer(name).start(); res.send(status('starting')); } else if ((action == 'start') && (value == 'paused')) { docker.getContainer(name).unpause(); res.send(status('starting')); - // Stop } else if ((action == 'stop') && (value != 'stopped')) { docker.getContainer(name).stop(); res.send(status('stopping')); - // Pause } else if ((action == 'pause') && (value == 'paused')) { docker.getContainer(name).unpause(); res.send(status('starting')); } else if ((action == 'pause') && (value == 'running')) { docker.getContainer(name).pause(); res.send(status('pausing')); - // Restart } else if (action == 'restart') { docker.getContainer(name).restart(); res.send(status('restarting')); } } -// Server metrics (CPU, RAM, TX, RX, DISK) -export const Stats = async (req, res) => { - let name = req.header('hx-trigger-name'); - let color = req.header('hx-trigger'); - let value = 0; - switch (name) { - case 'CPU': - await currentLoad().then(data => { - value = Math.round(data.currentLoad); - }); - break; - case 'RAM': - await mem().then(data => { - value = Math.round((data.active / data.total) * 100); - }); - break; - case 'NET': - let down = 0; - let up = 0; - let percent = 0; - await networkStats().then(data => { - down = Math.round(data[0].rx_bytes / (1024 * 1024)); - up = Math.round(data[0].tx_bytes / (1024 * 1024)); - // percent of download vs max download if max download was 1GB - percent = Math.round((down / 1000) * 100); - }); - let net = `
- -
-
- -
`; - res.send(net); - return; - case 'DISK': - await fsSize().then(data => { - value = data[0].use; - }); - break; - } - let info = `
- -
-
- -
`; - res.send(info); -} - async function containerInfo (containerName) { let container = docker.getContainer(containerName); let info = await container.inspect(); let image = info.Config.Image.split('/'); let ports_list = []; + let external = 0; + let internal = 0; try { for (const [key, value] of Object.entries(info.HostConfig.PortBindings)) { let ports = { @@ -231,20 +167,11 @@ async function containerInfo (containerName) { } ports_list.push(ports); } - } catch { - // no exposed ports - } - - let external = 0; - let internal = 0; + } catch {} try { external = ports_list[0].external; internal = ports_list[0].internal; - } catch { - // no exposed ports - } - - + } catch {} let details = { name: containerName, image: image, @@ -259,10 +186,11 @@ async function containerInfo (containerName) { } async function createCard (details) { - if (hidden.includes(details.name)) { return;} let shortname = details.name.slice(0, 10) + '...'; let trigger = 'data-hx-trigger="load, every 3s"'; let state = details.state; + let card = readFileSync('./views/partials/containerFull.html', 'utf8'); + let state_color = ''; switch (state) { case 'running': @@ -283,7 +211,7 @@ async function createCard (details) { break; } // if (name.startsWith('dweebui')) { disable = 'disabled=""'; } - let card = readFileSync('./views/partials/containerFull.html', 'utf8'); + card = card.replace(/AppName/g, details.name); card = card.replace(/AppShortName/g, shortname); card = card.replace(/AppIcon/g, details.service); @@ -297,80 +225,156 @@ async function createCard (details) { return card; } +async function userCards (session) { + session.container_list = []; + // check what containers the user wants hidden + let hidden = await Permission.findAll({ where: {user: session.user, hide: true}}, { attributes: ['containerName'] }); + hidden = hidden.map((container) => container.containerName); + // check what containers the user has permission to view + let visable = await Permission.findAll({ where: { user: session.user, [Op.or]: [{ uninstall: true }, { edit: true }, { upgrade: true }, { start: true }, { stop: true }, { pause: true }, { restart: true }, { logs: true }, { view: true }] } }); + visable = visable.map((container) => container.containerName); + // get all containers + let containers = await docker.listContainers({ all: true }); + // loop through containers + for (let i = 0; i < containers.length; i++) { + let container_name = containers[i].Names[0].replace('/', ''); + // skip hidden containers + if (hidden.includes(container_name)) { continue; } + // admin can see all containers that they don't have hidden + if (session.role == 'admin') { session.container_list.push({ container: container_name, state: containers[i].State }); } + // user can see any containers that they have any permissions for + else if (visable.includes(container_name)){ session.container_list.push({ container: container_name, state: containers[i].State }); } + } + // create a sent list if it doesn't exist + if (!session.sent_list) { session.sent_list = []; } + if (!session.update_list) { session.update_list = []; } + if (!session.new_cards) { session.new_cards = []; } +} -let [ cardList, newCards, containersArray, sentArray, updatesArray ] = [ '', '', [], [], [] ]; +async function updateDashboard (session) { + let container_list = session.container_list; + let sent_list = session.sent_list; + session.new_cards = []; + session.update_list = []; + // loop through the containers list + container_list.forEach(info => { + let { container, state } = info; + let sent = sent_list.find(c => c.container === container); + if (!sent) { session.new_cards.push(container);} + else if (sent.state !== state) { session.update_list.push(container); } + }); + // loop through the sent list to see if any containers have been removed + sent_list.forEach(info => { + let { container } = info; + let exists = container_list.find(c => c.container === container); + if (!exists) { session.update_list.push(container); } + }); +} // HTMX server-side events export const SSE = async (req, res) => { + // set the headers for server-sent events res.writeHead(200, { 'Content-Type': 'text/event-stream', 'Cache-Control': 'no-cache', 'Connection': 'keep-alive' }); - + // check for container changes every 500ms let eventCheck = setInterval(async () => { - // builds array of containers and their states - containersArray = []; - await docker.listContainers({ all: true }).then(containers => { - containers.forEach(container => { - let name = container.Names[0].replace('/', ''); - if (!hidden.includes(name)) { // if not hidden - containersArray.push({ container: name, state: container.State }); - } - }); - }); + await userCards(req.session); + // check if the cards displayed are the same as what's in the session + if ((JSON.stringify(req.session.container_list) === JSON.stringify(req.session.sent_list))) { return; } + await updateDashboard(req.session); - if ((JSON.stringify(containersArray) !== JSON.stringify(sentArray))) { - cardList = ''; - newCards = ''; - containersArray.forEach(container => { - const { container: containerName, state } = container; - const existingContainer = sentArray.find(c => c.container === containerName); - if (!existingContainer) { - containerInfo(containerName).then(details => { - createCard(details).then(card => { - newCards += card; - }); - }); - res.write(`event: update\n`); - res.write(`data: 'update cards'\n\n`); - } else if (existingContainer.state !== state) { - updatesArray.push(containerName); - } - containerInfo(containerName).then(details => { - createCard(details).then(card => { - cardList += card; - }); - }); - }); - - sentArray.forEach(container => { - const { container: containerName } = container; - const existingContainer = containersArray.find(c => c.container === containerName); - if (!existingContainer) { - updatesArray.push(containerName); - } - }); - - for (let i = 0; i < updatesArray.length; i++) { - res.write(`event: ${updatesArray[i]}\n`); - res.write(`data: 'update cards'\n\n`); - } - updatesArray = []; - sentArray = containersArray.slice(); + for (let i = 0; i < req.session.new_cards.length; i++) { + let details = await containerInfo(req.session.new_cards[i]); + let card = await createCard(details); + newCards += card; + req.session.alert = ''; } - + for (let i = 0; i < req.session.update_list.length; i++) { + res.write(`event: ${req.session.update_list[i]}\n`); + res.write(`data: 'update cards'\n\n`); + } + res.write(`event: update\n`); + res.write(`data: 'update cards'\n\n`); + req.session.sent_list = req.session.container_list.slice(); }, 500); - - req.on('close', () => { clearInterval(eventCheck); }); }; -let stats = {}; +// Server metrics (CPU, RAM, TX, RX, DISK) +export const Stats = async (req, res) => { + let name = req.header('hx-trigger-name'); + let color = req.header('hx-trigger'); + let value = 0; + switch (name) { + case 'CPU': + await currentLoad().then(data => { value = Math.round(data.currentLoad); }); + break; + case 'RAM': + await mem().then(data => { value = Math.round((data.active / data.total) * 100); }); + break; + case 'NET': + let [down, up, percent] = [0, 0, 0]; + await networkStats().then(data => { down = Math.round(data[0].rx_bytes / (1024 * 1024)); up = Math.round(data[0].tx_bytes / (1024 * 1024)); percent = Math.round((down / 1000) * 100); }); + let net = `
+
`; + res.send(net); + return; + case 'DISK': + await fsSize().then(data => { value = data[0].use; }); + break; + } + let info = `
+
`; + res.send(info); +} + +// Imported by utils/install.js +export async function addAlert (session, name) { + session.alert = ``; +} + +export const UpdatePermissions = async (req, res) => { + let { user, container } = req.body; + let id = req.header('hx-trigger'); + await Permission.update({ uninstall: false, edit: false, upgrade: false, start: false, stop: false, pause: false, restart: false, logs: false }, { where: { containerName: container, user: user } }); + Object.keys(req.body).forEach(async function(key) { + if (key != 'user' && key != 'container') { + let permissions = req.body[key]; + if (permissions.includes('uninstall')) { await Permission.update({ uninstall: true }, { where: {containerName: container, user: user}}); } + if (permissions.includes('edit')) { await Permission.update({ edit: true }, { where: {containerName: container, user: user}}); } + if (permissions.includes('upgrade')) { await Permission.update({ upgrade: true }, { where: {containerName: container, user: user}}); } + if (permissions.includes('start')) { await Permission.update({ start: true }, { where: {containerName: container, user: user}}); } + if (permissions.includes('stop')) { await Permission.update({ stop: true }, { where: {containerName: container, user: user}}); } + if (permissions.includes('pause')) { await Permission.update({ pause: true }, { where: {containerName: container, user: user}}); } + if (permissions.includes('restart')) { await Permission.update({ restart: true }, { where: {containerName: container, user: user}}); } + if (permissions.includes('logs')) { await Permission.update({ logs: true }, { where: {containerName: container, user: user}}); } + if (permissions.includes('view')) { await Permission.update({ view: true }, { where: {containerName: container, user: user}}); } + } + }); + if (id == 'submit') { + res.send(''); + return; + } else if (id == 'confirmed') { + res.send(''); + return; + } +} + // Container charts export const Chart = async (req, res) => { let name = req.header('hx-trigger-name'); - if (!stats[name]) { - stats[name] = { cpuArray: Array(15).fill(0), ramArray: Array(15).fill(0) }; - } + if (!stats[name]) { stats[name] = { cpuArray: Array(15).fill(0), ramArray: Array(15).fill(0) }; } const info = await dockerContainerStats(name); stats[name].cpuArray.push(Math.round(info[0].cpuPercent)); stats[name].ramArray.push(Math.round(info[0].memPercent)); @@ -385,72 +389,4 @@ export const Chart = async (req, res) => { }]) ` res.send(chart); -} - -export const UpdatePermissions = async (req, res) => { - let { user, container } = req.body; - let id = req.header('hx-trigger'); - - await Permission.update({ uninstall: false, edit: false, upgrade: false, start: false, stop: false, pause: false, restart: false, logs: false }, { where: { containerName: container, user: user } }); - - Object.keys(req.body).forEach(async function(key) { - if (key != 'user' && key != 'container') { - let permissions = req.body[key]; - - if (permissions.includes('uninstall')) { - await Permission.update({ uninstall: true }, { where: {containerName: container, user: user}}); - } - if (permissions.includes('edit')) { - await Permission.update({ edit: true }, { where: {containerName: container, user: user}}); - } - if (permissions.includes('upgrade')) { - await Permission.update({ upgrade: true }, { where: {containerName: container, user: user}}); - } - if (permissions.includes('start')) { - await Permission.update({ start: true }, { where: {containerName: container, user: user}}); - } - if (permissions.includes('stop')) { - await Permission.update({ stop: true }, { where: {containerName: container, user: user}}); - } - if (permissions.includes('pause')) { - await Permission.update({ pause: true }, { where: {containerName: container, user: user}}); - } - if (permissions.includes('restart')) { - await Permission.update({ restart: true }, { where: {containerName: container, user: user}}); - } - if (permissions.includes('logs')) { - await Permission.update({ logs: true }, { where: {containerName: container, user: user}}); - } - } - }); - - let submit = ''; - if (id == 'submit') { - submit = ``; - res.send(submit); - return; - } else if (id == 'confirmed') { - submit = ``; - res.send(submit); - return; - } -} - -// Gets imported by install.js -export async function addCard (name, state) { - console.log(`Adding card for ${name}: ${state}`); - - let details = { - name: name, - image: name, - service: name, - state: 'installing', - external_port: 0, - internal_port: 0, - ports: [], - link: 'localhost', - } - createCard(details).then(card => { - cardList += card; - }); } \ No newline at end of file diff --git a/router/index.js b/router/index.js index a3b0497..0bcf10e 100644 --- a/router/index.js +++ b/router/index.js @@ -6,7 +6,7 @@ export const router = express.Router(); import { Login, submitLogin, Logout } from "../controllers/login.js"; import { Register, submitRegister } from "../controllers/register.js"; import { Dashboard, DashboardAction, Stats, Chart, SSE, UpdatePermissions } from "../controllers/dashboard.js"; -import { Apps, appSearch, AppTemplate, InstallModal, ImportModal, LearnMore, Upload } from "../controllers/apps.js"; +import { Apps, appSearch, InstallModal, ImportModal, LearnMore, Upload } from "../controllers/apps.js"; import { Users } from "../controllers/users.js"; import { Images } from "../controllers/images.js"; import { Networks, removeNetwork } from "../controllers/networks.js"; @@ -31,13 +31,12 @@ const sessionCheck = async (req, res, next) => { } const permissionCheck = async (req, res, next) => { - if (!req.session.user) { res.redirect('/login'); return; } - else if (req.session.role == 'admin') { next(); return; } + if (req.session.role == 'admin') { next(); return; } let user = req.session.user; let action = req.path.split("/")[2]; let trigger = req.header('hx-trigger-name'); - const userAction = ['start', 'stop', 'restart', 'pause', 'uninstall', 'upgrade', 'edit', 'logs', 'hide', 'reset_view']; - const userPaths = ['card', 'containers', 'updates']; + const userAction = ['start', 'stop', 'restart', 'pause', 'uninstall', 'upgrade', 'edit', 'logs', 'view']; + const userPaths = ['card', 'updates', 'hide', 'reset']; if (userAction.includes(action)) { let permission = await Permission.findOne({ where: { containerName: trigger, user: user }, attributes: [`${action}`] }); if (permission) { @@ -69,7 +68,7 @@ router.post("/register", submitRegister); router.get("/", sessionCheck, Dashboard); router.get("/dashboard", sessionCheck, Dashboard); -router.post("/dashboard/:action", permissionCheck, DashboardAction); +router.post("/dashboard/:action", sessionCheck, permissionCheck, DashboardAction); router.get("/sse", sessionCheck, SSE); router.post("/updatePermissions", adminOnly, UpdatePermissions); router.get("/stats", sessionCheck, Stats); @@ -84,10 +83,10 @@ router.post("/removeVolume", adminOnly, removeVolume); router.get("/networks", adminOnly, Networks); router.post("/removeNetwork", adminOnly, removeNetwork); -router.get("/apps", adminOnly, Apps); -router.get("/apps/:page", adminOnly, Apps); -router.get("/apps/template/:template", adminOnly, AppTemplate); +router.get("/apps/:page?/:template?", adminOnly, Apps); + router.post("/apps", adminOnly, appSearch); + router.get("/install_modal", adminOnly, InstallModal) router.get("/import_modal", adminOnly, ImportModal) router.get("/learn_more", adminOnly, LearnMore) diff --git a/utils/install.js b/utils/install.js index 52d1dea..9f892ed 100644 --- a/utils/install.js +++ b/utils/install.js @@ -4,7 +4,7 @@ import { execSync } from "child_process"; import { docker } from "../server.js"; import DockerodeCompose from "dockerode-compose"; import { Syslog } from "../database/models.js"; -import { addCard } from "../controllers/dashboard.js"; +import { addAlert } from "../controllers/dashboard.js"; // This entire page hurts to look at. export const Install = async (req, res) => { @@ -21,7 +21,7 @@ export const Install = async (req, res) => { let docker_volumes = []; - addCard(name, 'installing'); + addAlert(req.session, name); if (image.startsWith('https://')){ mkdirSync(`./appdata/${name}`, { recursive: true }); diff --git a/views/dashboard.html b/views/dashboard.html index 8638cf9..a8772b0 100644 --- a/views/dashboard.html +++ b/views/dashboard.html @@ -7,8 +7,8 @@ DweebUI - Dashboard - - + +