diff --git a/src/components/status/status.js b/src/components/status/status.js index aaac5b71..2004b5cc 100644 --- a/src/components/status/status.js +++ b/src/components/status/status.js @@ -5,6 +5,7 @@ import DeleteButton from '../delete_button/delete_button.vue' import PostStatusForm from '../post_status_form/post_status_form.vue' import UserCardContent from '../user_card_content/user_card_content.vue' import StillImage from '../still-image/still-image.vue' +import UserAvatar from '../user_avatar/user_avatar.vue' import Gallery from '../gallery/gallery.vue' import LinkPreview from '../link-preview/link-preview.vue' import generateProfileLink from 'src/services/user_profile_link_generator/user_profile_link_generator' @@ -245,6 +246,7 @@ const Status = { PostStatusForm, UserCardContent, StillImage, + UserAvatar, Gallery, LinkPreview }, diff --git a/src/components/status/status.vue b/src/components/status/status.vue index c6e73e4e..5611d8d2 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -25,7 +25,7 @@
- +
diff --git a/src/components/still-image/still-image.js b/src/components/still-image/still-image.js index 5ad06dc2..8f3a7206 100644 --- a/src/components/still-image/still-image.js +++ b/src/components/still-image/still-image.js @@ -2,7 +2,8 @@ const StillImage = { props: [ 'src', 'referrerpolicy', - 'mimetype' + 'mimetype', + 'imageLoadError' ], data () { return { diff --git a/src/components/still-image/still-image.vue b/src/components/still-image/still-image.vue index 1dcb7ce6..29c59e42 100644 --- a/src/components/still-image/still-image.vue +++ b/src/components/still-image/still-image.vue @@ -1,7 +1,7 @@ diff --git a/src/components/user_avatar/user_avatar.js b/src/components/user_avatar/user_avatar.js new file mode 100644 index 00000000..bfa2c2b5 --- /dev/null +++ b/src/components/user_avatar/user_avatar.js @@ -0,0 +1,28 @@ +import StillImage from '../still-image/still-image.vue' +import nsfwImage from '../../assets/nsfw.png' + +const UserAvatar = { + props: [ + 'src' + ], + data () { + return { + showPlaceholder: false + } + }, + components: { + StillImage + }, + computed: { + imgSrc () { + return this.showPlaceholder ? nsfwImage : this.src + } + }, + methods: { + imageLoadError () { + this.showPlaceholder = true + } + } +} + +export default UserAvatar diff --git a/src/components/user_avatar/user_avatar.vue b/src/components/user_avatar/user_avatar.vue new file mode 100644 index 00000000..75a857ac --- /dev/null +++ b/src/components/user_avatar/user_avatar.vue @@ -0,0 +1,5 @@ + + +