ocelot-Social-Community/Ocelot-Social
1
0
Fork 0
mirror of https://github.com/Ocelot-Social-Community/Ocelot-Social.git synced 2025-12-13 07:46:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #5590 from Ocelot-Social-Community/5545-Footer-And-Header-Links-Configurable

Browse Source 
feat: 🍰 Footer And Header Links Configurable To Have External Link Target
This commit is contained in:
Wolfgang Huß 2022-10-28 13:46:02 +02:00 committed by GitHub
commit 7f26c0184a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 128 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
webapp/components/Group/GroupMember.vue
View File

@ -87,12 +87,7 @@
</ds-chip>
</template>
<template #edit="scope">
<ds-button
v-if="scope.row.myRoleInGroup !== 'owner'"
size="small"
primary
@click="deleteMember(scope.row.id)"
>
<ds-button v-if="scope.row.myRoleInGroup !== 'owner'" size="small" primary disabled>
<!-- TODO: implement removal of group members -->
<!-- :disabled="scope.row.myRoleInGroup === 'owner'"
-->
@ -221,14 +216,6 @@ export default {
} finally {
}
},
// TODO: implement removal of group members
// openModal(row) {
// this.isOpen = true
// this.memberId = row.id
// },
deleteMember(id) {
alert('deleteMember: ' + id)
},
},
}
</script>

25
webapp/components/HeaderMenu/HeaderMenu.vue
View File

