chore(cleanup): format code and move from js-beautify to prettier

Joxit · Apr 8, 2022 · 49fcba3 · 49fcba3
1 parent ab12cce
commit 49fcba3
Show file tree

Hide file tree

Showing 21 changed files with 373 additions and 302 deletions.
diff --git a/package.json b/package.json
@@ -2,6 +2,10 @@
   "name": "docker-registry-ui",
   "version": "2.1.0",
   "scripts": {
+    "format": "npm run format-html && npm run format-js && npm run format-riot",
+    "format-html": "find src rollup rollup.config.js -name '*.html' -exec prettier --config .prettierrc -w --parser html {} \\;",
+    "format-js": "find src rollup rollup.config.js -name '*.js' -exec prettier --config .prettierrc -w {} \\;",
+    "format-riot": "find src rollup rollup.config.js -name '*.riot' -exec prettier --config .prettierrc -w --parser html {} \\;",
     "start": "rollup -c -w --environment ROLLUP_SERVE:true",
     "build": "rollup -c",
     "build:electron": "npm run build && cd examples/electron && npm install && npm run dist"
@@ -25,8 +29,8 @@
     "@rollup/plugin-json": "^4.1.0",
     "@rollup/plugin-node-resolve": "^13.1.3",
     "core-js": "^3.19.1",
-    "js-beautify": "^1.14.0",
     "node-sass": "^7.0.1",
+    "prettier": "^2.6.2",
     "riot": "^6.1.2",
     "riot-mui": "github:joxit/riot-5-mui#4d68d7f",
     "rollup": "^2.59.0",

diff --git a/rollup/license.js b/rollup/license.js
@@ -15,4 +15,4 @@ export default `/*
  * along with this program.  If not, see <http://www.gnu.org/licenses/>.
  * 
  * @license AGPL
- */`
+ */`;
diff --git a/src/components/catalog/catalog-element.riot b/src/components/catalog/catalog-element.riot
@@ -96,10 +96,10 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
           onAuthentication: props.onAuthentication,
         });
         oReq.addEventListener('load', function () {
-          if (this.status == 200) {
+          if (this.status === 200) {
             const nbTags = (JSON.parse(this.responseText).tags || []).length;
             self.update({ nbTags });
-          } else if (this.status == 404) {
+          } else if (this.status === 404) {
             props.onNotify('Server not found', true);
           } else {
             props.onNotify(this.responseText, true);

diff --git a/src/components/catalog/catalog.riot b/src/components/catalog/catalog.riot
@@ -73,14 +73,14 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
           onAuthentication: this.props.onAuthentication,
         });
         oReq.addEventListener('load', function () {
-          if (this.status == 200) {
+          if (this.status === 200) {
             repositories = JSON.parse(this.responseText).repositories || [];
             repositories.sort();
             repositories = repositories.reduce(function (acc, e) {
               const slash = e.indexOf('/');
               if (slash > 0) {
                 const repoName = e.substring(0, slash) + '/';
-                if (acc.length == 0 || acc[acc.length - 1].repo != repoName) {
+                if (acc.length === 0 || acc[acc.length - 1].repo != repoName) {
                   acc.push({
                     repo: repoName,
                     images: [],
@@ -92,7 +92,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
               acc.push(e);
               return acc;
             }, []);
-          } else if (this.status == 404) {
+          } else if (this.status === 404) {
             self.props.onNotify('Server not found', true);
           } else {
             self.props.onNotify(this.responseText);

diff --git a/src/components/dialogs/add-registry-url.riot b/src/components/dialogs/add-registry-url.riot
@@ -31,9 +31,7 @@
     </div>
   </material-popup>
   <script>
-    import {
-      addRegistryServers
-    } from '../../scripts/utils';
+    import { addRegistryServers } from '../../scripts/utils';
     import router from '../../scripts/router';
 
     export default {
@@ -52,11 +50,11 @@
           return this.props.onNotify('The input field should start with http:// or https://.', true);
         }
         const url = addRegistryServers(input.value);
-        router.home()
+        router.home();
         this.props.onServerChange(url);
-        this.props.onClose()
+        this.props.onClose();
         setTimeout(() => router.updateUrlQueryParam(url), 100);
-      }
-    }
+      },
+    };
   </script>
-</add-registry-url>
+</add-registry-url>
diff --git a/src/components/dialogs/change-registry-url.riot b/src/components/dialogs/change-registry-url.riot
@@ -32,10 +32,7 @@
     </div>
   </material-popup>
   <script>
-    import {
-      addRegistryServers,
-      getRegistryServers
-    } from '../../scripts/utils';
+    import { addRegistryServers, getRegistryServers } from '../../scripts/utils';
     import router from '../../scripts/router';
     export default {
       change(event) {
@@ -47,13 +44,13 @@
           return this.props.onNotify('The select field should start with http:// or https://.', true);
         }
         const url = addRegistryServers(select.value);
-        router.home()
+        router.home();
         this.props.onServerChange(url);
-        this.props.onClose()
+        this.props.onClose();
         setTimeout(() => router.updateUrlQueryParam(url), 100);
       },
-      getRegistryServers
-    }
+      getRegistryServers,
+    };
   </script>
   <style>
     :host select {
@@ -74,4 +71,4 @@
       margin: 1.5em 0;
     }
   </style>
-</change-registry-url>
+</change-registry-url>
diff --git a/src/components/dialogs/confirm-delete-image.riot b/src/components/dialogs/confirm-delete-image.riot
@@ -52,15 +52,15 @@
         const oReq = new Http({ onAuthentication });
         const self = this;
         oReq.addEventListener('loadend', function () {
-          if (this.status == 200 || this.status == 202) {
+          if (this.status === 200 || this.status === 202) {
             oReq.getContentDigest(function (digest) {
               if (!digest) {
                 onNotify(ERROR_CAN_NOT_READ_CONTENT_DIGEST);
               } else {
                 self.deleteImage({ name, tag, digest }, opts);
               }
             });
-          } else if (this.status == 404) {
+          } else if (this.status === 404) {
             onNotify(`Manifest for ${name}:${tag} not found`, true);
           } else {
             onNotify(this.responseText);
@@ -77,10 +77,10 @@
         const { registryUrl, ignoreError, onNotify, onAuthentication, onClick } = opts;
         const oReq = new Http({ onAuthentication });
         oReq.addEventListener('loadend', function () {
-          if (this.status == 200 || this.status == 202) {
+          if (this.status === 200 || this.status === 202) {
             router.taglist(name);
             onNotify(`Deleting ${name}:${tag} image. Run \`registry garbage-collect config.yml\` on your registry`);
