reuse JsonFormatterWidget

Author: odeimaiz

services/static-webserver/client/source/class/osparc/info/FunctionLarge.js

@@ -61,11 +61,12 @@ qx.Class.define("osparc.info.FunctionLarge", {
         "Default Inputs": this.getFunction().getDefaultInputs(),
         "Outputs": this.getFunction().getOutputSchema()["schema_content"],
       };
-      const jsonViewer = new osparc.widget.JsonFormatterWidget();
+      const jsonViewer = new osparc.widget.JsonFormatterWidget(info);
       const scroll = new qx.ui.container.Scroll();
-      scroll.add(jsonViewer, { flex: 1 });
-      vBox.add(scroll, { flex: 1 });
-      jsonViewer.setJson(info);
+      scroll.add(jsonViewer);
+      vBox.add(scroll, {
+        flex: 1
+      });
 
       // Copy Id button
       const text = "Function Id";

services/static-webserver/client/source/class/osparc/jobs/Info.js

@@ -24,14 +24,12 @@ qx.Class.define("osparc.jobs.Info", {
 
     this._setLayout(new qx.ui.layout.VBox());
 
-    const divId = "job-info-viewer";
-    const htmlEmbed = osparc.wrapper.JsonFormatter.getInstance().createContainer(divId);
-    this._add(htmlEmbed, {
+    const jsonViewer = new osparc.widget.JsonFormatterWidget(info);
+    const scroll = new qx.ui.container.Scroll();
+    scroll.add(jsonViewer);
+    this._add(scroll, {
       flex: 1
     });
-    this.addListener("appear", () => {
-      osparc.wrapper.JsonFormatter.getInstance().setJson(info, divId);
-    });
   },
 
   statics: {

services/static-webserver/client/source/class/osparc/user/UserDetails.js

@@ -309,11 +309,12 @@ qx.Class.define("osparc.user.UserDetails", {
       this.getChildControl("postal-code").setValue(user.getPostalCode() || "-");
 
       // remaining data
-      const jsonViewer = new osparc.widget.JsonFormatterWidget();
+      const jsonViewer = new osparc.widget.JsonFormatterWidget(this.__remainingUserData);
       const scroll = new qx.ui.container.Scroll();
-      scroll.add(jsonViewer, { flex: 1 });
-      this.add(scroll, { flex: 1 });
-      jsonViewer.setJson(this.__remainingUserData);
+      scroll.add(jsonViewer);
+      this.add(scroll, {
+        flex: 1
+      });
     },
   }
 });