Skip to content

Commit

Permalink
refactor(ui): merge configUrl and configPath in config
Browse files Browse the repository at this point in the history 
BREAKING CHANGE:
configUrl and configPath are removed
from now, use ?config=... parameter
  • Loading branch information
@Alex-D
Alex-D committed May 1, 2020
1 parent c9c0040 commit 51baae9
Show file tree
Hide file tree
Showing 3 changed files with 20 additions and 54 deletions.
40 changes: 15 additions & 25 deletions ui/src/components/Errors.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@
<div class="c-monitoror-errors-title" v-if="hasConfigVerifyErrors">
We found {{errors.length}} error{{errors.length > 1 ? 's' : ''}} in this configuration file:
</div>
<template v-if="configUrlOrPath !== 'undefined'">
<code>{{configUrlOrPath}}</code> <br><br>
<template v-if="configParam !== 'undefined'">
<code>{{configParam}}</code> <br><br>
</template>
Last refresh at {{lastRefreshDate}}

Expand All @@ -31,16 +31,6 @@
Your configuration URL or path seems broken, please verify it
</p>
</template>
<template v-else-if="error.id === ConfigErrorId.MissingPathOrUrl">
<p class="c-monitoror-errors--error-title">
Missing <code>configPath</code> or <code>configUrl</code> query param
</p>
<p>
<a href="https://monitoror.com/documentation/#ui-configuration" target="_blank">
Check UI configuration documentation
</a>
</p>
</template>

