Milestone 3

.github/workflows/ci.yml

@@ -20,15 +20,11 @@ on:
       - develop
 
 jobs:
-  code-style:
+  code-style-express:
     name: Run style checks for Express server
 
     runs-on: ${{ matrix.os }}
 
-#    defaults:
-#        run:
-#            working-directory: ./
-
     strategy:
       matrix:
         os: [ ubuntu-latest ]
@@ -94,10 +90,6 @@ jobs:
 
     runs-on: ${{ matrix.os }}
 
-#    defaults:
-#        run:
-#            working-directory: ./
-
     strategy:
       matrix:
         os: [ ubuntu-latest ]
@@ -134,3 +126,26 @@ jobs:
         run: yarn run start:test
         env:
           MONGODB_URI: mongodb://localhost:27017/handshake
+
+  build-vue:
+    name: Build Vue.js app
+    runs-on: ubuntu-latest
+
+    defaults:
+      run:
+        working-directory: ./client
+
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v3
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v3
+        with:
+          node-version: 14
+
+      - name: Install packages
+        run: yarn
+
+      - name: Build Vue.js app
+        run: yarn run build

.gitignore

@@ -3,6 +3,8 @@
 
 # Express public folder is automatically generated by Vue
 /public
+/media/*/*
+!/media/*/.gitkeep
 
 /bin/act
 

app.js

@@ -2,7 +2,6 @@
 const express = require('express');
 const path = require('path');
 const logger = require('morgan');
-const multer = require('multer');
 const cookieParser = require('cookie-parser');
 const { authenticate } = require('./middlewares/authentication.middleware');
 
@@ -13,22 +12,25 @@ const app = express();
 app.use(logger('dev'));
 app.use(express.urlencoded({ extended: false })); // parse application/x-www.js-form-urlencoded
 app.use(express.json({ limit: '4MB' })); // parse application/json
-app.use(multer().none()); // parse multipart/form-data
 app.use(cookieParser());
 
 app.use(
   express.static(path.join(__dirname, 'public'), { index: 'index.html' })
 );
+app.use('/media', express.static(path.join(__dirname, 'media')));
 
 app.set('view engine', 'html');
 
 // TODO - controllers
 app.use('/auth', require('./routes/auth'));
 app.use('/api', authenticate, require('./routes/chat'));
+app.use('/upload', authenticate, require('./routes/upload'));
 
 // serve Vue app if no matching route is found
 app.get('*', (req, res) => {
   res.sendFile(path.join(__dirname, 'public/index.html'));
 });
 
+app.locals.onlineUsers = new Set();
+
 module.exports = app;

bin/www.js

@@ -10,6 +10,6 @@ server.on('listening', function () {
   console.log('Express server listening on port ' + server.address().port);
 });
 
-serverSocket.init(server);
+serverSocket.init(server, app.locals.onlineUsers);
 initDB();
 server.listen(app.get('port'));

client/.prettierrc

@@ -6,3 +6,4 @@ useTabs: false
 semi: true
 arrowParens: always
 bracketSpacing: true
+bracketSameLine: true

client/package.json

@@ -11,13 +11,19 @@
     "style:prettier:fix": "prettier --write ."
   },
   "dependencies": {
+    "@lottiefiles/lottie-interactivity": "^1.6.1",
+    "@lottiefiles/lottie-player": "^1.6.2",
     "axios": "^1.2.0",
     "core-js": "^3.8.3",
+    "localforage": "^1.10.0",
     "socket.io-client": "^4.5.4",
     "vue": "^2.6.14",
     "vue-axios": "^3.5.2",
+    "vue-custom-scrollbar": "^1.4.4",
     "vue-router": "^3.5.1",
-    "vuex": "^3.6.2"
+    "vuetify": "^2.6.0",
+    "vuex": "^3.6.2",
+    "vuex-persist": "^3.1.3"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",
@@ -34,6 +40,10 @@
     "eslint-plugin-node": "^11.1.0",
     "eslint-plugin-promise": "^5.1.0",
     "eslint-plugin-vue": "^8.0.3",
-    "vue-template-compiler": "^2.6.14"
+    "sass": "~1.32.0",
+    "sass-loader": "^10.0.0",
+    "vue-cli-plugin-vuetify": "~2.5.8",
+    "vue-template-compiler": "^2.6.14",
+    "vuetify-loader": "^1.7.0"
   }
 }