hamlab/mobilizon-frontend
2
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Migrate to Vue 3 and Vite

Browse Source 
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
2022-07-12 10:55:28 +02:00
parent 8f4099ee33
commit ee20e03cc2
464 changed files with 31515 additions and 32758 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
js/src/router/actor.ts
View File

@@ -1,7 +1,8 @@
import { RouteConfig } from "vue-router";
import { ImportedComponent } from "vue/types/options";
import { RouteRecordRaw } from "vue-router";
import { i18n } from "@/utils/i18n";
const { t } = i18n.global;
export enum ActorRouteName {
GROUP = "Group",
CREATE_GROUP = "CreateGroup",
@@ -9,33 +10,30 @@ export enum ActorRouteName {
MY_GROUPS = "MY_GROUPS",
}
export const actorRoutes: RouteConfig[] = [
export const actorRoutes: RouteRecordRaw[] = [
{
path: "/groups/create",
name: ActorRouteName.CREATE_GROUP,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "CreateGroup" */ "@/views/Group/Create.vue"),
component: (): Promise<any> => import("@/views/Group/Create.vue"),
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("Create group") as string },
announcer: { message: (): string => t("Create group") as string },
},
},
{
path: "/@:preferredUsername",
name: ActorRouteName.GROUP,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "Group" */ "@/views/Group/Group.vue"),
component: (): Promise<any> => import("@/views/Group/Group.vue"),
props: true,
meta: { requiredAuth: false, announcer: { skip: true } },
},
{
path: "/groups/me",
name: ActorRouteName.MY_GROUPS,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "MyGroups" */ "@/views/Group/MyGroups.vue"),
component: (): Promise<any> => import("@/views/Group/MyGroups.vue"),
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("My groups") as string },
announcer: { message: (): string => t("My groups") as string },
},
},
];

12
js/src/router/error.ts
View File

@@ -1,19 +1,19 @@
import { RouteConfig } from "vue-router";
import { ImportedComponent } from "vue/types/options";
import { RouteRecordRaw } from "vue-router";
import { i18n } from "@/utils/i18n";
const { t } = i18n.global.t;
export enum ErrorRouteName {
ERROR = "Error",
}
export const errorRoutes: RouteConfig[] = [
export const errorRoutes: RouteRecordRaw[] = [
{
path: "/error",
name: ErrorRouteName.ERROR,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "Error" */ "../views/Error.vue"),
component: (): Promise<any> => import("../views/ErrorView.vue"),
meta: {
announcer: { message: (): string => i18n.t("Error") as string },
announcer: { message: (): string => t("Error") },
},
},
];

61
js/src/router/event.ts
View File

