mirror of
https://github.com/IT4Change/Ocelot-Social.git
synced 2025-12-13 07:45:56 +00:00
fix(webapp): fix admin badges settings (#8438)
* Remove proxy from nuxt.config, instead add proxy filter * Show message when there are no badges
This commit is contained in:
parent
3c853d5737
commit
ba0cc147e7
@ -21,26 +21,41 @@ const badge2 = {
|
|||||||
describe('Admin/BadgesSection', () => {
|
describe('Admin/BadgesSection', () => {
|
||||||
let wrapper
|
let wrapper
|
||||||
|
|
||||||
const Wrapper = () => {
|
const Wrapper = (withBadges = true) => {
|
||||||
return render(BadgesSection, {
|
return render(BadgesSection, {
|
||||||
localVue,
|
localVue,
|
||||||
propsData: {
|
propsData: {
|
||||||
badges: [badge1, badge2],
|
badges: withBadges ? [badge1, badge2] : [],
|
||||||
|
},
|
||||||
|
mocks: {
|
||||||
|
$t: jest.fn((t) => t),
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
beforeEach(() => {
|
describe('without badges', () => {
|
||||||
wrapper = Wrapper()
|
beforeEach(() => {
|
||||||
|
wrapper = Wrapper(false)
|
||||||
|
})
|
||||||
|
|
||||||
|
it('renders', () => {
|
||||||
|
expect(wrapper.baseElement).toMatchSnapshot()
|
||||||
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
it('renders', () => {
|
describe('with badges', () => {
|
||||||
expect(wrapper.baseElement).toMatchSnapshot()
|
beforeEach(() => {
|
||||||
})
|
wrapper = Wrapper(true)
|
||||||
|
})
|
||||||
|
|
||||||
it('emits toggleButton', async () => {
|
it('renders', () => {
|
||||||
const button = screen.getByAltText(badge1.description)
|
expect(wrapper.baseElement).toMatchSnapshot()
|
||||||
await fireEvent.click(button)
|
})
|
||||||
expect(wrapper.emitted().toggleBadge[0][0]).toEqual(badge1)
|
|
||||||
|
it('emits toggleButton', async () => {
|
||||||
|
const button = screen.getByAltText(badge1.description)
|
||||||
|
await fireEvent.click(button)
|
||||||
|
expect(wrapper.emitted().toggleBadge[0][0]).toEqual(badge1)
|
||||||
|
})
|
||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|||||||
@ -1,16 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="badge-section">
|
<div class="badge-section">
|
||||||
<h4>{{ title }}</h4>
|
<h4>{{ title }}</h4>
|
||||||
<div class="badge-container">
|
<div class="badge-container" v-if="badges.length > 0">
|
||||||
<button
|
<button
|
||||||
v-for="badge in badges"
|
v-for="badge in badges"
|
||||||
:key="badge.id"
|
:key="badge.id"
|
||||||
@click="toggleBadge(badge)"
|
@click="toggleBadge(badge)"
|
||||||
:class="{ badge, inactive: !badge.isActive }"
|
:class="{ badge, inactive: !badge.isActive }"
|
||||||
>
|
>
|
||||||
<img :src="badge.icon" :alt="badge.description" />
|
<img :src="badge.icon | proxyApiUrl" :alt="badge.description" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
{{ $t('admin.badges.noBadges') }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
exports[`Admin/BadgesSection renders 1`] = `
|
exports[`Admin/BadgesSection with badges renders 1`] = `
|
||||||
<body>
|
<body>
|
||||||
<div>
|
<div>
|
||||||
<div
|
<div
|
||||||
@ -34,3 +34,23 @@ exports[`Admin/BadgesSection renders 1`] = `
|
|||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
exports[`Admin/BadgesSection without badges renders 1`] = `
|
||||||
|
<body>
|
||||||
|
<div>
|
||||||
|
<div
|
||||||
|
class="badge-section"
|
||||||
|
>
|
||||||
|
<h4>
|
||||||
|
|
||||||
|
</h4>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
|
||||||
|
admin.badges.noBadges
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
`;
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": "Stelle die verfügbaren Auszeichnungen für diesen Nutzer ein.",
|
"description": "Stelle die verfügbaren Auszeichnungen für diesen Nutzer ein.",
|
||||||
|
"noBadges": "Keine Auszeichnungen vorhanden.",
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": "Trophäe konnte nicht widerrufen werden!",
|
"error": "Trophäe konnte nicht widerrufen werden!",
|
||||||
"success": "Trophäe erfolgreich widerrufen"
|
"success": "Trophäe erfolgreich widerrufen"
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": "Configure the available badges for this user",
|
"description": "Configure the available badges for this user",
|
||||||
|
"noBadges": "There are no badges available",
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": "Trophy could not be revoked!",
|
"error": "Trophy could not be revoked!",
|
||||||
"success": "Trophy successfully revoked!"
|
"success": "Trophy successfully revoked!"
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": null,
|
"description": null,
|
||||||
|
"noBadges": null,
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": null,
|
"error": null,
|
||||||
"success": null
|
"success": null
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": null,
|
"description": null,
|
||||||
|
"noBadges": null,
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": null,
|
"error": null,
|
||||||
"success": null
|
"success": null
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": null,
|
"description": null,
|
||||||
|
"noBadges": null,
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": null,
|
"error": null,
|
||||||
"success": null
|
"success": null
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": null,
|
"description": null,
|
||||||
|
"noBadges": null,
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": null,
|
"error": null,
|
||||||
"success": null
|
"success": null
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": null,
|
"description": null,
|
||||||
|
"noBadges": null,
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": null,
|
"error": null,
|
||||||
"success": null
|
"success": null
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": null,
|
"description": null,
|
||||||
|
"noBadges": null,
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": null,
|
"error": null,
|
||||||
"success": null
|
"success": null
|
||||||
|
|||||||
@ -12,6 +12,7 @@
|
|||||||
"admin": {
|
"admin": {
|
||||||
"badges": {
|
"badges": {
|
||||||
"description": null,
|
"description": null,
|
||||||
|
"noBadges": null,
|
||||||
"revokeTrophy": {
|
"revokeTrophy": {
|
||||||
"error": null,
|
"error": null,
|
||||||
"success": null
|
"success": null
|
||||||
|
|||||||
@ -207,15 +207,6 @@ export default {
|
|||||||
'X-API-TOKEN': CONFIG.BACKEND_TOKEN,
|
'X-API-TOKEN': CONFIG.BACKEND_TOKEN,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
'/img': {
|
|
||||||
// make this configurable (nuxt-dotenv)
|
|
||||||
target: CONFIG.GRAPHQL_URI,
|
|
||||||
toProxy: true, // cloudflare needs that
|
|
||||||
headers: {
|
|
||||||
'X-UI-Request': true,
|
|
||||||
'X-API-TOKEN': CONFIG.BACKEND_TOKEN,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
|
|
||||||
// Give apollo module options
|
// Give apollo module options
|
||||||
|
|||||||
@ -58,6 +58,11 @@ describe('.vue', () => {
|
|||||||
query: jest.fn(),
|
query: jest.fn(),
|
||||||
},
|
},
|
||||||
mutate: jest.fn(),
|
mutate: jest.fn(),
|
||||||
|
queries: {
|
||||||
|
Badge: {
|
||||||
|
loading: false,
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
$toast: {
|
$toast: {
|
||||||
success: jest.fn(),
|
success: jest.fn(),
|
||||||
|
|||||||
@ -8,7 +8,7 @@
|
|||||||
</ds-heading>
|
</ds-heading>
|
||||||
<ds-text>{{ $t('admin.badges.description') }}</ds-text>
|
<ds-text>{{ $t('admin.badges.description') }}</ds-text>
|
||||||
</ds-space>
|
</ds-space>
|
||||||
<base-card>
|
<base-card v-if="!isLoadingBadges">
|
||||||
<badges-section
|
<badges-section
|
||||||
:title="$t('admin.badges.verificationBadges')"
|
:title="$t('admin.badges.verificationBadges')"
|
||||||
:badges="verificationBadges"
|
:badges="verificationBadges"
|
||||||
@ -87,6 +87,9 @@ export default {
|
|||||||
isActive: this.user.badgeTrophies.some((userBadge) => userBadge.id === badge.id),
|
isActive: this.user.badgeTrophies.some((userBadge) => userBadge.id === badge.id),
|
||||||
}))
|
}))
|
||||||
},
|
},
|
||||||
|
isLoadingBadges() {
|
||||||
|
return this.$apollo.queries.Badge.loading
|
||||||
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
toggleBadge(badge) {
|
toggleBadge(badge) {
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user