@ -28,7 +28,7 @@
:width="{ base: 'auto' }"
style="margin-right: 20px"
>
<a v-if="item.url" :href="item.url" target="_blank">
<a v-if="item.url" :href="item.url" :target="item.target">
<ds-text size="large" bold>
{{ $t(item.nameIdent) }}
</ds-text>
@ -78,8 +78,12 @@
<invite-button placement="top" />
</client-only>
</div>
<client-only>
<!-- group button -->
<client-only v-if="SHOW_GROUP_BUTTON_IN_HEADER">
<group-button />
</client-only>
<!-- avatar-menu -->
<client-only>
<avatar-menu placement="top" />
</client-only>
</template>
@ -154,9 +158,18 @@
<invite-button placement="top" />
</client-only>
</ds-flex-item>
<!-- group button -->
<ds-flex-item
:class="{ 'hide-mobile-menu': !toggleMobileMenu }"
style="text-align: center"
>
<client-only v-if="SHOW_GROUP_BUTTON_IN_HEADER">
<group-button />
</client-only>
</ds-flex-item>
<!-- avatar-menu mobile-->
<ds-flex-item :class="{ 'hide-mobile-menu': !toggleMobileMenu }" style="text-align: end">
<client-only>
<!-- avatar-menu mobile-->
<avatar-menu placement="top" />
</client-only>
</ds-flex-item>
@ -165,7 +178,7 @@
<!-- dynamic branding menu -->
<ul v-if="isHeaderMenu" class="dynamic-branding-mobil">
<li v-for="item in menu" :key="item.name">
<a v-if="item.url" :href="item.url" target="_blank">
<a v-if="item.url" :href="item.url" :target="item.target">
<ds-text size="large" bold>
{{ $t(item.nameIdent) }}
</ds-text>
@ -193,10 +206,12 @@
</template>
<script>
import { mapGetters } from 'vuex'
import { SHOW_GROUP_BUTTON_IN_HEADER } from '~/constants/groups.js'
import LOGOS from '~/constants/logos.js'
import headerMenu from '~/constants/headerMenu.js'
import AvatarMenu from '~/components/AvatarMenu/AvatarMenu'
import FilterMenu from '~/components/FilterMenu/FilterMenu.vue'
import GroupButton from '~/components/Group/GroupButton'
import InviteButton from '~/components/InviteButton/InviteButton'
import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
import Logo from '~/components/Logo/Logo'
@ -209,6 +224,7 @@ export default {
components: {
AvatarMenu,
FilterMenu,
GroupButton,
InviteButton,
LocaleSwitch,
Logo,
@ -223,6 +239,7 @@ export default {
return {
links,
LOGOS,
SHOW_GROUP_BUTTON_IN_HEADER,
isHeaderMenu: headerMenu.MENU.length > 0,
menu: headerMenu.MENU,
mobileSearchVisible: false,

32
webapp/components/PageFooter/PageFooter.spec.js
View File

@ -100,21 +100,41 @@ describe('PageFooter.vue', () => {
const links = {
...linksDefault,
ORGANIZATION: linksDefault.ORGANIZATION.overwrite({
externalLink: 'https://ocelot.social',
externalLink: {
url: 'https://ocelot.social',
target: '_blank',
},
}),
IMPRINT: linksDefault.IMPRINT.overwrite({
externalLink: 'https://ocelot.social/IMPRINT',
externalLink: {
url: 'https://ocelot.social/IMPRINT',
target: '_blank',
},
}),
TERMS_AND_CONDITIONS: linksDefault.TERMS_AND_CONDITIONS.overwrite({
externalLink: 'https://ocelot.social/TERMS_AND_CONDITIONS',
externalLink: {
url: 'https://ocelot.social/TERMS_AND_CONDITIONS',
target: '_blank',
},
}),
CODE_OF_CONDUCT: linksDefault.CODE_OF_CONDUCT.overwrite({
externalLink: 'https://ocelot.social/CODE_OF_CONDUCT',
externalLink: {
url: 'https://ocelot.social/CODE_OF_CONDUCT',
target: '_blank',
},
}),
DATA_PRIVACY: linksDefault.DATA_PRIVACY.overwrite({
externalLink: 'https://ocelot.social/DATA_PRIVACY',
externalLink: {
url: 'https://ocelot.social/DATA_PRIVACY',
target: '_blank',
},
}),
FAQ: linksDefault.FAQ.overwrite({
externalLink: {
url: 'https://ocelot.social/FAQ',
target: '_blank',
},
}),
FAQ: linksDefault.FAQ.overwrite({ externalLink: 'https://ocelot.social/FAQ' }),
}
wrapper = Wrapper()
wrapper.setData({ links })

7
webapp/components/_new/features/PageParamsLink/PageParamsLink.vue
View File

@ -6,7 +6,12 @@
>
<slot />
</nuxt-link>
<a v-else :href="pageParams.externalLink" target="_blank" :data-test="pageParams.name + '-link'">
<a
v-else
:href="pageParams.externalLink.url"
:target="pageParams.externalLink.target"
:data-test="pageParams.name + '-link'"
>
<slot />
</a>
</template>

48
webapp/components/utils/InternalPages.js
View File

@ -4,7 +4,11 @@ export const defaultPageParamsPages = {
ORGANIZATION: new PageParams({
name: 'organization',
externalLink: null, // if string is defined and not empty it's dominating
// externalLink: {
// url: 'https://ocelot.social',
// target: '_blank',
// },
externalLink: null, // if defined it's dominating
internalPage: {
pageRoute: '/organization', // static, don't change! internal page in case no external is defined
@ -21,7 +25,11 @@ export const defaultPageParamsPages = {
DONATE: new PageParams({
name: 'donate',
externalLink: null, // if string is defined and not empty it's dominating
// externalLink: {
// url: 'https://ocelot.social',
// target: '_blank',
// },
externalLink: null, // if defined it's dominating
internalPage: {
pageRoute: '/donate', // static, don't change! internal page in case no external is defined
@ -38,7 +46,11 @@ export const defaultPageParamsPages = {
IMPRINT: new PageParams({
name: 'imprint',
externalLink: null, // if string is defined and not empty it's dominating
// externalLink: {
// url: 'https://ocelot.social',
// target: '_blank',
// },
externalLink: null, // if defined it's dominating
internalPage: {
pageRoute: '/imprint', // static, don't change! internal page in case no external is defined
@ -55,7 +67,11 @@ export const defaultPageParamsPages = {
TERMS_AND_CONDITIONS: new PageParams({
name: 'terms-and-conditions',
externalLink: null, // if string is defined and not empty it's dominating
// externalLink: {
// url: 'https://ocelot.social',
// target: '_blank',
// },
externalLink: null, // if defined it's dominating
internalPage: {
pageRoute: '/terms-and-conditions', // static, don't change! internal page in case no external is defined
@ -72,7 +88,11 @@ export const defaultPageParamsPages = {
CODE_OF_CONDUCT: new PageParams({
name: 'code-of-conduct',
externalLink: null, // if string is defined and not empty it's dominating
// externalLink: {
// url: 'https://ocelot.social',
// target: '_blank',
// },
externalLink: null, // if defined it's dominating
internalPage: {
pageRoute: '/code-of-conduct', // static, don't change! internal page in case no external is defined
@ -89,7 +109,11 @@ export const defaultPageParamsPages = {
DATA_PRIVACY: new PageParams({
name: 'data-privacy',
externalLink: null, // if string is defined and not empty it's dominating
// externalLink: {
// url: 'https://ocelot.social',
// target: '_blank',
// },
externalLink: null, // if defined it's dominating
internalPage: {
pageRoute: '/data-privacy', // static, don't change! internal page in case no external is defined
@ -106,7 +130,11 @@ export const defaultPageParamsPages = {
FAQ: new PageParams({
name: 'faq',
externalLink: null, // if string is defined and not empty it's dominating
// externalLink: {
// url: 'https://ocelot.social',
// target: '_blank',
// },
externalLink: null, // if defined it's dominating
internalPage: {
pageRoute: '/faq', // static, don't change! internal page in case no external is defined
@ -123,7 +151,11 @@ export const defaultPageParamsPages = {
SUPPORT: new PageParams({
name: 'support',
externalLink: null,
// externalLink: {
// url: 'https://ocelot.social',
// target: '_blank',
// },
externalLink: null, // if defined it's dominating
internalPage: {
pageRoute: '/support', // static, don't change '*/support'! internal page in case no external is defined

10
webapp/components/utils/PageParams.js
View File

@ -24,18 +24,22 @@ export class PageParams {
}
get isInternalPage() {
return this.noStringDefined(this.externalLink)
return !(this.externalLink && !this.noStringDefined(this.externalLink.url))
}
get link() {
return this.isInternalPage ? this.internalPage.pageRoute : this.externalLink
return this.isInternalPage ? this.internalPage.pageRoute : this.externalLink.url
}
redirectToPage(thisComponent) {
if (this.isInternalPage) {
thisComponent.$router.push(this.internalPage.pageRoute)
} else if (typeof window !== 'undefined') {
window.location.href = this.externalLink
if (this.externalLink.target === '_blank') {
window.open(this.externalLink.url, this.externalLink.target)
} else {
window.location.href = this.externalLink.url
}
}
}
}

1
webapp/constants/headerMenu.js
View File

@ -7,6 +7,7 @@ export default {
// {
// nameIdent: 'nameIdent',
// url: 'https://ocelot.social',
// target: '_blank',
// },
],
}

31
webapp/constants/links.js
View File

@ -3,7 +3,11 @@
import { defaultPageParamsPages } from '~/components/utils/InternalPages.js'
const ORGANIZATION = defaultPageParamsPages.ORGANIZATION.overwrite({
externalLink: 'https://ocelot.social', // if string is defined and not empty it's dominating
// if defined it's dominating
externalLink: {
url: 'https://ocelot.social',
target: '_blank',
},
internalPage: {
// footerIdent: 'site.made', // localized string identifier, if undefined default is used
@ -16,8 +20,12 @@ const ORGANIZATION = defaultPageParamsPages.ORGANIZATION.overwrite({
},
})
const DONATE = defaultPageParamsPages.DONATE.overwrite({
// if defined it's dominating
externalLink: {
// we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
externalLink: 'https://ocelot-social.herokuapp.com/donations', // if string is defined and not empty it's dominating
url: 'https://ocelot-social.herokuapp.com/donations',
target: '_blank',
},
internalPage: {
// footerIdent: 'site.donate', // localized string identifier, if undefined default is used
@ -30,8 +38,11 @@ const DONATE = defaultPageParamsPages.DONATE.overwrite({
},
})
const IMPRINT = defaultPageParamsPages.IMPRINT.overwrite({
externalLink: {
// we use 'ocelot-social.herokuapp.com' at the moment, because redirections of 'ocelot.social' subpages are not working correctly
externalLink: 'https://ocelot-social.herokuapp.com/imprint', // if string is defined and not empty it's dominating
url: 'https://ocelot-social.herokuapp.com/imprint',
target: '_blank',
},
internalPage: {
// footerIdent: 'site.imprint', // localized string identifier, if undefined default is used
@ -44,7 +55,7 @@ const IMPRINT = defaultPageParamsPages.IMPRINT.overwrite({
},
})
const TERMS_AND_CONDITIONS = defaultPageParamsPages.TERMS_AND_CONDITIONS.overwrite({
// externalLink: null, // if string is defined and not empty it's dominating
// externalLink: null, // if defined it's dominating
internalPage: {
// footerIdent: 'site.termsAndConditions', // localized string identifier, if undefined default is used
@ -57,7 +68,7 @@ const TERMS_AND_CONDITIONS = defaultPageParamsPages.TERMS_AND_CONDITIONS.overwri
},
})
const CODE_OF_CONDUCT = defaultPageParamsPages.CODE_OF_CONDUCT.overwrite({
// externalLink: null, // if string is defined and not empty it's dominating
// externalLink: null, // if defined it's dominating
internalPage: {
// footerIdent: 'site.code-of-conduct', // localized string identifier, if undefined default is used
@ -70,7 +81,7 @@ const CODE_OF_CONDUCT = defaultPageParamsPages.CODE_OF_CONDUCT.overwrite({
},
})
const DATA_PRIVACY = defaultPageParamsPages.DATA_PRIVACY.overwrite({
// externalLink: null, // if string is defined and not empty it's dominating
// externalLink: null, // if defined it's dominating
internalPage: {
// footerIdent: 'site.data-privacy', // localized string identifier, if undefined default is used
@ -83,7 +94,7 @@ const DATA_PRIVACY = defaultPageParamsPages.DATA_PRIVACY.overwrite({
},
})
const FAQ = defaultPageParamsPages.FAQ.overwrite({
// externalLink: null, // if string is defined and not empty it's dominating
// externalLink: null, // if defined it's dominating
internalPage: {
// footerIdent: 'site.faq', // localized string identifier, if undefined default is used
@ -96,7 +107,11 @@ const FAQ = defaultPageParamsPages.FAQ.overwrite({
},
})
const SUPPORT = defaultPageParamsPages.SUPPORT.overwrite({
externalLink: 'https://ocelot.social', // if string is defined and not empty it's dominating
// if defined it's dominating
externalLink: {
url: 'https://ocelot.social',
target: '_blank',
},
internalPage: {
// footerIdent: 'site.support', // localized string identifier, if undefined default is used

5
webapp/mixins/internalPageMixins.js
View File

@ -16,10 +16,7 @@ export function internalPageMixins(pageParams) {
},
created() {
if (!this.pageParams.isInternalPage) {
// to avoid possible errors, because 'window' is only defined on browser side but not in NodeJS on client side. check for 'typeof window' is neccessary, because if it's not defined at all you can't check for 'window !== undefined' without the same error 'window is undefined'
if (typeof window !== 'undefined') {
window.location.href = this.pageParams.externalLink
}
this.pageParams.redirectToPage(this)
}
},
}