initial dependency update with initial setup

This commit is contained in:
Mateusz Michałowski 2024-07-11 08:14:59 +02:00
parent 54c1bd4cdc
commit e84ae7c352
11 changed files with 194 additions and 162 deletions

View File

@ -23,7 +23,9 @@
"@babel/core": "^7.15.8",
"@babel/node": "^7.15.8",
"@babel/preset-env": "^7.15.8",
"@vue/cli-plugin-unit-jest": "^4.5.14",
"@vue/apollo-option": "^4.0.0",
"@vue/cli-plugin-unit-jest": "~5.0.8",
"@vue/compat": "3.4.31",
"@vue/eslint-config-prettier": "^6.0.0",
"@vue/test-utils": "^1.2.2",
"apollo-boost": "^0.4.9",
@ -32,8 +34,8 @@
"babel-plugin-component": "^1.1.1",
"babel-preset-env": "^1.7.0",
"babel-preset-vue": "^2.0.2",
"bootstrap": "4.3.1",
"bootstrap-vue": "^2.21.2",
"bootstrap": "^5.3.3",
"bootstrap-vue-next": "^0.23.2",
"core-js": "^3.6.5",
"date-fns": "^2.29.3",
"dotenv-webpack": "^7.0.3",
@ -43,25 +45,26 @@
"jest": "26.6.3",
"jest-canvas-mock": "^2.3.1",
"jest-environment-jsdom-sixteen": "^2.0.0",
"portal-vue": "^2.1.7",
"portal-vue": "3.0.0",
"qrcanvas-vue": "2.1.1",
"regenerator-runtime": "^0.13.9",
"stats-webpack-plugin": "^0.7.0",
"vue": "^2.6.11",
"vue-apollo": "^3.0.8",
"vue-i18n": "^8.26.5",
"vue-jest": "^3.0.7",
"vue-router": "^3.5.3",
"vuex": "^3.6.2",
"vuex-persistedstate": "^4.1.0"
"vue": "3.4.31",
"vue-apollo": "3.1.2",
"vue-i18n": "9.13.1",
"vue-jest": "3.0.7",
"vue-router": "4.4.0",
"vuex": "4.1.0",
"vuex-persistedstate": "4.1.0"
},
"devDependencies": {
"@apollo/client": "^3.7.1",
"@apollo/client": "^3.10.8",
"@babel/eslint-parser": "^7.15.8",
"@intlify/eslint-plugin-vue-i18n": "^1.4.0",
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"@vue/cli-plugin-babel": "~5.0.8",
"@vue/cli-plugin-eslint": "~5.0.8",
"@vue/cli-service": "~5.0.8",
"@vue/compiler-sfc": "3.4.31",
"babel-eslint": "^10.1.0",
"babel-plugin-transform-require-context": "^0.1.1",
"cross-env": "^7.0.3",
@ -75,6 +78,7 @@
"eslint-plugin-prettier": "3.3.1",
"eslint-plugin-promise": "^5.1.1",
"eslint-plugin-vue": "^7.20.0",
"jest": "^27.1.0",
"mock-apollo-client": "^1.2.1",
"postcss": "^8.4.8",
"postcss-html": "^1.3.0",
@ -82,8 +86,8 @@
"stylelint": "^14.5.3",
"stylelint-config-recommended-vue": "^1.3.0",
"stylelint-config-standard-scss": "^3.0.0",
"vue-cli-plugin-i18n": "^2.3.1",
"vue-template-compiler": "^2.6.11"
"unplugin-vue-components": "^0.27.2",
"vue-cli-plugin-i18n": "~2.3.2"
},
"browserslist": [
"> 1%",

View File

@ -1,41 +1,42 @@
<template>
<div class="component-nabvar">
<b-navbar toggleable="lg" type="dark" class="bg-dark">
<b-navbar-brand class="mb-2" to="/">
<BNavbar toggleable="lg" type="dark" class="bg-dark">
<BNavbarBrand class="mb-2" to="/">
<img src="img/brand/gradido_logo_w.png" class="navbar-brand-img pl-2" alt="..." />
</b-navbar-brand>
</BNavbarBrand>
<b-navbar-toggle target="nav-collapse"></b-navbar-toggle>
<BNavbarToggle target="nav-collapse"></BNavbarToggle>
<b-collapse id="nav-collapse" is-nav>
<b-navbar-nav>
<b-nav-item to="/user">{{ $t('navbar.user_search') }}</b-nav-item>
<b-nav-item class="bg-color-creation" to="/creation-confirm">
<BCollapse id="nav-collapse" is-nav>
<BNavbarNav>
<BNavItem to="/user">{{ $t('navbar.user_search') }}</BNavItem>
<BNavItem class="bg-color-creation" to="/creation-confirm">
{{ $t('creation') }}
<b-badge v-show="$store.state.openCreations > 0" variant="danger">
<BBadge v-show="$store.state.openCreations > 0" variant="danger">
{{ $store.state.openCreations }}
</b-badge>
</b-nav-item>
<b-nav-item to="/contribution-links">
</BBadge>
</BNavItem>
<BNavItem to="/contribution-links">
{{ $t('navbar.automaticContributions') }}
</b-nav-item>
<b-nav-item to="/federation">
</BNavItem>
<BNavItem to="/federation">
{{ $t('navbar.instances') }}
</b-nav-item>
<b-nav-item to="/statistic">{{ $t('navbar.statistic') }}</b-nav-item>
<b-nav-item @click="wallet">{{ $t('navbar.my-account') }}</b-nav-item>
<b-nav-item @click="logout">{{ $t('navbar.logout') }}</b-nav-item>
</b-navbar-nav>
</b-collapse>
</b-navbar>
</BNavItem>
<BNavItem to="/statistic">{{ $t('navbar.statistic') }}</BNavItem>
<BNavItem @click="wallet">{{ $t('navbar.my-account') }}</BNavItem>
<BNavItem @click="logout">{{ $t('navbar.logout') }}</BNavItem>
</BNavbarNav>
</BCollapse>
</BNavbar>
</div>
</template>
<script>
import CONFIG from '../config'
import { logout } from '../graphql/logout'
import { BNavbar, BCollapse, BNavbarNav, BNavItem, BNavbarBrand, BBadge } from 'bootstrap-vue-next'
export default {
name: 'navbar',
components: { BNavbar, BCollapse, BNavbarNav, BNavItem, BNavbarBrand, BBadge },
methods: {
async logout() {
window.location.assign(CONFIG.WALLET_LOGIN_URL)

View File

@ -1,84 +1,100 @@
<!-- eslint-disable vue/no-static-inline-styles -->
<template>
<div class="statistic-table">
<b-table-simple style="width: auto" class="mt-5" striped stacked="md">
<b-thead>
<b-tr>
<b-th></b-th>
<b-th class="text-right">{{ $t('statistic.count') }}</b-th>
<b-th class="text-right">{{ $t('statistic.details') }}</b-th>
</b-tr>
</b-thead>
<b-tbody>
<b-tr>
<b-td>
<BTableSimple style="width: auto" class="mt-5" striped stacked="md">
<BThead>
<BTr>
<BTh />
<BTh class="text-right">{{ $t('statistic.count') }}</BTh>
<BTh class="text-right">{{ $t('statistic.details') }}</BTh>
</BTr>
</BThead>
<BTbody>
<BTr>
<BTd>
<b>{{ $t('statistic.totalUsers') }}</b>
</b-td>
<b-td class="text-right">{{ value.totalUsers }}</b-td>
<b-td></b-td>
</b-tr>
<b-tr>
<b-td>
</BTd>
<BTd class="text-right">
{{ value.totalUsers }}
</BTd>
<BTd></BTd>
</BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.activeUsers') }}</b>
</b-td>
<b-td class="text-right">{{ value.activeUsers }}</b-td>
<b-td></b-td>
</b-tr>
<b-tr>
<b-td>
</BTd>
<BTd class="text-right">
{{ value.activeUsers }}
</BTd>
<BTd></BTd>
</BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.deletedUsers') }}</b>
</b-td>
<b-td class="text-right">{{ value.deletedUsers }}</b-td>
<b-td></b-td>
</b-tr>
<b-tr>
<b-td>
</BTd>
<BTd class="text-right">
{{ value.deletedUsers }}
</BTd>
<BTd></BTd>
</BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.totalGradidoCreated') }}</b>
</b-td>
<b-td class="text-right">
{{ $n(value.totalGradidoCreated, 'decimal') }} {{ $t('GDD') }}
</b-td>
<b-td class="text-right">{{ value.totalGradidoCreated }}</b-td>
</b-tr>
<b-tr>
<b-td>
</BTd>
<BTd class="text-right">
<!-- {{ $n(value.totalGradidoCreated, 'decimal') }} {{ $t('GDD') }}-->
4500
</BTd>
<BTd class="text-right">
{{ value.totalGradidoCreated }}
</BTd>
</BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.totalGradidoDecayed') }}</b>
</b-td>
<b-td class="text-right">
{{ $n(value.totalGradidoDecayed, 'decimal') }} {{ $t('GDD') }}
</b-td>
<b-td class="text-right">{{ value.totalGradidoDecayed }}</b-td>
</b-tr>
<b-tr>
<b-td>
</BTd>
<BTd class="text-right">
<!-- {{ $n(value.totalGradidoDecayed, 'decimal') }} {{ $t('GDD') }}-->
100
</BTd>
<BTd class="text-right">{{ value.totalGradidoDecayed }}</BTd>
</BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.totalGradidoAvailable') }}</b>
</b-td>
<b-td class="text-right">
{{ $n(value.totalGradidoAvailable, 'decimal') }} {{ $t('GDD') }}
</b-td>
<b-td class="text-right">{{ value.totalGradidoAvailable }}</b-td>
</b-tr>
<b-tr>
<b-td>
</BTd>
<BTd class="text-right">
<!-- {{ $n(value.totalGradidoAvailable, 'decimal') }} {{ $t('GDD') }}-->
500
</BTd>
<BTd class="text-right">
{{ value.totalGradidoAvailable }}
</BTd>
</BTr>
<BTr>
<BTd>
<b>{{ $t('statistic.totalGradidoUnbookedDecayed') }}</b>
</b-td>
<b-td class="text-right">
{{ $n(value.totalGradidoUnbookedDecayed, 'decimal') }} {{ $t('GDD') }}
</b-td>
<b-td class="text-right">{{ value.totalGradidoUnbookedDecayed }}</b-td>
</b-tr>
</b-tbody>
</b-table-simple>
</BTd>
<BTd class="text-right">
<!-- {{ $n(value.totalGradidoUnbookedDecayed, 'decimal') }} {{ $t('GDD') }}-->
600
</BTd>
<BTd class="text-right">
{{ value.totalGradidoUnbookedDecayed }}
</BTd>
</BTr>
</BTbody>
</BTableSimple>
</div>
</template>
<script>
export default {
name: 'StatisticTable',
props: {
value: {
type: Object,
required: true,
},
<script setup>
import { defineProps } from 'vue'
import { BTableSimple, BThead, BTr, BTh, BTbody, BTd } from 'bootstrap-vue-next'
const props = defineProps({
value: {
type: Object,
required: true,
},
}
})
</script>

View File

@ -1,7 +1,4 @@
import Vue from 'vue'
import VueI18n from 'vue-i18n'
Vue.use(VueI18n)
import { createI18n } from 'vue-i18n'
const loadLocaleMessages = () => {
const locales = require.context('./locales/', true, /[A-Za-z0-9-_,\s]+\.json$/i)
@ -45,7 +42,7 @@ const numberFormats = {
},
}
const dateTimeFormats = {
const datetimeFormats = {
en: {
short: {
year: 'numeric',
@ -96,12 +93,13 @@ const dateTimeFormats = {
},
}
const i18n = new VueI18n({
const i18n = createI18n({
locale: 'en',
legacy: false,
fallbackLocale: 'en',
messages: loadLocaleMessages(),
numberFormats,
dateTimeFormats,
datetimeFormats,
})
export default i18n

View File

@ -1,5 +1,5 @@
import Vue from 'vue'
import App from './App'
import { createApp } from 'vue'
import App from './App.vue'
// without this async calls are not working
import 'regenerator-runtime'
@ -15,32 +15,32 @@ import VueApollo from 'vue-apollo'
import PortalVue from 'portal-vue'
import { BootstrapVue, IconsPlugin } from 'bootstrap-vue'
import { createBootstrap } from 'bootstrap-vue-next'
// Add the necessary CSS
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'
import 'bootstrap-vue-next/dist/bootstrap-vue-next.css'
import { toasters } from './mixins/toaster'
import { apolloProvider } from './plugins/apolloProvider'
Vue.use(PortalVue)
Vue.use(BootstrapVue)
const app = createApp(App)
Vue.use(IconsPlugin)
app.use(router)
app.use(store)
app.use(i18n)
app.use(PortalVue)
app.use(createBootstrap())
Vue.use(VueApollo)
app.use(VueApollo)
app.use(apolloProvider)
Vue.mixin(toasters)
app.mixin(toasters)
addNavigationGuards(router, store, apolloProvider.defaultClient, i18n)
i18n.locale =
store.state.moderator && store.state.moderator.language ? store.state.moderator.language : 'en'
new Vue({
router,
store,
i18n,
apolloProvider,
render: (h) => h(App),
}).$mount('#app')
app.mount('#app')

View File

@ -1,6 +1,6 @@
<template>
<div class="admin-overview">
<b-card
<BCard
v-show="$store.state.openCreations > 0"
border-variant="primary"
:header="$t('open_creations')"
@ -13,8 +13,8 @@
<h1>{{ $store.state.openCreations }}</h1>
</b-link>
</b-card-text>
</b-card>
<b-card
</BCard>
<BCard
v-show="$store.state.openCreations < 1"
border-variant="success"
:header="$t('not_open_creations')"
@ -22,19 +22,21 @@
header-text-variant="white"
align="center"
>
<b-card-text>
<b-link to="creation-confirm">
<BCardText>
<BLink to="creation-confirm">
<h1 data-test="open-creation">{{ $store.state.openCreations }}</h1>
</b-link>
</b-card-text>
</b-card>
</BLink>
</BCardText>
</BCard>
</div>
</template>
<script>
import { adminListContributions } from '../graphql/adminListContributions'
import { BCard, BCardText } from 'bootstrap-vue-next'
export default {
name: 'overview',
components: { BCard, BCardText },
data() {
return {
statusFilter: ['IN_PROGRESS', 'PENDING'],

View File

@ -1,9 +1,9 @@
import { ApolloClient, ApolloLink, InMemoryCache, HttpLink } from 'apollo-boost'
import VueApollo from 'vue-apollo'
import { ApolloClient, ApolloLink, InMemoryCache, createHttpLink } from '@apollo/client/core'
import { createApolloProvider } from '@vue/apollo-option'
import CONFIG from '../config'
import store from '../store/store'
const httpLink = new HttpLink({ uri: CONFIG.GRAPHQL_URI })
const httpLink = createHttpLink({ uri: CONFIG.GRAPHQL_URI })
const authLink = new ApolloLink((operation, forward) => {
const token = store.state.token
@ -30,6 +30,6 @@ const apolloClient = new ApolloClient({
cache: new InMemoryCache(),
})
export const apolloProvider = new VueApollo({
export const apolloProvider = createApolloProvider({
defaultClient: apolloClient,
})

View File

@ -1,14 +1,10 @@
import Vue from 'vue'
import VueRouter from 'vue-router'
import { createRouter, createWebHistory } from 'vue-router'
import routes from './routes'
Vue.use(VueRouter)
const router = new VueRouter({
base: '/admin',
const router = createRouter({
routes,
linkActiveClass: 'active',
mode: 'history',
history: createWebHistory('/admin/'),
scrollBehavior: (to, from, savedPosition) => {
if (savedPosition) {
return savedPosition
@ -16,7 +12,7 @@ const router = new VueRouter({
if (to.hash) {
return { selector: to.hash }
}
return { x: 0, y: 0 }
return { left: 0, top: 0 }
},
})

View File

@ -27,14 +27,15 @@ const routes = [
path: '/contribution-links',
component: () => import('@/pages/ContributionLinks.vue'),
},
{
path: '*',
component: () => import('@/components/NotFoundPage.vue'),
},
{
path: '/federation',
component: () => import('@/pages/FederationVisualize.vue'),
},
{
path: '/:catchAll(.*)',
name: 'NotFound',
component: () => import('@/components/NotFoundPage.vue'),
},
]
export default routes

View File

@ -1,10 +1,7 @@
import Vuex from 'vuex'
import Vue from 'vue'
import { createStore } from 'vuex'
import createPersistedState from 'vuex-persistedstate'
import CONFIG from '../config'
Vue.use(Vuex)
export const mutations = {
openCreationsPlus: (state, i) => {
state.openCreations += i
@ -34,7 +31,7 @@ export const actions = {
},
}
const store = new Vuex.Store({
const store = createStore({
plugins: [
createPersistedState({
key: 'gradido-admin',

View File

@ -20,6 +20,23 @@ module.exports = {
},
lintOnSave: true,
publicPath: '/admin',
chainWebpack: (config) => {
config.resolve.alias.set('vue', '@vue/compat')
config.module
.rule('vue')
.use('vue-loader')
.tap((options) => {
return {
...options,
compilerOptions: {
compatConfig: {
MODE: 2,
},
},
}
})
},
configureWebpack: {
// Set up all the aliases we use in our app.
resolve: {
@ -42,7 +59,7 @@ module.exports = {
new StatsPlugin('webpack.stats.json'),
],
infrastructureLogging: {
level: 'warn', // 'none' | 'error' | 'warn' | 'info' | 'log' | 'verbose'
level: 'info', // 'none' | 'error' | 'warn' | 'info' | 'log' | 'verbose'
},
},
css: {