From 6f8457381aed09276cd3f4e9101b248a30be10ce Mon Sep 17 00:00:00 2001 From: Axolotle Date: Wed, 15 Jul 2020 16:39:24 +0200 Subject: [PATCH] =?UTF-8?q?linting=E2=80=A6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/src/App.vue | 249 +++++++++++++++------------- app/src/components/Breadcrumb.vue | 76 ++++----- app/src/components/globals/Icon.vue | 30 ++-- app/src/components/globals/index.js | 2 +- app/src/helpers/api.js | 100 ++++++----- app/src/main.js | 13 +- app/src/plugins/i18n.js | 43 +++-- app/src/plugins/router.js | 22 ++- app/src/plugins/store.js | 43 +++-- app/src/routes.js | 36 ++-- app/src/scss/main.scss | 10 +- app/src/views/Home.vue | 48 +++--- app/src/views/Login.vue | 97 +++++------ app/src/views/User.vue | 234 ++++++++++++++------------ app/src/views/Users.vue | 120 +++++++------- 15 files changed, 577 insertions(+), 546 deletions(-) diff --git a/app/src/App.vue b/app/src/App.vue index e445a77a..17ad4278 100644 --- a/app/src/App.vue +++ b/app/src/App.vue @@ -1,48 +1,64 @@ @@ -101,46 +116,46 @@ export default { @import '@/scss/main.scss'; #app > header { - border-bottom: 1px solid #eee; - padding-top: 1rem; - margin-bottom: 1rem; + border-bottom: 1px solid #eee; + padding-top: 1rem; + margin-bottom: 1rem; - .navbar { - padding: 1rem 0; + .navbar { + padding: 1rem 0; - img { - width: 70px; - } - - .navbar-nav { - flex-direction: column; - - li { - margin: .2rem 0; - } - icon { - margin-left: .5rem; - } - } + img { + width: 70px; } + + .navbar-nav { + flex-direction: column; + + li { + margin: .2rem 0; + } + icon { + margin-left: .5rem; + } + } + } } #app > footer { - padding: 1rem 0; - border-top: 1px solid #eee; - font-size: 0.875rem; - margin-top: 2rem; + padding: 1rem 0; + border-top: 1px solid #eee; + font-size: 0.875rem; + margin-top: 2rem; - .nav-item { - & + .nav-item a::before { - content: "•"; - width: 1rem; - display: inline-block; - margin-left: -1.15rem; - } - &:first-child { - margin-left: -1rem; - } + .nav-item { + & + .nav-item a::before { + content: "•"; + width: 1rem; + display: inline-block; + margin-left: -1.15rem; } + &:first-child { + margin-left: -1rem; + } + } } diff --git a/app/src/components/Breadcrumb.vue b/app/src/components/Breadcrumb.vue index c1da775b..7f0e4ac6 100644 --- a/app/src/components/Breadcrumb.vue +++ b/app/src/components/Breadcrumb.vue @@ -1,51 +1,51 @@ diff --git a/app/src/components/globals/Icon.vue b/app/src/components/globals/Icon.vue index 3101465b..715ba1c3 100644 --- a/app/src/components/globals/Icon.vue +++ b/app/src/components/globals/Icon.vue @@ -1,27 +1,29 @@ diff --git a/app/src/components/globals/index.js b/app/src/components/globals/index.js index 4affac78..e4375f59 100644 --- a/app/src/components/globals/index.js +++ b/app/src/components/globals/index.js @@ -1 +1 @@ -export {default as Icon} from './Icon' +export { default as Icon } from './Icon' diff --git a/app/src/helpers/api.js b/app/src/helpers/api.js index 02d53c81..e0604870 100644 --- a/app/src/helpers/api.js +++ b/app/src/helpers/api.js @@ -1,63 +1,57 @@ - - -function objectToParams(object) { - const urlParams = new URLSearchParams(); - for (const [key, value] of Object.entries(object)) { - urlParams.append(key, value) - } - return urlParams +function objectToParams (object) { + const urlParams = new URLSearchParams() + for (const [key, value] of Object.entries(object)) { + urlParams.append(key, value) + } + return urlParams } - -function handleResponse(response, type = 'json') { - return response.ok ? response[type]() : handleErrors(response) +function handleResponse (response, type = 'json') { + return response.ok ? response[type]() : handleErrors(response) } - -function handleErrors(response) { - if (response.status == 401) { - throw new Error('Unauthorized'); - } +function handleErrors (response) { + if (response.status === 401) { + throw new Error('Unauthorized') + } } - export default { - options: { - credentials: 'include', - mode: 'cors', - headers: { - // FIXME is it important to keep this previous `Accept` header ? - // 'Accept': 'application/json, text/javascript, */*; q=0.01', - // Auto header is : - // "Accept": "*/*", + options: { + credentials: 'include', + mode: 'cors', + headers: { + // FIXME is it important to keep this previous `Accept` header ? + // 'Accept': 'application/json, text/javascript, */*; q=0.01', + // Auto header is : + // "Accept": "*/*", - // Also is this still important ? (needed by back-end) - 'X-Requested-With': 'XMLHttpRequest', - } - }, - - get(uri) { - return fetch('/api/' + uri, this.options) - .then(response => handleResponse(response)) - .catch(err => { - console.log(err) - }) - }, - - login(password) { - return fetch('/api/login', { - method: 'POST', - body: objectToParams({password}), - ...this.options - }).then(response => (response.ok)) - }, - - logout() { - return fetch('/api/logout', this.options).then(response => (response.ok)) - }, - - getVersion() { - return fetch('/api/versions', this.options) - .then(response => handleResponse(response)) + // Also is this still important ? (needed by back-end) + 'X-Requested-With': 'XMLHttpRequest' } + }, + + get (uri) { + return fetch('/api/' + uri, this.options) + .then(response => handleResponse(response)) + .catch(err => { + console.log(err) + }) + }, + + login (password) { + return fetch('/api/login', { + method: 'POST', + body: objectToParams({ password }), + ...this.options + }).then(response => (response.ok)) + }, + + logout () { + return fetch('/api/logout', this.options).then(response => (response.ok)) + }, + + getVersion () { + return fetch('/api/versions', this.options).then(response => handleResponse(response)) + } } diff --git a/app/src/main.js b/app/src/main.js index faeff0e2..a32333e9 100644 --- a/app/src/main.js +++ b/app/src/main.js @@ -7,17 +7,16 @@ import store from './plugins/store' import * as globalsComponents from './components/globals' - Vue.config.productionTip = false // Register global components -for (let component of Object.values(globalsComponents)) { - Vue.component(component.name, component) +for (const component of Object.values(globalsComponents)) { + Vue.component(component.name, component) } new Vue({ - i18n, - router, - store, - render: h => h(App), + i18n, + router, + store, + render: h => h(App) }).$mount('#app') diff --git a/app/src/plugins/i18n.js b/app/src/plugins/i18n.js index 6fe8c78c..164b8b3c 100644 --- a/app/src/plugins/i18n.js +++ b/app/src/plugins/i18n.js @@ -1,35 +1,34 @@ import Vue from 'vue' import VueI18n from 'vue-i18n' - Vue.use(VueI18n) function loadLocaleMessages () { - const locales = require.context('../locales', true, /[A-Za-z0-9-_,\s]+\.json$/i) - const messages = {} - locales.keys().forEach(key => { - const matched = key.match(/([A-Za-z0-9-_]+)\./i) - if (matched && matched.length > 1) { - const locale = matched[1] - messages[locale] = locales(key) - } - }) - return messages + const locales = require.context('../locales', true, /[A-Za-z0-9-_,\s]+\.json$/i) + const messages = {} + locales.keys().forEach(key => { + const matched = key.match(/([A-Za-z0-9-_]+)\./i) + if (matched && matched.length > 1) { + const locale = matched[1] + messages[locale] = locales(key) + } + }) + return messages } -function getBrowserLocale() { - const navigatorLocale = navigator.languages !== undefined - ? navigator.languages[0] - : navigator.language +function getBrowserLocale () { + const navigatorLocale = navigator.languages !== undefined + ? navigator.languages[0] + : navigator.language - return !navigatorLocale - ? process.env.VUE_APP_I18N_LOCALE || 'en' - : navigatorLocale + return !navigatorLocale + ? process.env.VUE_APP_I18N_LOCALE || 'en' + : navigatorLocale } export default new VueI18n({ - locale: getBrowserLocale(), - fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en', - // TODO : chunk locales json and lazy load them - messages: loadLocaleMessages() + locale: getBrowserLocale(), + fallbackLocale: process.env.VUE_APP_I18N_FALLBACK_LOCALE || 'en', + // TODO : chunk locales json and lazy load them + messages: loadLocaleMessages() }) diff --git a/app/src/plugins/router.js b/app/src/plugins/router.js index 50d5332a..64523b5f 100644 --- a/app/src/plugins/router.js +++ b/app/src/plugins/router.js @@ -3,24 +3,22 @@ import VueRouter from 'vue-router' import routes from '../routes' import store from './store' - Vue.use(VueRouter) const router = new VueRouter({ - // mode: 'history', // this allow all routes to be real ones (without '#') - base: process.env.BASE_URL, - routes + // mode: 'history', // this allow all routes to be real ones (without '#') + base: process.env.BASE_URL, + routes }) // Before each route request hook router.beforeEach((to, from, next) => { - // Allow if connected or route is not protected - if (store.state.connected || to.meta.noAuth) { - next() - } else { - next({name: 'login', query: {redirect: to.path}}) - } + // Allow if connected or route is not protected + if (store.state.connected || to.meta.noAuth) { + next() + } else { + next({ name: 'login', query: { redirect: to.path } }) + } }) - -export default router; +export default router diff --git a/app/src/plugins/store.js b/app/src/plugins/store.js index e4c90110..8ff05314 100644 --- a/app/src/plugins/store.js +++ b/app/src/plugins/store.js @@ -1,31 +1,30 @@ import Vue from 'vue' import Vuex from 'vuex' - Vue.use(Vuex) export default new Vuex.Store({ - state: { - connected: localStorage.getItem('connected') === 'true', - yunohostInfos: null + state: { + connected: localStorage.getItem('connected') === 'true', + yunohostInfos: null + }, + // Mutations must be synchronous. They are used to change the store state. + mutations: { + 'CONNECTED' (state, connected) { + localStorage.setItem('connected', connected) + state.connected = connected + if (!connected) { + state.yunohostInfos = null + } }, - // Mutations must be synchronous. They are used to change the store state. - mutations: { - ['CONNECTED'] (state, connected) { - localStorage.setItem('connected', connected) - state.connected = connected - if (!connected) { - state.yunohostInfos = null - } - }, - ['YUNOHOST_INFOS'] (state, data) { - console.log('version changed', data); - state.yunohostInfos = data - } - }, - // Actions may be asynchronous. They are used to commit mutations. - actions: { - }, - modules: { + 'YUNOHOST_INFOS' (state, data) { + console.log('version changed', data) + state.yunohostInfos = data } + }, + // Actions may be asynchronous. They are used to commit mutations. + actions: { + }, + modules: { + } }) diff --git a/app/src/routes.js b/app/src/routes.js index a334dbe0..b6bbf01d 100644 --- a/app/src/routes.js +++ b/app/src/routes.js @@ -3,21 +3,29 @@ import Login from './views/Login' import Users from './views/Users' import User from './views/User' - const routes = [ - {name: 'home', path: '/', component: Home}, - {name: 'login', path: '/login', component: Login, meta: { - noAuth: true - }}, - {name: 'users', path: '/users', component: Users, meta: { - breadcrumb: [{name: 'users', trad: 'users'}] - }}, - {name: 'user', path: '/user/:name', component: User, props: true, meta: { - breadcrumb: [ - {name: 'users', trad: 'users'}, - {name: 'user', param: 'name'} - ] - }}, + { name: 'home', path: '/', component: Home }, + { name: 'login', path: '/login', component: Login, meta: { noAuth: true } }, + { + name: 'users', + path: '/users', + component: Users, + meta: { + breadcrumb: [{ name: 'users', trad: 'users' }] + } + }, + { + name: 'user', + path: '/user/:name', + component: User, + props: true, + meta: { + breadcrumb: [ + { name: 'users', trad: 'users' }, + { name: 'user', param: 'name' } + ] + } + } ] export default routes diff --git a/app/src/scss/main.scss b/app/src/scss/main.scss index 9392964a..ef067c6d 100644 --- a/app/src/scss/main.scss +++ b/app/src/scss/main.scss @@ -18,20 +18,20 @@ // Bootstrap overrides body { - margin: 0; - font-family: "Source Sans Pro", "Helvetica Neue", "Fira Sans", Helvetica, Arial, sans-serif; + margin: 0; + font-family: "Source Sans Pro", "Helvetica Neue", "Fira Sans", Helvetica, Arial, sans-serif; } .list-group-item { - padding: 0.75rem 1rem; + padding: 0.75rem 1rem; } .list-group-item-action { - color: #333; + color: #333; } // Fork-awesome overrides .fa-fw { - width: 1.25em !important; + width: 1.25em !important; } diff --git a/app/src/views/Home.vue b/app/src/views/Home.vue index f4ef4cd3..791b1191 100644 --- a/app/src/views/Home.vue +++ b/app/src/views/Home.vue @@ -1,32 +1,32 @@ diff --git a/app/src/views/Login.vue b/app/src/views/Login.vue index 2248f842..493c2939 100644 --- a/app/src/views/Login.vue +++ b/app/src/views/Login.vue @@ -1,58 +1,59 @@ diff --git a/app/src/views/User.vue b/app/src/views/User.vue index 21ce8892..b0705f00 100644 --- a/app/src/views/User.vue +++ b/app/src/views/User.vue @@ -1,63 +1,73 @@ @@ -87,68 +102,67 @@ export default { @import '@/scss/main.scss'; .card-body > div { - flex-direction: column; - @include media-breakpoint-up(md) { - flex-direction: row; - } + flex-direction: column; + @include media-breakpoint-up(md) { + flex-direction: row; + } } h2 { - margin: 0; + margin: 0; } .icon.fa-user { - font-size: 10rem; - padding-right: 3rem; - padding-left: 1.75rem; + font-size: 10rem; + padding-right: 3rem; + padding-left: 1.75rem; } .row { - + .row { - border-top: 1px solid #eee; - } + + .row { + border-top: 1px solid #eee; + } - padding: .5rem; + padding: .5rem; } .col { - margin: 0; + margin: 0; } ul { - margin: 0; - padding: 0; + margin: 0; + padding: 0; - li { - font-style: italic; - list-style: none; - } + li { + font-style: italic; + list-style: none; + } } .skeleton { - opacity: 0.5; + opacity: 0.5; - h2 { - height: #{2 * 1.2}rem; + h2 { + height: #{2 * 1.2}rem; + } + .col { + & > * { + display: block; + background-color: $skeleton-color; + height: 1.5rem; + max-width: 8rem; } - .col { - & > * { - display: block; - background-color: $skeleton-color; - height: 1.5rem; - max-width: 8rem; - } - - strong { - max-width: 12rem; - } + strong { + max-width: 12rem; } + } - button { - height: calc(2.25rem + 2px); - width: 7rem; - } + button { + height: calc(2.25rem + 2px); + width: 7rem; + } } diff --git a/app/src/views/Users.vue b/app/src/views/Users.vue index 1153c185..774e9f3f 100644 --- a/app/src/views/Users.vue +++ b/app/src/views/Users.vue @@ -1,32 +1,34 @@ @@ -60,22 +62,22 @@ export default { @import '@/scss/_variables.scss'; p { - margin: 0 + margin: 0 } .skeleton { - @each $i, $opacity in 1 .75, 2 .5, 3 .25 { - .list-group-item:nth-child(#{$i}) { opacity: $opacity; } - } + @each $i, $opacity in 1 .75, 2 .5, 3 .25 { + .list-group-item:nth-child(#{$i}) { opacity: $opacity; } + } - h5, p { - background-color: $skeleton-color; - height: 1.5rem; - width: 10rem; - } + h5, p { + background-color: $skeleton-color; + height: 1.5rem; + width: 10rem; + } - small { - display: none; - } + small { + display: none; + } }