josh/dashy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🌐 Translations for app config, json editor, rebuild dialog and css dialog

Browse Source
This commit is contained in:
Alicia Sykes
2021-07-24 14:18:48 +01:00
parent 921af8def1
commit ef3468e2fb
5 changed files with 144 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/Configuration/RebuildApp.vue
View File

@@ -2,35 +2,41 @@
<modal :name="modalName" :resizable="true" width="50%" height="60%" classes="dashy-modal">
<div class="rebuild-app-container">
<!-- Title, intro and start button -->
<h3 class="rebuild-app-title">Rebuild Application</h3>
<h3 class="rebuild-app-title">{{ $t('app-rebuild.title') }}</h3>
<p>
A rebuild is required for changes written to the conf.yml file to take effect.
This should happen automatically, but if it hasn't, you can manually trigger it here.<br>
This is not required for modifications stored locally.
{{ $t('app-rebuild.rebuild-note-l1') }}
{{ $t('app-rebuild.rebuild-note-l2') }}<br>
{{ $t('app-rebuild.rebuild-note-l3') }}
</p>
<Button :click="startBuild" :disabled="loading || !allowRebuild" :disallow="!allowRebuild">
<template v-slot:text>{{ loading ? 'Building...' : 'Start Build' }}</template>
<template v-slot:text>
{{ loading ? $t('app-rebuild.rebuilding-status-1') : $t('app-rebuild.rebuild-button') }}
</template>
<template v-slot:icon><RebuildIcon /></template>
</Button>
<div v-if="!allowRebuild">
<p class="disallow-rebuild-msg">You do no have permission to trigger this action</p>
<p class="disallow-rebuild-msg">{{ $t('app-rebuild.error-permission') }}</p>
</div>
<!-- Loading animation and text (shown while build is happening) -->
<div v-if="loading" class="loader-info">
<LoadingAnimation class="loader" />
<p class="loading-message">This may take a few minutes...</p>
<p class="loading-message">{{ $t('app-rebuild.rebuilding-status-2') }}...</p>
</div>
<!-- Build response, and next actions (shown after build is done) -->
<div class="rebuild-response" v-if="success !== undefined">
<p v-if="success" class="response-status success">✅ Build completed succesfully</p>
<p v-else class="response-status failure">❌ Build operation failed</p>
<p v-if="success" class="response-status success">
✅ {{ $t('app-rebuild.success-msg') }}
</p>
<p v-else class="response-status failure">
❌ {{ $t('app-rebuild.fail-msg') }}
</p>
<pre class="output"><code>{{ output || error }}</code></pre>
<p class="rebuild-message">{{ message }}</p>
<p v-if="success" class="rebuild-message">
A page reload is now required for changes to take effect
{{ $t('app-rebuild.reload-note') }}
</p>
<Button :click="refreshPage" v-if="success">
<template v-slot:text>Reload Page</template>
<template v-slot:text>{{ $t('app-rebuild.reload-button') }}</template>
<template v-slot:icon><ReloadIcon /></template>
</Button>
</div>
@@ -65,6 +71,7 @@ export default {
allowRebuild: true,
}),
methods: {
/* Calls to the rebuild endpoint, to kickoff the app build */
startBuild() {
const baseUrl = process.env.VUE_APP_DOMAIN || window.location.origin;
const endpoint = `${baseUrl}/config-manager/rebuild`;
@@ -77,6 +84,7 @@ export default {
this.finished({ success: false, error });
});
},
/* Called when rebuild is complete, updates UI with either success or fail message */
finished(responseData) {
this.loading = false;
if (responseData) {
@@ -89,7 +97,8 @@ export default {
this.error = error;
}
this.$toasted.show(
(this.success ? '✅ Build Completed Succesfully' : '❌ Build Failed'),
(this.success
? `✅ ${this.$t('app-rebuild.success-msg')}` : `❌ ${this.$t('app-rebuild.fail-msg')}`),
{ className: `toast-${this.success ? 'success' : 'error'}` },
);
},