-          } else if (this.status == 404) {
+          } else if (this.status === 404) {
             ignoreError ||
               onNotify({
                 message: 'Digest not found for this image in your registry.',

diff --git a/src/components/dialogs/dialogs-menu.riot b/src/components/dialogs/dialogs-menu.riot
@@ -15,18 +15,35 @@
  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 -->
 <dialogs-menu>
-  <add-registry-url if="{ !props.readOnlyRegistries }" opened="{ state['add-registry-url'] }" on-close="{ onClose('add-registry-url') }"
-    on-notify="{ props.onNotify }" on-server-change="{ props.onServerChange }"></add-registry-url>
-  <change-registry-url opened="{ state['change-registry-url'] }" on-close="{ onClose('change-registry-url') }"
-    on-notify="{ props.onNotify }" on-server-change="{ props.onServerChange }"></change-registry-url>
-  <remove-registry-url if="{ !props.readOnlyRegistries }" opened="{ state['remove-registry-url'] }" on-close="{ onClose('remove-registry-url') }"
-    on-notify="{ props.onNotify }" on-server-change="{ props.onServerChange }"></remove-registry-url>
+  <add-registry-url
+    if="{ !props.readOnlyRegistries }"
+    opened="{ state['add-registry-url'] }"
+    on-close="{ onClose('add-registry-url') }"
+    on-notify="{ props.onNotify }"
+    on-server-change="{ props.onServerChange }"
+  ></add-registry-url>
+  <change-registry-url
+    opened="{ state['change-registry-url'] }"
+    on-close="{ onClose('change-registry-url') }"
+    on-notify="{ props.onNotify }"
+    on-server-change="{ props.onServerChange }"
+  ></change-registry-url>
+  <remove-registry-url
+    if="{ !props.readOnlyRegistries }"
+    opened="{ state['remove-registry-url'] }"
+    on-close="{ onClose('remove-registry-url') }"
+    on-notify="{ props.onNotify }"
+    on-server-change="{ props.onServerChange }"
+  ></remove-registry-url>
   <div class="container">
     <material-button onClick="{ onClick }" waves-center="true" rounded="true" waves-opacity="0.6" waves-duration="600">
       <i class="material-icons">more_vert</i>
     </material-button>
-    <material-dropdown-list items="{ dropdownItems.filter(item => item.ro || !props.readOnlyRegistries) }" onSelect="{ onDropdownSelect }"
-      opened="{ state.isDropdownOpened }" />
+    <material-dropdown-list
+      items="{ dropdownItems.filter(item => item.ro || !props.readOnlyRegistries) }"
+      onSelect="{ onDropdownSelect }"
+      opened="{ state.isDropdownOpened }"
+    />
   </div>
   <div class="overlay" onclick="{ onClick }" if="{ state.isDropdownOpened }"></div>
   <script>
@@ -38,44 +55,48 @@
       components: {
         AddRegistryUrl,
         ChangeRegistryUrl,
-        RemoveRegistryUrl
+        RemoveRegistryUrl,
       },
-      dropdownItems: [{
-        title: 'Add URL',
-        name: 'add-registry-url',
-        ro: false
-      }, {
-        title: 'Change URL',
-        name: 'change-registry-url',
-        ro: true
-      }, {
-        title: 'Remove URL',
-        name: 'remove-registry-url',
-        ro: false
-      }],
+      dropdownItems: [
+        {
+          title: 'Add URL',
+          name: 'add-registry-url',
+          ro: false,
+        },
+        {
+          title: 'Change URL',
+          name: 'change-registry-url',
+          ro: true,
+        },
+        {
+          title: 'Remove URL',
+          name: 'remove-registry-url',
+          ro: false,
+        },
+      ],
       onDropdownSelect(key, item) {
         this.update({
           [item.name]: true,
-          isDropdownOpened: false
+          isDropdownOpened: false,
         });
       },
       onClose(name) {
         return () => {
           this.update({
             [name]: false,
-            isDropdownOpened: false
-          })
-        }
+            isDropdownOpened: false,
+          });
+        };
       },
       onClick() {
         this.update({
-          isDropdownOpened: !this.state.isDropdownOpened
-        })
-      }
-    }
+          isDropdownOpened: !this.state.isDropdownOpened,
+        });
+      },
+    };
   </script>
   <style>
