Modularize PMA Navigation JS files #14468

Piyush3079 · 2018-07-08T06:21:48Z

This pr contains the modular code for PMA Navigation and the file names were changed in php files so that new modular code can be loaded rather than old code files.

This pr is in continuation of Mod_Js_Server_Status. Before reviewing this pr, review Mod_Js_Server_Status and merge and then compare with this pr.

Before submitting pull request, please check that every commit:

Has proper Signed-Off-By
Has commit message which describes it
Is needed on it's own, if you have just minor fixes to previous commits, you can squash them
Any new functionality is covered by tests

codecov · 2018-07-08T09:19:07Z

Codecov Report

❗ No coverage uploaded for pull request base (gsoc-js-refactoring@ed6f106). Click here to learn what that means.
The diff coverage is 15.2%.

@@                  Coverage Diff                   @@
##             gsoc-js-refactoring   #14468   +/-   ##
======================================================
  Coverage                       ?   49.93%           
  Complexity                     ?    14435           
======================================================
  Files                          ?      504           
  Lines                          ?    68972           
  Branches                       ?        0           
======================================================
  Hits                           ?    34441           
  Misses                         ?    34531           
  Partials                       ?        0

devenbansod · 2018-07-28T12:50:24Z

Please rebase and squash

Signed-off-by: Piyush Vijay <piyushvijay.1997@gmail.com>

…ore file names added in ajax and index. Signed-off-by: Piyush Vijay <piyushvijay.1997@gmail.com>

Piyush3079

General comments to increase the understandability of the pr

Piyush3079 · 2018-07-29T11:59:29Z

js/common_params.php

@@ -13,6 +13,11 @@
    // Send correct type:
    header('Content-Type: text/javascript; charset=UTF-8');

+    // Preventing caching of this file


Remove caching of this file to prevent storing of parameters in cache

Piyush3079 · 2018-07-29T12:00:09Z

js/navigation.js

@@ -271,388 +271,6 @@ function traverseNavigationForPaths () {
    return params;
 }

