Custom application in Dashboard in Cockpit

[flatspin (Ralf Jeckel)]

NethServer Version: 7.7.1908 (final)
Module: Custom / Cockpit

Hi friends,

I’ve custom application in Neth-GUI “Applications” menu like:

In old servermanager this was really simple to do. Put a file called omada.php in/usr/share/nethesis/NethServer/Module/Dashboard/Applications and that’s it.

<?php
namespace Nethserver\MOdule\Dashboard\Applications;

/* Launch Omada-Controller-Webinterface from Neth-Gui Applications section
 * Filelocation:  /usr/share/nethesis/NethServer/Module/Dashboard/Applications/
 * R. Jeckel 2019
 */

class Omada extends \Nethgui\Module\AbstractModule implements \NethServer\Module\Dashboard\Interfaces\ApplicationInterface
{
  public function getName()
  {
    return "Omada-Controller";
  }
  public function getInfo()
  {
    $host = explode(':',$_SERVER['HTTP_HOST']);
    return array(
      'url' => "https://".$host[0].":8043",
    );
  }
}

How to do this in cockpit? Is this still possible and if yes, where to find a documentation or something else?

TIA Ralf

[dnutan (Marc)]

I haven’t done it but I’d say it is possible.
Here’s some info:

• UI Guidelines
• Application manifest
• Tutorial

For a simple button to Open the app, something like nethserver-roundcubemail code (*.json, api/read) could be of help, alongside of nethsrver-cockpit-empty.
Someone fro dev_team will be able to assist in greater detail.

EDIT: here’s another post which can suit you better:

Display a web application in the cockpit application menu

With cockpit we now have to make some changes to display our web application inside the application menu of cockpit. You have to test and make a lot of attention to the sudoers.d/files, it could break the server-manager, so add an empty line at the end of the file, and please test it carefully delegated to a simple user. you can use this as example you must set as executable the api/read Rename the icon of your web app to logo.png Then the web app must be delegated to the group of the user…

[stephdl (Stéphane de Labrusse)]

Add

Api/read with chmod a+x (/usr/libexec/nethserver/api/nethserver-yourapi/)
Nethserver-yourapi.json (/usr/share/cockpit/nethserver/applications)
Sudo file to delegate

It is a bit more verbose but it should work

[flatspin (Ralf Jeckel)]

Thanks @dnutan and @stephdl for reply.
I’ll give it a try the next days.

[flatspin (Ralf Jeckel)]

Good morning @stephdl,

I tried it, but it doesn’t work. First I’ve to say, that I’m not experienced with what I’m doing here. In fact I’ve no clue. Just trying to copy from original files and the hints in the links you gave me.
So please forgive my ignorance.

What I did so far:

Placed read in /usr/libexec/nethserver/api/nethserver-omada / read has 755 (chmod a+x)

#!/bin/bash

#
# Copyright (C) 2018 Nethesis S.r.l.
# http://www.nethesis.it - nethserver@nethesis.it
#
# This script is part of NethServer.
#
# NethServer is free software: you can redistribute it and/or modify
# it under the terms of the GNU General Public License as published by
# the Free Software Foundation, either version 3 of the License,
# or any later version.
#
# NethServer is distributed in the hope that it will be useful,
# but WITHOUT ANY WARRANTY; without even the implied warranty of
# MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
# GNU General Public License for more details.
#
# You should have received a copy of the GNU General Public License
# along with NethServer.  If not, see COPYING.
#

#input=$(cat)
#action=$(jq -r .action <<<"$input")
#protocol=$(jq -r .location.protocol <<<"$input")
#host=$(jq -r .location.hostname <<<"$input")

if [[ $action == "app-info" ]]; then
    printf '{"url":"https://nethserver.jeckel.local:8043/login"}'
fi 

Placed nethserver-omada.json in /usr/share/cockpit/nethserver/applications

{
  "id": "nethserver-omada",
  "name": "TP-Link Omada Webinterface",
  "summary": "TP-Link Omada Controller Webinterface",
  "description": "TP-Link Omada Controller Webinterface",
  "url": "",
  "provides": ["nethserver-omada"],
  "release": {
    "version": "1.0"
  },
  "author": {
    "name": "R. Jeckel",
  },
  "infoapi": {
    "path": "nethserver-omada/read"
  },
  "icon": "logo.png",
  "external": true
}

placed 50_nsapi_nethserver_omada in /etc/sudoers.d

#
# nsapi_nethserver_omada
#
Cmnd_Alias NSAPI_NETHSERVER_OMADA = \
     /usr/libexec/nethserver/api/nethserver-omada/read

Defaults!NSAPI_NETHSERVER_OMADA !requiretty

and placed manifest.json with logo.png in /usr/share/cockpit/nethserver-omada