-    :host > .container{
+    :host > .container {
       position: absolute;
       top: 0px;
       right: 16px;
@@ -128,4 +149,4 @@
       line-height: 36px;
     }
   </style>
-</dialogs-menu>
+</dialogs-menu>
diff --git a/src/components/dialogs/remove-registry-url.riot b/src/components/dialogs/remove-registry-url.riot
@@ -21,8 +21,13 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       <ul class="list">
         <li each="{ url in getRegistryServers() }">
           <span>
-            <material-button onClick="{ remove }" url="{ url }" rounded="true" waves-color="rgba(158,158,158,.4)"
-              waves-center="true">
+            <material-button
+              onClick="{ remove }"
+              url="{ url }"
+              rounded="true"
+              waves-color="rgba(158,158,158,.4)"
+              waves-center="true"
+            >
               <i class="material-icons">delete</i>
             </material-button>
             <span class="url">{ url }</span>
@@ -37,18 +42,15 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
     </div>
   </material-popup>
   <script>
-    import {
-      getRegistryServers,
-      removeRegistryServers
-    } from '../../scripts/utils';
+    import { getRegistryServers, removeRegistryServers } from '../../scripts/utils';
     export default {
       remove(event) {
         const url = event.currentTarget.attributes.url && event.currentTarget.attributes.url.value;
         removeRegistryServers(url);
         setTimeout(() => this.update(), 100);
       },
-      getRegistryServers
-    }
+      getRegistryServers,
+    };
   </script>
   <style>
     :host material-popup .popup material-button {
@@ -59,4 +61,4 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
       color: #777;
     }
   </style>
-</remove-registry-url>
+</remove-registry-url>