Initial commit

45472ae6 · ale · 45472ae6 · 45472ae6 · 45472ae6 · 45472ae6
Commit 45472ae6 authored 2 years ago by ale
--- a/.gitignore
+++ b/.gitignore
+node_modules
+assets
+package-lock.json
--- a/package.json
+++ b/package.json
+{
+  "name": "ai-admin-dashboard",
+  "version": "0.1.0",
+  "dependencies": {
+    "css-loader": "6.7.1",
+    "extract-loader": "5.1.0",
+    "html-webpack-plugin": "5.5.0",
+    "mini-css-extract-plugin": "2.7.0",
+    "prometheus-query": "3.3.0",
+    "purgecss-webpack-plugin": "4.1.3",
+    "raw-loader": "4.0.2",
+    "webpack": "latest",
+    "webpack-cli": "latest",
+    "webpack-subresource-integrity": "5.1.0"
+  }
+}
--- a/src/dashboard.js
+++ b/src/dashboard.js
+import { PrometheusDriver } from 'prometheus-query';
+
+const prom = new PrometheusDriver({
+    endpoint: "https://monitor.autistici.org",
+    baseURL: "/api/v1",
+    withCredentials: true
+});
+
+const accountsQuery = "sum(max(accounts_count) by (shard,type,status)) by (type)";
+
+const accountNiceNames = {
+    mail: "email accounts",
+    web: "websites",
+    lists: "lists",
+    newsletters: "newsletters"
+};
+
+function queryAccounts(el) {
+    prom.instantQuery(accountsQuery)
+        .then((res) => {
+            const series = res.result;
+            var tmp = [];
+            series.forEach((serie) => {
+                tmp.push('' + serie.value.value + ' ' +
+                         accountNiceNames[serie.metric.labels.type]);
+            });
+
+            var txt = 'We are currently hosting ' + tmp.join(', ') + '.';
+            var p = document.createElement('p');
+            p.appendChild(document.createTextNode(txt));
+            el.append(p);
+        })
+        .catch((err) => {
+            dashboardError('Failed to fetch account metrics', err);
+        });
+};
+
+function dashboardError(msg, err) {
+    var p = document.createElement('p');
+    p.appendChild(document.createTextNode(msg + ': ' + err.error));
+    document.getElementById('errors').append(p);
+};
+
+window.addEventListener('load', () => {
+    console.log('Populating data items...');
+
+    queryAccounts(document.getElementById('accountInfo'));
+});
--- a/src/index.html
+++ b/src/index.html
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>Autistici/Inventati Admin Dashboard</title>
+    <style type="text/css">
+body {
+    background: white;
+    font-family: serif;
+}
+
+#main {
+    width: 550px;
+    margin: 0 auto;
+    margin-top: 40px;
+    text-align: left;
+    vertical-align: top;
+}
+
+#main p {
+    margin-top: 20px;
+}
+
+.float-right {
+    float: right;
+    text-align: right;
+    clear: left;
+}
+
+.title {
+    background: url('data:image/gif;base64,R0lGODlhIAAhAMQAAPoEBPNLS/PFxfFycvJbW/OoqPG6uvPX1/M9Pfn//+qmpvCSkvb19fYkJPkVFfKbm/z///fp6fn7+/NkZPfu7vXg4Pfx8fG1tfCAgPj5+fMzM+/s7PLPz/BSUv8AAP///yH5BAAAAAAALAAAAAAgACEAAAX/4CeOZGmeaKqubOu+cCyPUkRBM2ogjkNEuVLF4Sl6EIzgqGA0GpQiZtPzhHIATQcQSiEaEYkYBEdKIJoT8ggSPkkWgQlHDZk0H+ULIbCQlBJ2RQATFWQLRgACIgkCZ0YDah8CWFkYFJJGDQwQHAGUiAckClOZBQqUDgoTn1MKJBekTayxTVUiDI60ulMaFiUUGBoOALO6AA4NCAMVJxASFAcXDwMEXk0NCwUGHBEMbS4JHaRIQRAYtAG+MgkDWRpNCFsvGQRTDxvWR/IsFuLXvu2aaGDGIkMAUgtEHJil4dIKKf9EQKg3BcMKcwhJTJoSINKJAqwa7EtwsInFFYAQIRUwsbEIAnUrJBQI0OGCxw8QLiBAgGEfiwTfTiSQcFNECAA7') no-repeat top left;
+    padding-left: 50px;
+    display: block;
+    padding-bottom: 5px;
+    border-bottom: 1px solid black;
+}
+
+#errors {
+    margin-top: 50px;
+}
+
+#errors p {
+    background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAQAAAC1+jfqAAAAAmJLR0QA/4ePzL8AAACmSURBVCjPY2AgCUxgeMvQj1s6mOESgygQB2OX5mS4z+AApG0YHjJwY1PQyrAYyloCZGMAFYZXDFIMTAx/gWxxIFsdXcFWhkIgCVHAwFDEsAtVOpDhCgMrkgIWhotAMSTn3WNwBLNgCtCc2sywFMpCKGBgWAYUBwNloJOksfhKAubU9QzFcEFkExiA4utB1Gus+kFABmgGEBQwfGL4jxV+ZMhnoAIAADzYLvLUk8zUAAAAAElFTkSuQmCC') no-repeat top left;
+    padding-left: 20px;
+    color: red;
+}
+    </style>
+  </head>
+
+  <body>
+
+    <div id="main">
+
+      <h1 class="title">A/I Admin Dashboard</h1>
+
+      <p>
+        Welcome to the primary admin interface for A/I. From here you
+        can easily find all the administrative web interfaces, and links
+        to other important services.
+      </p>
+
+      <h3>Account management</h3>
+
+      <div id="accountInfo"></div>
+
+      <ul>
+        <li><a href="https://accountadmin.autistici.org/">accountadmin</a> - user account management</li>
+        <li><a href="https://services.autistici.org/admin/">services</a> - manage new account requests</li>
+        <li><a href="https://helpdesk.autistici.org/rt/">helpdesk</a> - user support requests</li>
+        <li><a href="https://feedback-loop.autistici.org/">feedback-loop</a> - latest spam reports from external email providers</li>
+        <li><a href="https://web-scanner.autistici.org/">web-scanner</a> - vulnerability reports for hosted user websites</li>
+      </ul>
+
+      <h3>System information</h3>
+
+      <div id="sysInfo"></div>
+
+      <ul>
+        <li><a href="https://admin.autistici.org/">service-dashboard</a> - map of services and hosts</li>
+        <li><a href="https://logs.autistici.org/">logs</a> - centralized log analysis
+          <ul>
+            <li><a href="https://logs.autistici.org/app/discover#/?_g=(filters:!(),refreshInterval:(pause:!t,value:0),time:(from:now-24h,to:now))&amp;_a=(columns:!(_source),filters:!(),index:ec2f3610-55c7-11e8-823a-73397be2582f,interval:auto,query:(language:kuery,query:''),sort:!())">syslog</a></li>
+            <li><a href="https://logs.autistici.org/app/dashboards#/view/AV9wDlJSJ4s36xPImL8m">web traffic</a></li>
+          </ul>
+        </li>
+
+        <li><a href="https://grafana.autistici.org/">grafana</a> - monitoring dashboards</li>
+        <li><a href="https://alerts.autistici.org/">alerts</a> - currently firing alerts</li>
+        <li><a href="https://thanos.autistici.org/">thanos</a> - query monitoring metrics</li>
+        <li><a href="https://backups.autistici.org/">backups</a> - info on recent backups</li>
+        <li><a href="https://assets.autistici.org/">assets</a> - deployed software asset tracking</li>
+      </ul>
+
+      <h3>Documentation</h3>
+
+      <ul>
+        <li><a href="https://git.autistici.org/ai/wiki/-/wikis/home">wiki</a> - operational documentation</li>
+        <li><a href="https://git.autistici.org/ai3/float/-/blob/master/docs/reference.md">float</a> - documentation of the underlying automation system</li>
+        <li><a href="https://git.autistici.org/ai3/config">ai3/config</a> - main configuration repository</li>
+      </ul>
+
+      <div id="errors"></div>
+
+    </div>
+
+<% for (let index in htmlWebpackPlugin.files.js) { %>
+    <script
+       src="<%= htmlWebpackPlugin.files.js[index] %>"
+       integrity="<%= htmlWebpackPlugin.files.jsIntegrity[index] %>"
+       crossorigin="<%= webpackConfig.output.crossOriginLoading %>"></script>
+<% } %>
+  </body>
+</html>
--- a/webpack.config.js
+++ b/webpack.config.js
+const webpack = require('webpack');
+const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+const HtmlWebpackPlugin = require('html-webpack-plugin');
+const PurgeCSSPlugin = require('purgecss-webpack-plugin');
+const { SubresourceIntegrityPlugin } = require('webpack-subresource-integrity');
+
+module.exports = {
+    context: __dirname + '/src',
+    entry: {
+        dashboard: [
+            './dashboard.js',
+            //'./dashboard.css',
+        ],
+    },
+    mode: 'production',
+    output: {
+        publicPath: '/',
+        path: __dirname + '/assets',
+        filename: '[name]-[contenthash].min.js',
+        assetModuleFilename: 'assets/[name][ext]',
+        crossOriginLoading: 'anonymous',
+        clean: true,
+    },
+    plugins: [
+        /**
+        new MiniCssExtractPlugin({
+            filename: '[name]-[contenthash].css',
+        }),
+        **/
+        new HtmlWebpackPlugin({
+            template: 'index.html',
+            minify: false,
+            inject: false,
+        }),
+        /**
+        new PurgeCSSPlugin({
+            paths: [__dirname + '/src/index.html'],
+            safelist: [/^oi/, /show/, /tooltip/],
+        }),
+        **/
+        new SubresourceIntegrityPlugin(),
+    ],
+    module: {
+        rules: [
+            {
+                test: /\.css$/,
+                use: [MiniCssExtractPlugin.loader, 'css-loader'],
+            },
+            {
+                test: /\.(ico|png|gif|jpe?g|svg|eot|otf|ttf|woff)$/,
+                type: 'asset/resource',
+            },
+        ],
+    },
+};