mirror of
https://github.com/woodpecker-ci/woodpecker.git
synced 2024-06-02 21:49:25 +00:00
Update dependencies and tiny adjustments to UI (#1083)
- updated all web/ dependencies - fixed icon positioning issue - changed text color of pipeline message - add hover underline effect to breadcrumb org name
This commit is contained in:
parent
d22821afc1
commit
66be4923d2
|
@ -5,3 +5,4 @@ package.json
|
||||||
tsconfig.eslint.json
|
tsconfig.eslint.json
|
||||||
tsconfig.json
|
tsconfig.json
|
||||||
src/assets/locales/
|
src/assets/locales/
|
||||||
|
components.d.ts
|
||||||
|
|
|
@ -121,6 +121,8 @@ module.exports = {
|
||||||
],
|
],
|
||||||
'vue/new-line-between-multi-line-property': 'error',
|
'vue/new-line-between-multi-line-property': 'error',
|
||||||
'vue/padding-line-between-blocks': 'error',
|
'vue/padding-line-between-blocks': 'error',
|
||||||
|
'vue/multi-word-component-names': 'off',
|
||||||
|
'vue/no-reserved-component-names': 'off',
|
||||||
|
|
||||||
// css rules
|
// css rules
|
||||||
'vue-scoped-css/no-unused-selector': 'error',
|
'vue-scoped-css/no-unused-selector': 'error',
|
||||||
|
|
|
@ -2,3 +2,4 @@ yarn-lock.yaml
|
||||||
dist
|
dist
|
||||||
coverage/
|
coverage/
|
||||||
LICENSE
|
LICENSE
|
||||||
|
components.d.ts
|
||||||
|
|
45
web/components.d.ts
vendored
Normal file
45
web/components.d.ts
vendored
Normal file
|
@ -0,0 +1,45 @@
|
||||||
|
// generated by unplugin-vue-components
|
||||||
|
// We suggest you to commit this file into source control
|
||||||
|
// Read more: https://github.com/vuejs/core/pull/3399
|
||||||
|
import '@vue/runtime-core'
|
||||||
|
|
||||||
|
export {}
|
||||||
|
|
||||||
|
declare module '@vue/runtime-core' {
|
||||||
|
export interface GlobalComponents {
|
||||||
|
ActionsTab: typeof import('./src/components/repo/settings/ActionsTab.vue')['default']
|
||||||
|
ActiveBuilds: typeof import('./src/components/layout/header/ActiveBuilds.vue')['default']
|
||||||
|
BadgeTab: typeof import('./src/components/repo/settings/BadgeTab.vue')['default']
|
||||||
|
BuildFeedItem: typeof import('./src/components/build-feed/BuildFeedItem.vue')['default']
|
||||||
|
BuildFeedSidebar: typeof import('./src/components/build-feed/BuildFeedSidebar.vue')['default']
|
||||||
|
BuildItem: typeof import('./src/components/repo/build/BuildItem.vue')['default']
|
||||||
|
BuildList: typeof import('./src/components/repo/build/BuildList.vue')['default']
|
||||||
|
BuildLog: typeof import('./src/components/repo/build/BuildLog.vue')['default']
|
||||||
|
BuildProcDuration: typeof import('./src/components/repo/build/BuildProcDuration.vue')['default']
|
||||||
|
BuildProcList: typeof import('./src/components/repo/build/BuildProcList.vue')['default']
|
||||||
|
BuildRunningIcon: typeof import('./src/components/repo/build/BuildRunningIcon.vue')['default']
|
||||||
|
BuildStatusIcon: typeof import('./src/components/repo/build/BuildStatusIcon.vue')['default']
|
||||||
|
Button: typeof import('./src/components/atomic/Button.vue')['default']
|
||||||
|
Checkbox: typeof import('./src/components/form/Checkbox.vue')['default']
|
||||||
|
CheckboxesField: typeof import('./src/components/form/CheckboxesField.vue')['default']
|
||||||
|
DocsLink: typeof import('./src/components/atomic/DocsLink.vue')['default']
|
||||||
|
FluidContainer: typeof import('./src/components/layout/FluidContainer.vue')['default']
|
||||||
|
GeneralTab: typeof import('./src/components/repo/settings/GeneralTab.vue')['default']
|
||||||
|
Icon: typeof import('./src/components/atomic/Icon.vue')['default']
|
||||||
|
IconButton: typeof import('./src/components/atomic/IconButton.vue')['default']
|
||||||
|
InputField: typeof import('./src/components/form/InputField.vue')['default']
|
||||||
|
ListItem: typeof import('./src/components/atomic/ListItem.vue')['default']
|
||||||
|
Navbar: typeof import('./src/components/layout/header/Navbar.vue')['default']
|
||||||
|
NumberField: typeof import('./src/components/form/NumberField.vue')['default']
|
||||||
|
Panel: typeof import('./src/components/layout/Panel.vue')['default']
|
||||||
|
RadioField: typeof import('./src/components/form/RadioField.vue')['default']
|
||||||
|
RegistriesTab: typeof import('./src/components/repo/settings/RegistriesTab.vue')['default']
|
||||||
|
RouterLink: typeof import('vue-router')['RouterLink']
|
||||||
|
RouterView: typeof import('vue-router')['RouterView']
|
||||||
|
SecretsTab: typeof import('./src/components/repo/settings/SecretsTab.vue')['default']
|
||||||
|
SelectField: typeof import('./src/components/form/SelectField.vue')['default']
|
||||||
|
Tab: typeof import('./src/components/tabs/Tab.vue')['default']
|
||||||
|
Tabs: typeof import('./src/components/tabs/Tabs.vue')['default']
|
||||||
|
TextField: typeof import('./src/components/form/TextField.vue')['default']
|
||||||
|
}
|
||||||
|
}
|
|
@ -17,51 +17,51 @@
|
||||||
"test": "echo 'No tests configured' && exit 0"
|
"test": "echo 'No tests configured' && exit 0"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@intlify/vite-plugin-vue-i18n": "^3.4.0",
|
"@intlify/vite-plugin-vue-i18n": "^6.0.0",
|
||||||
"@kyvg/vue3-notification": "2.3.4",
|
"@kyvg/vue3-notification": "^2.3.6",
|
||||||
"@meforma/vue-toaster": "1.2.2",
|
"@meforma/vue-toaster": "^1.3.0",
|
||||||
"ansi_up": "^5.1.0",
|
"ansi_up": "^5.1.0",
|
||||||
"dayjs": "1.10.7",
|
"dayjs": "^1.11.4",
|
||||||
"floating-vue": "2.0.0-beta.5",
|
"floating-vue": "^2.0.0-beta.19",
|
||||||
"fuse.js": "6.4.6",
|
"fuse.js": "^6.6.2",
|
||||||
"humanize-duration": "3.27.0",
|
"humanize-duration": "^3.27.2",
|
||||||
"javascript-time-ago": "2.3.10",
|
"javascript-time-ago": "^2.5.7",
|
||||||
"lodash": "4.17.21",
|
"lodash": "^4.17.21",
|
||||||
"node-emoji": "1.11.0",
|
"node-emoji": "^1.11.0",
|
||||||
"pinia": "2.0.0",
|
"pinia": "^2.0.17",
|
||||||
"vue": "v3.2.20",
|
"vue": "^3.2.37",
|
||||||
"vue-i18n": "9",
|
"vue-i18n": "^9.2.2",
|
||||||
"vue-router": "4.0.10"
|
"vue-router": "^4.1.3"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@iconify/json": "1.1.421",
|
"@iconify/json": "^2.1.88",
|
||||||
"@types/humanize-duration": "3.27.0",
|
"@types/humanize-duration": "^3.27.1",
|
||||||
"@types/javascript-time-ago": "2.0.3",
|
"@types/javascript-time-ago": "^2.0.3",
|
||||||
"@types/lodash": "4.14.179",
|
"@types/lodash": "^4.14.182",
|
||||||
"@types/node": "16.11.6",
|
"@types/node": "^16.11.6",
|
||||||
"@types/node-emoji": "1.8.1",
|
"@types/node-emoji": "^1.8.1",
|
||||||
"@typescript-eslint/eslint-plugin": "5.6.0",
|
"@typescript-eslint/eslint-plugin": "^5.33.0",
|
||||||
"@typescript-eslint/parser": "5.6.0",
|
"@typescript-eslint/parser": "^5.33.0",
|
||||||
"@vitejs/plugin-vue": "1.9.4",
|
"@vitejs/plugin-vue": "^3.0.1",
|
||||||
"@vue/compiler-sfc": "3.2.20",
|
"@vue/compiler-sfc": "^3.2.37",
|
||||||
"eslint": "7.32.0",
|
"eslint": "^8.21.0",
|
||||||
"eslint-config-airbnb-base": "15.0.0",
|
"eslint-config-airbnb-base": "^15.0.0",
|
||||||
"eslint-config-airbnb-typescript": "16.1.0",
|
"eslint-config-airbnb-typescript": "^17.0.0",
|
||||||
"eslint-config-prettier": "8.3.0",
|
"eslint-config-prettier": "^8.5.0",
|
||||||
"eslint-plugin-import": "2.25.3",
|
"eslint-plugin-import": "^2.26.0",
|
||||||
"eslint-plugin-prettier": "4.0.0",
|
"eslint-plugin-prettier": "^4.2.1",
|
||||||
"eslint-plugin-promise": "5.1.1",
|
"eslint-plugin-promise": "^6.0.0",
|
||||||
"eslint-plugin-simple-import-sort": "7.0.0",
|
"eslint-plugin-simple-import-sort": "^7.0.0",
|
||||||
"eslint-plugin-vue": "7.18.0",
|
"eslint-plugin-vue": "^9.3.0",
|
||||||
"eslint-plugin-vue-scoped-css": "1.3.0",
|
"eslint-plugin-vue-scoped-css": "^2.2.0",
|
||||||
"prettier": "2.4.1",
|
"prettier": "^2.7.1",
|
||||||
"typescript": "4.4.4",
|
"typescript": "4.4.4",
|
||||||
"unplugin-icons": "0.12.17",
|
"unplugin-icons": "^0.14.8",
|
||||||
"unplugin-vue-components": "0.17.0",
|
"unplugin-vue-components": "^0.22.3",
|
||||||
"vite": "2.6.13",
|
"vite": "^3.0.4",
|
||||||
"vite-plugin-windicss": "1.4.12",
|
"vite-plugin-windicss": "^1.8.7",
|
||||||
"vite-svg-loader": "3.0.0",
|
"vite-svg-loader": "^3.4.0",
|
||||||
"vue-tsc": "0.28.10",
|
"vue-tsc": "^0.39.5",
|
||||||
"windicss": "3.2.0"
|
"windicss": "^3.5.6"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,22 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<button
|
<button
|
||||||
type="button"
|
type="button"
|
||||||
class="
|
class="relative flex items-center py-1 px-2 rounded-md border shadow-sm cursor-pointer transition-all duration-150 focus:outline-none overflow-hidden disabled:opacity-50 disabled:cursor-not-allowed"
|
||||||
relative
|
|
||||||
flex
|
|
||||||
items-center
|
|
||||||
py-1
|
|
||||||
px-2
|
|
||||||
rounded-md
|
|
||||||
border
|
|
||||||
shadow-sm
|
|
||||||
cursor-pointer
|
|
||||||
transition-all
|
|
||||||
duration-150
|
|
||||||
focus:outline-none
|
|
||||||
overflow-hidden
|
|
||||||
disabled:opacity-50 disabled:cursor-not-allowed
|
|
||||||
"
|
|
||||||
:class="{
|
:class="{
|
||||||
'bg-white hover:bg-gray-200 border-gray-300 text-color dark:bg-dark-gray-700 dark:border-dark-400 dark:hover:bg-dark-gray-800':
|
'bg-white hover:bg-gray-200 border-gray-300 text-color dark:bg-dark-gray-700 dark:border-dark-400 dark:hover:bg-dark-gray-800':
|
||||||
color === 'gray',
|
color === 'gray',
|
||||||
|
|
|
@ -1,25 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
class="
|
class="relative flex items-center justify-center text-color px-1 py-1 rounded-full bg-transparent hover:bg-gray-200 hover:text-gray-700 dark:hover:bg-gray-600 dark:hover:text-gray-700 cursor-pointer transition-all duration-150 focus:outline-none overflow-hidden disabled:opacity-50 disabled:cursor-not-allowed"
|
||||||
relative
|
|
||||||
flex
|
|
||||||
items-center
|
|
||||||
justify-center
|
|
||||||
text-color
|
|
||||||
px-1
|
|
||||||
py-1
|
|
||||||
rounded-full
|
|
||||||
bg-transparent
|
|
||||||
hover:bg-gray-200 hover:text-gray-700
|
|
||||||
dark:hover:bg-gray-600 dark:hover:text-gray-700
|
|
||||||
cursor-pointer
|
|
||||||
transition-all
|
|
||||||
duration-150
|
|
||||||
focus:outline-none
|
|
||||||
overflow-hidden
|
|
||||||
disabled:opacity-50 disabled:cursor-not-allowed
|
|
||||||
"
|
|
||||||
@click="doClick"
|
@click="doClick"
|
||||||
>
|
>
|
||||||
<Icon :name="icon" />
|
<Icon :name="icon" />
|
||||||
|
|
|
@ -1,17 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<component
|
<component
|
||||||
:is="clickable ? 'button' : 'div'"
|
:is="clickable ? 'button' : 'div'"
|
||||||
class="
|
class="w-full flex border rounded-md bg-white overflow-hidden p-4 border-gray-300 dark:bg-dark-gray-700 dark:border-dark-400"
|
||||||
w-full
|
|
||||||
flex
|
|
||||||
border
|
|
||||||
rounded-md
|
|
||||||
bg-white
|
|
||||||
overflow-hidden
|
|
||||||
p-4
|
|
||||||
border-gray-300
|
|
||||||
dark:bg-dark-gray-700 dark:border-dark-400
|
|
||||||
"
|
|
||||||
:class="{ 'cursor-pointer hover:shadow-md hover:bg-gray-200 dark:hover:bg-dark-gray-800': clickable }"
|
:class="{ 'cursor-pointer hover:shadow-md hover:bg-gray-200 dark:hover:bg-dark-gray-800': clickable }"
|
||||||
>
|
>
|
||||||
<slot />
|
<slot />
|
||||||
|
|
|
@ -7,16 +7,7 @@
|
||||||
v-for="build in sortedBuildFeed"
|
v-for="build in sortedBuildFeed"
|
||||||
:key="build.id"
|
:key="build.id"
|
||||||
:to="{ name: 'repo-build', params: { repoOwner: build.owner, repoName: build.name, buildId: build.number } }"
|
:to="{ name: 'repo-build', params: { repoOwner: build.owner, repoName: build.name, buildId: build.number } }"
|
||||||
class="
|
class="flex border-b py-4 px-2 w-full hover:bg-light-300 dark:hover:bg-dark-gray-900 dark:border-dark-gray-600 hover:shadow-sm"
|
||||||
flex
|
|
||||||
border-b
|
|
||||||
py-4
|
|
||||||
px-2
|
|
||||||
w-full
|
|
||||||
hover:bg-light-300
|
|
||||||
dark:hover:bg-dark-gray-900 dark:border-dark-gray-600
|
|
||||||
hover:shadow-sm
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<BuildFeedItem :build="build" />
|
<BuildFeedItem :build="build" />
|
||||||
</router-link>
|
</router-link>
|
||||||
|
|
|
@ -3,21 +3,7 @@
|
||||||
<input
|
<input
|
||||||
:id="`checkbox-${id}`"
|
:id="`checkbox-${id}`"
|
||||||
type="checkbox"
|
type="checkbox"
|
||||||
class="
|
class="checkbox flex-shrink-0 relative border border-gray-400 dark:border-gray-600 cursor-pointer rounded-md transition-colors duration-150 w-5 h-5 checked:bg-lime-600 checked:border-lime-600 dark:checked:bg-lime-800 dark:checked:border-lime-800"
|
||||||
checkbox
|
|
||||||
flex-shrink-0
|
|
||||||
relative
|
|
||||||
border border-gray-400
|
|
||||||
dark:border-gray-600
|
|
||||||
cursor-pointer
|
|
||||||
rounded-md
|
|
||||||
transition-colors
|
|
||||||
duration-150
|
|
||||||
w-5
|
|
||||||
h-5
|
|
||||||
checked:bg-lime-600 checked:border-lime-600
|
|
||||||
dark:checked:bg-lime-800 dark:checked:border-lime-800
|
|
||||||
"
|
|
||||||
:checked="innerValue"
|
:checked="innerValue"
|
||||||
@click="innerValue = !innerValue"
|
@click="innerValue = !innerValue"
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -3,19 +3,7 @@
|
||||||
<input
|
<input
|
||||||
:id="`radio-${id}-${option.value}`"
|
:id="`radio-${id}-${option.value}`"
|
||||||
type="radio"
|
type="radio"
|
||||||
class="
|
class="radio relative flex-shrink-0 border border-gray-400 dark:border-gray-600 cursor-pointer rounded-full w-5 h-5 checked:bg-lime-600 checked:border-lime-600 dark:checked:bg-lime-700 dark:checked:border-lime-700"
|
||||||
radio
|
|
||||||
relative
|
|
||||||
flex-shrink-0
|
|
||||||
border border-gray-400
|
|
||||||
dark:border-gray-600
|
|
||||||
cursor-pointer
|
|
||||||
rounded-full
|
|
||||||
w-5
|
|
||||||
h-5
|
|
||||||
checked:bg-lime-600 checked:border-lime-600
|
|
||||||
dark:checked:bg-lime-700 dark:checked:border-lime-700
|
|
||||||
"
|
|
||||||
:value="option.value"
|
:value="option.value"
|
||||||
:checked="innerValue.includes(option.value)"
|
:checked="innerValue.includes(option.value)"
|
||||||
@click="innerValue = option.value"
|
@click="innerValue = option.value"
|
||||||
|
|
|
@ -1,15 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="
|
class="w-full border border-gray-200 py-1 px-2 rounded-md bg-white hover:border-gray-300 dark:bg-dark-gray-700 dark:border-dark-400 dark:hover:border-dark-800"
|
||||||
w-full
|
|
||||||
border border-gray-200
|
|
||||||
py-1
|
|
||||||
px-2
|
|
||||||
rounded-md
|
|
||||||
bg-white
|
|
||||||
hover:border-gray-300
|
|
||||||
dark:bg-dark-gray-700 dark:border-dark-400 dark:hover:border-dark-800
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<input
|
<input
|
||||||
v-if="lines === 1"
|
v-if="lines === 1"
|
||||||
|
|
|
@ -1,18 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="
|
class="flex rounded-full w-8 h-8 bg-opacity-30 hover:bg-opacity-50 bg-white items-center justify-center cursor-pointer text-white"
|
||||||
flex
|
|
||||||
rounded-full
|
|
||||||
w-8
|
|
||||||
h-8
|
|
||||||
bg-opacity-30
|
|
||||||
hover:bg-opacity-50
|
|
||||||
bg-white
|
|
||||||
items-center
|
|
||||||
justify-center
|
|
||||||
cursor-pointer
|
|
||||||
text-white
|
|
||||||
"
|
|
||||||
:class="{
|
:class="{
|
||||||
spinner: activeBuilds.length !== 0,
|
spinner: activeBuilds.length !== 0,
|
||||||
}"
|
}"
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<ListItem v-if="build" clickable class="p-0 w-full">
|
<ListItem v-if="build" clickable class="p-0 w-full">
|
||||||
<div class="flex items-center md:mr-4">
|
<div class="flex h-full w-11 items-center md:mr-4">
|
||||||
<div
|
<div
|
||||||
class="min-h-full w-3"
|
class="min-h-full w-3"
|
||||||
:class="{
|
:class="{
|
||||||
|
@ -23,9 +23,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="w-full md:w-auto md:mx-4 flex items-center min-w-0">
|
<div class="w-full md:w-auto md:mx-4 flex items-center min-w-0">
|
||||||
<span class="text-color-alt <md:underline whitespace-nowrap overflow-hidden overflow-ellipsis">{{
|
<span class="text-color <md:underline whitespace-nowrap overflow-hidden overflow-ellipsis">{{ message }}</span>
|
||||||
message
|
|
||||||
}}</span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
|
|
|
@ -26,16 +26,7 @@
|
||||||
<div
|
<div
|
||||||
v-show="loadedLogs"
|
v-show="loadedLogs"
|
||||||
ref="consoleElement"
|
ref="consoleElement"
|
||||||
class="
|
class="w-full max-w-full grid grid-cols-[min-content,1fr,min-content] auto-rows-min flex-grow p-2 gap-x-2 overflow-x-hidden overflow-y-auto"
|
||||||
w-full
|
|
||||||
max-w-full
|
|
||||||
grid grid-cols-[min-content,1fr,min-content]
|
|
||||||
auto-rows-min
|
|
||||||
flex-grow
|
|
||||||
p-2
|
|
||||||
gap-x-2
|
|
||||||
overflow-x-hidden overflow-y-auto
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<div v-for="line in log" :key="line.index" class="contents font-mono">
|
<div v-for="line in log" :key="line.index" class="contents font-mono">
|
||||||
<span class="text-gray-500 whitespace-nowrap select-none text-right">{{ line.index + 1 }}</span>
|
<span class="text-gray-500 whitespace-nowrap select-none text-right">{{ line.index + 1 }}</span>
|
||||||
|
|
|
@ -1,18 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="flex flex-col w-full md:w-3/12 text-gray-600 dark:text-gray-400">
|
<div class="flex flex-col w-full md:w-3/12 text-gray-600 dark:text-gray-400">
|
||||||
<div
|
<div
|
||||||
class="
|
class="flex md:ml-2 p-4 space-x-1 justify-between flex-shrink-0 border-b-1 md:rounded-md bg-gray-300 dark:border-b-dark-gray-600 dark:bg-dark-gray-700"
|
||||||
flex
|
|
||||||
md:ml-2
|
|
||||||
p-4
|
|
||||||
space-x-1
|
|
||||||
justify-between
|
|
||||||
flex-shrink-0
|
|
||||||
border-b-1
|
|
||||||
md:rounded-md
|
|
||||||
bg-gray-300
|
|
||||||
dark:border-b-dark-gray-600 dark:bg-dark-gray-700
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<div class="flex space-x-1 items-center flex-shrink-0">
|
<div class="flex space-x-1 items-center flex-shrink-0">
|
||||||
<div class="flex items-center"><img class="w-6" :src="build.author_avatar" /></div>
|
<div class="flex items-center"><img class="w-6" :src="build.author_avatar" /></div>
|
||||||
|
@ -59,17 +48,7 @@
|
||||||
<div v-if="proc.environ" class="text-xs">
|
<div v-if="proc.environ" class="text-xs">
|
||||||
<div v-for="(value, key) in proc.environ" :key="key">
|
<div v-for="(value, key) in proc.environ" :key="key">
|
||||||
<span
|
<span
|
||||||
class="
|
class="pl-2 pr-1 py-0.5 bg-gray-800 text-gray-200 dark:bg-gray-600 border-2 border-gray-800 dark:border-gray-600 rounded-l-full"
|
||||||
pl-2
|
|
||||||
pr-1
|
|
||||||
py-0.5
|
|
||||||
bg-gray-800
|
|
||||||
text-gray-200
|
|
||||||
dark:bg-gray-600
|
|
||||||
border-2 border-gray-800
|
|
||||||
dark:border-gray-600
|
|
||||||
rounded-l-full
|
|
||||||
"
|
|
||||||
>{{ key }}</span
|
>{{ key }}</span
|
||||||
>
|
>
|
||||||
<span class="pl-1 pr-2 py-0.5 border-2 border-gray-800 dark:border-gray-600 rounded-r-full">{{
|
<span class="pl-1 pr-2 py-0.5 border-2 border-gray-800 dark:border-gray-600 rounded-r-full">{{
|
||||||
|
@ -81,17 +60,7 @@
|
||||||
<div
|
<div
|
||||||
v-for="job in proc.children"
|
v-for="job in proc.children"
|
||||||
:key="job.pid"
|
:key="job.pid"
|
||||||
class="
|
class="flex mx-2 mb-1 p-2 pl-6 cursor-pointer rounded-md items-center hover:bg-gray-300 hover:dark:bg-dark-gray-700"
|
||||||
flex
|
|
||||||
mx-2
|
|
||||||
mb-1
|
|
||||||
p-2
|
|
||||||
pl-6
|
|
||||||
cursor-pointer
|
|
||||||
rounded-md
|
|
||||||
items-center
|
|
||||||
hover:bg-gray-300 hover:dark:bg-dark-gray-700
|
|
||||||
"
|
|
||||||
:class="{ 'bg-gray-300 !dark:bg-dark-gray-700': selectedProcId && selectedProcId === job.pid }"
|
:class="{ 'bg-gray-300 !dark:bg-dark-gray-700': selectedProcId && selectedProcId === job.pid }"
|
||||||
@click="$emit('update:selected-proc-id', job.pid)"
|
@click="$emit('update:selected-proc-id', job.pid)"
|
||||||
>
|
>
|
||||||
|
|
|
@ -2,19 +2,9 @@
|
||||||
<WoodpeckerIcon class="woodpecker h-16" />
|
<WoodpeckerIcon class="woodpecker h-16" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts" setup>
|
||||||
import { defineComponent } from 'vue';
|
|
||||||
|
|
||||||
// eslint-disable-next-line import/no-relative-parent-imports
|
// eslint-disable-next-line import/no-relative-parent-imports
|
||||||
import WoodpeckerIcon from '../../../assets/woodpecker.svg?component';
|
import WoodpeckerIcon from '../../../assets/woodpecker.svg?component';
|
||||||
|
|
||||||
export default defineComponent({
|
|
||||||
name: 'BuildRunningIcon',
|
|
||||||
|
|
||||||
components: {
|
|
||||||
WoodpeckerIcon,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
|
@ -4,18 +4,7 @@
|
||||||
<div
|
<div
|
||||||
v-for="tab in tabs"
|
v-for="tab in tabs"
|
||||||
:key="tab.id"
|
:key="tab.id"
|
||||||
class="
|
class="w-full py-2 md:w-auto md:pt-0 md:pb-2 md:px-8 flex cursor-pointer md:border-b-2 text-color hover:text-gray-700 dark:hover:text-gray-400 items-center"
|
||||||
w-full
|
|
||||||
py-2
|
|
||||||
md:w-auto md:pt-0 md:pb-2 md:px-8
|
|
||||||
flex
|
|
||||||
cursor-pointer
|
|
||||||
md:border-b-2
|
|
||||||
text-color
|
|
||||||
hover:text-gray-700
|
|
||||||
dark:hover:text-gray-400
|
|
||||||
items-center
|
|
||||||
"
|
|
||||||
:class="{
|
:class="{
|
||||||
'border-gray-400 dark:border-gray-600': activeTab === tab.id,
|
'border-gray-400 dark:border-gray-600': activeTab === tab.id,
|
||||||
'border-transparent': activeTab !== tab.id,
|
'border-transparent': activeTab !== tab.id,
|
||||||
|
|
|
@ -5,15 +5,7 @@
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="
|
class="flex flex-col w-full overflow-hidden md:m-8 md:rounded-md md:shadow md:border md:bg-white md:dark:bg-dark-gray-700 dark:border-dark-200 md:flex-row md:w-3xl md:h-sm justify-center"
|
||||||
flex flex-col
|
|
||||||
w-full
|
|
||||||
overflow-hidden
|
|
||||||
md:m-8 md:rounded-md md:shadow md:border md:bg-white md:dark:bg-dark-gray-700
|
|
||||||
dark:border-dark-200
|
|
||||||
md:flex-row md:w-3xl md:h-sm
|
|
||||||
justify-center
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<div class="flex md:bg-lime-500 md:dark:bg-lime-900 md:w-3/5 justify-center items-center">
|
<div class="flex md:bg-lime-500 md:dark:bg-lime-900 md:w-3/5 justify-center items-center">
|
||||||
<img class="w-48 h-48" src="../assets/logo.svg?url" />
|
<img class="w-48 h-48" src="../assets/logo.svg?url" />
|
||||||
|
|
|
@ -2,7 +2,9 @@
|
||||||
<FluidContainer v-if="repo && repoPermissions && $route.meta.repoHeader">
|
<FluidContainer v-if="repo && repoPermissions && $route.meta.repoHeader">
|
||||||
<div class="flex flex-wrap border-b items-center pb-4 mb-4 dark:border-gray-600 justify-center">
|
<div class="flex flex-wrap border-b items-center pb-4 mb-4 dark:border-gray-600 justify-center">
|
||||||
<h1 class="text-xl text-color w-full md:w-auto text-center mb-4 md:mb-0">
|
<h1 class="text-xl text-color w-full md:w-auto text-center mb-4 md:mb-0">
|
||||||
<router-link :to="{ name: 'repos-owner', params: { repoOwner } }">{{ repoOwner }}</router-link>
|
<router-link :to="{ name: 'repos-owner', params: { repoOwner } }" class="hover:underline">{{
|
||||||
|
repoOwner
|
||||||
|
}}</router-link>
|
||||||
{{ ` / ${repo.name}` }}
|
{{ ` / ${repo.name}` }}
|
||||||
</h1>
|
</h1>
|
||||||
<a v-if="badgeUrl" :href="badgeUrl" target="_blank" class="md:ml-auto">
|
<a v-if="badgeUrl" :href="badgeUrl" target="_blank" class="md:ml-auto">
|
||||||
|
@ -32,8 +34,8 @@
|
||||||
<router-view v-else-if="repo && repoPermissions" />
|
<router-view v-else-if="repo && repoPermissions" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts" setup>
|
||||||
import { computed, defineComponent, onMounted, provide, ref, toRef, watch } from 'vue';
|
import { computed, defineProps, onMounted, provide, ref, toRef, watch } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import { useRoute, useRouter } from 'vue-router';
|
import { useRoute, useRouter } from 'vue-router';
|
||||||
|
|
||||||
|
@ -50,91 +52,81 @@ import { RepoPermissions } from '~/lib/api/types';
|
||||||
import BuildStore from '~/store/builds';
|
import BuildStore from '~/store/builds';
|
||||||
import RepoStore from '~/store/repos';
|
import RepoStore from '~/store/repos';
|
||||||
|
|
||||||
export default defineComponent({
|
const props = defineProps({
|
||||||
name: 'RepoWrapper',
|
// used by toRef
|
||||||
|
// eslint-disable-next-line vue/no-unused-properties
|
||||||
components: { FluidContainer, IconButton, Icon, Tabs, Tab },
|
repoOwner: {
|
||||||
|
type: String,
|
||||||
props: {
|
required: true,
|
||||||
// used by toRef
|
|
||||||
// eslint-disable-next-line vue/no-unused-properties
|
|
||||||
repoOwner: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
|
|
||||||
// used by toRef
|
|
||||||
// eslint-disable-next-line vue/no-unused-properties
|
|
||||||
repoName: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
|
|
||||||
setup(props) {
|
// used by toRef
|
||||||
const repoOwner = toRef(props, 'repoOwner');
|
// eslint-disable-next-line vue/no-unused-properties
|
||||||
const repoName = toRef(props, 'repoName');
|
repoName: {
|
||||||
const repoStore = RepoStore();
|
type: String,
|
||||||
const buildStore = BuildStore();
|
required: true,
|
||||||
const apiClient = useApiClient();
|
},
|
||||||
const notifications = useNotifications();
|
});
|
||||||
const { isAuthenticated } = useAuthentication();
|
|
||||||
const route = useRoute();
|
|
||||||
const router = useRouter();
|
|
||||||
const i18n = useI18n();
|
|
||||||
|
|
||||||
const { forge } = useConfig();
|
const repoOwner = toRef(props, 'repoOwner');
|
||||||
const repo = repoStore.getRepo(repoOwner, repoName);
|
const repoName = toRef(props, 'repoName');
|
||||||
const repoPermissions = ref<RepoPermissions>();
|
const repoStore = RepoStore();
|
||||||
const builds = buildStore.getSortedBuilds(repoOwner, repoName);
|
const buildStore = BuildStore();
|
||||||
provide('repo', repo);
|
const apiClient = useApiClient();
|
||||||
provide('repo-permissions', repoPermissions);
|
const notifications = useNotifications();
|
||||||
provide('builds', builds);
|
const { isAuthenticated } = useAuthentication();
|
||||||
|
const route = useRoute();
|
||||||
|
const router = useRouter();
|
||||||
|
const i18n = useI18n();
|
||||||
|
|
||||||
async function loadRepo() {
|
const { forge } = useConfig();
|
||||||
repoPermissions.value = await apiClient.getRepoPermissions(repoOwner.value, repoName.value);
|
const repo = repoStore.getRepo(repoOwner, repoName);
|
||||||
if (!repoPermissions.value.pull) {
|
const repoPermissions = ref<RepoPermissions>();
|
||||||
notifications.notify({ type: 'error', title: i18n.t('repo.not_allowed') });
|
const builds = buildStore.getSortedBuilds(repoOwner, repoName);
|
||||||
// no access and not authenticated, redirect to login
|
provide('repo', repo);
|
||||||
if (!isAuthenticated) {
|
provide('repo-permissions', repoPermissions);
|
||||||
await router.replace({ name: 'login', query: { url: route.fullPath } });
|
provide('builds', builds);
|
||||||
return;
|
|
||||||
}
|
|
||||||
await router.replace({ name: 'home' });
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
await repoStore.loadRepo(repoOwner.value, repoName.value);
|
async function loadRepo() {
|
||||||
await buildStore.loadBuilds(repoOwner.value, repoName.value);
|
repoPermissions.value = await apiClient.getRepoPermissions(repoOwner.value, repoName.value);
|
||||||
|
if (!repoPermissions.value.pull) {
|
||||||
|
notifications.notify({ type: 'error', title: i18n.t('repo.not_allowed') });
|
||||||
|
// no access and not authenticated, redirect to login
|
||||||
|
if (!isAuthenticated) {
|
||||||
|
await router.replace({ name: 'login', query: { url: route.fullPath } });
|
||||||
|
return;
|
||||||
}
|
}
|
||||||
|
await router.replace({ name: 'home' });
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
onMounted(() => {
|
await repoStore.loadRepo(repoOwner.value, repoName.value);
|
||||||
loadRepo();
|
await buildStore.loadBuilds(repoOwner.value, repoName.value);
|
||||||
});
|
}
|
||||||
|
|
||||||
watch([repoOwner, repoName], () => {
|
onMounted(() => {
|
||||||
loadRepo();
|
loadRepo();
|
||||||
});
|
});
|
||||||
|
|
||||||
const badgeUrl = computed(() => `/api/badges/${repo.value.owner}/${repo.value.name}/status.svg`);
|
watch([repoOwner, repoName], () => {
|
||||||
|
loadRepo();
|
||||||
|
});
|
||||||
|
|
||||||
const activeTab = computed({
|
const badgeUrl = computed(() => `/api/badges/${repo.value.owner}/${repo.value.name}/status.svg`);
|
||||||
get() {
|
|
||||||
if (route.name === 'repo-branches' || route.name === 'repo-branch') {
|
|
||||||
return 'branches';
|
|
||||||
}
|
|
||||||
return 'activity';
|
|
||||||
},
|
|
||||||
set(tab: string) {
|
|
||||||
if (tab === 'branches') {
|
|
||||||
router.push({ name: 'repo-branches' });
|
|
||||||
} else {
|
|
||||||
router.push({ name: 'repo' });
|
|
||||||
}
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
return { repo, repoPermissions, badgeUrl, activeTab, forge };
|
const activeTab = computed({
|
||||||
|
get() {
|
||||||
|
if (route.name === 'repo-branches' || route.name === 'repo-branch') {
|
||||||
|
return 'branches';
|
||||||
|
}
|
||||||
|
return 'activity';
|
||||||
|
},
|
||||||
|
set(tab: string) {
|
||||||
|
if (tab === 'branches') {
|
||||||
|
router.push({ name: 'repo-branches' });
|
||||||
|
} else {
|
||||||
|
router.push({ name: 'repo' });
|
||||||
|
}
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -5,16 +5,7 @@
|
||||||
<IconButton icon="back" class="flex-shrink-0" @click="goBack" />
|
<IconButton icon="back" class="flex-shrink-0" @click="goBack" />
|
||||||
|
|
||||||
<h1
|
<h1
|
||||||
class="
|
class="order-3 w-full <md:flex-wrap md:order-none md:w-auto md:ml-2 flex text-center text-xl text-color whitespace-nowrap overflow-hidden overflow-ellipsis"
|
||||||
order-3
|
|
||||||
w-full
|
|
||||||
<md:flex-wrap
|
|
||||||
md:order-none md:w-auto md:ml-2
|
|
||||||
flex
|
|
||||||
text-center text-xl text-color
|
|
||||||
whitespace-nowrap
|
|
||||||
overflow-hidden overflow-ellipsis
|
|
||||||
"
|
|
||||||
>
|
>
|
||||||
<span class="w-full md:w-auto text-center">{{ $t('repo.build.pipeline', { buildId }) }}</span>
|
<span class="w-full md:w-auto text-center">{{ $t('repo.build.pipeline', { buildId }) }}</span>
|
||||||
<span class="<md:hidden mx-2">-</span>
|
<span class="<md:hidden mx-2">-</span>
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
{
|
{
|
||||||
"extends": "./tsconfig.json",
|
"extends": "./tsconfig.json",
|
||||||
"include": [".eslintrc.js", "jest.config.ts", "vite.config.ts", "windi.config.ts", "src", "test"]
|
"include": [".eslintrc.js", "jest.config.ts", "vite.config.ts", "windi.config.ts", "src", "test", "components.d.ts"]
|
||||||
}
|
}
|
||||||
|
|
2202
web/yarn.lock
2202
web/yarn.lock
File diff suppressed because it is too large
Load diff
Loading…
Reference in a new issue