mirrors/woodpecker
1
0
Fork 0
mirror of https://github.com/woodpecker-ci/woodpecker.git synced 2025-09-02 20:23:50 +00:00
Code Issues Projects Releases Wiki Activity

Show oauth host and favicon on login (#5376)

Browse source
This commit is contained in:
Anbraten 2025-07-31 18:09:14 +02:00 committed by GitHub
parent 12cd608150
commit 68adc21a53
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 29 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
web/src/assets/locales/en.json
View file

@ -1,8 +1,7 @@
{
"cancel": "Cancel",
"login_with": "Login with {forge}",
"login_to_woodpecker_with": "Login to Woodpecker with",
"login": "Login",
"welcome": "Welcome to Woodpecker",
"repos": "Repos",
"repositories": {
"title": "Repositories",

39
web/src/views/Login.vue
View file

@ -20,7 +20,7 @@
<WoodpeckerLogo preserveAspectRatio="xMinYMin slice" class="h-32 w-32 md:h-48 md:w-48" />
</div>
<div class="flex min-h-48 flex-col items-center justify-center gap-4 p-4 text-center md:w-2/5">
<h1 class="text-wp-text-100 text-xl">{{ $t('welcome') }}</h1>
<h1 class="text-wp-text-100 text-xl">{{ $t('login_to_woodpecker_with') }}</h1>
<div class="flex flex-col gap-2">
<Button
v-for="forge in forges"
@ -29,7 +29,17 @@
class="whitespace-normal!"
@click="doLogin(forge.id)"
>
{{ $t('login_with', { forge: getHostFromUrl(forge) }) }}
<div class="mr-2 w-4">
<img
v-if="!failedForgeFavicons.has(forge.id)"
:src="getFaviconUrl(forge)"
:alt="$t('login_to_woodpecker_with', { forge: getHostFromUrl(forge) })"
@error="() => failedForgeFavicons.add(forge.id)"
/>
<Icon v-else :name="forge.type === 'addon' ? 'repo' : forge.type" />
</div>
{{ getHostFromUrl(forge) }}
</Button>
</div>
</div>
@ -45,6 +55,7 @@ import { useRoute, useRouter } from 'vue-router';
import WoodpeckerLogo from '~/assets/logo.svg?component';
import Button from '~/components/atomic/Button.vue';
import Error from '~/components/atomic/Error.vue';
import Icon from '~/components/atomic/Icon.vue';
import useApiClient from '~/compositions/useApiClient';
import useAuthentication from '~/compositions/useAuthentication';
import { useWPTitle } from '~/compositions/useWPTitle';
@ -58,15 +69,6 @@ const apiClient = useApiClient();
const forges = ref<Forge[]>([]);
function getHostFromUrl(forge: Forge) {
if (!forge.url) {
return forge.type.charAt(0).toUpperCase() + forge.type.slice(1);
}
const url = new URL(forge.url);
return url.hostname;
}
function doLogin(forgeId?: number) {
const url = typeof route.query.url === 'string' ? route.query.url : '';
authentication.authenticate(url, forgeId);
@ -100,4 +102,19 @@ onMounted(async () => {
});
useWPTitle(computed(() => [i18n.t('login')]));
function getHostFromUrl(forge: Forge) {
if (!forge.url && !forge.oauth_host) {
return forge.type.charAt(0).toUpperCase() + forge.type.slice(1);
}
const url = new URL(forge.oauth_host ?? forge.url);
return url.hostname;
}
const failedForgeFavicons = ref(new Set<number>()); // Track which favicons failed to load
function getFaviconUrl(forge: Forge) {
const url = new URL(forge.oauth_host ?? forge.url);
return `${url.origin}/favicon.ico`;
}
</script>