{
  "version": 0,
  "content-security-policy": "style-src 'self' 'unsafe-inline'"
}

Can you tell me, what I missed?
Restarted httpd, but nothing happend.
Also tried signal-event nethserver-cockpit-update.

TIA Ralf

[stephdl (Stéphane de Labrusse)]

What are the symptoms, do you see a link in the applications page, could you open the web console of your browser (F12), do you have something inside?

Did you restart cockpit also?

[flatspin (Ralf Jeckel)]

No there’s no button in applications.
Should be in here right?

And no Error in Console when opening applications menu.

API exec: system-task/read
$ /usr/bin/sudo /usr/libexec/nethserver/api/system-task/read | jq nethserver.js:31:17
API exec: system-apps/read
$  echo '{"action":"hide-uninstall"}' | /usr/libexec/nethserver/api/system-apps/read | jq nethserver.js:31:17
API exec: system-authorization/read
$ /usr/libexec/nethserver/api/system-authorization/read | jq nethserver.js:31:17
tasks undefined App.vue:428
tasks no running tasks App.vue:428
API exec: system-apps/read
$  echo '{"action":"list","location":{"href":"https://nethserver.jeckel.local:9090/cockpit/$8b27c86324ff9e0121bd5f70fb417fcdc4775db4163ae5cb665ade4ce89df807/nethserver/index.html#/applications","origin":"https://nethserver.jeckel.local:9090","protocol":"https:","host":"nethserver.jeckel.local:9090","hostname":"nethserver.jeckel.local","port":"9090","pathname":"/cockpit/$8b27c86324ff9e0121bd5f70fb417fcdc4775db4163ae5cb665ade4ce89df807/nethserver/index.html","search":"","hash":"#/applications"}}' | /usr/libexec/nethserver/api/system-apps/read | jq

@stephdl

Did you restart cockpit also?

I think the signal-event did this already, but tried it again and no change.

EDIT: PS: also tried another browser.

[stephdl (Stéphane de Labrusse)]

Will try it myself this wk

[dnutan (Marc)]

Did you try without commenting these lines?

@flatspin

#input=$(cat) 
#action=$(jq -r .action <<<"$input") 
#protocol=$(jq -r .location.protocol <<<"$input") 
#host=$(jq -r .location.hostname <<<"$input")

[flatspin (Ralf Jeckel)]

Yes I did, but no change.

[stephdl (Stéphane de Labrusse)]

• I took your code and I put it on a VM
• think to remove # in read file
• then I found an error

you have a nethserver-omada.json with bad json syntax

[root@ns7loc9 ~]# cat /usr/share/cockpit/nethserver/applications//nethserver-omada.json | jq
parse error: Expected another key-value pair at line 13, column 3

once corrected

[root@ns7loc9 ~]# cat /usr/share/cockpit/nethserver/applications//nethserver-omada.json | jq
{
  "id": "nethserver-omada",
  "name": "TP-Link Omada Webinterface",
  "summary": "TP-Link Omada Controller Webinterface",
  "description": "TP-Link Omada Controller Webinterface",
  "url": "",
  "provides": [
    "nethserver-omada"
  ],
  "release": {
    "version": "1.0"
  },
  "author": {
    "name": "R. Jeckel"
  },
  "infoapi": {
    "path": "nethserver-omada/read"
  },
  "icon": "logo.png",
  "external": true
}

change

  "author": {
    "name": "R. Jeckel",
  },

to

  "author": {
    "name": "R. Jeckel"
  },

WEB development could be really strict sometime :’(

[stephdl (Stéphane de Labrusse)]

once done, I would be pleased if you could make a wiki page, ping us to format the page if you have some issue

[flatspin (Ralf Jeckel)]

@stephdl you are my hero!

This damend little “,” …

It works:

I’ll do a wiki page, but give me some time please.

[flatspin (Ralf Jeckel)]

Hi @stephdl I wrote a little how to:

https://wiki.nethserver.org/doku.php?id=userguide:how_to_call_a_custom_webpage_from_applications_section_in_cockpit#how_to_call_a_custom_webpage_from_application_section_in_cockpit

Can you please review and give me a feedback? Thanks.

[stephdl (Stéphane de Labrusse)]

Will do it asap… Completely forgotten… Really thank you

[dnutan (Marc)]

Thanks!
One suggestion would be to make the domain (FQDN) not hardcoded.

[stephdl (Stéphane de Labrusse)]

maybe some debug option could be added like in Custom application in Dashboard in Cockpit

in short a good json file must pass the test : cat /path/to/jsonFile.json | jq

[stephdl (Stéphane de Labrusse)]

read it so far no errors, nice job…tk

added more tags

[flatspin (Ralf Jeckel)]

added test and a big thanks!