From a4a0f65c5d818c17cd5810459bbff8987048905d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?G=C3=A9ry=20Debongnie?= <ged@odoo.com>
Date: Sun, 31 Oct 2021 10:40:36 +0000
Subject: [PATCH] [IMP] developer: add sections on service and systray registry

Part-of: odoo/documentation#1246
---
 .../reference/javascript/registries.rst       | 84 +++++++++++++++++++
 .../reference/javascript/services.rst         |  7 +-
 2 files changed, 89 insertions(+), 2 deletions(-)

diff --git a/content/developer/reference/javascript/registries.rst b/content/developer/reference/javascript/registries.rst
index 14e24cdc0..9232e6e4b 100644
--- a/content/developer/reference/javascript/registries.rst
+++ b/content/developer/reference/javascript/registries.rst
@@ -108,6 +108,21 @@ category(subcategory)
 Reference List
 ==============
 
+.. list-table::
+   :widths: 30 70
+   :header-rows: 1
+
+   * - Category
+     - Content
+   * - :ref:`main_components <registries/main_components>`
+     - top level components
+   * - :ref:`services <registries/services>`
+     - all services that should be activated
+   * - :ref:`systray <registries/systray>`
+     - components displayed in the systray zone in the navbar
+
+.. _registries/main_components:
+
 Main components registry
 ------------------------
 
@@ -133,3 +148,72 @@ this:
    registry.category("main_components").add("LoadingIndicator", {
      Component: LoadingIndicator,
    });
+
+.. _registries/services:
+
+Service registry
+----------------
+
+The service registry (category: `services`) contains all
+:ref:`services <javascript/services>` that should be activated by the Odoo
+framework.
+
+.. code-block:: javascript
+
+    import { registry } from "@web/core/registry";
+
+    const myService = {
+        dependencies: [...],
+        start(env, deps) {
+            // some code here
+        }
+    };
+
+    registry.category("services").add("myService", myService);
+
+.. _registries/systray:
+
+Systray registry
+----------------
+
+The systray is the zone on the right of the navbar that contains various small
+components, that usually display some sort of information (like the number of
+unread messages), notifications and/or let the user interact with them.
+
+The `systray` registry contains a description of these systray items, as objects
+with the following three keys:
+
+- `Component`: the component class that represents the item. Its root element
+  should be a `<li>` tag, otherwise it might not be styled properly.
+- `props (optional)`: props that should be given to the component
+- `isDisplayed (optional)`: a function that takes the :ref:`env <javascript/environment>`
+  and returns a boolean. If true, the systray item is displayed. Otherwise it is
+  removed.
+
+For example:
+
+.. code-block:: js
+
+    import { registry } from "@web/core/registry";
+
+    class MySystrayItem extends Component {
+        // some component ...
+    }
+
+    registry.category("systray").add("myAddon.myItem", {
+        Component: MySystrayItem,
+    });
+
+
+The systray registry is an ordered registry (with the `sequence` number):
+
+.. code-block:: js
+
+    const item = {
+        Component: MySystrayItem
+    };
+    registry.category("systray").add("myaddon.some_description", item, { sequence: 43 });
+
+The sequence number defaults to 50. If given, this number will be used
+to order the items. The lowest sequence is on the right and the highest sequence
+is on the left in the systray menu.
\ No newline at end of file
diff --git a/content/developer/reference/javascript/services.rst b/content/developer/reference/javascript/services.rst
index 666bbc238..d51953b3d 100644
--- a/content/developer/reference/javascript/services.rst
+++ b/content/developer/reference/javascript/services.rst
@@ -1,3 +1,6 @@
+
+.. _javascript/services:
+
 ========
 Services
 ========
@@ -14,7 +17,7 @@ every 5 seconds:
 
 .. code-block:: javascript
 
-    import { registry } from "./core/registry";
+    import { registry } from "@web/core/registry";
 
     const myService = {
         dependencies: ["notification"],
@@ -26,7 +29,7 @@ every 5 seconds:
         }
     };
 
-    serviceRegistry.add("myService", myService);
+    registry.category("services").add("myService", myService);
 
 At startup, the web client starts all services present in the `services`
 registry. Note that the name used in the registry is the name of the service.