IT4Change/Ocelot-Social
3
0
Fork 0
mirror of https://github.com/IT4Change/Ocelot-Social.git synced 2025-12-13 07:45:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Cleanup

Browse Source
This commit is contained in:
Wolfgang Huß 2021-11-11 12:05:26 +01:00
parent b7400339ab
commit 32844b8197
4 changed files with 2 additions and 259 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
webapp/components/_new/features/MySomethingList/MySomethingList.spec.js
View File

@ -1,7 +1,5 @@
import { mount } from '@vue/test-utils'
// Wolle import flushPromises from 'flush-promises'
import MySomethingList from './MySomethingList.vue'
// Wolle import Vuex from 'vuex'
import Vue from 'vue'
const localVue = global.localVue
@ -11,9 +9,6 @@ describe('MySomethingList.vue', () => {
let propsData
let data
let mocks
// let getters
// Wolle const socialMediaUrl = 'https://freeradical.zone/@mattwr18'
// const newSocialMediaUrl = 'https://twitter.com/mattwr18'
beforeEach(() => {
propsData = {
@ -34,20 +29,11 @@ describe('MySomethingList.vue', () => {
success: jest.fn(),
},
}
// getters = {
// 'auth/user': () => {
// return {}
// },
// }
})
describe('mount', () => {
// Wolle let form, input, slots, submitButton
let form, slots
const Wrapper = () => {
// const store = new Vuex.Store({
// getters,
// })
slots = {
'list-item': '<div class="list-item"></div>',
'edit-item': '<div class="edit-item"></div>',
@ -55,88 +41,15 @@ describe('MySomethingList.vue', () => {
return mount(MySomethingList, {
propsData,
data,
// store,
mocks,
localVue,
slots,
})
}
// describe('adding social media link', () => {
// beforeEach(async () => {
// wrapper = Wrapper()
// form = wrapper.find('form')
// form.trigger('submit')
// await Vue.nextTick()
// console.log(wrapper.html())
// console.log('wrapper.vm.socialMediaLinks: ', wrapper.vm.socialMediaLinks)
// input = wrapper.find('input#editSocialMedia')
// console.log('input: ', input)
// submitButton = wrapper.find('button')
// })
// Wolle it('requires the link to be a valid url', async () => {
// input.setValue('some value')
// form.trigger('submit')
// await Vue.nextTick()
// expect(mocks.$apollo.mutate).not.toHaveBeenCalled()
// })
// Wolle it('displays an error message when not saved successfully', async () => {
// mocks.$apollo.mutate.mockRejectedValue({ message: 'Ouch!' })
// input.setValue(newSocialMediaUrl)
// form.trigger('submit')
// await Vue.nextTick()
// await flushPromises()
// expect(mocks.$toast.error).toHaveBeenCalledTimes(1)
// })
// describe('success', () => {
// beforeEach(async () => {
// mocks.$apollo.mutate.mockResolvedValue({
// data: { CreateSocialMedia: { id: 's2', url: newSocialMediaUrl } },
// })
// input.setValue(newSocialMediaUrl)
// form.trigger('submit')
// await Vue.nextTick()
// })
// it('sends the new url to the backend', () => {
// const expected = expect.objectContaining({
// variables: { url: newSocialMediaUrl },
// })
// expect(mocks.$apollo.mutate).toHaveBeenCalledWith(expected)
// })
// it('displays a success message', async () => {
// await flushPromises()
// expect(mocks.$toast.success).toHaveBeenCalledTimes(1)
// })
// it('clears the form', async () => {
// await flushPromises()
// expect(input.value).toBe(undefined)
// expect(submitButton.vm.$attrs.disabled).toBe(true)
// })
// })
// })
describe('given existing social media links', () => {
beforeEach(() => {
// getters = {
// 'auth/user': () => ({
// socialMedia: [{ id: 's1', url: socialMediaUrl }],
// }),
// }
// Wolle propsData = { editingLink: { id: 's1', url: socialMediaUrl } }
// data = () => {
// return {
// editingLink: { id: 's2', url: socialMediaUrl },
// }
// }
wrapper = Wrapper()
// form = wrapper.find('form')
})
describe('for each item it', () => {
@ -158,7 +71,6 @@ describe('MySomethingList.vue', () => {
const editButton = wrapper.find('.base-button[data-test="edit-button"]')
editButton.trigger('click')
await Vue.nextTick()
// Wolle input = wrapper.find('input#editSocialMedia')
})
it('disables adding items while editing', () => {

153
webapp/components/_new/features/MySomethingList/MySomethingList.vue
View File

@ -18,12 +18,6 @@
</ds-heading>
</ds-space>
<ds-space v-if="items" margin-top="base" margin="base">
<!-- Wolle <ds-input
id="editSocialMedia"
model="socialMediaUrl"
type="text"
:placeholder="$t('settings.social-media.placeholder')"
/> -->
<slot name="edit-item" />
</ds-space>
</div>
@ -33,11 +27,6 @@
<ds-list-item v-for="item in items" :key="item.id" class="list-item--high">
<!-- Wolle remove template tag? -->
<template>
<!-- Wolle <a :href="link.url" target="_blank">
<img :src="link.favicon" alt="Link:" height="16" width="16" />
{{ link.url }}
</a> -->
<!-- Wolle <slot name="list-item" :link="link" data-test="item-slot" /> -->
<slot name="list-item" :item="item" />
<span class="divider">|</span>
<base-button
@ -63,13 +52,6 @@
</div>
<ds-space margin-top="base">
<!-- Wolle <ds-input
v-if="!isEditing"
id="addSocialMedia"
model="socialMediaUrl"
type="text"
:placeholder="$t('settings.social-media.placeholder')"
/> -->
<ds-space margin-top="base">
<base-button
filled
@ -88,10 +70,6 @@
</template>
<script>
// Wolle import unionBy from 'lodash/unionBy'
// import gql from 'graphql-tag'
// Wolle import { mapGetters, mapMutations } from 'vuex'
export default {
name: 'MySomethingList',
props: {
@ -121,17 +99,7 @@ export default {
},
},
data() {
// Wolle console.log(this.useItems)
return {
// Wolle formData: {
// socialMediaUrl: '',
// },
// formSchema: {
// socialMediaUrl: {
// type: 'url',
// message: this.$t('common.validations.url'),
// },
// },
formData: this.useFormData,
formSchema: this.useFormSchema,
items: this.useItems,
@ -140,49 +108,26 @@ export default {
}
},
computed: {
// Wolle ...mapGetters({
// currentUser: 'auth/user',
// }),
isEditing() {
return this.editingItem !== null
},
isCreation() {
return this.editingItem !== null && this.editingItem.id === ''
},
// Wolle socialMediaLinks() {
// const domainRegex = /^(?:https?:\/\/)?(?:[^@\n])?(?:www\.)?([^:/\n?]+)/g
// const { socialMedia = [] } = this.currentUser
// return socialMedia.map(({ id, url }) => {
// const [domain] = url.match(domainRegex) || []
// const favicon = domain ? `${domain}/favicon.ico` : null
// return { id, url, favicon }
// })
// },
},
watch: {
// useFormData(newFormData) {
// this.formData = newFormData
// },
// useFormSchema(newFormSchema) {
// this.formSchema = newFormSchema
// },
// can change by a parents callback and again given trough by bind from there
useItems(newItems) {
this.items = newItems
},
},
methods: {
// Wolle ...mapMutations({
// setCurrentUser: 'auth/SET_USER',
// }),
handleCancel() {
this.editingItem = null
// Wolle ??? this.formData.socialMediaUrl = ''
this.disabled = true
},
handleEditSocialMedia(item) {
this.editingItem = item
// Wolle this.formData.socialMediaUrl = link.url
// Wolle this.$refs.socialMediaUrl.$el.focus()
this.callbacks.edit(this, item)
},
handleInput(data) {
@ -196,101 +141,12 @@ export default {
}
},
async handleDeleteSocialMedia(item) {
// Wolle try {
// await this.$apollo.mutate({
// mutation: gql`
// mutation($id: ID!) {
// DeleteSocialMedia(id: $id) {
// id
// url
// }
// }
// `,
// variables: {
// id: item.id,
// },
// update: (store, { data }) => {
// const socialMedia = this.currentUser.socialMedia.filter(
// (element) => element.id !== item.id,
// )
// this.setCurrentUser({
// ...this.currentUser,
// socialMedia,
// })
// },
// })
// this.$toast.success(this.$t('settings.social-media.successDelete'))
// } catch (err) {
// this.$toast.error(err.message)
// }
await this.callbacks.delete(this, item)
},
async handleSubmitSocialMedia() {
// Wolle const isEditing = (this.editingLink !== null)
if (!this.isEditing) {
// Wolle this.editingLink = { id: '', url: '' }
// this.handleEditSocialMedia({ id: '', url: '' })
this.handleEditSocialMedia({ ...this.defaultItem, id: '' })
} else {
// // Wolle const url = this.formData.socialMediaUrl
// this.editingLink.url = this.formData.socialMediaUrl
// const duplicateUrl = this.items.find((item) => item.url === this.editingLink.url)
// // Wolle console.log('duplicateUrl: ', duplicateUrl)
// // console.log('this.isEditing: ', this.isEditing)
// // console.log('this.editingLink: ', this.editingLink)
// if (duplicateUrl && this.isEditing && duplicateUrl.id !== this.editingLink.id) {
// return this.$toast.error(this.$t('settings.social-media.requireUnique'))
// }
// let mutation, variables, successMessage
// if (this.isCreation) {
// mutation = gql`
// mutation($url: String!) {
// CreateSocialMedia(url: $url) {
// id
// url
// }
// }
// `
// variables = { url: this.editingLink.url }
// successMessage = this.$t('settings.social-media.successAdd')
// } else {
// mutation = gql`
// mutation($id: ID!, $url: String!) {
// UpdateSocialMedia(id: $id, url: $url) {
// id
// url
// }
// }
// `
// variables = { id: this.editingLink.id, url: this.editingLink.url }
// successMessage = this.$t('settings.data.success')
// }
// try {
// await this.$apollo.mutate({
// mutation,
// variables,
// update: (_store, { data }) => {
// const newSocialMedia = !this.isCreation
// ? data.UpdateSocialMedia
// : data.CreateSocialMedia
// this.setCurrentUser({
// ...this.currentUser,
// socialMedia: unionBy([newSocialMedia], this.currentUser.socialMedia, 'id'),
// })
// },
// })
// this.$toast.success(successMessage)
// this.formData.socialMediaUrl = ''
// this.disabled = true
// this.editingLink = null
// } catch (err) {
// this.$toast.error(err.message)
// }
if (await this.callbacks.submit(this, this.isCreation, this.editingItem, this.formData)) {
this.disabled = true
this.editingItem = null
@ -302,15 +158,8 @@ export default {
</script>
<style lang="scss" scope>
// Wolle .title {
// font-size: $font-size-xx-large;
// margin-top: $space-small;
// // Wolle margin-bottom: $space-small;
// }
.undertitle {
font-size: $font-size-base;
// margin-top: $space-base;
}
.divider {

17
webapp/pages/settings/my-social-media.spec.js
View File

@ -33,7 +33,6 @@ describe('my-social-media.vue', () => {
})
describe('mount', () => {
// Wolle let form, input, submitButton
let form, input
const Wrapper = () => {
const store = new Vuex.Store({
@ -49,7 +48,6 @@ describe('my-social-media.vue', () => {
form.trigger('submit')
await Vue.nextTick()
input = wrapper.find('input#editSocialMedia')
// Wolle submitButton = wrapper.find('button')
})
it('requires the link to be a valid url', async () => {
@ -90,15 +88,8 @@ describe('my-social-media.vue', () => {
expect(mocks.$toast.success).toHaveBeenCalledTimes(1)
})
// Wolle it('clears the form', async () => {
// await flushPromises()
// expect(input.value).toBe(undefined)
// expect(submitButton.vm.$attrs.disabled).toBe(true)
// })
it('switches back to list', async () => {
await flushPromises()
// Wolle expect(input.value).toBe(undefined)
// expect(submitButton.vm.$attrs.disabled).toBe(true)
const submitButton = wrapper.find('.base-button[data-test="add-save-button"]')
expect(submitButton.text()).not.toContain('settings.social-media.submit')
})
@ -124,14 +115,6 @@ describe('my-social-media.vue', () => {
it('displays the url', () => {
expect(wrapper.find(`a[href="${socialMediaUrl}"]`).exists()).toBe(true)
})
// it('displays the edit button', () => {
// expect(wrapper.find('.base-button[data-test="edit-button"]').exists()).toBe(true)
// })
// it('displays the delete button', () => {
// expect(wrapper.find('.base-button[data-test="delete-button"]').exists()).toBe(true)
// })
})
it('does not accept a duplicate url', async () => {

3
webapp/pages/settings/my-social-media.vue
View File

@ -81,8 +81,8 @@ export default {
setCurrentUser: 'auth/SET_USER',
}),
callbackEditSocialMedia(thisList, link) {
// Wolle this.editingLink = link
thisList.formData.socialMediaUrl = link.url
// try to set focus on link edit field
// thisList.$refs.socialMediaUrl.$el.focus()
// !!! Check for existenz
// this.$scopedSlots.default()[0].context.$refs
@ -139,7 +139,6 @@ export default {
})
thisList.$toast.success(successMessage)
// Wolle ??? thisList.formData.socialMediaUrl = ''
return true
} catch (err) {