Enable data synchronization from the UI

app/application.js

@@ -154,7 +154,7 @@ class RunConditionTableApplication {
         httpServer.get(EP.rctData, (req, res) => databaseService.pgExecFetchData(req, res));
         httpServer.post(EP.insertData, (req, res) => databaseService.pgExecDataInsert(req, res));
         httpServer.get(EP.date, (req, res) => databaseService.getDate(req, res));
-        httpServer.get('sync', (req, res) => this.syncAll());
+        httpServer.get(EP.sync, async (req, res) => this.syncAll());
     }
 
     buildAuthControl() {

app/config/public.js

@@ -63,6 +63,7 @@ module.exports = { // Properties that will be provided to frontend in the public
         insertData: '/Rct-Data/insert-data/',
         authControl: '/auth-control/',
         date: '/date/',
+        sync: '/sync/',
     },
     methods: {
         login: 'post',

app/lib/ResProvider.js

@@ -227,11 +227,9 @@ class ResProvider {
         const p = ResProvider.viaEnvVars(varsDef, null, 'warn');
         let { host } = p;
         let { path } = p;
-        // eslint-disable-next-line prefer-destructuring
-        let prot = p['prot'];
+        let { prot } = p || {};
         prot = prot ? prot.trim().replace('://', '') : 'https';
-        // eslint-disable-next-line prefer-destructuring
-        let port = p['port'];
+        let { port } = p || {};
         const hs = host.split(':');
         if (hs.length === 2) {
             // eslint-disable-next-line prefer-destructuring

app/public/components/userView/data/table/noDataView.js

@@ -0,0 +1,84 @@
+/**
+ * @license
+ * Copyright 2019-2020 CERN and copyright holders of ALICE O2.
+ * See http://alice-o2.web.cern.ch/copyright for details of the copyright holders.
+ * All rights not expressly granted are reserved.
+ *
+ * This software is distributed under the terms of the GNU General Public
+ * License v3 (GPL Version 3), copied verbatim in the file "COPYING".
+ *
+ * In applying this license CERN does not waive the privileges and immunities
+ * granted to it by virtue of its status as an Intergovernmental Organization
+ * or submit itself to any jurisdiction.
+ */
+
+import { h } from '/js/src/index.js';
+import { RCT } from '../../../../config.js';
+const { pagesNames } = RCT;
+
+function useState(defaultValue) {
+    let value = defaultValue;
+
+    function getValue() {
+      return value;
+    }
+
+    function setValue(newValue) {
+      value = newValue;
+    }
+
+    return [getValue, setValue];
+  }
+
+  const modes = {
+	requested: 0,
+	waiting: 1,
+}
+
+export default function noDataView(
+    model, dataPointer
+) {
+    const [mode, setMode] = useState(modes.waiting);
+    const goBackBtn = h('button.btn.btn-primary.m3', {
+        onclick: () => model.removeCurrentData(),
+    }, 'Go back');
+    const reloadBtn = h('button.btn.btn-primary.m3', {
+        onclick: async () => {
+            if (mode() === modes.waiting) {
+                await model.sync();
+                // await model.fetchedData.reqForData(true);
+                // model.notify();
+                // document.location.reload(true);
+            } else {
+                model.fetchedData.reqForData(true);
+            }
+            setMode(modes.requested);
+        },
+    }, 'Reload');
+    const noDataMessage = h('h3', 'No data found');
+    const noDataExplanation = h('h5', `${
+        dataPointer.page === pagesNames.periods
+            ? 'Please sysnchronize with outer services'
+            : 'There is no data to be displayed here'
+    }`);
+
+    const noPeriodsView = h('.loginDiv.top-100', [
+        h('.synchronize-90'),
+        noDataMessage,
+        noDataExplanation,
+        reloadBtn,
+    ]);
+
+    const noDataView = h('.loginDiv.top-100', [
+        h('.nothing-found-90'),
+        noDataMessage,
+        noDataExplanation,
+        goBackBtn,
+    ]);
+
+    return dataPointer.page === pagesNames.periods
+        ? mode() === modes.requested
+            ? 'loading'
+            : noPeriodsView
+        : noDataView;
+}

app/public/components/userView/data/table/tablePanel.js

@@ -21,6 +21,7 @@ import pager from '../pager.js';
 import postingDataConfig from '../posting/postingDataConfig.js';
 import { postForm } from '../posting/postForm.js';
 import filter from './filter.js';
+import noDataView from './noDataView.js';
 
 import { RCT } from '../../../../config.js';
 const { pagesNames } = RCT;
@@ -35,28 +36,12 @@ const { pagesNames } = RCT;
 export default function tablePanel(model) {
     const dataPointer = model.getCurrentDataPointer();
     const data = model.fetchedData[dataPointer.page][dataPointer.index].payload;
+    data.rows = data.rows.filter((item) => item.name != 'null');
 
     if (data.rows?.length == 0) {
-        const removeAndGoBackBtn = h('button.btn.btn-primary.m3', {
-            onclick: () => model.removeCurrentData(),
-        }, `${
-            dataPointer.page === pagesNames.periods
-                ? 'Reload'
-                : 'Go back'
-        }`);
-        const noDataMessage = h('h3', 'No data found');
-        const noDataExplanation = h('h5', `${
-            dataPointer.page === pagesNames.periods
-                ? 'Make sure the database works fine'
-                : 'There is no data to be displayed here'
-        }`);
-        return h('.loginDiv.top-100', [
-            h('.nothing-found-90'),
-            noDataMessage,
-            noDataExplanation,
-            removeAndGoBackBtn,
-        ]);
+        return noDataView(model, dataPointer);
     }
+
     const cellsSpecials = pagesCellsSpecials[dataPointer.page];
 
     const { fields } = data;

app/public/model/PrimaryModel.js

@@ -78,6 +78,14 @@ export default class PrimaryModel extends Observable {
         this.notify();
     }
 
+    async sync() {
+        const syncEndpoint = '/api/sync/';
+        const { result, status, ok } = this.loader.get(syncEndpoint);
+        await this.fetchedData.reqForData(true);
+        document.location.reload(true);
+        this.notify();
+    }
+
     getDataPointerFromUrl(url) {
         const pointer = Object.fromEntries(new URLSearchParams(url.search));
         return {

app/public/styles/icons.css

@@ -151,3 +151,10 @@
     height: 90px;
     display: inline-block;
 }
+
+.synchronize-90 {
+    background-image: url('./images/90/Synchronize.svg');
+    width: 90px;
+    height: 90px;
+    display: inline-block;
+}

docs/CONFIGURATION.md

@@ -29,5 +29,5 @@ The following configuration items can be set using environment variables, note t
 ## Misc.
 | Variable name | Description | Default value |
 |---------------|-------------|---------------|
-| ALIMONITOR_PASSPHRASE | passphrase to grid certificate myCertificate.p12 | |
+| ALIMONITOR_PASSPHRASE | passphrase to the grid certificate (`rct-alimonitor-cert.p12`) | |
 | CERN_SOCKS | address of proxy socket used for reaching CERN network | false |