Merge pull request #428 from Seluj78/427-like-permission

Author: Seluj78

frontend/src/components/app/recommendations/RecommendationCard.vue

@@ -28,6 +28,10 @@
 /* eslint-disable no-else-return */
 /* eslint-disable max-len */
 
+import imageMan from '../../../assets/recommendations/avatars/man1.png';
+import imageWoman from '../../../assets/recommendations/avatars/woman1.png';
+import imageOther from '../../../assets/recommendations/avatars/other.png';
+
 export default {
   props: ['recommendation'],
   methods: {
@@ -48,19 +52,11 @@ export default {
         return imageForShowcase;
       }
       if (this.recommendation.gender === 'male') {
-        const number = Math.floor(Math.random() * 11);
-        if (number % 2 === 0) {
-          return '../../../assets/recommendations/avatars/man1.png';
-        }
-        return '../../../assets/recommendations/avatars/man2.png';
+        return imageMan;
       } else if (this.recommendation.gender === 'female') {
-        const number = Math.floor(Math.random() * 11);
-        if (number % 2 === 0) {
-          return '../../../assets/recommendations/avatars/woman1.png';
-        }
-        return '../../../assets/recommendations/avatars/woman2.png';
+        return imageWoman;
       }
-      return '../../../assets/recommendations/avatars/other.png';
+      return imageOther;
     },
   },
 };

frontend/src/components/app/users/User.vue

@@ -1,10 +1,13 @@
 <template>
   <!-- eslint-disable max-len -->
   <div class="sm:mx-16 lg:mx-32">
-    <div v-if="!user" class="mx-auto flex items-center justify-center mt-32">
+    <div v-if="error" class="mx-auto flex items-center justify-center mt-32">
+      {{error}}
+    </div>
+    <div v-if="!user && !error" class="mx-auto flex items-center justify-center mt-32">
       <img class="h-36" src="../../../assets/loading.svg">
     </div>
-    <section v-else class="mx-auto">
+    <section v-if="user && !error" class="mx-auto">
       <div v-on:click="goBack()" class="sort-button py-0 ml-auto rounded-md text-lg w-20 md:w-16 mr-4 sm:mr-0 mb-4">
         <h1 class="noSelect">←</h1>
       </div>
@@ -26,6 +29,7 @@ export default {
   },
   data: () => ({
     user: null,
+    error: null,
   }),
   methods: {
     goBack() {
@@ -39,8 +43,12 @@ export default {
     },
   },
   async beforeMount() {
-    const userRequest = await this.$http.get(`/profile/view/${this.$route.params.id}`);
-    this.user = userRequest.data.profile;
+    try {
+      const userRequest = await this.$http.get(`/profile/view/${this.$route.params.id}`);
+      this.user = userRequest.data.profile;
+    } catch (error) {
+      this.error = error.response.data.error.message;
+    }
   },
 };
 </script>

frontend/src/components/app/users/UserProfile.vue

@@ -35,7 +35,7 @@
         class="px-4 py-1 border rounded-xl mr-2 mt-2 text-gray-600 text-sm">{{interest}}</h1>
       </div>
     </div>
-    <div class="text-center flex flex-col mx-auto p-8 border-b">
+    <div v-if="avatarsUploaded()" class="text-center flex flex-col mx-auto p-8 border-b">
       <LikeButton
         v-if="!likeButtons.superLikeClicked"
         v-bind:hasBeenClicked="likeButtons.likeClicked"
@@ -120,6 +120,10 @@ export default {
     blocked: false,
   }),
   methods: {
+    avatarsUploaded() {
+      return this.user.images.length > 0
+      && this.$store.getters.getLoggedInUser.images.length > 0;
+    },
     preferences() {
       if (this.user.orientation === 'heterosexual' && this.user.gender === 'male') {
         return 'women';
@@ -219,6 +223,14 @@ export default {
   async beforeMount() {
     this.checkIfUserIsLiked();
     this.checkIfUserIsBlocked();
+    const interests = this.user.tags;
+    if (interests) {
+      for (let j = 0; j < interests.length; j += 1) {
+        this.userInterests.push(interests[j].name);
+      }
+    }
+  },
+  async mounted() {
     const sliderRangesRequest = await this.$http.get('/search/values');
     const maxScore = sliderRangesRequest.data.search_minmax.max_score;
     const sliderScore = document.getElementById('sliderScore');
@@ -229,12 +241,6 @@ export default {
     } else {
       sliderScore.style.marginLeft = `calc(${marginLeft} - ${sliderScoreWidth})`;
     }
-    const interests = this.user.tags;
-    if (interests) {
-      for (let j = 0; j < interests.length; j += 1) {
-        this.userInterests.push(interests[j].name);
-      }
-    }
   },
 };
 </script>

frontend/src/router/index.js

@@ -16,6 +16,7 @@ import User from '../components/app/users/User.vue';
 import History from '../views/app/History.vue';
 import Matches from '../views/app/Matches.vue';
 import SignOut from '../views/auth/SignOut.vue';
+import NotFound from '../views/NotFound.vue';
 import store from '../store/index';
 
 Vue.use(VueRouter);
@@ -144,6 +145,11 @@ const routes = [
     name: 'SignOut',
     beforeEnter: notLoggedInRedirectLogin,
   },
+  {
+    path: '*',
+    component: NotFound,
+    name: 'NotFound',
+  },
 ];
 
 const router = new VueRouter({

frontend/src/views/NotFound.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="sm:mx-16 lg:mx-32 mt-32">
+    <h1 class="text-2xl text-center mx-auto">404 page not found</h1>
+  </div>
+</template>

frontend/src/views/app/History.vue

@@ -143,15 +143,12 @@ export default {
       this.filteredCount = count;
     },
   },
-  async created() {
-    await this.fetchUsers('People I viewed');
-    this.filteredCount = this.recommendations.length;
-  },
   async beforeRouteEnter(to, from, next) {
     next(async (vm) => {
       if (from.name !== 'Users' || !vm.visitUser) {
         vm.browseAgain();
         await vm.fetchUsers('People I viewed');
+        vm.filteredCount = vm.recommendations.length;
         vm.$el.scrollTop = 0;
       }
       vm.prevRoute = from;