fix(plugin update version checking)

Author: Ajit Kumar

client/main.scss

@@ -10,13 +10,11 @@ html {
   width: 100%;
   overflow: hidden;
   margin: 0;
-  background: linear-gradient(
-    to bottom,
-    var(--secondary-color),
-    var(--primary-color),
-    var(--primary-color),
-    var(--primary-color)
-  );
+  background: linear-gradient(to bottom,
+      var(--secondary-color),
+      var(--primary-color),
+      var(--primary-color),
+      var(--primary-color));
   color: var(--primary-text-color);
   font-family: 'Montserrat', sans-serif;
 }
@@ -89,9 +87,11 @@ body.loading {
         0% {
           transform: translateX(-100%) scaleX(0);
         }
+
         50% {
           transform: translateX(100%) scaleX(1);
         }
+
         100% {
           transform: translateX(100%) scaleX(0);
         }
@@ -108,7 +108,7 @@ header {
   position: sticky;
   top: 0;
 
-  > .icon {
+  >.icon {
     height: 60px;
     width: 60px;
     display: flex;
@@ -142,7 +142,7 @@ header {
       justify-content: center;
     }
 
-    #menu-toggler ~ .mask {
+    #menu-toggler~.mask {
       position: fixed;
       top: 0;
       left: 0;
@@ -153,11 +153,11 @@ header {
       transition: all 0.3s ease-in-out;
     }
 
-    #menu-toggler:checked ~ nav:nth-of-type(2) {
+    #menu-toggler:checked~nav:nth-of-type(2) {
       transform: translateX(0);
     }
 
-    #menu-toggler:checked ~ .mask {
+    #menu-toggler:checked~.mask {
       pointer-events: all;
       background-color: rgba($color: #000000, $alpha: 0.5);
     }
@@ -246,6 +246,7 @@ main {
   &:empty {
     position: relative;
     height: 100%;
+
     &::before {
       position: absolute;
       top: 50%;
@@ -371,6 +372,7 @@ button {
   &:disabled,
   &.disabled {
     cursor: not-allowed;
+    opacity: 0.5;
   }
 
   &:hover {
@@ -387,10 +389,12 @@ button {
         background-color: var(--button-color);
         color: var(--button-text-color);
       }
+
       50% {
         background-color: var(--button-hover-color);
         color: var(--button-text-color);
       }
+
       100% {
         background-color: var(--button-color);
         color: var(--button-text-color);
@@ -437,4 +441,4 @@ code {
 [role='button'] {
   cursor: pointer;
   width: fit-content;
-}
+}

client/pages/publishPlugin/index.js

@@ -5,6 +5,7 @@ import {
 } from 'lib/helpers';
 import AjaxForm from 'components/ajaxForm';
 import Router from 'lib/Router';
+import Ref from 'html-tag-js/ref';
 
 export default async function PublishPlugin({ mode = 'publish', id }) {
   const user = await getLoggedInUser();
@@ -26,6 +27,7 @@ export default async function PublishPlugin({ mode = 'publish', id }) {
   const minVersionCode = <></>;
   const method = mode === 'publish' ? 'post' : 'put';
   const buttonText = <>{capitalize(mode)}</>;
+  const submitButton = new Ref();
   const pluginIcon = <img style={{ height: '120px', width: '120px' }} src="#" alt="Plugin icon" />;
 
   let plugin;
@@ -93,7 +95,9 @@ export default async function PublishPlugin({ mode = 'publish', id }) {
         </tbody>
       </table>
 
-      <button type='submit'> <span className="icon publish"></span> {buttonText}</button>
+      <button ref={submitButton} type='submit'>
+        <span className="icon publish"></span>{buttonText}
+      </button>
     </AjaxForm>
   </section>;
 
@@ -104,6 +108,7 @@ export default async function PublishPlugin({ mode = 'publish', id }) {
     }
 
     successText.value = 'Plugin published successfully.';
+    Router.loadUrl(`/plugin/${data.id}`);
   }
 
   function onerror(error) {
@@ -140,6 +145,14 @@ export default async function PublishPlugin({ mode = 'publish', id }) {
           return;
         }
 
+        if (id && !isVersionGreater(manifest.version, plugin.version)) {
+          submitButton.el.disabled = true;
+          errorText.value = 'Version should be greater than previous version.';
+          return;
+        }
+
+        errorText.value = '';
+        submitButton.el.disabled = false;
         pluginId.value = manifest.id;
         pluginName.value = manifest.name;
         pluginVersion.value = manifest.version;
@@ -155,4 +168,42 @@ export default async function PublishPlugin({ mode = 'publish', id }) {
 
     reader.readAsArrayBuffer(file);
   }
+
+  function isVersionGreater(newV, oldV) {
+    const [newMajor, newMinor, newPatch] = newV.split('.').map(Number);
+    const [oldMajor, oldMinor, oldPatch] = oldV.split('.').map(Number);
+
+    if (newMajor > oldMajor) {
+      return true;
+    }
+
+    if (newMajor === oldMajor && newMinor > oldMinor) {
+      return true;
+    }
+
+    if (newMajor === oldMajor && newMinor === oldMinor && newPatch > oldPatch) {
+      return true;
+    }
+
+    return false;
+  }
+
+  function getUpdateType(newV, oldV) {
+    const [newMajor, newMinor, newPatch] = newV.split('.').map(Number);
+    const [oldMajor, oldMinor, oldPatch] = oldV.split('.').map(Number);
+
+    if (newMajor > oldMajor) {
+      return 'major';
+    }
+
+    if (newMajor === oldMajor && newMinor > oldMinor) {
+      return 'minor';
+    }
+
+    if (newMajor === oldMajor && newMinor === oldMinor && newPatch > oldPatch) {
+      return 'patch';
+    }
+
+    return 'unknown';
+  }
 }

server/apis/plugin.js

@@ -459,7 +459,7 @@ router.put('/', async (req, res) => {
     }
 
     const { license, contributors, changelogs, keywords } = req.body;
-    const { pluginJson, icon, readme } = await exploreZip(pluginZip.data);
+    const { pluginJson, icon, readme, changelogs: changelogsFile } = await exploreZip(pluginZip.data);
 
     const errorMessage = validatePlugin(pluginJson, icon, readme);
     if (errorMessage) {
@@ -492,7 +492,7 @@ router.put('/', async (req, res) => {
       [Plugin.DESCRIPTION, readme],
       [Plugin.LICENSE, license],
       [Plugin.CONTRIBUTORS, contributors],
-      [Plugin.CHANGELOGS, changelogs],
+      [Plugin.CHANGELOGS, changelogs || changelogsFile],
       [Plugin.KEYWORDS, keywords],
     ];
 
@@ -617,8 +617,9 @@ async function exploreZip(file) {
   const pluginJson = JSON.parse(await zip.file('plugin.json')?.async('string'));
   const icon = await zip.file('icon.png')?.async('base64');
   const readme = await zip.file('readme.md')?.async('string');
+  const changelogs = await zip.file('changelogs.md')?.async('string');
 
-  return { pluginJson, icon, readme };
+  return { pluginJson, icon, readme, changelogs };
 }
 
 function savePlugin(id, file, icon) {
@@ -729,14 +730,20 @@ function isValidPrice(price) {
   return price && !Number.isNaN(price) && price >= MIN_PRICE && price <= MAX_PRICE;
 }
 
-function isVersionGreater(v1, v2) {
-  const v1Arr = v1.split('.');
-  const v2Arr = v2.split('.');
+function isVersionGreater(newV, oldV) {
+  const [newMajor, newMinor, newPatch] = newV.split('.').map(Number);
+  const [oldMajor, oldMinor, oldPatch] = oldV.split('.').map(Number);
 
-  for (let i = 0; i < 3; i++) {
-    if (v1Arr[i] > v2Arr[i]) {
-      return true;
-    }
+  if (newMajor > oldMajor) {
+    return true;
+  }
+
+  if (newMajor === oldMajor && newMinor > oldMinor) {
+    return true;
+  }
+
+  if (newMajor === oldMajor && newMinor === oldMinor && newPatch > oldPatch) {
+    return true;
   }
 
   return false;