refactor: rename empty component files and tags

This commit is contained in:
Javier López 2023-08-15 00:43:25 +02:00
parent 931b728c33
commit 8410972189
21 changed files with 62 additions and 62 deletions

View File

@ -2,5 +2,5 @@ import { Then } from "@badeball/cypress-cucumber-preprocessor";
Then("the list of posts of this user is empty", () => {
cy.get(".base-card").not(".post-link");
cy.get(".main-container").find(".ds-space.hc-empty");
cy.get(".main-container").find(".ds-space.empty");
});

View File

@ -38,7 +38,7 @@ describe('Empty.vue', () => {
it('renders that message', () => {
propsData.message = 'this is a custom message for Empty component'
wrapper = Wrapper()
expect(wrapper.find('.hc-empty-message').text()).toEqual(propsData.message)
expect(wrapper.find('.empty-message').text()).toEqual(propsData.message)
})
})
@ -46,7 +46,7 @@ describe('Empty.vue', () => {
it('sets margin to that margin', () => {
propsData.margin = 'xxx-small'
wrapper = Wrapper()
expect(wrapper.find('.hc-empty').attributes().margin).toEqual(propsData.margin)
expect(wrapper.find('.empty').attributes().margin).toEqual(propsData.margin)
})
})
})

View File

@ -1,6 +1,6 @@
import { storiesOf } from '@storybook/vue'
import { withA11y } from '@storybook/addon-a11y'
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
import helpers from '~/storybook/helpers'
helpers.init()
@ -11,14 +11,14 @@ storiesOf('Empty', module)
.add(
'tasks icon with message',
() => ({
components: { HcEmpty },
template: '<hc-empty icon="tasks" message="Sorry, there are no ... available." />',
components: { Empty },
template: '<empty icon="tasks" message="Sorry, there are no ... available." />',
}),
{
notes: "Possible icons include 'messages', 'events', 'alert', 'tasks', 'docs', and 'file'",
},
)
.add('default icon, no message', () => ({
components: { HcEmpty },
template: '<hc-empty />',
components: { Empty },
template: '<empty />',
}))

View File