-/**


Remove events from js/navigation.js to avoid duplicate events and triggering of events twice

Piyush3079 · 2018-07-29T12:00:54Z

js/src/ajax.js

@@ -586,8 +589,8 @@ export let AJAX = {
             * @todo This condition is to be removed once all the files are modularised
             */
            if (checkNewCode(file)) {
-                var fileImports = ['server_privileges', 'server_databases', 'server_status_advisor',
-                    'server_status_processes', 'server_status_variables',];
+                var fileImports = ['server_privileges', 'server_databases', 'error_report', 'navigation', 'server_status_advisor',


Navigations and error report files whitelisted for ajax loading

Piyush3079 · 2018-07-29T12:01:38Z

js/src/functions/navigation.js

@@ -4,6 +4,97 @@
 * @returns void


File containing the functions related to navigation which can be imported in files.

Piyush3079 · 2018-07-29T12:02:22Z

js/src/index.js

+/**
+ * Adding common files for every page
+ */
+for (let i in files.global) {


For loading common files required on every page.

Piyush3079 · 2018-07-29T12:03:30Z

js/src/navigation.js

@@ -0,0 +1,513 @@
+/* vim: set expandtab sw=4 ts=4 sts=4: */


Main navigation file containing the events related to navigation which are copied from js/navigations.js and modified accordingly for use with modular code.

Piyush3079 · 2018-07-29T12:04:34Z

libraries/classes/Header.php

@@ -183,13 +183,13 @@ private function _addDefaultScripts(): void

        $this->_scripts->addFile('messages.php', array('l' => $GLOBALS['lang']));
        $this->_scripts->addFile('common_params.php', array('l' => $GLOBALS['lang']));
+        $this->_scripts->addFile('vendors~index_new.js');


vendor files are added in webpack to create a common bundle for vendor files required on every page like jquery, sprintf etc.

Piyush3079 · 2018-07-29T12:06:43Z

webpack.config.babel.js

 };
 var plugins = [
    new webpack.optimize.OccurrenceOrderPlugin(),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.NamedModulesPlugin(),
-    new webpack.NoEmitOnErrorsPlugin()
+    new webpack.NoEmitOnErrorsPlugin(),
+    new plugin()


Bundle analyzer plugin to run bundle analyzer in development mode.

Piyush3079 · 2018-07-29T12:07:23Z

webpack.config.babel.js

@@ -47,6 +52,28 @@ export default [{
        path: path.resolve(__dirname, 'js/dist'),
        publicPath: PUBLIC_PATH
    },
+    optimization: {


Default configuration for chunks generated by dynamic imports.

devenbansod

Looks good to me. Tested locally, works fine.

Some minor comments added.

devenbansod · 2018-07-29T11:56:49Z

js/navigation.js

@@ -271,388 +271,6 @@ function traverseNavigationForPaths () {
    return params;
 }

-/**


Wouldn't this complete file get deleted ultimately?

Once all the files get revamped then only we will be able to delete this complete files because functions defined in this file are going to be used in many other files which are not revamped yet.

devenbansod · 2018-07-29T11:58:18Z

webpack.config.babel.js

@@ -1,5 +1,8 @@
 import path from 'path';
 import webpack from 'webpack';
+import BundleAnalyzerPlugin from 'webpack-bundle-analyzer';
+
+let plugin = BundleAnalyzerPlugin.BundleAnalyzerPlugin;


This naming could/should be improved.

devenbansod · 2018-07-29T11:59:12Z

libraries/classes/Header.php

@@ -183,13 +183,13 @@ private function _addDefaultScripts(): void

        $this->_scripts->addFile('messages.php', array('l' => $GLOBALS['lang']));
        $this->_scripts->addFile('common_params.php', array('l' => $GLOBALS['lang']));
+        $this->_scripts->addFile('vendors~index_new.js');


Why was it not needed previously? and is only needed for this file?

Its not file specific. There is slight change in webpack configuration which is generating a combined bundle of vendor files needed on every page. So this files is the bundled vendor file.

devenbansod · 2018-07-29T13:17:32Z

package.json

@@ -37,6 +37,7 @@
    "del-cli": "^1.1.0",


I get the following warning when I run yarn install:
warning " > babel-loader@7.1.5" has unmet peer dependency "babel-core@6".

This is due to not including babel-core package but this will not have effect as we have installed babel-cli instead of babel-core.

Signed-off-by: Piyush Vijay <piyushvijay.1997@gmail.com>

…d in Header.php Signed-Off-By: Piyush Vijay <piyushvijay.1997@gmail.com>

… login and logout again. Signed-Off-By: Piyush Vijay <piyushvijay.1997@gmail.com>

devenbansod

Looks good to me. Tested locally, works fine.

Moving ahead to unblock next PR.

TODO: @Piyush3079 to revisit renaming of files, folders, functions, classes once all files are revamped.

devenbansod changed the base branch from master to gsoc-js-refactoring July 28, 2018 12:49

devenbansod changed the title ~~PMA Navigation modularized~~ Modularize PMA Navigation JS files Jul 28, 2018

devenbansod self-assigned this Jul 28, 2018

devenbansod self-requested a review July 28, 2018 12:50

Piyush3079 force-pushed the Mod_Js_Navigation branch 12 times, most recently from 57f5b34 to c17c254 Compare July 29, 2018 11:33

Piyush3079 added 2 commits July 29, 2018 17:07

Import highlight_sql module in show_ajax_messages.

0ae42e5

Signed-off-by: Piyush Vijay <piyushvijay.1997@gmail.com>

Navigation revamped, navigation functions separated from main file. M…

b52b7a3

…ore file names added in ajax and index. Signed-off-by: Piyush Vijay <piyushvijay.1997@gmail.com>

Piyush3079 force-pushed the Mod_Js_Navigation branch from c17c254 to 383b9c9 Compare July 29, 2018 11:38

Piyush3079 commented Jul 29, 2018

View reviewed changes

devenbansod approved these changes Jul 29, 2018

View reviewed changes

Piyush3079 added 3 commits July 30, 2018 01:37

File names changed for revamped javascript files in php files.

5c54cdc

Signed-off-by: Piyush Vijay <piyushvijay.1997@gmail.com>

Fallback for new Modularize navigation. Both old and new code include…

2f3eeae

…d in Header.php Signed-Off-By: Piyush Vijay <piyushvijay.1997@gmail.com>

Remove caching of common_params.php to avoid stoing token in cache on…

9727a94

… login and logout again. Signed-Off-By: Piyush Vijay <piyushvijay.1997@gmail.com>

Piyush3079 force-pushed the Mod_Js_Navigation branch from 383b9c9 to 9727a94 Compare July 29, 2018 20:10

devenbansod approved these changes Jul 30, 2018

View reviewed changes

devenbansod merged commit 00e9049 into phpmyadmin:gsoc-js-refactoring Jul 30, 2018

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Modularize PMA Navigation JS files #14468

Modularize PMA Navigation JS files #14468

Piyush3079 commented Jul 8, 2018

codecov bot commented Jul 8, 2018 •

edited

Loading

devenbansod commented Jul 28, 2018

Piyush3079 left a comment

Piyush3079 Jul 29, 2018

Piyush3079 Jul 29, 2018

Piyush3079 Jul 29, 2018

Piyush3079 Jul 29, 2018

Piyush3079 Jul 29, 2018

Piyush3079 Jul 29, 2018

Piyush3079 Jul 29, 2018

Piyush3079 Jul 29, 2018

Piyush3079 Jul 29, 2018

devenbansod left a comment

devenbansod Jul 29, 2018

Piyush3079 Jul 29, 2018

devenbansod Jul 29, 2018

devenbansod Jul 29, 2018

Piyush3079 Jul 29, 2018

devenbansod Jul 29, 2018

Piyush3079 Jul 29, 2018

devenbansod left a comment

Modularize PMA Navigation JS files #14468

Modularize PMA Navigation JS files #14468

Conversation

Piyush3079 commented Jul 8, 2018

codecov bot commented Jul 8, 2018 • edited Loading

Codecov Report

devenbansod commented Jul 28, 2018

Piyush3079 left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

devenbansod left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

devenbansod left a comment

Choose a reason for hiding this comment

codecov bot commented Jul 8, 2018 •

edited

Loading