add about page. fixes #15

This commit is contained in:
Thomas Amland 2020-09-19 13:36:06 +02:00
parent 419f26b8bf
commit 30570ff662
5 changed files with 64 additions and 7 deletions

View File

@ -4,7 +4,7 @@ on: [push, pull_request]
env: env:
IMAGE: ${{ github.repository }} IMAGE: ${{ github.repository }}
VERSION: ${{ github.sha }} TAG: ${{ github.sha }}
jobs: jobs:
build: build:
@ -20,7 +20,10 @@ jobs:
run: yarn install run: yarn install
- name: Build - name: Build
run: VUE_APP_VERSION=$VERSION yarn build run: |
export VUE_APP_BUILD=$TAG
export VUE_APP_BUILD_DATE=$(date --iso-8601)
yarn build
- name: Upload artifact - name: Upload artifact
uses: actions/upload-artifact@v2 uses: actions/upload-artifact@v2
@ -29,12 +32,12 @@ jobs:
path: dist path: dist
- name: Build docker image - name: Build docker image
run: docker build -t $IMAGE:$VERSION -f docker/Dockerfile . run: docker build -t $IMAGE:$TAG -f docker/Dockerfile .
- name: Push docker image - name: Push docker image
run: | run: |
docker login -u ${{ secrets.DOCKER_HUB_USERNAME }} -p ${{ secrets.DOCKER_HUB_PASSWORD }} docker login -u ${{ secrets.DOCKER_HUB_USERNAME }} -p ${{ secrets.DOCKER_HUB_PASSWORD }}
docker push $IMAGE:$VERSION docker push $IMAGE:$TAG
preview: preview:
runs-on: ubuntu-latest runs-on: ubuntu-latest
@ -79,7 +82,7 @@ jobs:
steps: steps:
- name: Push latest - name: Push latest
run: | run: |
docker pull $IMAGE:$VERSION docker pull $IMAGE:$TAG
docker tag $IMAGE:$VERSION $IMAGE:latest docker tag $IMAGE:$TAG $IMAGE:latest
docker login -u ${{ secrets.DOCKER_HUB_USERNAME }} -p ${{ secrets.DOCKER_HUB_PASSWORD }} docker login -u ${{ secrets.DOCKER_HUB_USERNAME }} -p ${{ secrets.DOCKER_HUB_PASSWORD }}
docker push $IMAGE:latest docker push $IMAGE:latest

View File

@ -1,6 +1,6 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head data-version="<%= process.env.VUE_APP_VERSION %>"> <head data-build="<%= process.env.VUE_APP_BUILD %>">
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<% if (process.env.NODE_ENV === "production") { %> <% if (process.env.NODE_ENV === "production") { %>

40
src/app/About.vue Normal file
View File

@ -0,0 +1,40 @@
<template>
<b-modal size="lg" hide-header hide-footer :visible="visible" @change="$emit('close')">
<div style="width: 200px" class="mx-auto mb-3">
<Logo />
</div>
<div class="text-center">
<ExternalLink :href="url">
GitHub <Icon icon="box-arrow-up-right" />
</ExternalLink>
<p>
Licensed under the AGPLv3 license.
</p>
<div>Build: {{ build }}</div>
<div>Build date: {{ buildDate }}</div>
</div>
<div class="d-flex justify-content-end">
<button class="btn btn-secondary" @click="$emit('close')">
Close
</button>
</div>
</b-modal>
</template>
<script lang="ts">
import Vue from 'vue'
import Logo from './Logo.vue'
export default Vue.extend({
components: {
Logo,
},
props: {
visible: { type: Boolean, required: true },
},
computed: {
build: () => process.env.VUE_APP_BUILD,
buildDate: () => process.env.VUE_APP_BUILD_DATE,
url: () => 'https://github.com/tamland/airsonic-frontend'
},
})
</script>

View File

@ -25,22 +25,34 @@
<b-dropdown-item :href="`${server}/settings.view`"> <b-dropdown-item :href="`${server}/settings.view`">
Server settings Server settings
</b-dropdown-item> </b-dropdown-item>
<b-dropdown-item-button @click="showAboutModal = true">
About
</b-dropdown-item-button>
<b-dropdown-divider />
<b-dropdown-item-button @click="logout"> <b-dropdown-item-button @click="logout">
Log out Log out
</b-dropdown-item-button> </b-dropdown-item-button>
</b-dropdown> </b-dropdown>
</template> </template>
<About :visible="showAboutModal" @close="showAboutModal = false" />
</div> </div>
</template> </template>
<script lang="ts"> <script lang="ts">
import Vue from 'vue' import Vue from 'vue'
import { mapActions, mapState } from 'vuex' import { mapActions, mapState } from 'vuex'
import About from './About.vue'
import SearchForm from '@/search/SearchForm.vue' import SearchForm from '@/search/SearchForm.vue'
export default Vue.extend({ export default Vue.extend({
components: { components: {
About,
SearchForm, SearchForm,
}, },
data() {
return {
showAboutModal: false
}
},
computed: { computed: {
...mapState([ ...mapState([
'server', 'server',

View File

@ -5,6 +5,7 @@
import Vue from 'vue' import Vue from 'vue'
import { import {
BIcon, BIcon,
BIconBoxArrowUpRight,
BIconBroadcast, BIconBroadcast,
BIconCardText, BIconCardText,
BIconChevronCompactRight, BIconChevronCompactRight,
@ -29,6 +30,7 @@
export default Vue.extend({ export default Vue.extend({
components: { components: {
BIcon, BIcon,
BIconBoxArrowUpRight,
BIconBroadcast, BIconBroadcast,
BIconCardText, BIconCardText,
BIconChevronCompactRight, BIconChevronCompactRight,