Exercise 7 #9
Exercise 7 #9
Conversation
…works/no-js-pls into exercise-7
| <button @click="updateNews(1)">Upvote</button> | ||
| <button @click="updateNews(-1)">Downvote</button> | ||
| <button @click="deleteNews">Remove</button> | ||
| <button v-if="token" @click="updateNews(1)">Upvote</button> |
There was a problem hiding this comment.
star For an upvote button that behaves according to the authentication state of your user
| <button v-if="authorId === news.author.id" @click="deleteNews">Delete</button> | ||
| <button v-if="authorId === news.author.id">Edit</button> |
There was a problem hiding this comment.
star For a delete and edit button that is only visible to the author of the post.
| methods: { | ||
| vote() { | ||
| async setupNewsList() { | ||
| this.token = this.$apolloHelpers.getToken(); | ||
| if (this.token) { | ||
| this.authorId = jwtDecode(this.token).userId; | ||
| } | ||
| const { data } = await this.$apollo.query({ query: FETCH_ITEMS }); | ||
| this.newsItems = data.posts; | ||
| }, | ||
| async vote(item) { | ||
| const { data } = await this.$apollo.mutate({ mutation: UPVOTE_MUTATION, variables: { id: item.id } }); | ||
| if (data.upvote) { | ||
| this.newsItems = this.newsItems.filter((elem) => elem.id !== item.id); | ||
| this.newsItems.push(data.upvote); | ||
| } |
medizinmensch
left a comment
medizinmensch
left a comment
There was a problem hiding this comment.
Hi @Systems-Development-and-Frameworks/pls-no-js !
Looks very good! Always fun to read your little easter eggs ("ichbingesetzt", "no-nuxt-pls").
Your tests could be more extensive though. You barely did the minimum.
Also, remember to delete test files and things you don't need (like "content/hello.md").
⭐ For instructions in the README.md on how to build your webapp for production.
⭐ For no changes in "Files Changed" tab of the refactoring from vue-cli to create-nuxt-app. (See #1 in instructions)
⭐ ⭐ For the API connection between your front- and backend.
⭐ For your previous frontend tests still passing. Requests to the backend are mocked.
⭐ ⭐ For a login feature in your webapp including a Vue component and its software tests.
⭐ ⭐ For a menu component which shows a login or logout button and its software tests.
⭐ For an upvote button that behaves according to the authentication state of your user
⭐ For a delete and edit button that is only visible to the author of the post.
⭐ For Lighthouse reporting that your production website is installable as PWA (except HTTPS).
⭐ For requesting a review and reviewing another team's PR.
That makes 13/13 ⭐
| describe('Menu.vue', () => { | ||
| test('renders login when user is not logged in', () => { |
There was a problem hiding this comment.
A little strange that you test Menu.vue in your Login.spec.js
Pull request for exercise 7.
Switched the frontend to nuxtjs and connected the front- and backend via graphql.
Review can be found here.
PWA Report:
