KevinMidboe/vinlottis
1
0
Fork 0
Code Issues 8 Pull Requests 14 Packages Projects Releases Wiki Activity

Request wine front & backend talk nicer togheter.

Browse Source 
- requestWineController validates wine object and returns helpfull
 error repsonse if anything is missing.
 - requestWine uses new endpoint and calls api from within itself.
 - Linting.
This commit is contained in:
Kevin
2021-02-19 00:26:21 +01:00
parent a37c08880c
commit 83d9b30048
3 changed files with 169 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
api/controllers/requestController.js
View File

@@ -1,10 +1,11 @@
const path = require("path");
const RequestRepository = require(path.join(__dirname, "../request"));
const requestRepository = require(path.join(__dirname, "../request"));
function addRequest(req, res) {
const { wine } = req.body;
return RequestRepository.addNew(wine)
return verifyWineValues(wine)
.then(_ => requestRepository.addNew(wine))
.then(wine =>
res.json({
message: "Successfully added new request",
@@ -23,7 +24,8 @@ function addRequest(req, res) {
}
function allRequests(req, res) {
return RequestRepository.getAll()
return requestRepository
.getAll()
.then(wines =>
res.json({
wines: wines,
@@ -31,12 +33,10 @@ function allRequests(req, res) {
})
)
.catch(error => {
console.log("error in getAllRequests:", error);
const message = "Unable to fetch all requested wines.";
return res.status(500).json({
const { message, statusCode } = error;
return res.status(statusCode || 500).json({
success: false,
message: message
message: message || "Unable to fetch all requested wines."
});
});
}
@@ -44,7 +44,8 @@ function allRequests(req, res) {
function deleteRequest(req, res) {
const { id } = req.params;
return RequestRepository.deleteById(id)
return requestRepository
.deleteById(id)
.then(_ =>
res.json({
message: `Slettet vin med id: ${id}`,
@@ -61,6 +62,41 @@ function deleteRequest(req, res) {
});
}
function verifyWineValues(wine) {
return new Promise((resolve, reject) => {
if (wine == undefined) {
reject({
message: "No wine object found in request body.",
status: 400
});
}
if (wine.id == null) {
reject({
message: "Wine object missing value id.",
status: 400
});
} else if (wine.name == null) {
reject({
message: "Wine object missing value name.",
status: 400
});
} else if (wine.vivinoLink == null) {
reject({
message: "Wine object missing value vivinoLink.",
status: 400
});
} else if (wine.image == null) {
reject({
message: "Wine object missing value image.",
status: 400
});
}
resolve();
});
}
module.exports = {
addRequest,
allRequests,

46
api/request.js
View File

@@ -1,10 +1,6 @@
const path = require("path");
const RequestedWine = require(path.join(
__dirname, "/schemas/RequestedWine"
));
const Wine = require(path.join(
__dirname, "/schemas/Wine"
));
const RequestedWine = require(path.join(__dirname, "/schemas/RequestedWine"));
const Wine = require(path.join(__dirname, "/schemas/Wine"));
class RequestedWineNotFound extends Error {
constructor(message = "Wine with this id was not found.") {
@@ -14,11 +10,11 @@ class RequestedWineNotFound extends Error {
}
}
const addNew = async (wine) => {
let thisWineIsLOKO = await Wine.findOne({id: wine.id})
const addNew = async wine => {
let foundWine = await Wine.findOne({ id: wine.id });
if(thisWineIsLOKO == undefined){
thisWineIsLOKO = new Wine({
if (foundWine == undefined) {
foundWine = new Wine({
name: wine.name,
vivinoLink: wine.vivinoLink,
rating: null,
@@ -26,44 +22,44 @@ const addNew = async (wine) => {
image: wine.image,
id: wine.id
});
await thisWineIsLOKO.save()
await foundWine.save();
}
let requestedWine = await RequestedWine.findOne({ "wineId": wine.id})
let requestedWine = await RequestedWine.findOne({ wineId: wine.id });
if (requestedWine == undefined) {
requestedWine = new RequestedWine({
count: 1,
wineId: wine.id,
wine: thisWineIsLOKO
})
wine: foundWine
});
} else {
requestedWine.count += 1;
}
await requestedWine.save()
await requestedWine.save();
return requestedWine;
}
};
const getById = (id) => {
return RequestedWine.findOne({ wineId: id }).populate("wine")
const getById = id => {
return RequestedWine.findOne({ wineId: id })
.populate("wine")
.then(wine => {
if (wine == null) {
throw new RequestedWineNotFound();
}
return wine;
})
}
});
};
const deleteById = (id) => {
return getById(id)
.then(wine => RequestedWine.deleteOne({ wineId: wine.id }))
}
const deleteById = id => {
return getById(id).then(requestedWine => RequestedWine.deleteOne({ _id: requestedWine._id }));
};
const getAll = () => {
return RequestedWine.find({}).populate("wine");
}
};
module.exports = {
addNew,

113
frontend/components/RequestWine.vue
View File

@@ -9,18 +9,21 @@
<h1>
Foreslå en vin!
</h1>
<section class="search-container">
<section class="search-section">
<input type="text" v-model="searchString" @keyup.enter="fetchWineFromVin()" placeholder="Søk etter en vin du liker her!🍷" class="search-input-field">
<button :disabled="!searchString" @click="fetchWineFromVin()" class="vin-button">Søk</button>
</section>
<section v-for="(wine, index) in this.wines" :key="index" class="single-result">
<img
v-if="wine.image"
:src="wine.image"
class="wine-image"
:class="{ 'fullscreen': fullscreen }"
<input
type="text"
v-model="searchString"
@keyup.enter="searchWines()"
placeholder="Søk etter en vin du liker her!🍷"
class="search-input-field"
/>
<button :disabled="!searchString" @click="searchWines()" class="vin-button">Søk</button>
</section>
<section v-for="(wine, index) in wines" :key="index" class="single-result">
<img v-if="wine.image" :src="wine.image" class="wine-image" :class="{ fullscreen: fullscreen }" />
<img v-else class="wine-placeholder" alt="Wine image" />
<section class="wine-info">
<h2 v-if="wine.name">{{ wine.name }}</h2>
@@ -29,37 +32,38 @@
<span v-if="wine.rating">{{ wine.rating }}%</span>
<span v-if="wine.price">{{ wine.price }} NOK</span>
<span v-if="wine.country">{{ wine.country }}</span>
<span v-if="wine.year">{{ wine.year }}</span>
</div>
</section>
<button class="vin-button" @click="request(wine)">Foreslå denne</button>
<a
v-if="wine.vivinoLink"
:href="wine.vivinoLink"
class="wine-link"
>Les mer</a>
<button class="vin-button" @click="requestWine(wine)">Foreslå denne</button>
<a v-if="wine.vivinoLink" :href="wine.vivinoLink" class="wine-link">Les mer</a>
</section>
<p v-if="this.wines && this.wines.length == 0">
<p v-if="loading == false && wines && wines.length == 0">
Fant ingen viner med det navnet!
</p>
<p v-else-if="loading">Loading...</p>
</section>
</section>
</template>
<script>
import { searchForWine, requestNewWine } from "@/api";
import { searchForWine } from "@/api";
import Wine from "@/ui/Wine";
import Modal from "@/ui/Modal";
import RequestedWineCard from "@/ui/RequestedWineCard";
export default {
components: {
Wine,
Modal
Modal,
RequestedWineCard
},
data() {
return {
searchString: undefined,
wines: undefined,
showModal: false,
loading: false,
modalButtons: [
{
text: "Legg til flere viner",
@@ -70,36 +74,59 @@ export default {
action: "move"
}
]
}
};
},
methods: {
fetchWineFromVin(){
fetchWinesByQuery(query) {
let url = new URL("/api/vinmonopolet/wine/search", window.location);
url.searchParams.set("name", query);
this.wines = [];
this.loading = true;
return fetch(url.href)
.then(resp => resp.json())
.then(response => (this.wines = response.wines))
.finally(wines => (this.loading = false));
},
searchWines() {
if (this.searchString) {
this.wines = []
let localSearchString = this.searchString.replace(/ /g, "_");
searchForWine(localSearchString)
.then(res => this.wines = res)
this.fetchWinesByQuery(localSearchString);
}
},
request(wine){
requestNewWine(wine)
.then(resp => {
if(resp.success) {
this.showModal = true
requestWine(wine) {
const options = {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ wine: wine })
};
return fetch("/api/request", options)
.then(resp => resp.json())
.then(response => {
if (response.success) {
this.showModal = true;
this.$toast.info({
title: `Vinen ${wine.name} har blitt foreslått!`
});
} else {
alert("Obs, her oppsto det en feil! Feilen er logget.");
this.$toast.error({
title: "Obs, her oppsto det en feil! Feilen er logget.",
description: response.message
});
}
})
});
},
emitFromModalButton(action) {
if (action == "stay") {
this.showModal = false
this.showModal = false;
} else {
this.$router.push("/requested-wines");
}
}
},
}
};
</script>
<style lang="scss" scoped>
@@ -107,7 +134,6 @@ export default {
@import "@/styles/global";
@import "@/styles/variables";
h1 {
text-align: center;
}
@@ -126,14 +152,13 @@ input[type="text"] {
max-width: 90%;
}
.search-container {
margin: 1rem;
}
.search-section {
display: grid;
grid: 1fr / 1fr .2fr;
grid: 1fr / 1fr 0.2fr;
@include mobile {
.vin-button {
@@ -148,7 +173,7 @@ input[type="text"] {
.single-result {
margin-top: 1rem;
display: grid;
grid: 1fr / .5fr 2fr .5fr .5fr;
grid: 1fr / 0.5fr 2fr 0.5fr 0.5fr;
grid-template-areas: "picture details button-left button-right";
justify-items: center;
align-items: center;
@@ -158,15 +183,15 @@ input[type="text"] {
box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.2);
@include mobile {
grid: 1fr .5fr / .5fr 1fr;
grid-template-areas: "picture details"
grid: 1fr 0.5fr / 0.5fr 1fr;
grid-template-areas:
"picture details"
"button-left button-right";
grid-gap: .5em;
grid-gap: 0.5em;
.vin-button {
grid-area: button-right;
padding: .5em;
padding: 0.5em;
font-size: 1em;
line-height: 1em;
height: 2em;
@@ -181,12 +206,10 @@ input[type="text"] {
max-width: 80%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis
text-overflow: ellipsis;
}
}
.wine-image {
height: 100px;
grid-area: picture;
@@ -238,6 +261,4 @@ input[type="text"] {
}
}
}
</style>