1
0
mirror of https://github.com/woodpecker-ci/woodpecker.git synced 2024-12-12 08:23:48 +02:00
woodpecker/web
Martin W. Kirst 2c1fc4b500
support custom .JS and .CSS files for custom banner messages (white-labeling) (#1781)
This PR introduces two new server configuration options, for providing a
custom .JS and .CSS file.
These can be used to show custom banner messages, add
environment-dependent signals, or simply a corporate logo.

### Motivation (what problem I try to solve)

I'm operating Woodpecker in multiple k8s clusters for different
environments.
When having multiple browser tabs open, I prefer strong indicators for
each environment.
E.g. a red "PROD" banner, or just a blue "QA" banner.
Also, we sometimes need to have the chance for maintenance, and instead
of broadcasting emails,
I prefer a banner message, stating something like: "Heads-up: there's a
planned downtime, next Friday, blabla...".

Also, I like to have the firm's logo visible, which makes Woodpecker
look more like an integral part of our platform.

### Implementation notes

* Two new config options are introduced ```WOODPECKER_CUSTOM_CSS_FILE```
and ```WOODPECKER_CUSTOM_JS_FILE```
* I've piggy-bagged the existing handler for assets, as it seemed to me
a minimally invasive approach
* the option along with an example is documented
* a simple unit test for the Gin-handler ensures some regression safety
* no extra dependencies are introduced

### Visual example

The documented example will look like this.

![Screenshot 2023-05-27 at 17 00
44](https://github.com/woodpecker-ci/woodpecker/assets/1189394/8940392e-463c-4651-a1eb-f017cd3cd64d)

### Areas of uncertainty 

This is my first contribution to Woodpecker and I tried my best to align
with your conventions.
That said, I found myself uncertain about these things and would be glad
about getting feedback.

* The handler tests are somewhat different than the other ones because I
wanted to keep them simple - I hope that still matches your coding
guidelines
* caching the page sometimes will let the browser not recognize changes
and a user must reload. I'm not fully into the details of how caching is
implemented and neither can judge if it's a real problem. Another pair
of eyes would be good.
2023-07-10 12:46:35 +02:00
..
public/favicons Improve favicons (#576) 2021-12-08 13:58:00 +01:00
src Translated using Weblate (Latvian) 2023-07-09 20:44:58 +00:00
.eslintignore Update dependencies and tiny adjustments to UI (#1083) 2022-08-09 14:13:32 +02:00
.eslintrc.js Hide not owned repos from sidebar and repo list (#1453) 2023-01-31 09:37:11 +01:00
.gitignore Rewrite of WebUI (#245) 2021-11-03 17:40:31 +01:00
.prettierignore Replace yarn with pnpm (#1240) 2022-10-08 16:15:07 +02:00
.prettierrc.js Rewrite of WebUI (#245) 2021-11-03 17:40:31 +01:00
components.d.ts Do not store inactive repos (#1658) 2023-03-21 23:01:59 +01:00
index.html support custom .JS and .CSS files for custom banner messages (white-labeling) (#1781) 2023-07-10 12:46:35 +02:00
LICENSE Pull in frontend 2019-11-12 14:27:39 +01:00
package.json Overwrite web dep version (#1919) 2023-07-03 07:52:25 +02:00
pnpm-lock.yaml Overwrite web dep version (#1919) 2023-07-03 07:52:25 +02:00
tsconfig.eslint.json Update dependencies and tiny adjustments to UI (#1083) 2022-08-09 14:13:32 +02:00
tsconfig.json Rewrite of WebUI (#245) 2021-11-03 17:40:31 +01:00
vite.config.ts Update frontend dependencies (#1655) 2023-03-20 00:07:18 +01:00
web.go Update Go dependencies and minimal Go version to 1.20 (#1650) 2023-03-21 00:48:15 +01:00
windi.config.ts Unify buttons, links and improve focus styles (#1317) 2022-11-18 08:10:43 +01:00