mirror of
https://github.com/Ocelot-Social-Community/Ocelot-Social.git
synced 2025-12-13 07:46:06 +00:00
Rename prop 'user' of 'profile-avatar' to 'profile'
This commit is contained in:
parent
615ee2991a
commit
5f43a51c6a
@ -11,7 +11,7 @@
|
||||
"
|
||||
@click.prevent="toggleMenu"
|
||||
>
|
||||
<profile-avatar :user="user" size="small" />
|
||||
<profile-avatar :profile="user" size="small" />
|
||||
<base-icon class="dropdown-arrow" name="angle-down" />
|
||||
</a>
|
||||
</template>
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
</div>
|
||||
<div v-else :class="[{ 'disabled-content': user.disabled }]" placement="top-start">
|
||||
<nuxt-link :to="userLink" :class="['user-teaser']">
|
||||
<profile-avatar v-if="showAvatar" :user="user" size="small" />
|
||||
<profile-avatar v-if="showAvatar" :profile="user" size="small" />
|
||||
<div class="info">
|
||||
<span class="text">
|
||||
<span class="slug">{{ userSlug }}</span>
|
||||
|
||||
@ -23,39 +23,39 @@ describe('ProfileAvatar', () => {
|
||||
expect(wrapper.find(BaseIcon).exists()).toBe(true)
|
||||
})
|
||||
|
||||
describe('given a user', () => {
|
||||
describe('given a profile', () => {
|
||||
describe('with no image', () => {
|
||||
beforeEach(() => {
|
||||
propsData = {
|
||||
user: {
|
||||
profile: {
|
||||
name: 'Matt Rider',
|
||||
},
|
||||
}
|
||||
wrapper = Wrapper()
|
||||
})
|
||||
|
||||
describe('no user name', () => {
|
||||
describe('no profile name', () => {
|
||||
it('renders an icon', () => {
|
||||
propsData = { user: { name: null } }
|
||||
propsData = { profile: { name: null } }
|
||||
wrapper = Wrapper()
|
||||
expect(wrapper.find(BaseIcon).exists()).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
describe("user name is 'Anonymous'", () => {
|
||||
describe("profile name is 'Anonymous'", () => {
|
||||
it('renders an icon', () => {
|
||||
propsData = { user: { name: 'Anonymous' } }
|
||||
propsData = { profile: { name: 'Anonymous' } }
|
||||
wrapper = Wrapper()
|
||||
expect(wrapper.find(BaseIcon).exists()).toBe(true)
|
||||
})
|
||||
})
|
||||
|
||||
it('displays user initials', () => {
|
||||
it('displays profile initials', () => {
|
||||
expect(wrapper.find('.initials').text()).toEqual('MR')
|
||||
})
|
||||
|
||||
it('displays no more than 3 initials', () => {
|
||||
propsData = { user: { name: 'Ana Paula Nunes Marques' } }
|
||||
propsData = { profile: { name: 'Ana Paula Nunes Marques' } }
|
||||
wrapper = Wrapper()
|
||||
expect(wrapper.find('.initials').text()).toEqual('APN')
|
||||
})
|
||||
@ -64,7 +64,7 @@ describe('ProfileAvatar', () => {
|
||||
describe('with a relative avatar url', () => {
|
||||
beforeEach(() => {
|
||||
propsData = {
|
||||
user: {
|
||||
profile: {
|
||||
name: 'Not Anonymous',
|
||||
avatar: {
|
||||
url: '/avatar.jpg',
|
||||
@ -82,7 +82,7 @@ describe('ProfileAvatar', () => {
|
||||
describe('with an absolute avatar url', () => {
|
||||
beforeEach(() => {
|
||||
propsData = {
|
||||
user: {
|
||||
profile: {
|
||||
name: 'Not Anonymous',
|
||||
avatar: {
|
||||
url: 'https://s3.amazonaws.com/uifaces/faces/twitter/sawalazar/128.jpg',
|
||||
|
||||
@ -31,47 +31,47 @@ storiesOf('ProfileAvatar', module)
|
||||
data: () => ({
|
||||
user: userWithAvatar,
|
||||
}),
|
||||
template: '<profile-avatar :user="user" />',
|
||||
template: '<profile-avatar :profile="user" />',
|
||||
}))
|
||||
.add('normal without image, anonymous user', () => ({
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: anonymousUser,
|
||||
}),
|
||||
template: '<profile-avatar :user="user" />',
|
||||
template: '<profile-avatar :profile="user" />',
|
||||
}))
|
||||
.add('normal without image, user initials', () => ({
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithoutAvatar,
|
||||
}),
|
||||
template: '<profile-avatar :user="user" />',
|
||||
template: '<profile-avatar :profile="user" />',
|
||||
}))
|
||||
.add('small, with image', () => ({
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithAvatar,
|
||||
}),
|
||||
template: '<profile-avatar :user="user" size="small"/>',
|
||||
template: '<profile-avatar :profile="user" size="small"/>',
|
||||
}))
|
||||
.add('small', () => ({
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithoutAvatar,
|
||||
}),
|
||||
template: '<profile-avatar :user="user" size="small"/>',
|
||||
template: '<profile-avatar :profile="user" size="small"/>',
|
||||
}))
|
||||
.add('large, with image', () => ({
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithAvatar,
|
||||
}),
|
||||
template: '<profile-avatar :user="user" size="large"/>',
|
||||
template: '<profile-avatar :profile="user" size="large"/>',
|
||||
}))
|
||||
.add('large', () => ({
|
||||
components: { ProfileAvatar },
|
||||
data: () => ({
|
||||
user: userWithoutAvatar,
|
||||
}),
|
||||
template: '<profile-avatar :user="user" size="large"/>',
|
||||
template: '<profile-avatar :profile="user" size="large"/>',
|
||||
}))
|
||||
|
||||
@ -5,10 +5,10 @@
|
||||
<base-icon v-if="isAnonymous" name="eye-slash" />
|
||||
<img
|
||||
v-if="isAvatar"
|
||||
:src="user.avatar | proxyApiUrl"
|
||||
:src="profile.avatar | proxyApiUrl"
|
||||
class="image"
|
||||
:alt="user.name"
|
||||
:title="user.name"
|
||||
:alt="profile.name"
|
||||
:title="profile.name"
|
||||
@error="$event.target.style.display = 'none'"
|
||||
/>
|
||||
</div>
|
||||
@ -25,23 +25,23 @@ export default {
|
||||
return value.match(/(small|large)/)
|
||||
},
|
||||
},
|
||||
user: {
|
||||
profile: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
isAnonymous() {
|
||||
return !this.user || !this.user.name || this.user.name.toLowerCase() === 'anonymous'
|
||||
return !this.profile || !this.profile.name || this.profile.name.toLowerCase() === 'anonymous'
|
||||
},
|
||||
isAvatar() {
|
||||
// TODO may we could test as well if the image is reachable? otherwise the background gets white and the initails can not be read
|
||||
return this.user && this.user.avatar
|
||||
return this.profile && this.profile.avatar
|
||||
},
|
||||
userInitials() {
|
||||
if (this.isAnonymous) return ''
|
||||
|
||||
return this.user.name.match(/\b\w/g).join('').substring(0, 3).toUpperCase()
|
||||
return this.profile.name.match(/\b\w/g).join('').substring(0, 3).toUpperCase()
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
@ -8,9 +8,9 @@
|
||||
style="position: relative; height: auto; overflow: visible"
|
||||
>
|
||||
<avatar-uploader v-if="isMyGroup" :profile="group">
|
||||
<!-- Wolle: <profile-avatar :user="user" class="profile-page-avatar" size="large"></profile-avatar> -->
|
||||
<!-- Wolle: <profile-avatar :profile="user" class="profile-page-avatar" size="large" /> -->
|
||||
</avatar-uploader>
|
||||
<!-- Wolle: <profile-avatar v-else :user="user" class="profile-page-avatar" size="large" /> -->
|
||||
<!-- Wolle: <profile-avatar v-else :profile="user" class="profile-page-avatar" size="large" /> -->
|
||||
<!-- Menu -->
|
||||
<!-- Wolle: <client-only>
|
||||
<content-menu
|
||||
|
||||
@ -8,9 +8,9 @@
|
||||
style="position: relative; height: auto; overflow: visible"
|
||||
>
|
||||
<avatar-uploader v-if="myProfile" :profile="user">
|
||||
<profile-avatar :user="user" class="profile-page-avatar" size="large"></profile-avatar>
|
||||
<profile-avatar :profile="user" class="profile-page-avatar" size="large" />
|
||||
</avatar-uploader>
|
||||
<profile-avatar v-else :user="user" class="profile-page-avatar" size="large" />
|
||||
<profile-avatar v-else :profile="user" class="profile-page-avatar" size="large" />
|
||||
<!-- Menu -->
|
||||
<client-only>
|
||||
<content-menu
|
||||
|
||||
@ -28,7 +28,7 @@
|
||||
params: { id: scope.row.id, slug: scope.row.slug },
|
||||
}"
|
||||
>
|
||||
<profile-avatar :user="scope.row" size="small" />
|
||||
<profile-avatar :profile="scope.row" size="small" />
|
||||
</nuxt-link>
|
||||
</template>
|
||||
<template #name="scope">
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
params: { id: scope.row.id, slug: scope.row.slug },
|
||||
}"
|
||||
>
|
||||
<profile-avatar :user="scope.row" size="small" />
|
||||
<profile-avatar :profile="scope.row" size="small" />
|
||||
</nuxt-link>
|
||||
</template>
|
||||
<template #name="scope">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user