From a2be651f047b929c7149d3d79c682db0d61159e3 Mon Sep 17 00:00:00 2001 From: David May <1301201+wass3r@users.noreply.github.com> Date: Thu, 14 Nov 2019 08:27:53 -0600 Subject: [PATCH] feat(links): add ability to customize help links (#18) --- .env.example | 17 ++++++++++++----- docker-entrypoint.sh | 2 +- src/elm/Main.elm | 18 ++++++++++++------ src/elm/Main/index.d.ts | 4 ++++ src/static/index.ts | 34 ++++++++++++++++++++++++++++++++++ 5 files changed, 63 insertions(+), 12 deletions(-) diff --git a/.env.example b/.env.example index 1005deae6..0958cf80d 100644 --- a/.env.example +++ b/.env.example @@ -3,7 +3,7 @@ # /_/--\ |_| |_| # -# Vela api server address, typically runs on port :8080 locally. +# Vela API server address, typically runs on port :8080. # Should match the "VELA_ADDR" value in docker-compose.yml # when running locally. VELA_API=http://localhost:8080 @@ -14,18 +14,25 @@ VELA_SOURCE_URL= # github oauth app client id VELA_SOURCE_CLIENT= -# github oauth app client secret -VELA_SOURCE_SECRET= +# customize the location where you want users to provide feedack +# (default) https://github.com/go-vela/ui/issues/new +# VELA_FEEDBACK_URL= + +# customize the location where users can review documentation +# (default) https://go-vela.github.io/docs +# VELA_DOCS_URL= # __ ___ _ # / /\ | |_) | | # /_/--\ |_| |_| # -# note: same as used by APP, henced commented out +# These should only be needed if you are running +# the docker compose stack as they are used by the api/server +# note: same as used by APP, henced commented out # github oauth app client id # VELA_SOURCE_CLIENT= # github oauth app client secret -# VELA_SOURCE_SECRET= +VELA_SOURCE_SECRET= diff --git a/docker-entrypoint.sh b/docker-entrypoint.sh index 0e53e37e6..ae2be0000 100755 --- a/docker-entrypoint.sh +++ b/docker-entrypoint.sh @@ -4,7 +4,7 @@ set -eu for f in /usr/share/nginx/html/*.js do # shellcheck disable=SC2016 - envsubst '${VELA_API},${VELA_SOURCE_URL},${VELA_SOURCE_CLIENT}' < "$f" > "$f".tmp && mv "$f".tmp "$f" + envsubst '${VELA_API},${VELA_SOURCE_URL},${VELA_SOURCE_CLIENT},${VELA_FEEDBACK_URL},{$VELA_DOCS_URL}' < "$f" > "$f".tmp && mv "$f".tmp "$f" done exec "$@" \ No newline at end of file diff --git a/src/elm/Main.elm b/src/elm/Main.elm index 760f8c458..895a73a1c 100644 --- a/src/elm/Main.elm +++ b/src/elm/Main.elm @@ -47,7 +47,7 @@ import Html.Attributes , value ) import Html.Events exposing (onClick, onInput) -import Html.Lazy exposing (lazy) +import Html.Lazy exposing (lazy2) import Http exposing (Error(..)) import Http.Detailed import Interop @@ -103,6 +103,8 @@ type alias Flags = , velaAPI : String , velaSourceBaseURL : String , velaSourceClient : String + , velaFeedbackURL : String + , velaDocsURL : String , velaSession : Maybe Session } @@ -120,6 +122,8 @@ type alias Model = , velaAPI : String , velaSourceBaseURL : String , velaSourceOauthStartURL : String + , velaFeedbackURL : String + , velaDocsURL : String , navigationKey : Navigation.Key , zone : Time.Zone , time : Time.Posix @@ -174,6 +178,8 @@ init flags url navKey = , UB.string "client_id" flags.velaSourceClient ] , velaSourceBaseURL = flags.velaSourceBaseURL + , velaFeedbackURL = flags.velaFeedbackURL + , velaDocsURL = flags.velaDocsURL , navigationKey = navKey , toasties = Alerting.initialState , zone = Time.utc @@ -664,7 +670,7 @@ view model = in { title = "Vela - " ++ title , body = - [ lazy viewHeader model.session + [ lazy2 viewHeader model.session { feedbackLink = model.velaFeedbackURL, docsLink = model.velaDocsURL } , viewNav model , div [ class "util" ] [ Build.viewBuildHistory model.time model.zone model.page model.builds.org model.builds.repo model.builds.builds ] , main_ [] @@ -1088,8 +1094,8 @@ navButton model = text "" -viewHeader : Maybe Session -> Html Msg -viewHeader maybeSession = +viewHeader : Maybe Session -> { feedbackLink : String, docsLink : String } -> Html Msg +viewHeader maybeSession { feedbackLink, docsLink } = let session : Session session = @@ -1115,8 +1121,8 @@ viewHeader maybeSession = ] ] , div [ class "help-links" ] - [ a [ href "https://github.com/go-vela/ui/issues/new" ] [ text "feedback" ] - , a [ href "https://go-vela.github.io/docs" ] [ text "docs" ] + [ a [ href feedbackLink ] [ text "feedback" ] + , a [ href docsLink ] [ text "docs" ] , FeatherIcons.terminal |> FeatherIcons.withSize 18 |> FeatherIcons.toHtml [] ] ] diff --git a/src/elm/Main/index.d.ts b/src/elm/Main/index.d.ts index ade34d776..b5a9f9345 100644 --- a/src/elm/Main/index.d.ts +++ b/src/elm/Main/index.d.ts @@ -51,6 +51,10 @@ export type Flags = { readonly velaSourceBaseURL: string; /** @property velaSourceClient the "Client ID" for the OAuth app set up in the source management tool */ readonly velaSourceClient: string; + /** @property velaFeedbackURL allows you to customize the destination of the feedback link */ + readonly velaFeedbackURL: string; + /** @property velaDocsURL allows you to customize the destination of the docs link */ + readonly velaDocsURL: string; /** @property velaSession used for passsing in an existing Vela session to Elm */ readonly velaSession: Session | null; }; diff --git a/src/static/index.ts b/src/static/index.ts index 536a4b25e..54279c6ef 100644 --- a/src/static/index.ts +++ b/src/static/index.ts @@ -5,6 +5,10 @@ import { Elm, Flags, App, Config, Session } from "../elm/Main"; import "../scss/style.scss"; +// Vela consts +const feedbackURL: string = "https://github.com/go-vela/ui/issues/new"; +const docsURL: string = "https://go-vela.github.io/docs"; + // setup for session state const storageKey: string = "vela"; const storedSessionState: string | null = sessionStorage.getItem(storageKey); @@ -18,6 +22,14 @@ const flags: Flags = { velaAPI: process.env.VELA_API || "$VELA_API", velaSourceBaseURL: process.env.VELA_SOURCE_URL || "$VELA_SOURCE_URL", velaSourceClient: process.env.VELA_SOURCE_CLIENT || "$VELA_SOURCE_CLIENT", + velaFeedbackURL: + process.env.VELA_FEEDBACK_URL || + envOrNull("VELA_FEEDBACK_URL", "$VELA_FEEDBACK_URL") || + feedbackURL, + velaDocsURL: + process.env.VELA_DOCS_URL || + envOrNull("VELA_DOCS_URL", "$VELA_DOCS_URL") || + docsURL, velaSession: currentSessionState || null }; @@ -40,3 +52,25 @@ app.ports.storeSession.subscribe(sessionMessage => { setTimeout(() => app.ports.onSessionChange.send(sessionMessage), 0); }); + +/** + * envOrNull is a basic helper that returns a substituted + * environment variable or null + * + * @param env the env variable to be substituted, sans "$" prefix + * @param subst the substituted variable (or not) + */ +function envOrNull(env: string, subst: string): string | null { + // substituted value is empty + if (!subst || !subst.trim()) { + return null; + } + + // value was not substituted; ignore + if (subst.indexOf(env) !== -1) { + return null; + } + + // value was substituted, return it + return subst; +}