sanger · StephenHulme · Aug 5, 2024 · Jan 19, 2024 · Mar 22, 2024 · Jan 19, 2024
diff --git a/.gitignore b/.gitignore
@@ -44,8 +44,10 @@ log/*.log*
 *.swn
 
 # Release
-release.tar.gz
+BRANCH
 REVISION
+TAG
+release.tar.gz
 
 # Bye-bug history
 .byebug_history
diff --git a/.nvmrc b/.nvmrc
@@ -1 +1 @@
-v14.17.6
+v16.20.2
diff --git a/Dockerfile b/Dockerfile
@@ -12,26 +12,25 @@ RUN apt-get install -y build-essential
 RUN apt-get install -y curl
 RUN apt-get install -y git
 
-# DEPRECATED:
-# Set Node to install the latest version 14 (matching .nvmrc)
-RUN curl -sL https://deb.nodesource.com/setup_14.x | bash -
-RUN apt-get update
-RUN apt-get install -y nodejs
-
 # TODO:
 # Set Node to install version 16+, a more recent version such as 20 is recommended
 #   https://github.com/nodesource/distributions
-# RUN set -uex \
-#     && NODE_MAJOR=20 \
-#     && apt-get update \
-#     && apt-get install -y ca-certificates curl gnupg \
-#     && mkdir -p /etc/apt/keyrings \
-#     && curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key \
-#     | gpg --dearmor -o /etc/apt/keyrings/nodesource.gpg \
-#     && echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_$NODE_MAJOR.x nodistro main" \
-#     | tee /etc/apt/sources.list.d/nodesource.list \
-#     && apt-get update \
-#     && apt-get install nodejs -y;
+RUN set -uex \
+    && NODE_MAJOR=16 \
+    && apt-get update \
+    && apt-get install -y ca-certificates curl gnupg \
+    && mkdir -p /etc/apt/keyrings \
+    && curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key \
+    | gpg --dearmor -o /etc/apt/keyrings/nodesource.gpg \
+    && echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_$NODE_MAJOR.x nodistro main" \
+    | tee /etc/apt/sources.list.d/nodesource.list \
+    && apt-get update \
+    && apt-get install nodejs -y;
+
+# Install Python for deasync [node-gyp]
+# Issue: https://github.com/abbr/deasync/issues/106
+# Resolution: https://github.com/nodejs/node-gyp?tab=readme-ov-file#installation
+RUN apt-get install -y python3
 
 # Change the working directory for all proceeding operations
 #   https://docs.docker.com/develop/develop-images/dockerfile_best-practices/#workdir

diff --git a/app/javascript/asset-comments/components/AssetComments.spec.js b/app/javascript/asset-comments/components/AssetComments.spec.js
@@ -51,10 +51,10 @@ describe('AssetComments', () => {
     // checking sort of comments, should be re-ordered
     expect(wrapper.find('.comments-list').findAll('li').wrappers[0].text()).toContain('This is also a comment')
     expect(wrapper.find('.comments-list').findAll('li').wrappers[0].text()).toContain('Jane Smythe (js2)')
-    expect(wrapper.find('.comments-list').findAll('li').wrappers[0].text()).toContain('30 September 2017, 12:18')
+    expect(wrapper.find('.comments-list').findAll('li').wrappers[0].text()).toContain('30 September 2017 at 12:18')
     expect(wrapper.find('.comments-list').findAll('li').wrappers[1].text()).toContain('This is a comment')
     expect(wrapper.find('.comments-list').findAll('li').wrappers[1].text()).toContain('John Smith (js1)')
-    expect(wrapper.find('.comments-list').findAll('li').wrappers[1].text()).toContain('31 August 2017, 11:18')
+    expect(wrapper.find('.comments-list').findAll('li').wrappers[1].text()).toContain('31 August 2017 at 11:18')
   })
 
   it('renders a message when there are no comments', () => {

diff --git a/app/javascript/custom-tagged-plate/components/CustomTaggedPlate.vue b/app/javascript/custom-tagged-plate/components/CustomTaggedPlate.vue
@@ -593,7 +593,7 @@ export default {
           // page, and update the history. Instead we don't redirect
           // application/json requests, and redirect the user ourselves.
           this.progressMessage = response.data.message
-          this.locationObj.href = response.data.redirect
+          this.locationObj.href = response.data.redirect // eslint-disable-line vue/no-mutating-props
           this.creationRequestInProgress = false
           this.creationRequestSuccessful = true
         })

diff --git a/app/javascript/custom-tagged-plate/index.js b/app/javascript/custom-tagged-plate/index.js
@@ -12,9 +12,9 @@ import axios from 'axios'
 
 Vue.use(BootstrapVue)
 
-Vue.component('lb-main-content', MainContent)
-Vue.component('lb-page', Page)
-Vue.component('lb-sidebar', Sidebar)
+Vue.component('LbMainContent', MainContent)
+Vue.component('LbPage', Page)
+Vue.component('LbSidebar', Sidebar)
 
 document.addEventListener('DOMContentLoaded', () => {
   /*

diff --git a/app/javascript/multi-stamp-tubes/components/MultiStampTubes.vue b/app/javascript/multi-stamp-tubes/components/MultiStampTubes.vue
@@ -339,7 +339,7 @@ export default {
           // page, and update the history. Instead we don't redirect
           // application/json requests, and redirect the user ourselves.
           this.progressMessage = response.data.message
-          this.locationObj.href = response.data.redirect
+          this.locationObj.href = response.data.redirect // eslint-disable-line vue/no-mutating-props
         })
         .catch((error) => {
           handleFailedRequest(error)

diff --git a/app/javascript/multi-stamp-tubes/index.js b/app/javascript/multi-stamp-tubes/index.js
@@ -12,9 +12,9 @@ import axios from 'axios'
 
 Vue.use(BootstrapVue)
 
-Vue.component('lb-main-content', MainContent)
-Vue.component('lb-page', Page)
-Vue.component('lb-sidebar', Sidebar)
+Vue.component('LbMainContent', MainContent)
+Vue.component('LbPage', Page)
+Vue.component('LbSidebar', Sidebar)
 
 document.addEventListener('DOMContentLoaded', () => {
   if (document.getElementById('multi-stamp-tubes-page')) {

diff --git a/app/javascript/multi-stamp/components/MultiStamp.vue b/app/javascript/multi-stamp/components/MultiStamp.vue
@@ -291,7 +291,7 @@ export default {
           // page, and update the history. Instead we don't redirect
           // application/json requests, and redirect the user ourselves.
           this.progressMessage = response.data.message
-          this.locationObj.href = response.data.redirect
+          this.locationObj.href = response.data.redirect // eslint-disable-line vue/no-mutating-props
         })
         .catch((error) => {
           // Something has gone wrong

diff --git a/app/javascript/multi-stamp/index.js b/app/javascript/multi-stamp/index.js
@@ -13,9 +13,9 @@ import axios from 'axios'
 
 Vue.use(BootstrapVue)
 
-Vue.component('lb-main-content', MainContent)
-Vue.component('lb-page', Page)
-Vue.component('lb-sidebar', Sidebar)
+Vue.component('LbMainContent', MainContent)
+Vue.component('LbPage', Page)
+Vue.component('LbSidebar', Sidebar)
 
 document.addEventListener('DOMContentLoaded', () => {
   /*

diff --git a/app/javascript/shared/components/Alert.vue b/app/javascript/shared/components/Alert.vue
@@ -9,7 +9,7 @@
 
 <script>
 export default {
-  name: 'Alert',
+  name: 'LbAlert',
   props: {
     level: { type: String, default: 'info' },
     title: { type: String, default: '' },

diff --git a/app/javascript/shared/components/Page.vue b/app/javascript/shared/components/Page.vue
@@ -22,14 +22,14 @@
 </template>
 
 <script>
-import Alert from 'shared/components/Alert'
+import LbAlert from 'shared/components/Alert'
 import eventBus from 'shared/eventBus'
 import uniqueSlug from 'unique-slug'
 
 export default {
-  name: 'Page',
+  name: 'LbPage',
   components: {
-    'lb-alert': Alert,
+    'lb-alert': LbAlert,
   },
   data() {
     return {

diff --git a/app/javascript/shared/components/Plate.spec.js b/app/javascript/shared/components/Plate.spec.js
@@ -1,12 +1,12 @@
 // Import the component being tested
 import { shallowMount } from '@vue/test-utils'
 
-import Plate from 'shared/components/Plate.vue'
+import LbPlate from 'shared/components/Plate.vue'
 // Here are some Jasmine 2.0 tests, though you can
 // use any test runner / assertion library combo you prefer
-describe('Plate', () => {
+describe('LbPlate', () => {
   const myCaption = 'Caption'
-  const wrapper = shallowMount(Plate, {
+  const wrapper = shallowMount(LbPlate, {
     propsData: { columns: 12, rows: 8, caption: myCaption, wells: { B3: {} } },
   })
 

diff --git a/app/javascript/shared/components/Plate.vue b/app/javascript/shared/components/Plate.vue
@@ -32,16 +32,16 @@
 </template>
 
 <script>
-import Well from 'shared/components/Well'
+import LbWell from 'shared/components/Well'
 import { rowNumToLetter } from 'shared/wellHelpers'
 
 export default {
-  name: 'Plate',
+  name: 'LbPlate',
   filters: {
     toLetter: rowNumToLetter,
   },
   components: {
-    'lb-well': Well,
+    'lb-well': LbWell,
   },
   props: {
     columns: { type: Number, default: 12 },

diff --git a/app/javascript/shared/components/Sidebar.vue b/app/javascript/shared/components/Sidebar.vue
@@ -11,6 +11,6 @@
 
 <script>
 export default {
-  name: 'Sidebar',
+  name: 'LbSidebar',
 }
 </script>
diff --git a/app/javascript/shared/components/Well.vue b/app/javascript/shared/components/Well.vue
@@ -18,7 +18,7 @@ import BootstrapVue from 'bootstrap-vue'
 Vue.use(BootstrapVue)
 
 export default {
-  name: 'Well',
+  name: 'LbWell',
   props: {
     position: { type: String, required: true },
     // Previously this was pool index, and was not required. Caused a silent failure (invisible wells)

diff --git a/app/javascript/shared/components/mixins/devourSelect.spec.js b/app/javascript/shared/components/mixins/devourSelect.spec.js
@@ -27,7 +27,7 @@ describe('DevourSelect mixin', () => {
       fields: testFields,
       validation: testValidation,
     }
-    cmp = Vue.extend({ mixins: [DevourSelect] })
+    cmp = Vue.extend({ mixins: [DevourSelect] }) // eslint-disable-line vue/one-component-per-file
     devourSelectInstance = new cmp({
       propsData: data,
     })
@@ -61,7 +61,7 @@ describe('DevourSelect mixin', () => {
 
   describe('checking api behaviour', () => {
     const wrapperFactory = function (api = mockApi()) {
-      const MyComponent = Vue.extend({ mixins: [DevourSelect] })
+      const MyComponent = Vue.extend({ mixins: [DevourSelect] }) // eslint-disable-line vue/one-component-per-file
       return mount(MyComponent, {
         propsData: {
           api: api.devour,

diff --git a/app/javascript/test_support/base_vue.js b/app/javascript/test_support/base_vue.js
@@ -19,8 +19,8 @@ localVue.use(BootstrapVue)
 localVue.prototype.$axios = axios
 localVue.prototype.$api = mockApi()
 
-localVue.component('lb-main-content', MainContent)
-localVue.component('lb-page', Page)
-localVue.component('lb-sidebar', Sidebar)
+localVue.component('LbMainContent', MainContent)
+localVue.component('LbPage', Page)
+localVue.component('LbSidebar', Sidebar)
 
 export default localVue
diff --git a/app/javascript/tubes-to-rack/index.js b/app/javascript/tubes-to-rack/index.js
@@ -12,9 +12,9 @@ import axios from 'axios'
 
 Vue.use(BootstrapVue)
 
-Vue.component('lb-main-content', MainContent)
-Vue.component('lb-page', Page)
-Vue.component('lb-sidebar', Sidebar)
+Vue.component('LbMainContent', MainContent)
+Vue.component('LbPage', Page)
+Vue.component('LbSidebar', Sidebar)
 
 document.addEventListener('DOMContentLoaded', () => {
   if (document.getElementById('tubes-to-rack-page')) {

diff --git a/app/javascript/validate-paired-tubes/index.js b/app/javascript/validate-paired-tubes/index.js
@@ -12,9 +12,9 @@ import axios from 'axios'
 
 Vue.use(BootstrapVue)
 
-Vue.component('lb-main-content', MainContent)
-Vue.component('lb-page', Page)
-Vue.component('lb-sidebar', Sidebar)
+Vue.component('LbMainContent', MainContent)
+Vue.component('LbPage', Page)
+Vue.component('LbSidebar', Sidebar)
 
 document.addEventListener('DOMContentLoaded', () => {
   if (document.getElementById('validate-paired-tubes')) {

diff --git a/babel.config.js b/babel.config.js
@@ -42,24 +42,10 @@ module.exports = function (api) {
       isTestEnv && 'babel-plugin-dynamic-import-node',
       '@babel/plugin-transform-destructuring',
       ['@babel/plugin-transform-private-methods', { loose: true }],
-      [
-        '@babel/plugin-transform-class-properties',
-        {
-          loose: true,
-        },
-      ],
-      [
-        '@babel/plugin-transform-object-rest-spread',
-        {
-          useBuiltIns: true,
-        },
-      ],
-      [
-        '@babel/plugin-transform-private-property-in-object',
-        {
-          loose: true,
-        },
-      ],
+      ['@babel/plugin-transform-class-properties', { loose: true }],
+      ['@babel/plugin-transform-object-rest-spread', { useBuiltIns: true }],
+      ['@babel/plugin-transform-private-property-in-object', { loose: true }],
+      ['@babel/plugin-transform-regenerator', { async: false }],
       [
         '@babel/plugin-transform-runtime',
         {
@@ -68,12 +54,6 @@ module.exports = function (api) {
           corejs: false,
         },
       ],
-      [
-        '@babel/plugin-transform-regenerator',
-        {
-          async: false,
-        },
-      ],
     ].filter(Boolean),
   }
 }
diff --git a/package.json b/package.json
@@ -1,6 +1,8 @@
 {
   "dependencies": {
-    "@babel/preset-env": "^7.25.2",
+    "@babel/plugin-transform-runtime": "^7.24.7",
+    "@babel/preset-env": "^7.24.4",
+    "@babel/runtime": "^7.24.8",
     "@rails/webpacker": "5.4.2",
     "axios": "^0.28.0",
     "babel-loader": "^8.2.5",
@@ -11,17 +13,22 @@
     "devour-client": "^2.1.2",
     "flush-promises": "^1.0.0",
     "pluralize": "^7.0.0",
-    "vue": "2.6.11",
+    "vue": "^2.7.0",
     "vue-loader": "^15.11.1",
     "vue-style-loader": "^4.1.3",
-    "vue-template-compiler": "2.6.11",
+    "vue-template-compiler": "^2.7.0",
     "web-worker": "^1.3.0",
     "webpack": "^4.46.0",
     "webpack-cli": "^3.3.12"
   },
   "devDependencies": {
-    "@babel/core": "^7.25.2",
-    "@babel/plugin-transform-runtime": "^7.23.9",
+    "@babel/core": "^7.24.4",
+    "@babel/plugin-transform-class-properties": "^7.24.4",
+    "@babel/plugin-transform-object-rest-spread": "^7.24.4",
+    "@babel/plugin-transform-private-methods": "^7.24.4",
+    "@babel/plugin-transform-private-property-in-object": "^7.24.4",
+    "@babel/plugin-transform-regenerator": "^7.24.4",
+    "@babel/plugin-transform-runtime": "^7.24.7",
     "@prettier/plugin-ruby": "^2.1.0",
     "@vue/test-utils": "^1.0.0-beta.25",
     "axios-mock-adapter": "^1.22.0",
@@ -32,7 +39,7 @@
     "eslint": "^6.0.0",
     "eslint-config-prettier": "^8.10.0",
     "eslint-plugin-jest": "^24.7.0",
-    "eslint-plugin-vue": "^6.2.2",
+    "eslint-plugin-vue": "^9.0.0",
     "jest": "^27.5.1",
     "mini-css-extract-plugin": "^0.7.0",
     "prettier": "^2.8.8",