@ -1,15 +1,15 @@
<template>
<ds-space class="hc-empty" centered :margin="margin">
<ds-space class="empty" centered :margin="margin">
<ds-text>
<img
:src="iconPath"
width="80"
class="hc-empty-icon"
class="empty-icon"
style="margin-bottom: 5px"
alt="Empty"
/>
<br />
<ds-text v-show="message" class="hc-empty-message" color="softer">
<ds-text v-show="message" class="empty-message" color="softer">
{{ message }}
</ds-text>
</ds-text>
@ -18,7 +18,7 @@
<script>
export default {
name: 'HcEmpty',
name: 'Empty',
props: {
/**
* Icon that should be shown
@ -55,7 +55,7 @@ export default {
</script>
<style lang="scss">
.hc-empty-icon {
.empty-icon {
padding-bottom: $font-space-large;
}
</style>

View File

@ -48,8 +48,8 @@ describe('NotificationsTable.vue', () => {
})
describe('no notifications', () => {
it('renders HcEmpty component', () => {
expect(wrapper.find('.hc-empty').exists()).toBe(true)
it('renders Empty component', () => {
expect(wrapper.find('.empty').exists()).toBe(true)
})
})

View File

@ -97,11 +97,11 @@
</ds-grid-item>
</ds-grid>
</div>
<hc-empty v-else icon="alert" :message="$t('notifications.empty')" />
<empty v-else icon="alert" :message="$t('notifications.empty')" />
</template>
<script>
import UserTeaser from '~/components/UserTeaser/UserTeaser'
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
import BaseCard from '../_new/generic/BaseCard/BaseCard.vue'
import mobile from '~/mixins/mobile'
@ -110,7 +110,7 @@ const maxMobileWidth = 768 // at this point the table breaks down
export default {
components: {
UserTeaser,
HcEmpty,
Empty,
BaseCard,
},
mixins: [mobile(maxMobileWidth)],

View File

@ -1,18 +1,18 @@
<template>
<ds-space centered>
<hc-empty icon="events" :message="$t('components.registration.signup.unavailable')" />
<empty icon="events" :message="$t('components.registration.signup.unavailable')" />
<slot></slot>
<ds-space margin="xxx-small" />
</ds-space>
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
export default {
name: 'RegistrationSlideNoPublic',
components: {
HcEmpty,
Empty,
},
props: {
sliderData: { type: Object, required: true },

View File

@ -50,8 +50,8 @@ describe('SearchResults', () => {
describe('searchResults', () => {
describe('contains no results', () => {
it('renders hc-empty component', () => {
expect(wrapper.find('.hc-empty').exists()).toBe(true)
it('renders empty component', () => {
expect(wrapper.find('.empty').exists()).toBe(true)
})
})

View File

@ -98,7 +98,7 @@
<!-- no results -->
<ds-grid-item v-else :row-span="7" column-span="fullWidth">
<ds-space centered>
<hc-empty icon="tasks" :message="$t('search.no-results', { search })" />
<empty icon="tasks" :message="$t('search.no-results', { search })" />
</ds-space>
</ds-grid-item>
</masonry-grid>
@ -109,7 +109,7 @@
<script>
import postListActions from '~/mixins/postListActions'
import { searchPosts, searchUsers, searchGroups, searchHashtags } from '~/graphql/Search.js'
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
import MasonryGrid from '~/components/MasonryGrid/MasonryGrid'
import MasonryGridItem from '~/components/MasonryGrid/MasonryGridItem'
import PostTeaser from '~/components/PostTeaser/PostTeaser'
@ -123,7 +123,7 @@ export default {
name: 'SearchResults',
components: {
TabNavigation,
HcEmpty,
Empty,
MasonryGrid,
MasonryGridItem,
PostTeaser,

View File

@ -1,7 +1,7 @@
import faker from '@faker-js/faker'
import { storiesOf } from '@storybook/vue'
import { withA11y } from '@storybook/addon-a11y'
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
import MasonryGrid from '~/components/MasonryGrid/MasonryGrid'
import MasonryGridItem from '~/components/MasonryGrid/MasonryGridItem'
import PostTeaser from '~/components/PostTeaser/PostTeaser'
@ -66,7 +66,7 @@ storiesOf('TabNavigator', module)
.add('given search results of posts, users, hashtags', () => ({
components: {
TabNavigation,
HcEmpty,
Empty,
MasonryGrid,
MasonryGridItem,
PostTeaser,
@ -178,7 +178,7 @@ storiesOf('TabNavigator', module)
<!-- no results -->
<ds-grid-item v-else :row-span="7" column-span="fullWidth">
<ds-space centered>
<hc-empty icon="tasks" :message="$t('search.no-results', { search })" />
<empty icon="tasks" :message="$t('search.no-results', { search })" />
</ds-space>
</ds-grid-item>
</masonry-grid>

View File

@ -28,16 +28,16 @@
<report-row :key="report.id" :report="report" @confirm-report="$emit('confirm', report)" />
</template>
</table>
<hc-empty v-else icon="alert" :message="$t('moderation.reports.empty')" />
<empty v-else icon="alert" :message="$t('moderation.reports.empty')" />
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
import ReportRow from '~/components/features/ReportRow/ReportRow'
export default {
components: {
HcEmpty,
Empty,
ReportRow,
},
props: {

View File

@ -1,16 +1,16 @@
<template>
<base-card>
<h2 class="title">{{ $t('admin.notifications.name') }}</h2>
<hc-empty icon="tasks" message="Coming Soon…" />
<empty icon="tasks" message="Coming Soon…" />
</base-card>
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
export default {
components: {
HcEmpty,
Empty,
},
}
</script>

View File

@ -1,16 +1,16 @@
<template>
<base-card>
<h2 class="title">{{ $t('admin.organizations.name') }}</h2>
<hc-empty icon="tasks" message="Coming Soon…" />
<empty icon="tasks" message="Coming Soon…" />
</base-card>
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
export default {
components: {
HcEmpty,
Empty,
},
}
</script>

View File

@ -1,16 +1,16 @@
<template>
<base-card>
<h2 class="title">{{ $t('admin.pages.name') }}</h2>
<hc-empty icon="tasks" message="Coming Soon…" />
<empty icon="tasks" message="Coming Soon…" />
</base-card>
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
export default {
components: {
HcEmpty,
Empty,
},
}
</script>

View File

@ -1,16 +1,16 @@
<template>
<base-card>
<h2 class="title">{{ $t('admin.settings.name') }}</h2>
<hc-empty icon="tasks" message="Coming Soon…" />
<empty icon="tasks" message="Coming Soon…" />
</base-card>
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
export default {
components: {
HcEmpty,
Empty,
},
}
</script>

View File

@ -121,7 +121,7 @@
</template>
<template v-else>
<ds-grid-item :row-span="2" column-span="fullWidth">
<hc-empty icon="docs" />
<empty icon="docs" />
<ds-text align="center">{{ $t('index.no-results') }}</ds-text>
<ds-text align="center">{{ $t('index.change-filter-settings') }}</ds-text>
</ds-grid-item>
@ -140,7 +140,7 @@ import postListActions from '~/mixins/postListActions'
import mobile from '~/mixins/mobile'
import DonationInfo from '~/components/DonationInfo/DonationInfo.vue'
import HashtagsFilter from '~/components/HashtagsFilter/HashtagsFilter.vue'
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
import PostTeaser from '~/components/PostTeaser/PostTeaser.vue'
import MasonryGrid from '~/components/MasonryGrid/MasonryGrid.vue'
import MasonryGridItem from '~/components/MasonryGrid/MasonryGridItem.vue'
@ -158,7 +158,7 @@ export default {
DonationInfo,
HashtagsFilter,
PostTeaser,
HcEmpty,
Empty,
MasonryGrid,
MasonryGridItem,
FilterMenuComponent,

View File

@ -168,7 +168,7 @@
</template>
<template v-else>
<ds-grid-item column-span="fullWidth">
<hc-empty margin="xx-large" icon="file" />
<empty margin="xx-large" icon="file" />
</ds-grid-item>
</template>
</masonry-grid>
@ -189,7 +189,7 @@ import HcFollowButton from '~/components/Button/FollowButton'
import HcCountTo from '~/components/CountTo.vue'
import HcBadges from '~/components/Badges.vue'
import FollowList, { followListVisibleCount } from '~/components/features/ProfileList/FollowList'
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
import ContentMenu from '~/components/ContentMenu/ContentMenu'
import AvatarUploader from '~/components/Uploader/AvatarUploader'
import ProfileAvatar from '~/components/_new/generic/ProfileAvatar/ProfileAvatar'
@ -218,7 +218,7 @@ export default {
HcFollowButton,
HcCountTo,
HcBadges,
HcEmpty,
Empty,
ProfileAvatar,
ContentMenu,
AvatarUploader,

View File

@ -90,7 +90,7 @@ describe('Registration', () => {
it('no "method" query in URI show "RegistrationSlideNoPublic"', async () => {
mocks.$route.query = {}
wrapper = await Wrapper()
expect(wrapper.find('.hc-empty').exists()).toBe(true)
expect(wrapper.find('.empty').exists()).toBe(true)
expect(wrapper.find('.enter-invite').exists()).toBe(false)
expect(wrapper.find('.enter-email').exists()).toBe(false)
})
@ -127,13 +127,13 @@ describe('Registration', () => {
it('no "inviteCode" query in URI', async () => {
mocks.$route.query = { method: 'invite-code' }
wrapper = await Wrapper()
expect(wrapper.find('.hc-empty').exists()).toBe(true)
expect(wrapper.find('.empty').exists()).toBe(true)
})
it('"inviteCode=ABCDEF" query in URI', async () => {
mocks.$route.query = { method: 'invite-code', inviteCode: 'ABCDEF' }
wrapper = await Wrapper()
expect(wrapper.find('.hc-empty').exists()).toBe(true)
expect(wrapper.find('.empty').exists()).toBe(true)
})
})
})

View File

@ -1,16 +1,16 @@
<template>
<base-card>
<h2 class="title">{{ $t('settings.invites.name') }}</h2>
<hc-empty icon="tasks" message="Coming Soon…" />
<empty icon="tasks" message="Coming Soon…" />
</base-card>
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
export default {
components: {
HcEmpty,
Empty,
},
}
</script>

View File

@ -1,16 +1,16 @@
<template>
<base-card>
<h2 class="title">{{ $t('settings.languages.name') }}</h2>
<hc-empty icon="tasks" message="Coming Soon…" />
<empty icon="tasks" message="Coming Soon…" />
</base-card>
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
export default {
components: {
HcEmpty,
Empty,
},
}
</script>

View File

@ -1,16 +1,16 @@
<template>
<base-card>
<h2 class="title">{{ $t('settings.organizations.name') }}</h2>
<hc-empty icon="tasks" message="Coming Soon…" />
<empty icon="tasks" message="Coming Soon…" />
</base-card>
</template>
<script>
import HcEmpty from '~/components/Empty/Empty'
import Empty from '~/components/Empty/Empty'
export default {
components: {
HcEmpty,
Empty,
},
}
</script>