<!-- Config verify errors -->
<template v-else-if="error.id === ConfigErrorId.FieldTypeMismatch">
Expand All @@ -52,7 +42,7 @@
<p>
Expected type: <code>{{error.data.expected}}</code>
</p>
<pre v-if="error.data.configExtract" :data-config-path-or-url="configUrlOrPath"><code
<pre v-if="error.data.configExtract" :data-config-param="configParam"><code
v-html="formatConfigExtract(error)"></code></pre>
<p class="go-to-documentation">
<a href="https://monitoror.com/documentation/" target="_blank">
Expand All @@ -68,7 +58,7 @@
<p>
Try to escape the backslash: <code>\{{error.data.configExtractHighlight}}</code>
</p>
<pre v-if="error.data.configExtract" :data-config-path-or-url="configUrlOrPath"><code
<pre v-if="error.data.configExtract" :data-config-param="configParam"><code
v-html="formatConfigExtract(error)"></code></pre>
<p class="go-to-documentation">
<a href="https://monitoror.com/documentation/" target="_blank">
Expand All @@ -82,7 +72,7 @@
<code>{{error.data.fieldName}}</code>
value
</p>
<pre v-if="error.data.configExtract" :data-config-path-or-url="configUrlOrPath"><code
<pre v-if="error.data.configExtract" :data-config-param="configParam"><code
v-html="formatConfigExtract(error)"></code></pre>
<p class="go-to-documentation" v-if="getTileDocUrl(error) !== undefined">
<a :href="getTileDocUrl(error)" target="_blank">
Expand All @@ -94,7 +84,7 @@
<p class="c-monitoror-errors--error-title">
Missing required <code>{{error.data.fieldName}}</code> field
</p>
<pre :data-config-path-or-url="configUrlOrPath"><code v-html="formatConfigExtract(error)"></code></pre>
<pre :data-config-param="configParam"><code v-html="formatConfigExtract(error)"></code></pre>
<p class="go-to-documentation">
<a href="https://monitoror.com/documentation/" target="_blank">
Go to documentation
Expand All @@ -108,7 +98,7 @@
<p>
{{error.message}}
</p>
<pre :data-config-path-or-url="configUrlOrPath"><code v-html="formatConfigExtract(error)"></code></pre>
<pre :data-config-param="configParam"><code v-html="formatConfigExtract(error)"></code></pre>
<p class="go-to-documentation">
<a href="https://monitoror.com/documentation/" target="_blank">
Go to documentation
Expand All @@ -126,7 +116,7 @@
Did you mean
<code>{{guessExpectedFieldName(error.data.fieldName, splitList(error.data.expected))}}</code>?
</p>
<pre :data-config-path-or-url="configUrlOrPath"><code v-html="formatConfigExtract(error)"></code></pre>
<pre :data-config-param="configParam"><code v-html="formatConfigExtract(error)"></code></pre>
<p class="go-to-documentation">
<a href="https://monitoror.com/documentation/" target="_blank">
Go to documentation
Expand All @@ -145,7 +135,7 @@
<code>{{guessExpectedValue(error.data.configExtract, error.data.fieldName,
splitList(error.data.expected))}}</code>?
</p>
<pre :data-config-path-or-url="configUrlOrPath"><code v-html="formatConfigExtract(error)"></code></pre>
<pre :data-config-param="configParam"><code v-html="formatConfigExtract(error)"></code></pre>
<p class="go-to-documentation">
<a href="https://monitoror.com/documentation/#tile-definitions" target="_blank">
Go to <strong>Tile definitions</strong> documentation section
Expand All @@ -158,7 +148,7 @@
<code>{{parsedExtractFieldValue(error.data.configExtractHighlight, 'type')}}</code>
type as <code>GROUP</code> subtile
</p>
<pre :data-config-path-or-url="configUrlOrPath"><code
<pre :data-config-param="configParam"><code
v-html="ellipsisUnnecessaryParams(formatConfigExtract(error))"></code></pre>
</template>
<template v-else-if="error.id === ConfigErrorId.UnsupportedVersion">
Expand Down Expand Up @@ -194,7 +184,7 @@
<p>
{{error.id}}
</p>
<pre :data-config-path-or-url="configUrlOrPath"><code
<pre :data-config-param="configParam"><code
v-html="formatConfigExtract(error)"></code></pre>
</template>
</div>
Expand Down Expand Up @@ -229,8 +219,8 @@
}
}
get configUrlOrPath(): string {
return this.$store.getters.configUrl || decodeURIComponent(this.$store.getters.configPath)
get configParam(): string {
return this.$store.getters.configParam
}
get lastRefreshDate(): string {
Expand Down Expand Up @@ -337,9 +327,9 @@
color: var(--color-spring-wood);
}
pre[data-config-path-or-url] {
pre[data-config-param] {
&::after {
content: "// " attr(data-config-path-or-url);
content: "// " attr(data-config-param);
position: absolute;
top: 30px;
left: $error-padding;
Expand Down
1 change: 0 additions & 1 deletion ui/src/helpers/hasConfigVerifyErrors.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import ConfigError from '@/interfaces/configError'
const CONFIG_NON_VERIFY_ERRORS = [
ConfigErrorId.CannotBeFetched,
ConfigErrorId.ConfigNotFound,
ConfigErrorId.MissingPathOrUrl,
]

export default function hasConfigVerifyErrors(errors: ConfigError[]): boolean {
Expand Down
33 changes: 5 additions & 28 deletions ui/src/store.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -65,26 +65,14 @@ const store: StoreOptions<RootState> = {

return apiBaseUrl
},
configPath(): string | undefined {
const configPath = getQueryParamValue('configPath')

return configPath
},
configUrl(): string | undefined {
const configUrl = getQueryParamValue('configUrl')

return configUrl
configParam(): string {
return getQueryParamValue('config', 'default') as string
},
proxyfiedConfigUrl(state, getters): string | undefined {
const configProxyUrl = `${getters.apiBaseUrl}${API_BASE_PATH}/config`
const configProxyUrl = `${getters.apiBaseUrl}${API_BASE_PATH}/configs`
const urlEncodedConfigParam = encodeURIComponent(getters.configParam)

if (getters.configUrl !== undefined) {
return `${configProxyUrl}?url=${getters.configUrl}`
}

if (getters.configPath !== undefined) {
return `${configProxyUrl}?path=${getters.configPath}`
}
return `${configProxyUrl}/${urlEncodedConfigParam}`
},
theme(): Theme {
let theme = Theme.Default
Expand Down Expand Up @@ -214,17 +202,6 @@ const store: StoreOptions<RootState> = {
})
},
async fetchConfiguration({commit, state, getters, dispatch}) {
if (getters.proxyfiedConfigUrl === undefined) {
const configPathOrUrlIsMissing: ConfigError = {
id: ConfigErrorId.MissingPathOrUrl,
message: 'configPath or configUrl query param is missing',
data: {},
}

commit('setErrors', [configPathOrUrlIsMissing])
return
}

const hydrateTile = (tile: TileConfig, groupTile?: TileConfig) => {
// Create a identifier based on tile configuration
tile.stateKey = tile.type + '_' + md5.hashStr(JSON.stringify(tile))
Expand Down

0 comments on commit 51baae9

Please sign in to comment.