@@ -1,17 +1,12 @@
import { RouteConfig, Route } from "vue-router";
import { ImportedComponent } from "vue/types/options";
import { i18n } from "@/utils/i18n";
import { RouteLocationNormalized, RouteRecordRaw } from "vue-router";
const participations = (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "participations" */ "@/views/Event/Participants.vue"
);
const editEvent = (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "edit-event" */ "@/views/Event/Edit.vue");
const event = (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "event" */ "@/views/Event/Event.vue");
const myEvents = (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "my-events" */ "@/views/Event/MyEvents.vue");
const t = i18n.global.t;
const participations = () => import("@/views/Event/Participants.vue");
const editEvent = () => import("@/views/Event/Edit.vue");
const event = () => import("@/views/Event/Event.vue");
const myEvents = () => import("@/views/Event/MyEvents.vue");
export enum EventRouteName {
EVENT_LIST = "EventList",
@@ -28,24 +23,14 @@ export enum EventRouteName {
TAG = "Tag",
}
export const eventRoutes: RouteConfig[] = [
{
path: "/events/list/:location?",
name: EventRouteName.EVENT_LIST,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "EventList" */ "@/views/Event/EventList.vue"),
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Event list") as string },
},
},
export const eventRoutes: RouteRecordRaw[] = [
{
path: "/events/create",
name: EventRouteName.CREATE_EVENT,
component: editEvent,
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("Create event") as string },
announcer: { message: (): string => t("Create event") as string },
},
},
{
@@ -55,7 +40,7 @@ export const eventRoutes: RouteConfig[] = [
props: true,
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("My events") as string },
announcer: { message: (): string => t("My events") as string },
},
},
{
@@ -63,7 +48,7 @@ export const eventRoutes: RouteConfig[] = [
name: EventRouteName.EDIT_EVENT,
component: editEvent,
meta: { requiredAuth: true, announcer: { skip: true } },
props: (route: Route): Record<string, unknown> => {
props: (route: RouteLocationNormalized): Record<string, unknown> => {
return { ...route.params, ...{ isUpdate: true } };
},
},
@@ -72,7 +57,7 @@ export const eventRoutes: RouteConfig[] = [
name: EventRouteName.DUPLICATE_EVENT,
component: editEvent,
meta: { requiredAuth: true, announce: { skip: true } },
props: (route: Route): Record<string, unknown> => ({
props: (route: RouteLocationNormalized): Record<string, unknown> => ({
...route.params,
...{ isDuplicate: true },
}),
@@ -94,23 +79,23 @@ export const eventRoutes: RouteConfig[] = [
{
path: "/events/:uuid/participate",
name: EventRouteName.EVENT_PARTICIPATE_LOGGED_OUT,
component: (): Promise<ImportedComponent> =>
component: () =>
import("../components/Participation/UnloggedParticipation.vue"),
props: true,
meta: {
announcer: {
message: (): string => i18n.t("Unlogged participation") as string,
message: (): string => t("Unlogged participation") as string,
},
},
},
{
path: "/events/:uuid/participate/with-account",
name: EventRouteName.EVENT_PARTICIPATE_WITH_ACCOUNT,
component: (): Promise<ImportedComponent> =>
component: () =>
import("../components/Participation/ParticipationWithAccount.vue"),
meta: {
announcer: {
message: (): string => i18n.t("Participation with account") as string,
message: (): string => t("Participation with account") as string,
},
},
props: true,
@@ -118,12 +103,11 @@ export const eventRoutes: RouteConfig[] = [
{
path: "/events/:uuid/participate/without-account",
name: EventRouteName.EVENT_PARTICIPATE_WITHOUT_ACCOUNT,
component: (): Promise<ImportedComponent> =>
component: () =>
import("../components/Participation/ParticipationWithoutAccount.vue"),
meta: {
announcer: {
message: (): string =>
i18n.t("Participation without account") as string,
message: (): string => t("Participation without account") as string,
},
},
props: true,
@@ -131,11 +115,11 @@ export const eventRoutes: RouteConfig[] = [
{
path: "/participation/email/confirm/:token",
name: EventRouteName.EVENT_PARTICIPATE_CONFIRM,
component: (): Promise<ImportedComponent> =>
component: () =>
import("../components/Participation/ConfirmParticipation.vue"),
meta: {
announcer: {
message: (): string => i18n.t("Confirm participation") as string,
message: (): string => t("Confirm participation") as string,
},
},
props: true,
@@ -143,12 +127,11 @@ export const eventRoutes: RouteConfig[] = [
{
path: "/tag/:tag",
name: EventRouteName.TAG,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "Search" */ "@/views/Search.vue"),
component: () => import("@/views/SearchView.vue"),
props: true,
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Tag search") as string },
announcer: { message: (): string => t("Tag search") as string },
},
},
];

55
js/src/router/groups.ts
View File

@@ -1,5 +1,4 @@
import { RouteConfig, Route } from "vue-router";
import { ImportedComponent } from "vue/types/options";
import { RouteLocationNormalized, RouteRecordRaw } from "vue-router";
export enum GroupsRouteName {
TODO_LISTS = "TODO_LISTS",
@@ -22,33 +21,29 @@ export enum GroupsRouteName {
TIMELINE = "TIMELINE",
}
const resourceFolder = (): Promise<ImportedComponent> =>
const resourceFolder = (): Promise<any> =>
import("@/views/Resources/ResourceFolder.vue");
const groupEvents = (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "groupEvents" */ "@/views/Event/GroupEvents.vue");
const groupEvents = (): Promise<any> => import("@/views/Event/GroupEvents.vue");
export const groupsRoutes: RouteConfig[] = [
export const groupsRoutes: RouteRecordRaw[] = [
{
path: "/@:preferredUsername/todo-lists",
name: GroupsRouteName.TODO_LISTS,
component: (): Promise<ImportedComponent> =>
import("@/views/Todos/TodoLists.vue"),
component: (): Promise<any> => import("@/views/Todos/TodoLists.vue"),
props: true,
meta: { requiredAuth: true, announcer: { skip: true } },
},
{
path: "/todo-lists/:id",
name: GroupsRouteName.TODO_LIST,
component: (): Promise<ImportedComponent> =>
import("@/views/Todos/TodoList.vue"),
component: (): Promise<any> => import("@/views/Todos/TodoList.vue"),
props: true,
meta: { requiredAuth: true, announcer: { skip: true } },
},
{
path: "/todo/:todoId",
name: GroupsRouteName.TODO,
component: (): Promise<ImportedComponent> =>
import("@/views/Todos/Todo.vue"),
component: (): Promise<any> => import("@/views/Todos/TodoView.vue"),
props: true,
meta: { requiredAuth: true, announcer: { skip: true } },
},
@@ -56,7 +51,10 @@ export const groupsRoutes: RouteConfig[] = [
path: "/@:preferredUsername/resources",
name: GroupsRouteName.RESOURCE_FOLDER_ROOT,
component: resourceFolder,
props: { path: "/" },
props: (to) => ({
path: "/",
preferredUsername: to.params.preferredUsername,
}),
meta: { requiredAuth: true, announcer: { skip: true } },
},
{
@@ -68,8 +66,7 @@ export const groupsRoutes: RouteConfig[] = [
},
{
path: "/@:preferredUsername/settings",
component: (): Promise<ImportedComponent> =>
import("@/views/Group/Settings.vue"),
component: (): Promise<any> => import("@/views/Group/Settings.vue"),
props: true,
meta: { requiredAuth: true },
redirect: { name: GroupsRouteName.GROUP_PUBLIC_SETTINGS },
@@ -78,14 +75,15 @@ export const groupsRoutes: RouteConfig[] = [
{
path: "public",
name: GroupsRouteName.GROUP_PUBLIC_SETTINGS,
component: (): Promise<ImportedComponent> =>
props: true,
component: (): Promise<any> =>
import("../views/Group/GroupSettings.vue"),
meta: { announcer: { skip: true } },
},
{
path: "members",
name: GroupsRouteName.GROUP_MEMBERS_SETTINGS,
component: (): Promise<ImportedComponent> =>
component: (): Promise<any> =>
import("../views/Group/GroupMembers.vue"),
props: true,
meta: { announcer: { skip: true } },
@@ -93,7 +91,7 @@ export const groupsRoutes: RouteConfig[] = [
{
path: "followers",
name: GroupsRouteName.GROUP_FOLLOWERS_SETTINGS,
component: (): Promise<ImportedComponent> =>
component: (): Promise<any> =>
import("../views/Group/GroupFollowers.vue"),
props: true,
meta: { announcer: { skip: true } },
@@ -102,17 +100,15 @@ export const groupsRoutes: RouteConfig[] = [
},
{
path: "/@:preferredUsername/p/new",
component: (): Promise<ImportedComponent> =>
import("@/views/Posts/Edit.vue"),
component: (): Promise<any> => import("@/views/Posts/Edit.vue"),
props: true,
name: GroupsRouteName.POST_CREATE,
meta: { requiredAuth: true, announcer: { skip: true } },
},
{
path: "/p/:slug/edit",
component: (): Promise<ImportedComponent> =>
import("@/views/Posts/Edit.vue"),
props: (route: Route): Record<string, unknown> => ({
component: (): Promise<any> => import("@/views/Posts/Edit.vue"),
props: (route: RouteLocationNormalized): Record<string, unknown> => ({
...route.params,
...{ isUpdate: true },
}),
@@ -121,16 +117,14 @@ export const groupsRoutes: RouteConfig[] = [
},
{
path: "/p/:slug",
component: (): Promise<ImportedComponent> =>
import("@/views/Posts/Post.vue"),
component: (): Promise<any> => import("@/views/Posts/Post.vue"),
props: true,
name: GroupsRouteName.POST,
meta: { requiredAuth: false, announcer: { skip: true } },
},
{
path: "/@:preferredUsername/p",
component: (): Promise<ImportedComponent> =>
import("@/views/Posts/List.vue"),
component: (): Promise<any> => import("@/views/Posts/List.vue"),
props: true,
name: GroupsRouteName.POSTS,
meta: { requiredAuth: false, announcer: { skip: true } },
@@ -144,7 +138,7 @@ export const groupsRoutes: RouteConfig[] = [
},
{
path: "/@:preferredUsername/join",
component: (): Promise<ImportedComponent> =>
component: (): Promise<any> =>
import("@/components/Group/JoinGroupWithAccount.vue"),
props: true,
name: GroupsRouteName.GROUP_JOIN,
@@ -152,7 +146,7 @@ export const groupsRoutes: RouteConfig[] = [
},
{
path: "/@:preferredUsername/follow",
component: (): Promise<ImportedComponent> =>
component: (): Promise<any> =>
import("@/components/Group/JoinGroupWithAccount.vue"),
props: true,
name: GroupsRouteName.GROUP_FOLLOW,
@@ -161,8 +155,7 @@ export const groupsRoutes: RouteConfig[] = [
{
path: "/@:preferredUsername/timeline",
name: GroupsRouteName.TIMELINE,
component: (): Promise<ImportedComponent> =>
import("@/views/Group/Timeline.vue"),
component: (): Promise<any> => import("@/views/Group/Timeline.vue"),
props: true,
meta: { requiredAuth: true, announcer: { skip: true } },
},

34
js/src/router/guards/register-guard.ts
View File

@@ -1,22 +1,32 @@
import { IConfig } from "@/types/config.model";
import { ErrorCode } from "@/types/enums";
import { provideApolloClient, useQuery } from "@vue/apollo-composable";
import { NavigationGuard } from "vue-router";
import { CONFIG } from "../../graphql/config";
import apolloProvider from "../../vue-apollo";
import { apolloClient } from "../../vue-apollo";
import { ErrorRouteName } from "../error";
export const beforeRegisterGuard: NavigationGuard = async (to, from, next) => {
const { data } = await apolloProvider.defaultClient.query({
query: CONFIG,
const { onResult, onError } = provideApolloClient(apolloClient)(() =>
useQuery<{ config: IConfig }>(CONFIG)
);
onResult(({ data }) => {
const { config } = data;
if (!config.registrationsOpen && !config.registrationsAllowlist) {
return next({
name: ErrorRouteName.ERROR,
query: { code: ErrorCode.REGISTRATION_CLOSED },
});
}
return next();
});
const { config } = data;
if (!config.registrationsOpen && !config.registrationsAllowlist) {
return next({
name: ErrorRouteName.ERROR,
query: { code: ErrorCode.REGISTRATION_CLOSED },
});
}
onError((err) => {
console.error(err);
return next();
});
return next();
};

125
js/src/router/index.ts
View File

@@ -1,9 +1,6 @@
import Vue from "vue";
import Router, { Route } from "vue-router";
import { createRouter, createWebHistory } from "vue-router";
import VueScrollTo from "vue-scrollto";
import { PositionResult } from "vue-router/types/router.d";
import { ImportedComponent } from "vue/types/options";
import Home from "../views/Home.vue";
import HomeView from "../views/HomeView.vue";
import { eventRoutes } from "./event";
import { actorRoutes } from "./actor";
import { errorRoutes } from "./error";
@@ -15,25 +12,21 @@ import { userRoutes } from "./user";
import RouteName from "./name";
import { AVAILABLE_LANGUAGES, i18n } from "@/utils/i18n";
Vue.use(Router);
const { t } = i18n.global;
function scrollBehavior(
to: Route,
from: Route,
savedPosition: any
): PositionResult | undefined | null {
function scrollBehavior(to: any, from: any, savedPosition: any) {
if (to.hash) {
VueScrollTo.scrollTo(to.hash, 700);
return {
selector: to.hash,
offset: { x: 0, y: 10 },
offset: { left: 0, top: 10 },
};
}
if (savedPosition) {
return savedPosition;
}
return { x: 0, y: 0 };
return { left: 0, top: 0 };
}
export const routes = [
@@ -47,84 +40,83 @@ export const routes = [
{
path: "/search",
name: RouteName.SEARCH,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "Search" */ "@/views/Search.vue"),
component: (): Promise<any> => import("@/views/SearchView.vue"),
props: true,
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Search") as string },
announcer: { message: (): string => t("Search") as string },
},
},
{
path: "/",
name: RouteName.HOME,
component: Home,
component: HomeView,
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Homepage") as string },
announcer: { message: (): string => t("Homepage") as string },
},
},
{
path: "/categories",
name: RouteName.CATEGORIES,
component: (): Promise<any> => import("@/views/CategoriesView.vue"),
meta: {
requiredAuth: false,
announcer: { message: (): string => t("Categories") as string },
},
},
{
path: "/about",
name: RouteName.ABOUT,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "about" */ "@/views/About.vue"),
component: (): Promise<any> => import("@/views/About.vue"),
meta: { requiredAuth: false },
redirect: { name: RouteName.ABOUT_INSTANCE },
children: [
{
path: "instance",
name: RouteName.ABOUT_INSTANCE,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "about" */ "@/views/About/AboutInstance.vue"
),
component: (): Promise<any> =>
import("@/views/About/AboutInstance.vue"),
meta: {
announcer: {
message: (): string => i18n.t("About instance") as string,
message: (): string => t("About instance") as string,
},
},
},
{
path: "/terms",
name: RouteName.TERMS,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "cookies" */ "@/views/About/Terms.vue"),
component: (): Promise<any> => import("@/views/About/Terms.vue"),
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Terms") as string },
announcer: { message: (): string => t("Terms") as string },
},
},
{
path: "/privacy",
name: RouteName.PRIVACY,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "cookies" */ "@/views/About/Privacy.vue"),
component: (): Promise<any> => import("@/views/About/Privacy.vue"),
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Privacy") as string },
announcer: { message: (): string => t("Privacy") as string },
},
},
{
path: "/rules",
name: RouteName.RULES,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "cookies" */ "@/views/About/Rules.vue"),
component: (): Promise<any> => import("@/views/About/Rules.vue"),
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Rules") as string },
announcer: { message: (): string => t("Rules") as string },
},
},
{
path: "/glossary",
name: RouteName.GLOSSARY,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "cookies" */ "@/views/About/Glossary.vue"
),
component: (): Promise<any> => import("@/views/About/Glossary.vue"),
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Glossary") as string },
announcer: { message: (): string => t("Glossary") as string },
},
},
],
@@ -132,38 +124,38 @@ export const routes = [
{
path: "/interact",
name: RouteName.INTERACT,
component: (): Promise<ImportedComponent> =>
component: (): Promise<any> =>
import(/* webpackChunkName: "interact" */ "@/views/Interact.vue"),
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Interact") as string },
announcer: { message: (): string => t("Interact") as string },
},
},
{
path: "/auth/:provider/callback",
name: "auth-callback",
component: (): Promise<ImportedComponent> =>
component: (): Promise<any> =>
import(
/* webpackChunkName: "ProviderValidation" */ "@/views/User/ProviderValidation.vue"
),
meta: {
announcer: {
message: (): string => i18n.t("Redirecting to Mobilizon") as string,
message: (): string => t("Redirecting to Mobilizon") as string,
},
},
},
{
path: "/welcome/:step?",
name: RouteName.WELCOME_SCREEN,
component: (): Promise<ImportedComponent> =>
component: (): Promise<any> =>
import(
/* webpackChunkName: "WelcomeScreen" */ "@/views/User/SettingsOnboard.vue"
),
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("First steps") as string },
announcer: { message: (): string => t("First steps") as string },
},
props: (route: Route): Record<string, unknown> => {
props: (route: any): Record<string, unknown> => {
const step = Number.parseInt(route.params.step, 10);
if (Number.isNaN(step)) {
return { step: 1 };
@@ -174,13 +166,13 @@ export const routes = [
{
path: "/404",
name: RouteName.PAGE_NOT_FOUND,
component: (): Promise<ImportedComponent> =>
component: (): Promise<any> =>
import(
/* webpackChunkName: "PageNotFound" */ "../views/PageNotFound.vue"
),
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Page not found") as string },
announcer: { message: (): string => t("Page not found") as string },
},
},
];
@@ -188,36 +180,31 @@ export const routes = [
for (const locale of AVAILABLE_LANGUAGES) {
routes.push({
path: `/${locale}`,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "HomepageRedirectComponent" */ "../components/Utils/HomepageRedirectComponent.vue"
),
component: () =>
import("../components/Utils/HomepageRedirectComponent.vue"),
});
}
routes.push({
path: "*",
path: "/:pathMatch(.*)*",
redirect: { name: RouteName.PAGE_NOT_FOUND },
});
const router = new Router({
export const router = createRouter({
scrollBehavior,
mode: "history",
base: "/",
history: createWebHistory("/"),
routes,
});
router.beforeEach(authGuardIfNeeded);
router.afterEach(() => {
try {
if (router.app.$children[0]) {
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
// @ts-ignore
router.app.$children[0].error = null;
}
} catch (e) {
console.error(e);
}
});
export default router;
// router.afterEach(() => {
// try {
// if (router.app.$children[0]) {
// // eslint-disable-next-line @typescript-eslint/ban-ts-comment
// // @ts-ignore
// router.app.$children[0].error = null;
// }
// } catch (e) {
// console.error(e);
// }
// });

7
js/src/router/name.ts
View File

@@ -7,11 +7,12 @@ import { DiscussionRouteName } from "./discussion";
import { UserRouteName } from "./user";
enum GlobalRouteName {
HOME = "Home",
ABOUT = "About",
HOME = "HOME",
ABOUT = "ABOUT",
CATEGORIES = "CATEGORIES",
ABOUT_INSTANCE = "ABOUT_INSTANCE",
PAGE_NOT_FOUND = "PageNotFound",
SEARCH = "Search",
SEARCH = "SEARCH",
TERMS = "TERMS",
PRIVACY = "PRIVACY",
GLOSSARY = "GLOSSARY",

139
js/src/router/settings.ts
View File

@@ -1,6 +1,7 @@
import { Route, RouteConfig } from "vue-router";
import { ImportedComponent } from "vue/types/options";
import { i18n } from "@/utils/i18n";
import { RouteLocationNormalized, RouteRecordRaw } from "vue-router";
const { t } = i18n.global;
export enum SettingsRouteName {
SETTINGS = "SETTINGS",
@@ -28,11 +29,10 @@ export enum SettingsRouteName {
IDENTITIES = "IDENTITIES",
}
export const settingsRoutes: RouteConfig[] = [
export const settingsRoutes: RouteRecordRaw[] = [
{
path: "/settings",
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "Settings" */ "@/views/Settings.vue"),
component: () => import("@/views/SettingsView.vue"),
props: true,
meta: { requiredAuth: true, announcer: { skip: true } },
redirect: { name: SettingsRouteName.ACCOUNT_SETTINGS },
@@ -50,43 +50,37 @@ export const settingsRoutes: RouteConfig[] = [
{
path: "account/general",
name: SettingsRouteName.ACCOUNT_SETTINGS_GENERAL,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "AccountSettings" */ "@/views/Settings/AccountSettings.vue"
),
component: (): Promise<any> =>
import("@/views/Settings/AccountSettings.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Account settings") as string,
message: (): string => t("Account settings") as string,
},
},
},
{
path: "preferences",
name: SettingsRouteName.PREFERENCES,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "Preferences" */ "@/views/Settings/Preferences.vue"
),
component: (): Promise<any> =>
import("@/views/Settings/PreferencesView.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("Preferences") as string },
announcer: { message: (): string => t("Preferences") as string },
},
},
{
path: "notifications",
name: SettingsRouteName.NOTIFICATIONS,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "Notifications" */ "@/views/Settings/Notifications.vue"
),
component: (): Promise<any> =>
import("@/views/Settings/NotificationsView.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Notifications") as string,
message: (): string => t("Notifications") as string,
},
},
},
@@ -99,50 +93,41 @@ export const settingsRoutes: RouteConfig[] = [
{
path: "admin/dashboard",
name: SettingsRouteName.ADMIN_DASHBOARD,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "Dashboard" */ "@/views/Admin/Dashboard.vue"
),
component: (): Promise<any> => import("@/views/Admin/Dashboard.vue"),
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Admin dashboard") as string,
message: (): string => t("Admin dashboard") as string,
},
},
},
{
path: "admin/settings",
name: SettingsRouteName.ADMIN_SETTINGS,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "AdminSettings" */ "@/views/Admin/Settings.vue"
),
component: (): Promise<any> => import("@/views/Admin/Settings.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Admin settings") as string,
message: (): string => t("Admin settings") as string,
},
},
},
{
path: "admin/users",
name: SettingsRouteName.USERS,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "Users" */ "@/views/Admin/Users.vue"),
component: (): Promise<any> => import("@/views/Admin/Users.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("Users") as string },
announcer: { message: (): string => t("Users") as string },
},
},
{
path: "admin/users/:id",
name: SettingsRouteName.ADMIN_USER_PROFILE,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "AdminUserProfile" */ "@/views/Admin/AdminUserProfile.vue"
),
component: (): Promise<any> =>
import("@/views/Admin/AdminUserProfile.vue"),
props: true,
meta: {
requiredAuth: true,
@@ -152,62 +137,49 @@ export const settingsRoutes: RouteConfig[] = [
{
path: "admin/profiles",
name: SettingsRouteName.PROFILES,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "AdminProfiles" */ "@/views/Admin/Profiles.vue"
),
component: (): Promise<any> => import("@/views/Admin/Profiles.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("Profiles") as string },
announcer: { message: (): string => t("Profiles") as string },
},
},
{
path: "admin/profiles/:id",
name: SettingsRouteName.ADMIN_PROFILE,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "AdminProfile" */ "@/views/Admin/AdminProfile.vue"
),
component: (): Promise<any> => import("@/views/Admin/AdminProfile.vue"),
props: true,
meta: { requiredAuth: true, announcer: { skip: true } },
},
{
path: "admin/groups",
name: SettingsRouteName.ADMIN_GROUPS,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "GroupProfiles" */ "@/views/Admin/GroupProfiles.vue"
),
component: (): Promise<any> =>
import("@/views/Admin/GroupProfiles.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Group profiles") as string,
message: (): string => t("Group profiles") as string,
},
},
},
{
path: "admin/groups/:id",
name: SettingsRouteName.ADMIN_GROUP_PROFILE,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "AdminGroupProfile" */ "@/views/Admin/AdminGroupProfile.vue"
),
component: (): Promise<any> =>
import("@/views/Admin/AdminGroupProfile.vue"),
props: true,
meta: { requiredAuth: true, announcer: { skip: true } },
},
{
path: "admin/instances",
name: SettingsRouteName.INSTANCES,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "Instances" */ "@/views/Admin/Instances.vue"
),
component: (): Promise<any> => import("@/views/Admin/Instances.vue"),
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Instances") as string,
message: (): string => t("Instances") as string,
},
},
props: true,
@@ -215,15 +187,12 @@ export const settingsRoutes: RouteConfig[] = [
{
path: "admin/instances/:domain",
name: SettingsRouteName.INSTANCE,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "Instance" */ "@/views/Admin/Instance.vue"
),
component: (): Promise<any> => import("@/views/Admin/Instance.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Instance") as string,
message: (): string => t("Instance") as string,
},
},
},
@@ -236,43 +205,35 @@ export const settingsRoutes: RouteConfig[] = [
{
path: "/moderation/reports",
name: SettingsRouteName.REPORTS,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "ReportList" */ "@/views/Moderation/ReportList.vue"
),
component: (): Promise<any> =>
import("@/views/Moderation/ReportList.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Reports list") as string,
message: (): string => t("Reports list") as string,
},
},
},
{
path: "/moderation/report/:reportId",
name: SettingsRouteName.REPORT,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "Report" */ "@/views/Moderation/Report.vue"
),
component: (): Promise<any> => import("@/views/Moderation/Report.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: { message: (): string => i18n.t("Report") as string },
announcer: { message: (): string => t("Report") as string },
},
},
{
path: "/moderation/logs",
name: SettingsRouteName.REPORT_LOGS,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "ModerationLogs" */ "@/views/Moderation/Logs.vue"
),
component: (): Promise<any> => import("@/views/Moderation/Logs.vue"),
props: true,
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Moderation logs") as string,
message: (): string => t("Moderation logs") as string,
},
},
},
@@ -285,29 +246,25 @@ export const settingsRoutes: RouteConfig[] = [
{
path: "/identity/create",
name: SettingsRouteName.CREATE_IDENTITY,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "EditIdentity" */ "@/views/Account/children/EditIdentity.vue"
),
props: (route: Route): Record<string, unknown> => ({
component: (): Promise<any> =>
import("@/views/Account/children/EditIdentity.vue"),
props: (route: RouteLocationNormalized): Record<string, unknown> => ({
identityName: route.params.identityName,
isUpdate: false,
}),
meta: {
requiredAuth: true,
announcer: {
message: (): string => i18n.t("Create identity") as string,
message: (): string => t("Create identity") as string,
},
},
},
{
path: "/identity/update/:identityName?",
name: SettingsRouteName.UPDATE_IDENTITY,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "EditIdentity" */ "@/views/Account/children/EditIdentity.vue"
),
props: (route: Route): Record<string, unknown> => ({
component: (): Promise<any> =>
import("@/views/Account/children/EditIdentity.vue"),
props: (route: RouteLocationNormalized): Record<string, unknown> => ({
identityName: route.params.identityName,
isUpdate: true,
}),

62
js/src/router/user.ts
View File

@@ -1,8 +1,9 @@
import { beforeRegisterGuard } from "@/router/guards/register-guard";
import { Route, RouteConfig } from "vue-router";
import { ImportedComponent } from "vue/types/options";
import { RouteLocationNormalized, RouteRecordRaw } from "vue-router";
import { i18n } from "@/utils/i18n";
const t = i18n.global.t;
export enum UserRouteName {
REGISTER = "Register",
REGISTER_PROFILE = "RegisterProfile",
@@ -14,116 +15,97 @@ export enum UserRouteName {
LOGIN = "Login",
}
export const userRoutes: RouteConfig[] = [
export const userRoutes: RouteRecordRaw[] = [
{
path: "/register/user",
name: UserRouteName.REGISTER,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "RegisterUser" */ "@/views/User/Register.vue"
),
component: (): Promise<any> => import("@/views/User/RegisterView.vue"),
props: true,
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Register") as string },
announcer: { message: (): string => t("Register") as string },
},
beforeEnter: beforeRegisterGuard,
},
{
path: "/register/profile",
name: UserRouteName.REGISTER_PROFILE,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "RegisterProfile" */ "@/views/Account/Register.vue"
),
component: (): Promise<any> => import("@/views/Account/Register.vue"),
// We can only pass string values through params, therefore
props: (route: Route): Record<string, unknown> => ({
props: (route: RouteLocationNormalized): Record<string, unknown> => ({
email: route.params.email,
userAlreadyActivated: route.params.userAlreadyActivated === "true",
}),
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Register") as string },
announcer: { message: (): string => t("Register") as string },
},
},
{
path: "/resend-instructions",
name: UserRouteName.RESEND_CONFIRMATION,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "ResendConfirmation" */ "@/views/User/ResendConfirmation.vue"
),
component: (): Promise<any> =>
import("@/views/User/ResendConfirmation.vue"),
props: true,
meta: {
requiresAuth: false,
announcer: {
message: (): string => i18n.t("Resent confirmation email") as string,
message: (): string => t("Resent confirmation email") as string,
},
},
},
{
path: "/password-reset/send",
name: UserRouteName.SEND_PASSWORD_RESET,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "SendPasswordReset" */ "@/views/User/SendPasswordReset.vue"
),
component: (): Promise<any> => import("@/views/User/SendPasswordReset.vue"),
props: true,
meta: {
requiresAuth: false,
announcer: {
message: (): string => i18n.t("Send password reset") as string,
message: (): string => t("Send password reset") as string,
},
},
},
{
path: "/password-reset/:token",
name: UserRouteName.PASSWORD_RESET,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "PasswordReset" */ "@/views/User/PasswordReset.vue"
),
component: (): Promise<any> => import("@/views/User/PasswordReset.vue"),
meta: {
requiresAuth: false,
announcer: { message: (): string => i18n.t("Password reset") as string },
announcer: { message: (): string => t("Password reset") as string },
},
props: true,
},
{
path: "/validate/email/:token",
name: UserRouteName.EMAIL_VALIDATE,
component: (): Promise<ImportedComponent> =>
import(
/* webpackChunkName: "EmailValidate" */ "@/views/User/EmailValidate.vue"
),
component: (): Promise<any> => import("@/views/User/EmailValidate.vue"),
props: true,
meta: {
requiresAuth: false,
announcer: { message: (): string => i18n.t("Email validate") as string },
announcer: { message: (): string => t("Email validate") as string },
},
},
{
path: "/validate/:token",
name: UserRouteName.VALIDATE,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "Validate" */ "@/views/User/Validate.vue"),
component: (): Promise<any> => import("@/views/User/ValidateUser.vue"),
props: true,
meta: {
requiresAuth: false,
announcer: {
message: (): string => i18n.t("Validating account") as string,
message: (): string => t("Validating account") as string,
},
},
},
{
path: "/login",
name: UserRouteName.LOGIN,
component: (): Promise<ImportedComponent> =>
import(/* webpackChunkName: "Login" */ "@/views/User/Login.vue"),
component: (): Promise<any> => import("@/views/User/LoginView.vue"),
props: true,
meta: {
requiredAuth: false,
announcer: { message: (): string => i18n.t("Login") as string },
announcer: { message: (): string => t("Login") as string },
},
},
];