diff --git a/docker-compose.yml b/docker-compose.yml index a16753e4d..c88dca66e 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -82,10 +82,8 @@ services: build: context: . dockerfile: frontend.Dockerfile - volumes: - - './frontend:/frontend' ports: - - '4242:8080' + - '4242:5000' networks: - backend-net diff --git a/frontend.Dockerfile b/frontend.Dockerfile index e82ca6225..113631472 100644 --- a/frontend.Dockerfile +++ b/frontend.Dockerfile @@ -6,7 +6,10 @@ ENV PATH /frontend/node_modules/.bin:$PATH COPY frontend/package.json /frontend/package.json COPY frontend/yarn.lock /frontend/yarn.lock +COPY ./frontend . RUN yarn install -CMD ["yarn", "serve"] +RUN yarn build + +CMD ["serve", "-s", "dist"] diff --git a/frontend/package.json b/frontend/package.json index 18e6dc89d..d4ab7940f 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -16,6 +16,7 @@ "jwt-decode": "^3.0.0", "nouislider": "^14.6.2", "secure-ls": "^1.2.6", + "serve": "^11.3.2", "tailwindcss": "^1.8.10", "vee-validate": "^3.4.1", "vue": "^2.6.11", diff --git a/frontend/src/App.vue b/frontend/src/App.vue index 4b31d7f1e..dd4256c56 100644 --- a/frontend/src/App.vue +++ b/frontend/src/App.vue @@ -37,6 +37,10 @@ body, height: 100%; } +body { + margin: 0; +} + ::placeholder { @apply font-normal; } diff --git a/frontend/src/components/app/matches/Chat.vue b/frontend/src/components/app/matches/Chat.vue index da73367fa..98a3d1492 100644 --- a/frontend/src/components/app/matches/Chat.vue +++ b/frontend/src/components/app/matches/Chat.vue @@ -101,15 +101,15 @@ export default { const response = await this.$http.post('/messages/send', { to_uid: this.user.id.toString(), content: this.message, - }); + }, { accessTokenRequired: true }); this.messages.push(response.data.new_message); this.message = ''; this.$emit('new-message'); this.scrollChatToBottom(); }, async fetchNewMessages() { - await this.$http.post(`/messages/see/${this.chatWithUserId}`); - const messagesRequest = await this.$http.get(`/conversations/${this.chatWithUserId}`); + await this.$http.post(`/messages/see/${this.chatWithUserId}`, null, { accessTokenRequired: true }); + const messagesRequest = await this.$http.get(`/conversations/${this.chatWithUserId}`, { accessTokenRequired: true }); const newMessages = messagesRequest.data.messages; const oldMessageCount = this.messages.length; this.messages = newMessages; @@ -121,11 +121,11 @@ export default { } }, async prepareChatForNewUser() { - await this.$http.post(`/messages/see/${this.chatWithUserId}`); - const messagesRequest = await this.$http.get(`/conversations/${this.chatWithUserId}`); + await this.$http.post(`/messages/see/${this.chatWithUserId}`, null, { accessTokenRequired: true }); + const messagesRequest = await this.$http.get(`/conversations/${this.chatWithUserId}`, { accessTokenRequired: true }); this.messages = messagesRequest.data.messages; this.determineFirstMessagesOfTimespans(this.messages); - const userRequest = await this.$http.get(`/users/${this.chatWithUserId}`); + const userRequest = await this.$http.get(`/users/${this.chatWithUserId}`, { accessTokenRequired: true }); this.user = userRequest.data; this.scrollChatToBottom(); }, diff --git a/frontend/src/components/app/matches/MessageBubble.vue b/frontend/src/components/app/matches/MessageBubble.vue index ceaccd275..8a07ac512 100644 --- a/frontend/src/components/app/matches/MessageBubble.vue +++ b/frontend/src/components/app/matches/MessageBubble.vue @@ -56,10 +56,10 @@ export default { } if (!isLiked) { this.message.is_liked = true; - await this.$http.post(`/messages/like/${id}`); + await this.$http.post(`/messages/like/${id}`, null, { accessTokenRequired: true }); } else { this.message.is_liked = false; - await this.$http.post(`/messages/unlike/${id}`); + await this.$http.post(`/messages/unlike/${id}`, null, { accessTokenRequired: true }); } }, }, diff --git a/frontend/src/components/app/onboarding/Location.vue b/frontend/src/components/app/onboarding/Location.vue index aada857d2..3f3f01a62 100644 --- a/frontend/src/components/app/onboarding/Location.vue +++ b/frontend/src/components/app/onboarding/Location.vue @@ -51,7 +51,7 @@ export default { this.$emit('next-slide'); }, async sendLocation() { - await this.$http.put('/profile/edit/geolocation', this.locationData); + await this.$http.put('/profile/edit/geolocation', this.locationData, { accessTokenRequired: true }); }, }, mounted() { diff --git a/frontend/src/components/app/onboarding/MainAndSecondaryImagesUpload.vue b/frontend/src/components/app/onboarding/MainAndSecondaryImagesUpload.vue index a20cb8db5..05f01f725 100644 --- a/frontend/src/components/app/onboarding/MainAndSecondaryImagesUpload.vue +++ b/frontend/src/components/app/onboarding/MainAndSecondaryImagesUpload.vue @@ -52,9 +52,9 @@ export default { const formData = new FormData(); formData.append('file[]', this.imagesUploaded[i].content); if (i === 0) { - await this.$http.post('/profile/images?is_primary=true', formData); + await this.$http.post('/profile/images?is_primary=true', formData, { accessTokenRequired: true }); } else { - await this.$http.post('/profile/images?is_primary=false', formData); + await this.$http.post('/profile/images?is_primary=false', formData, { accessTokenRequired: true }); } } catch (error) {} } diff --git a/frontend/src/components/app/settings/AccountInput.vue b/frontend/src/components/app/settings/AccountInput.vue index bf5354005..02735e906 100644 --- a/frontend/src/components/app/settings/AccountInput.vue +++ b/frontend/src/components/app/settings/AccountInput.vue @@ -85,25 +85,25 @@ export default { this.currentValueBackup = this.currentValue; try { if (this.type === 'firstName') { - await this.$http.patch('/profile/edit/first_name', { first_name: this.currentValue }); + await this.$http.patch('/profile/edit/first_name', { first_name: this.currentValue }, { accessTokenRequired: true }); } else if (this.type === 'lastName') { - await this.$http.patch('/profile/edit/last_name', { last_name: this.currentValue }); + await this.$http.patch('/profile/edit/last_name', { last_name: this.currentValue }, { accessTokenRequired: true }); } else if (this.type === 'email') { - await this.$http.put('/profile/edit/email', { email: this.currentValue }); + await this.$http.put('/profile/edit/email', { email: this.currentValue }, { accessTokenRequired: true }); } else if (this.type === 'username') { - await this.$http.patch('/profile/edit/username', { username: this.currentValue }); + await this.$http.patch('/profile/edit/username', { username: this.currentValue }, { accessTokenRequired: true }); } else if (this.type === 'bio') { - await this.$http.patch('/profile/edit/bio', { bio: this.currentValue }); + await this.$http.patch('/profile/edit/bio', { bio: this.currentValue }, { accessTokenRequired: true }); } else if (this.type === 'password') { await this.$http.put('/profile/edit/password', { old_password: this.passwordOld, new_password: this.currentValue, - }); + }, { accessTokenRequired: true }); this.currentValue = ''; this.passwordRepeat = ''; this.passwordOld = ''; } - const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`); + const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`, { accessTokenRequired: true }); await this.$store.dispatch('login', user.data); } catch (error) { this.error = error.response.data.error.message; diff --git a/frontend/src/components/app/users/User.vue b/frontend/src/components/app/users/User.vue index b51ba26d9..e7771c563 100644 --- a/frontend/src/components/app/users/User.vue +++ b/frontend/src/components/app/users/User.vue @@ -35,17 +35,28 @@ export default { goBack() { this.$router.go(-1); }, + sortImages() { + const userImagesLength = this.user.images.length; + for (let i = 0; i < userImagesLength; i += 1) { + if (this.user.images[i].is_primary && i !== 0) { + this.user.images.splice(0, 0, this.user.images[i]); + this.user.images.splice(i + 1, 1); + return; + } + } + }, }, watch: { async $route() { - const userRequest = await this.$http.get(`/profile/view/${this.$route.params.id}`); + const userRequest = await this.$http.get(`/profile/view/${this.$route.params.id}`, { accessTokenRequired: true }); this.user = userRequest.data.profile; }, }, async beforeMount() { try { - const userRequest = await this.$http.get(`/profile/view/${this.$route.params.id}`); + const userRequest = await this.$http.get(`/profile/view/${this.$route.params.id}`, { accessTokenRequired: true }); this.user = userRequest.data.profile; + this.sortImages(); } catch (error) { this.error = error.response.data.error.message; } diff --git a/frontend/src/components/app/users/UserProfile.vue b/frontend/src/components/app/users/UserProfile.vue index e3b8df87e..56fa06395 100644 --- a/frontend/src/components/app/users/UserProfile.vue +++ b/frontend/src/components/app/users/UserProfile.vue @@ -166,26 +166,26 @@ export default { async buttonClicked(...args) { const [name] = args; if (name === 'like') { - await this.$http.post(`/like/${this.user.id}`, { is_superlike: false }); + await this.$http.post(`/like/${this.user.id}`, { is_superlike: false }, { accessTokenRequired: true }); this.likeButtons.likeClicked = true; } else if (name === 'superLike') { - await this.$http.post(`/like/${this.user.id}`, { is_superlike: true }); + await this.$http.post(`/like/${this.user.id}`, { is_superlike: true }, { accessTokenRequired: true }); this.likeButtons.superLikeClicked = true; } - const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`); + const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`, { accessTokenRequired: true }); await this.$store.dispatch('login', user.data); this.checkIfUserIsMatched(); }, async buttonRevert(...args) { const [name] = args; if (name === 'like') { - await this.$http.post(`/unlike/${this.user.id}`, { is_superlike: false }); + await this.$http.post(`/unlike/${this.user.id}`, { is_superlike: false }, { accessTokenRequired: true }); this.likeButtons.likeClicked = false; } else if (name === 'superLike') { - await this.$http.post(`/unlike/${this.user.id}`, { is_superlike: true }); + await this.$http.post(`/unlike/${this.user.id}`, { is_superlike: true }, { accessTokenRequired: true }); this.likeButtons.superLikeClicked = false; } - const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`); + const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`, { accessTokenRequired: true }); await this.$store.dispatch('login', user.data); this.checkIfUserIsMatched(); }, @@ -196,22 +196,22 @@ export default { } }, async makeReport() { - await this.$http.post(`/profile/report/${this.user.id}`, { reason: this.report }); + await this.$http.post(`/profile/report/${this.user.id}`, { reason: this.report }, { accessTokenRequired: true }); this.reported = true; setTimeout(() => { this.reported = false; }, 3000); }, async block() { - await this.$http.post(`/profile/block/${this.user.id}`); + await this.$http.post(`/profile/block/${this.user.id}`, null, { accessTokenRequired: true }); this.blocked = true; - const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`); + const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`, { accessTokenRequired: true }); await this.$store.dispatch('login', user.data); }, async unblock() { - await this.$http.post(`/profile/unblock/${this.user.id}`); + await this.$http.post(`/profile/unblock/${this.user.id}`, null, { accessTokenRequired: true }); this.blocked = false; - const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`); + const user = await this.$http.get(`/users/${this.$store.getters.getLoggedInUser.id}`, { accessTokenRequired: true }); await this.$store.dispatch('login', user.data); }, checkIfUserIsLiked() { @@ -270,7 +270,7 @@ export default { } }, async mounted() { - const sliderRangesRequest = await this.$http.get('/search/values'); + const sliderRangesRequest = await this.$http.get('/search/values', { accessTokenRequired: true }); const maxScore = sliderRangesRequest.data.search_minmax.max_score; const sliderScore = document.getElementById('sliderScore'); if (sliderScore) { diff --git a/frontend/src/components/shared/FilterSlider.vue b/frontend/src/components/shared/FilterSlider.vue index e63a0a7c5..3d0e9115d 100644 --- a/frontend/src/components/shared/FilterSlider.vue +++ b/frontend/src/components/shared/FilterSlider.vue @@ -59,7 +59,319 @@ export default { }; -