mirrors/woodpecker
1
0
Fork 0
mirror of https://github.com/woodpecker-ci/woodpecker.git synced 2024-11-22 01:41:02 +00:00
Code Issues Projects Releases Wiki Activity

Untangle settings / header slots (#4403)

Browse source
This commit is contained in:
Anbraten 2024-11-18 15:16:30 +01:00 committed by GitHub
parent 5e2fa8164b
commit d0927e37dc
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
28 changed files with 73 additions and 58 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
web/src/components/admin/settings/AdminAgentsTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<AgentManager <AgentManager
:desc="$t('admin.settings.agents.desc')" :description="$t('admin.settings.agents.desc')"
:load-agents="loadAgents" :load-agents="loadAgents"
:create-agent="createAgent" :create-agent="createAgent"
:update-agent="updateAgent" :update-agent="updateAgent"

2
web/src/components/admin/settings/AdminOrgsTab.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<Settings :title="$t('admin.settings.orgs.orgs')" :desc="$t('admin.settings.orgs.desc')"> <Settings :title="$t('admin.settings.orgs.orgs')" :description="$t('admin.settings.orgs.desc')">
<div class="space-y-4 text-wp-text-100"> <div class="space-y-4 text-wp-text-100">
<ListItem <ListItem
v-for="org in orgs" v-for="org in orgs"

4
web/src/components/admin/settings/AdminQueueTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Settings :title="$t('admin.settings.queue.queue')" :desc="$t('admin.settings.queue.desc')"> <Settings :title="$t('admin.settings.queue.queue')" :description="$t('admin.settings.queue.desc')">
<template #titleActions> <template #headerActions>
<div v-if="queueInfo"> <div v-if="queueInfo">
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<Button <Button

10
web/src/components/admin/settings/AdminRegistriesTab.vue
View file

@ -1,11 +1,10 @@
<template> <template>
<Settings <Settings
:title="$t('registries.registries')" :title="$t('registries.registries')"
:desc="$t('admin.settings.registries.desc')" :description="$t('admin.settings.registries.desc')"
docs-url="docs/usage/registries" docs-url="docs/usage/registries"
:warning="$t('admin.settings.registries.warning')"
> >
<template #titleActions> <template #headerActions>
<Button <Button
v-if="selectedRegistry" v-if="selectedRegistry"
:text="$t('registries.show')" :text="$t('registries.show')"
@ -15,6 +14,10 @@
<Button v-else :text="$t('registries.add')" start-icon="plus" @click="showAddRegistry" /> <Button v-else :text="$t('registries.add')" start-icon="plus" @click="showAddRegistry" />
</template> </template>
<template #headerEnd>
<Warning class="text-sm mt-4" :text="$t('admin.settings.registries.warning')" />
</template>
<RegistryList <RegistryList
v-if="!selectedRegistry" v-if="!selectedRegistry"
v-model="registries" v-model="registries"
@ -39,6 +42,7 @@ import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import Button from '~/components/atomic/Button.vue'; import Button from '~/components/atomic/Button.vue';
import Warning from '~/components/atomic/Warning.vue';
import Settings from '~/components/layout/Settings.vue'; import Settings from '~/components/layout/Settings.vue';
import RegistryEdit from '~/components/registry/RegistryEdit.vue'; import RegistryEdit from '~/components/registry/RegistryEdit.vue';
import RegistryList from '~/components/registry/RegistryList.vue'; import RegistryList from '~/components/registry/RegistryList.vue';

4
web/src/components/admin/settings/AdminReposTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Settings :title="$t('admin.settings.repos.repos')" :desc="$t('admin.settings.repos.desc')"> <Settings :title="$t('admin.settings.repos.repos')" :description="$t('admin.settings.repos.desc')">
<template #titleActions> <template #headerActions>
<Button <Button
start-icon="heal" start-icon="heal"
:is-loading="isRepairingRepos" :is-loading="isRepairingRepos"

10
web/src/components/admin/settings/AdminSecretsTab.vue
View file

@ -1,15 +1,18 @@
<template> <template>
<Settings <Settings
:title="$t('secrets.secrets')" :title="$t('secrets.secrets')"
:desc="$t('admin.settings.secrets.desc')" :description="$t('admin.settings.secrets.desc')"
docs-url="docs/usage/secrets" docs-url="docs/usage/secrets"
:warning="$t('admin.settings.secrets.warning')"
> >
<template #titleActions> <template #headerActions>
<Button v-if="selectedSecret" :text="$t('secrets.show')" start-icon="back" @click="selectedSecret = undefined" /> <Button v-if="selectedSecret" :text="$t('secrets.show')" start-icon="back" @click="selectedSecret = undefined" />
<Button v-else :text="$t('secrets.add')" start-icon="plus" @click="showAddSecret" /> <Button v-else :text="$t('secrets.add')" start-icon="plus" @click="showAddSecret" />
</template> </template>
<template #headerEnd>
<Warning class="text-sm mt-4" :text="$t('admin.settings.secrets.warning')" />
</template>
<SecretList <SecretList
v-if="!selectedSecret" v-if="!selectedSecret"
v-model="secrets" v-model="secrets"
@ -34,6 +37,7 @@ import { computed, ref } from 'vue';
import { useI18n } from 'vue-i18n'; import { useI18n } from 'vue-i18n';
import Button from '~/components/atomic/Button.vue'; import Button from '~/components/atomic/Button.vue';
import Warning from '~/components/atomic/Warning.vue';
import Settings from '~/components/layout/Settings.vue'; import Settings from '~/components/layout/Settings.vue';
import SecretEdit from '~/components/secrets/SecretEdit.vue'; import SecretEdit from '~/components/secrets/SecretEdit.vue';
import SecretList from '~/components/secrets/SecretList.vue'; import SecretList from '~/components/secrets/SecretList.vue';

4
web/src/components/admin/settings/AdminUsersTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Settings :title="$t('admin.settings.users.users')" :desc="$t('admin.settings.users.desc')"> <Settings :title="$t('admin.settings.users.users')" :description="$t('admin.settings.users.desc')">
<template #titleActions> <template #headerActions>
<Button <Button
v-if="selectedUser" v-if="selectedUser"
:text="$t('admin.settings.users.show')" :text="$t('admin.settings.users.show')"

6
web/src/components/agent/AgentManager.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Settings :title="$t('admin.settings.agents.agents')" :desc="desc"> <Settings :title="$t('admin.settings.agents.agents')" :description>
<template #titleActions> <template #headerActions>
<Button <Button
v-if="selectedAgent" v-if="selectedAgent"
:text="$t('admin.settings.agents.show')" :text="$t('admin.settings.agents.show')"
@ -46,7 +46,7 @@ import AgentForm from './AgentForm.vue';
import AgentList from './AgentList.vue'; import AgentList from './AgentList.vue';
const props = defineProps<{ const props = defineProps<{
desc: string; description: string;
loadAgents: (page: number) => Promise<Agent[] | null>; loadAgents: (page: number) => Promise<Agent[] | null>;
createAgent: (agent: Partial<Agent>) => Promise<Agent>; createAgent: (agent: Partial<Agent>) => Promise<Agent>;
updateAgent: (agent: Agent) => Promise<Agent | void>; updateAgent: (agent: Agent) => Promise<Agent | void>;

13
web/src/components/layout/Settings.vue
View file

@ -7,13 +7,12 @@
</h1> </h1>
<div class="flex flex-wrap gap-x-4 gap-y-2 items-center justify-between"> <div class="flex flex-wrap gap-x-4 gap-y-2 items-center justify-between">
<p v-if="desc" class="text-sm text-wp-text-alt-100">{{ desc }}</p> <p v-if="description" class="text-sm text-wp-text-alt-100">{{ description }}</p>
<div v-if="$slots.titleActions"> <div v-if="$slots.headerActions">
<slot name="titleActions" /> <slot name="headerActions" />
</div> </div>
</div> </div>
<slot name="headerEnd" />
<Warning v-if="warning" class="text-sm mt-4" :text="warning" />
</div> </div>
<slot /> <slot />
@ -22,13 +21,11 @@
<script setup lang="ts"> <script setup lang="ts">
import DocsLink from '~/components/atomic/DocsLink.vue'; import DocsLink from '~/components/atomic/DocsLink.vue';
import Warning from '~/components/atomic/Warning.vue';
import Panel from '~/components/layout/Panel.vue'; import Panel from '~/components/layout/Panel.vue';
defineProps<{ defineProps<{
title: string; title: string;
desc?: string; description?: string;
docsUrl?: string; docsUrl?: string;
warning?: string;
}>(); }>();
</script> </script>

12
web/src/components/layout/scaffold/Header.vue
View file

@ -24,26 +24,26 @@
</div> </div>
<TextField <TextField
v-if="searchBoxPresent" v-if="searchBoxPresent"
class="w-auto <md:w-full <md:order-3" class="w-auto <md:w-full flex-grow <md:order-3"
:aria-label="$t('search')" :aria-label="$t('search')"
:placeholder="$t('search')" :placeholder="$t('search')"
:model-value="search" :model-value="search"
@update:model-value="(value: string) => $emit('update:search', value)" @update:model-value="(value: string) => $emit('update:search', value)"
/> />
<div <div
v-if="$slots.titleActions" v-if="$slots.headerActions"
class="flex items-center md:justify-end gap-x-2 min-w-0" class="flex items-center md:justify-end gap-x-2 min-w-0"
:class="{ :class="{
'md:flex-1': searchBoxPresent, 'md:flex-1': searchBoxPresent,
}" }"
> >
<slot name="titleActions" /> <slot name="headerActions" />
</div> </div>
</div> </div>
<div v-if="enableTabs" class="flex md:items-center flex-col py-2 md:flex-row md:justify-between md:py-0"> <div v-if="enableTabs" class="flex md:items-center flex-col py-2 md:flex-row md:justify-between md:py-0">
<Tabs class="<md:order-2" /> <Tabs class="<md:order-2" />
<div v-if="$slots.titleActions" class="flex content-start md:justify-end"> <div v-if="$slots.headerActions" class="flex content-start md:justify-end">
<slot name="tabActions" /> <slot name="tabActions" />
</div> </div>
</div> </div>
@ -52,6 +52,8 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { computed } from 'vue';
import IconButton from '~/components/atomic/IconButton.vue'; import IconButton from '~/components/atomic/IconButton.vue';
import TextField from '~/components/form/TextField.vue'; import TextField from '~/components/form/TextField.vue';
import Container from '~/components/layout/Container.vue'; import Container from '~/components/layout/Container.vue';
@ -69,5 +71,5 @@ defineEmits<{
(event: 'update:search', query: string): void; (event: 'update:search', query: string): void;
}>(); }>();
const searchBoxPresent = props.search !== undefined; const searchBoxPresent = computed(() => props.search !== undefined);
</script> </script>

2
web/src/components/layout/scaffold/Scaffold.vue
View file

@ -7,7 +7,7 @@
@update:search="(value) => $emit('update:search', value)" @update:search="(value) => $emit('update:search', value)"
> >
<template #title><slot name="title" /></template> <template #title><slot name="title" /></template>
<template v-if="$slots.titleActions" #titleActions><slot name="titleActions" /></template> <template v-if="$slots.headerActions" #headerActions><slot name="headerActions" /></template>
<template v-if="$slots.tabActions" #tabActions><slot name="tabActions" /></template> <template v-if="$slots.tabActions" #tabActions><slot name="tabActions" /></template>
</Header> </Header>

2
web/src/components/org/settings/OrgAgentsTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<AgentManager <AgentManager
:desc="$t('org.settings.agents.desc')" :description="$t('org.settings.agents.desc')"
:load-agents="loadAgents" :load-agents="loadAgents"
:create-agent="createAgent" :create-agent="createAgent"
:update-agent="updateAgent" :update-agent="updateAgent"

4
web/src/components/org/settings/OrgRegistriesTab.vue
View file

@ -1,10 +1,10 @@
<template> <template>
<Settings <Settings
:title="$t('registries.registries')" :title="$t('registries.registries')"
:desc="$t('org.settings.registries.desc')" :description="$t('org.settings.registries.desc')"
docs-url="docs/usage/registries" docs-url="docs/usage/registries"
> >
<template #titleActions> <template #headerActions>
<Button <Button
v-if="selectedRegistry" v-if="selectedRegistry"
:text="$t('registries.show')" :text="$t('registries.show')"

4
web/src/components/org/settings/OrgSecretsTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Settings :title="$t('secrets.secrets')" :desc="$t('org.settings.secrets.desc')" docs-url="docs/usage/secrets"> <Settings :title="$t('secrets.secrets')" :description="$t('org.settings.secrets.desc')" docs-url="docs/usage/secrets">
<template #titleActions> <template #headerActions>
<Button v-if="selectedSecret" :text="$t('secrets.show')" start-icon="back" @click="selectedSecret = undefined" /> <Button v-if="selectedSecret" :text="$t('secrets.show')" start-icon="back" @click="selectedSecret = undefined" />
<Button v-else :text="$t('secrets.add')" start-icon="plus" @click="showAddSecret" /> <Button v-else :text="$t('secrets.add')" start-icon="plus" @click="showAddSecret" />
</template> </template>

2
web/src/components/repo/settings/BadgeTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Settings :title="$t('repo.settings.badge.badge')"> <Settings :title="$t('repo.settings.badge.badge')">
<template #titleActions> <template #headerActions>
<a v-if="badgeUrl" :href="badgeUrl" target="_blank"> <a v-if="badgeUrl" :href="badgeUrl" target="_blank">
<img :src="badgeUrl" /> <img :src="badgeUrl" />
</a> </a>

8
web/src/components/repo/settings/CronTab.vue
View file

@ -1,6 +1,10 @@
<template> <template>
<Settings :title="$t('repo.settings.crons.crons')" :desc="$t('repo.settings.crons.desc')" docs-url="docs/usage/cron"> <Settings
<template #titleActions> :title="$t('repo.settings.crons.crons')"
:description="$t('repo.settings.crons.desc')"
docs-url="docs/usage/cron"
>
<template #headerActions>
<Button <Button
v-if="selectedCron" v-if="selectedCron"
start-icon="back" start-icon="back"

4
web/src/components/repo/settings/RegistriesTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Settings :title="$t('registries.credentials')" :desc="$t('registries.desc')" docs-url="docs/usage/registries"> <Settings :title="$t('registries.credentials')" :description="$t('registries.desc')" docs-url="docs/usage/registries">
<template #titleActions> <template #headerActions>
<Button <Button
v-if="selectedRegistry" v-if="selectedRegistry"
:text="$t('registries.show')" :text="$t('registries.show')"

4
web/src/components/repo/settings/SecretsTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<Settings :title="$t('secrets.secrets')" :desc="$t('secrets.desc')" docs-url="docs/usage/secrets"> <Settings :title="$t('secrets.secrets')" :description="$t('secrets.desc')" docs-url="docs/usage/secrets">
<template #titleActions> <template #headerActions>
<Button v-if="selectedSecret" :text="$t('secrets.show')" start-icon="back" @click="selectedSecret = undefined" /> <Button v-if="selectedSecret" :text="$t('secrets.show')" start-icon="back" @click="selectedSecret = undefined" />
<Button v-else :text="$t('secrets.add')" start-icon="plus" @click="showAddSecret" /> <Button v-else :text="$t('secrets.add')" start-icon="plus" @click="showAddSecret" />
</template> </template>

2
web/src/components/user/UserAgentsTab.vue
View file

@ -1,6 +1,6 @@
<template> <template>
<AgentManager <AgentManager
:desc="$t('user.settings.agents.desc')" :description="$t('user.settings.agents.desc')"
:load-agents="loadAgents" :load-agents="loadAgents"
:create-agent="createAgent" :create-agent="createAgent"
:update-agent="updateAgent" :update-agent="updateAgent"

8
web/src/components/user/UserCLIAndAPITab.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<Settings :title="$t('user.settings.cli_and_api.cli_and_api')" :desc="$t('user.settings.cli_and_api.desc')"> <Settings :title="$t('user.settings.cli_and_api.cli_and_api')" :description="$t('user.settings.cli_and_api.desc')">
<InputField :label="$t('user.settings.cli_and_api.cli_usage')"> <InputField :label="$t('user.settings.cli_and_api.cli_usage')">
<template #titleActions> <template #headerActions>
<a :href="cliDownload" target="_blank" class="ml-4 text-wp-link-100 hover:text-wp-link-200">{{ <a :href="cliDownload" target="_blank" class="ml-4 text-wp-link-100 hover:text-wp-link-200">{{
$t('user.settings.cli_and_api.download_cli') $t('user.settings.cli_and_api.download_cli')
}}</a> }}</a>
@ -10,14 +10,14 @@
</InputField> </InputField>
<InputField :label="$t('user.settings.cli_and_api.token')"> <InputField :label="$t('user.settings.cli_and_api.token')">
<template #titleActions> <template #headerActions>
<Button class="ml-auto" :text="$t('user.settings.cli_and_api.reset_token')" @click="resetToken" /> <Button class="ml-auto" :text="$t('user.settings.cli_and_api.reset_token')" @click="resetToken" />
</template> </template>
<pre class="code-box">{{ token }}</pre> <pre class="code-box">{{ token }}</pre>
</InputField> </InputField>
<InputField :label="$t('user.settings.cli_and_api.api_usage')"> <InputField :label="$t('user.settings.cli_and_api.api_usage')">
<template #titleActions> <template #headerActions>
<a <a
v-if="enableSwagger" v-if="enableSwagger"
:href="`${address}/swagger/index.html`" :href="`${address}/swagger/index.html`"

4
web/src/components/user/UserRegistriesTab.vue
View file

@ -1,10 +1,10 @@
<template> <template>
<Settings <Settings
:title="$t('registries.registries')" :title="$t('registries.registries')"
:desc="$t('user.settings.registries.desc')" :description="$t('user.settings.registries.desc')"
docs-url="docs/usage/registries" docs-url="docs/usage/registries"
> >
<template #titleActions> <template #headerActions>
<Button <Button
v-if="selectedRegistry" v-if="selectedRegistry"
:text="$t('registries.show')" :text="$t('registries.show')"

8
web/src/components/user/UserSecretsTab.vue
View file

@ -1,6 +1,10 @@
<template> <template>
<Settings :title="$t('secrets.secrets')" :desc="$t('user.settings.secrets.desc')" docs-url="docs/usage/secrets"> <Settings
<template #titleActions> :title="$t('secrets.secrets')"
:description="$t('user.settings.secrets.desc')"
docs-url="docs/usage/secrets"
>
<template #headerActions>
<Button v-if="selectedSecret" :text="$t('secrets.show')" start-icon="back" @click="selectedSecret = undefined" /> <Button v-if="selectedSecret" :text="$t('secrets.show')" start-icon="back" @click="selectedSecret = undefined" />
<Button v-else :text="$t('secrets.add')" start-icon="plus" @click="showAddSecret" /> <Button v-else :text="$t('secrets.add')" start-icon="plus" @click="showAddSecret" />
</template> </template>

2
web/src/views/Repos.vue
View file

@ -4,7 +4,7 @@
{{ $t('repositories') }} {{ $t('repositories') }}
</template> </template>
<template #titleActions> <template #headerActions>
<Button :to="{ name: 'repo-add' }" start-icon="plus" :text="$t('repo.add')" /> <Button :to="{ name: 'repo-add' }" start-icon="plus" :text="$t('repo.add')" />
</template> </template>

2
web/src/views/User.vue
View file

@ -1,7 +1,7 @@
<template> <template>
<Scaffold enable-tabs> <Scaffold enable-tabs>
<template #title>{{ $t('user.settings.settings') }}</template> <template #title>{{ $t('user.settings.settings') }}</template>
<template #titleActions><Button :text="$t('logout')" :to="`${address}/logout`" /></template> <template #headerActions><Button :text="$t('logout')" :to="`${address}/logout`" /></template>
<Tab id="general" :title="$t('user.settings.general.general')"> <Tab id="general" :title="$t('user.settings.general.general')">
<UserGeneralTab /> <UserGeneralTab />
</Tab> </Tab>

2
web/src/views/org/OrgRepos.vue
View file

@ -4,7 +4,7 @@
{{ org.name }} {{ org.name }}
</template> </template>
<template #titleActions> <template #headerActions>
<IconButton <IconButton
v-if="orgPermissions.admin" v-if="orgPermissions.admin"
icon="settings" icon="settings"

2
web/src/views/org/OrgWrapper.vue
View file

@ -4,7 +4,7 @@
{{ org.name }} {{ org.name }}
</template> </template>
<template #titleActions> <template #headerActions>
<IconButton <IconButton
v-if="orgPermissions.admin" v-if="orgPermissions.admin"
:to="{ name: org.is_user ? 'user' : 'repo-settings' }" :to="{ name: org.is_user ? 'user' : 'repo-settings' }"

2
web/src/views/repo/RepoWrapper.vue
View file

@ -15,7 +15,7 @@
{{ repo.name }} {{ repo.name }}
</span> </span>
</template> </template>
<template #titleActions> <template #headerActions>
<a v-if="badgeUrl" :href="badgeUrl" target="_blank"> <a v-if="badgeUrl" :href="badgeUrl" target="_blank">
<img :src="badgeUrl" /> <img :src="badgeUrl" />
</a> </a>

2
web/src/views/repo/pipeline/PipelineWrapper.vue
View file

@ -19,7 +19,7 @@
</span> </span>
</template> </template>
<template #titleActions> <template #headerActions>
<div class="flex md:items-center flex-col gap-2 md:flex-row md:justify-between min-w-0"> <div class="flex md:items-center flex-col gap-2 md:flex-row md:justify-between min-w-0">
<div class="flex content-start gap-2 min-w-0"> <div class="flex content-start gap-2 min-w-0">
<PipelineStatusIcon :status="pipeline.status" class="flex flex-shrink-0" /> <PipelineStatusIcon :status="pipeline.status" class="flex flex-shrink-0" />