#50042 Issue 50041 - Set the React dataflow foundation and add basic plugin UI
Closed by spichugi. Opened by spichugi.
spichugi/389-ds-base plugin_ui_cli  into  master

Download 50042.patch

Description: Add basic plugin functionality - Table and Modal.
Add Notificationcontroller component which can be used by other
components in the future.
Add cockpit component for onoff switch.
Add custoTableToolbar component with search field and loading spinner.
Add edit option to Plugin CLI.
Fix ds.css according to eslint.

https://pagure.io/389-ds-base/issue/50041

Reviewed by: ?

rebased onto e766b9e78ee0d1ed5539b5ae76df90527c88ea0b

Should specify that "on" and "off" are the valid values for this setting

Also when I click on "Plugins tab" the screen is blank, is that expected?

rebased onto a0b5693db3bf6ac1c5d7d9afa2aa80052de66000

rebased onto 39cc6a941c340fa85f82f01bf61b294dadd21797

Should specify that "on" and "off" are the valid values for this setting

Fixed and rebased.
And it should compile now properly.

I see console errors:

Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”). plugins.html:1:1
Warning: Failed prop type: The prop `id` is marked as required in `Checkbox`, but its value is `undefined`.
    in Checkbox (created by Plugins)
    in Plugins checkPropTypes.js:19
Warning: Failed prop type: The prop `aria-label` is marked as required in `Checkbox`, but its value is `undefined`.
    in Checkbox (created by Plugins)
    in Plugins checkPropTypes.js:19
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”).
plugins.html:1:1
Warning: A component is changing a controlled input of type checkbox to be uncontrolled. Input elements should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components
    in input (created by Checkbox)
    in div (created by Checkbox)
    in Checkbox (created by Plugins)
    in div (created by Plugins)
    in Plugins react-dom.development.js:523
Loading replication configuration...

Also...

I tried testing this patch by running "make -f rpm.mk rpms" and installing those rpms(which I expected to work). Doing this the console has an error on startup because the wrong dsconf usage is used (dsconf backend list). This might be breaking other things, but I'm not sure what the best way is to test this patch as the rpms I created don't seem to be using the current changes in the source.

I see console errors:
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”). plugins.html:1:1
Warning: Failed prop type: The prop id is marked as required in Checkbox, but its value is undefined.
in Checkbox (created by Plugins)
in Plugins checkPropTypes.js:19
Warning: Failed prop type: The prop aria-label is marked as required in Checkbox, but its value is undefined.
in Checkbox (created by Plugins)
in Plugins checkPropTypes.js:19
Content Security Policy: The page’s settings blocked the loading of a resource at inline (“default-src”).
plugins.html:1:1
Warning: A component is changing a controlled input of type checkbox to be uncontrolled. Input elements should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component. More info: https://fb.me/react-controlled-components
in input (created by Checkbox)
in div (created by Checkbox)
in Checkbox (created by Plugins)
in div (created by Plugins)
in Plugins react-dom.development.js:523
Loading replication configuration...

Looks like it is old warnings which are fixed in the current patch.

Also...
I tried testing this patch by running "make -f rpm.mk rpms" and installing those rpms(which I expected to work). Doing this the console has an error on startup because the wrong dsconf usage is used (dsconf backend list). This might be breaking other things, but I'm not sure what the best way is to test this patch as the rpms I created don't seem to be using the current changes in the source.

For the local RPM creation, this works for me:

make 389-console-clean
make -f rpm.mk srpms
mock -q dist/srpms/$MYSRPM

And for a local development and testing:

make 389-console-clean
make 389-console-devel-install
cd src/cockpit/389-console
make -f node_modules.mk install
node_modules/webpack/bin/webpack.js --watch

I will put the information to the wiki tomorrow, sure.

Also, Cockpit uses system python libraries so it is okay for rpm installation (we have all tools installed right there, from one source - package)

For the local development, I use 'pip3 install src/lib389 -U' when I need to update the python-lib389.

rebased onto cdbb81f485266101abf820117612af7d54e56aa6

rebased onto 1ad10e485e4d049789a85d417aff9bf8227a5512

rebased onto 1fb353db6a7d6f81dc79ee0438a375661cea9e8f

rebased with all fixes (CSS too).
Please check.

It's still not working :-( It just says: "Setting up plugins on server localhost.localdomain"

Maybe I am still not testing your patch correctly.

Now I am trying to do:

make 389-console
make 389-console-devel-install

I relogged into the console as my local user, but the UI Plug-in pages shows no table as I mentioned above.

Add our css for footer:

The plugin Modal also has a horizontal scroll bar, this should not be there.

I found a big perf improvement. We were reloading the same configuration for each existing instance. So if you had two instances then at startup it would load the configuration for instance 1 three times!!

So create the select-server listener after we load all the initial instances into the select list

index 5d1503d53..5d8c19790 100644
--- a/src/cockpit/389-console/src/ds.js
+++ b/src/cockpit/389-console/src/ds.js
@@ -227,6 +227,13 @@ function get_insts() {
       server_select_elem = document.getElementById('select-server');
       server_select_elem.dispatchEvent(new Event('change'));
     }
+    
+    // Now set the listener or else we reload the same configuration over and over for each existing instance
+    document.getElementById("select-server").addEventListener("change", function() {
+      server_id = $(this).val();
+      server_inst = server_id.replace("slapd-", "");
+      load_config();
+    });
diff --git a/src/cockpit/389-console/src/servers.js b/src/cockpit/389-console/src/servers.js
index fa7a8d62c..8dbd1bff5 100644
--- a/src/cockpit/389-console/src/servers.js
+++ b/src/cockpit/389-console/src/servers.js
@@ -418,13 +418,6 @@ $(document).ready( function() {
       {
         get_insts();
-        // Handle changing instance here
-        document.getElementById("select-server").addEventListener("change", function() {
-          server_id = $(this).val();
-          server_inst = server_id.replace("slapd-", "");
-          load_config();
-        });

If you add this change above and look into the other minor issues I mentioned you have my ack!

rebased onto 86a3d0e146c3887cf987b8d218ac6a46904f5157

Very nice catch with the performance! And others too.
Fixed.

Thanks, ack!!!!

rebased onto b844aab6eaf47c8991c3ba99da7f281ad3c5dfcf

Pull-Request has been merged by spichugi

389-ds-base is moving from Pagure to Github. This means that new issues and pull requests
will be accepted only in 389-ds-base's github repository.

This pull request has been cloned to Github as issue and is available here:
- https://github.com/389ds/389-ds-base/issues/3101

If you want to continue to work on the PR, please navigate to the github issue,
download the patch from the attachments and file a new pull request.

Thank you for understanding. We apologize for all inconvenience.

Pull-Request has been closed by spichugi

Metadata