-
-
Notifications
You must be signed in to change notification settings - Fork 148
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
perf(ui/sidebar): optimize setup process and i18n lazy load (#962)
- Loading branch information
Showing
12 changed files
with
390 additions
and
400 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,84 @@ | ||
| import Artalk from 'artalk' | ||
| import { Router } from 'vue-router' | ||
| import { bootParams } from './global' | ||
| import { useUserStore } from './stores/user' | ||
|
|
||
| export function setupArtalk() { | ||
| // Create virtual element for Artalk | ||
| const artalkEl = document.createElement('div') | ||
| artalkEl.style.display = 'none' | ||
| document.body.append(artalkEl) | ||
|
|
||
| // Init Artalk | ||
| return Artalk.init({ | ||
| el: artalkEl, | ||
| server: '../', | ||
| pageKey: bootParams.pageKey, | ||
| site: bootParams.site, | ||
| darkMode: bootParams.darkMode, | ||
| useBackendConf: true, | ||
| pvAdd: false, | ||
| remoteConfModifier: (conf) => { | ||
| conf.noComment = `<div class="atk-sidebar-no-content"></div>` | ||
| conf.flatMode = true | ||
| conf.pagination = { | ||
| pageSize: 20, | ||
| readMore: false, | ||
| autoLoad: false, | ||
| } | ||
| conf.listUnreadHighlight = true | ||
| }, | ||
| }) | ||
| } | ||
|
|
||
| export async function syncArtalkUser(artalk: Artalk, router: Router) { | ||
| const user = useUserStore() | ||
| const logout = () => { | ||
| user.logout() | ||
| nextTick(() => { | ||
| router.replace('/login') | ||
| }) | ||
| } | ||
|
|
||
| // Access from open sidebar or directly by url | ||
| if (bootParams.user?.email) { | ||
| // sync user from sidebar to artalk | ||
| artalk.ctx.get('user').update(bootParams.user) | ||
| } else { | ||
| // Sync user from artalk to sidebar | ||
| try { | ||
| user.sync() | ||
| } catch { | ||
| logout() | ||
| return | ||
| } | ||
| } | ||
|
|
||
| // Async check user status (no await) | ||
| checkUser(artalk, logout) | ||
| } | ||
|
|
||
| function checkUser(artalk: Artalk, logout: () => void) { | ||
| // Get user info from artalk | ||
| const { name, email } = artalk.ctx.get('user').getData() | ||
|
|
||
| // Remove login failed dialog if sidebar | ||
| artalk.ctx.getApiHandlers().remove('need_login') | ||
| artalk.ctx.getApiHandlers().add('need_login', async () => { | ||
| logout() | ||
| throw new Error('Need login') | ||
| }) | ||
|
|
||
| // Check user status | ||
| artalk.ctx | ||
| .getApi() | ||
| .user.getUserStatus({ email, name }) | ||
| .then((res) => { | ||
| if (res.data.is_admin && !res.data.is_login) { | ||
| logout() | ||
| } else { | ||
| // Mark all notifications as read | ||
| artalk.ctx.getApi().notifies.markAllNotifyRead({ email, name }) | ||
| } | ||
| }) | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,99 @@ | ||
| export const en = { | ||
| ctrlCenter: 'Admin', | ||
| msgCenter: 'Messages', | ||
| noContent: 'No Content', | ||
| searchHint: 'Search by keywords...', | ||
| allSites: 'All Sites', | ||
| siteManage: 'Site Management', | ||
| comment: 'Comment', | ||
| page: 'Page', | ||
| user: 'User', | ||
| site: 'Site', | ||
| transfer: 'Transfer', | ||
| settings: 'Settings', | ||
| all: 'All', | ||
| pending: 'Pending', | ||
| personal: 'Personal', | ||
| mentions: 'Mentions', | ||
| mine: 'Mine', | ||
| admin: 'Admin', | ||
| create: 'Create', | ||
| import: 'Import', | ||
| export: 'Export', | ||
| settingSaved: 'Setting saved', | ||
| settingSaveFailed: 'Setting save failed', | ||
| settingNotice: 'Note: Some config options may require a manual reboot to take effect.', | ||
| apply: 'Apply', | ||
| updateComplete: 'Update complete', | ||
| updateReady: 'Ready to update...', | ||
| opFailed: 'Operation failed', | ||
| updateTitle: 'Fetch Title', | ||
| uploading: 'Uploading', | ||
| cancel: 'Cancel', | ||
| back: 'Back', | ||
| cacheClear: 'Cache Clear', | ||
| cacheWarm: 'Cache Warm', | ||
| editTitle: 'Edit Title', | ||
| switchKey: 'Switch Key', | ||
| commentAllowAll: 'Anyone Comment', | ||
| commentOnlyAdmin: 'Admin Comment Only', | ||
| config: 'Config', | ||
| envVarControlHint: 'Referenced by the environment variable {key}', | ||
| userAdminHint: 'Admin user', | ||
| userInConfHint: 'This user is defined in config file', | ||
| edit: 'Edit', | ||
| delete: 'Delete', | ||
| siteCount: 'Total {count} Sites', | ||
| createSite: 'Create Site', | ||
| siteName: 'Site Name', | ||
| siteUrls: 'Site URLs', | ||
| multiSepHint: 'multiple separated by commas', | ||
| add: 'Add', | ||
| rename: 'Rename', | ||
| inputHint: 'Input text...', | ||
| userCreate: 'Create User', | ||
| userEdit: 'Edit User', | ||
| userInConfCannotEditHint: | ||
| 'Cannot edit user in config file, please modify the config file manually', | ||
| userDeleteConfirm: | ||
| 'This operation will delete all comments of user: "{name}" email: "{email}", including the reply comments under his comments. Continue?', | ||
| userDeleteManuallyHint: | ||
| 'User has been deleted from the database, please manually edit the config file and delete the user', | ||
| pageDeleteConfirm: | ||
| 'This operation will delete the page: "{title}" and all data under it. Continue?', | ||
| siteDeleteConfirm: | ||
| 'This operation will delete the site: "{name}" and all data under it. Continue?', | ||
| siteNameInputHint: 'Please enter the site name', | ||
| comments: 'Comments', | ||
| last: 'Last', | ||
| show: 'Show', | ||
| username: 'Username', | ||
| email: 'Email', | ||
| link: 'Link', | ||
| badgeText: 'Badge Text', | ||
| badgeColor: 'Badge Color', | ||
| role: 'Role', | ||
| normal: 'Normal', | ||
| password: 'Password', | ||
| passwordEmptyHint: 'leave blank not change your password', | ||
| emailNotify: 'Email notification', | ||
| enabled: 'Enabled', | ||
| disabled: 'Disabled', | ||
| save: 'Save', | ||
| dataFile: 'Data File', | ||
| artransfer: 'Artransfer', | ||
| targetSiteName: 'Target Site Name', | ||
| targetSiteURL: 'Target Site URL', | ||
| payload: 'Payload', | ||
| optional: 'Optional', | ||
| uploadReadyToImport: 'File uploaded and is ready for import', | ||
| artransferToolHint: 'Use the {link} to convert data to Artrans format.', | ||
| moreDetails: 'More details', | ||
| loginFailure: 'Login failure', | ||
| login: 'Login', | ||
| logout: 'Logout', | ||
| logoutConfirm: 'Are you sure you want to log out?', | ||
| loginSelectHint: 'Please select the account you wish to log into:', | ||
| } | ||
|
|
||
| export default en |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| import { createI18n, type I18n, type Locale } from 'vue-i18n' | ||
| import { en } from './i18n-en' | ||
|
|
||
| export type MessageSchema = typeof en | ||
|
|
||
| export function setupI18n() { | ||
| const i18n = createI18n({ | ||
| legacy: false, // use i18n in Composition API | ||
| locale: 'en', | ||
| fallbackLocale: 'en', | ||
| messages: { en } as any, | ||
| }) | ||
|
|
||
| const setLocale = async (value: string) => { | ||
| await loadLocaleMessages(i18n, value) | ||
| i18n.global.locale.value = value | ||
| } | ||
|
|
||
| return { i18n, setLocale } | ||
| } | ||
|
|
||
| export async function loadLocaleMessages(i18n: I18n, locale: Locale) { | ||
| if (i18n.global.availableLocales.includes(locale)) return | ||
|
|
||
| // Load locale messages with dynamic import | ||
| // @see https://vitejs.dev/guide/features#dynamic-import | ||
| const messages = await import(`./i18n/${locale}.ts`) | ||
| .then((r: any) => r.default || r) | ||
| .catch(() => { | ||
| console.error(`Failed to load locale messages for "${locale}"`) | ||
| return | ||
| }) | ||
|
|
||
| // Set locale and locale message | ||
| i18n.global.setLocaleMessage(locale, messages) | ||
| return nextTick() | ||
| } |
Oops, something went wrong.