1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
|
// Copyright (C) 2023 Vaughn Nugent
//
// This program is free software: you can redistribute it and/or modify
// it under the terms of the GNU Affero General Public License as
// published by the Free Software Foundation, either version 3 of the
// License, or (at your option) any later version.
//
// This program is distributed in the hope that it will be useful,
// but WITHOUT ANY WARRANTY; without even the implied warranty of
// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
// GNU Affero General Public License for more details.
//
// You should have received a copy of the GNU Affero General Public License
// along with this program. If not, see <https://www.gnu.org/licenses/>.
//Get the create app from boostrap dir
import { createVnApp } from './bootstrap'
import { configureApi } from '@vnuge/vnlib.browser'
//Import all styles
import './bootstrap/style/all.scss'
//Import your main style file
import './assets/main.scss'
//Import font data
import "@fontsource/source-sans-pro"
/* FONT AWESOME CONFIG */
import { library } from '@fortawesome/fontawesome-svg-core'
import { faBullhorn, faCertificate, faCheck, faChevronLeft, faChevronRight, faComment, faCopy, faFolderOpen, faKey, faLink, faMinusCircle, faPencil, faPhotoFilm, faPlus, faRotateLeft, faSignInAlt, faSpinner, faSync, faTrash, faUser } from '@fortawesome/free-solid-svg-icons'
import { faGithub, faDiscord, faMarkdown } from '@fortawesome/free-brands-svg-icons'
//Add required icons for the app
library.add(faSignInAlt, faGithub, faDiscord, faSpinner, faCertificate, faKey, faSync, faPlus, faMinusCircle, faUser, faCheck, faTrash, faCopy,
faPencil, faLink, faPhotoFilm, faRotateLeft, faMarkdown, faBullhorn, faFolderOpen, faComment, faChevronLeft, faChevronRight);
//Add icons to library
import router from './router'
//Import nav components
import FooterNav1 from './components/FooterNav1.vue'
import FooterNav2 from './components/FooterNav2.vue'
import SiteLogo from './components/Site-Logo.vue'
import DynamicFormVue from './components/DynamicForm.vue'
import { globalStatePlugin } from './store/globalState'
import { profilePlugin } from './store/userProfile'
import { mfaSettingsPlugin } from './store/mfaSettingsPlugin'
import { pageProtectionPlugin } from './store/pageProtectionPlugin'
import { socialMfaPlugin } from './store/socialMfaPlugin'
//Setup the vnlib api
configureApi({
session: {
//The identifier of the login cookie, see Essentials.Accounts docs
loginCookieName: 'li',
browserIdSize: 32,
},
user: {
accountBasePath: '/account',
},
axios: {
//The base url to make api requests against
baseURL: import.meta.env.VITE_API_URL,
withCredentials: false,
//See Essentials.Accounts docs
tokenHeader: 'X-Web-Token',
},
storage: localStorage
})
createVnApp({
//The app mount point
mountElement: '#app',
//Enable dark mode support
useDarkMode: true,
//Add the font awesome library
faLibrary: library,
//Called when the app is created for you to add custom elements
onCreate(app, store) {
//Add the router
app.use(router)
store.use(globalStatePlugin)
//User-profile plugin
.use(profilePlugin('/account/profile'))
//setup page protection plugin with the router
.use(pageProtectionPlugin(router))
//Enable mfa with totp settings plugin (optional pki config)
.use(mfaSettingsPlugin('/account/mfa', '/account/pki'))
//Setup social mfa plugin
.use(socialMfaPlugin)
//Add the home-page component
router.addRoute({
path: '/',
name: 'Home',
redirect: { path: '/' }
})
//Configure account page redirect to profile
router.addRoute({
path: '/account',
name: 'Account',
redirect: { path: '/account/profile' }
})
//Add the footer nav components
app.component('FooterNav1', FooterNav1)
app.component('FooterNav2', FooterNav2)
//Register site-logo component
app.component('SiteLogo', SiteLogo)
//Register the dynamic form component
app.component('dynamic-form', DynamicFormVue)
},
})
|
