diff --git a/eslint.config.js b/eslint.config.js index f4575c4..6cc9ef1 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -20,6 +20,7 @@ export default defineConfig([ rules: { semi: "error", "prefer-const": "error", + "@typescript-eslint/no-explicit-any": "off" }, }, { diff --git a/index.html b/index.html index fb5c481..3eab86a 100644 --- a/index.html +++ b/index.html @@ -3,9 +3,9 @@ - + - Shell + Moduflix diff --git a/public/favicon.ico b/public/favicon.ico deleted file mode 100644 index df36fcf..0000000 Binary files a/public/favicon.ico and /dev/null differ diff --git a/public/logo.svg b/public/logo.svg new file mode 100644 index 0000000..72e936f --- /dev/null +++ b/public/logo.svg @@ -0,0 +1,50 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/main.ts b/src/main.ts index 64267dc..8830cc0 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,7 +1,7 @@ import { createPinia } from "pinia"; import { createApp } from "vue"; -import { router } from "./routes/routes"; +import router from "./routes/routes"; import App from "./App.vue"; const app = createApp(App); diff --git a/src/routes/loaders/loadLandingRemote.ts b/src/routes/loaders/loadLandingRemote.ts new file mode 100644 index 0000000..2e13de8 --- /dev/null +++ b/src/routes/loaders/loadLandingRemote.ts @@ -0,0 +1,12 @@ +import { applyDocumentMeta } from "../../utils/applyDocumentMeta"; + +export async function loadLandingRemote() { + const remote = await import("landing/Landing"); + + applyDocumentMeta({ + title: "Moduflix - Landing", + description: "Application with Vue.js", + }); + + return remote.default; +} diff --git a/src/routes/routes.ts b/src/routes/routes.ts index 10ca36a..3f3fbd9 100644 --- a/src/routes/routes.ts +++ b/src/routes/routes.ts @@ -1,15 +1,21 @@ import { createRouter, createWebHistory } from "vue-router"; import Auth from "../views/Auth.vue"; -import Landing from "../views/Landing.vue"; import Catalog from "../views/Catalog.vue"; import Player from "../views/Player.vue"; +import { loadLandingRemote } from "./loaders/loadLandingRemote"; const routes = [ - { path: "/", component: Landing }, + { path: "/", component: loadLandingRemote }, { path: "/auth", component: Auth }, { path: "/catalog", component: Catalog }, { path: "/player", component: Player }, ]; -export const router = createRouter({ history: createWebHistory(), routes }); +const router = createRouter({ history: createWebHistory(), routes }); + +(window as any).shellNavigate = (to: string) => { + router.push(to); +}; + +export default router; diff --git a/src/types/landing.d.ts b/src/types/landing.d.ts new file mode 100644 index 0000000..115cdf4 --- /dev/null +++ b/src/types/landing.d.ts @@ -0,0 +1,7 @@ +/* eslint-disable @typescript-eslint/no-explicit-any */ +/* eslint-disable @typescript-eslint/no-empty-object-type */ +declare module "landing/Landing" { + import { DefineComponent } from "vue"; + const component: DefineComponent<{}, {}, any>; + export default component; +} diff --git a/src/utils/applyDocumentMeta.ts b/src/utils/applyDocumentMeta.ts new file mode 100644 index 0000000..4ec7e26 --- /dev/null +++ b/src/utils/applyDocumentMeta.ts @@ -0,0 +1,25 @@ +export function applyDocumentMeta({ + title, + description, +}: { + title?: string; + description?: string; +}) { + if (title) { + document.title = title; + } + + if (description) { + let metaDesc = document.querySelector( + 'meta[name="description"]', + ) as HTMLMetaElement | null; + + if (!metaDesc) { + metaDesc = document.createElement("meta"); + metaDesc.name = "description"; + document.head.appendChild(metaDesc); + } + + metaDesc.content = description; + } +}