From af05a6f1fed4443e35caaa9eb84b0fc3c0526c65 Mon Sep 17 00:00:00 2001 From: Ferran Date: Fri, 4 Oct 2024 08:10:40 +0200 Subject: [PATCH] chore: astro v5 migration + tab contact support --- astro.config.ts | 206 +++--- package.json | 6 +- .../contact/components/tabs/Tabs.astro | 10 +- .../contact/utils/changeTab/changeTab.ts | 30 +- .../modules/core/components/head/Head.astro | 4 +- tsconfig.json | 1 + yarn.lock | 697 ++++++++++-------- 7 files changed, 539 insertions(+), 415 deletions(-) diff --git a/astro.config.ts b/astro.config.ts index 9a61788f..179e7cec 100644 --- a/astro.config.ts +++ b/astro.config.ts @@ -9,112 +9,9 @@ import { defineConfig, envField } from "astro/config"; const isProd = import.meta.env.PROD; export default defineConfig({ - experimental: { - contentLayer: true, - contentCollectionCache: true, - env: { - validateSecrets: true, - schema: { - SITE_URL: envField.string({ - access: "public", - context: "client", - default: "https://biancafiore.me", - }), - BIANCA_EMAIL: envField.string({ - access: "public", - context: "client", - default: import.meta.env.BIANCA_EMAIL, - }), - TWITTER_HANDLE: envField.string({ - access: "public", - context: "client", - default: import.meta.env.TWITTER_HANDLE, - }), - GOOGLE_ANALYTICS_ID: envField.string({ - access: "public", - context: "client", - }), - GOOGLE_TAG_MANAGER_ID: envField.string({ - access: "public", - context: "client", - }), - GOOGLE_RECAPTCHA_SITE_KEY: envField.string({ - access: "public", - context: "client", - }), - GOOGLE_RECAPTCHA_SECRET_KEY: envField.string({ - access: "public", - context: "client", - }), - FIREBASE_PRIVATE_KEY_ID: envField.string({ - access: "secret", - context: "server", - }), - FIREBASE_PRIVATE_KEY: envField.string({ - access: "secret", - context: "server", - }), - FIREBASE_PROJECT_ID: envField.string({ - access: "secret", - context: "server", - }), - FIREBASE_CLIENT_EMAIL: envField.string({ - access: "secret", - context: "server", - }), - FIREBASE_CLIENT_ID: envField.string({ - access: "secret", - context: "server", - }), - FIREBASE_AUTH_URI: envField.string({ - access: "secret", - context: "server", - }), - FIREBASE_TOKEN_URI: envField.string({ - access: "secret", - context: "server", - }), - FIREBASE_AUTH_CERT_URL: envField.string({ - access: "secret", - context: "server", - }), - FIREBASE_CLIENT_CERT_URL: envField.string({ - access: "secret", - context: "server", - }), - RESEND_API_KEY: envField.string({ - access: "secret", - context: "server", - }), - CONTENTFUL_SPACE_ID: envField.string({ - access: "secret", - context: "server", - }), - CONTENTFUL_DELIVERY_TOKEN: envField.string({ - access: "secret", - context: "server", - }), - CONTENTFUL_PREVIEW_TOKEN: envField.string({ - access: "secret", - context: "server", - }), - CONTENTFUL_SIGNIN_TOKEN: envField.string({ - access: "secret", - context: "server", - }), - ALGOLIA_API_KEY: envField.string({ - access: "secret", - context: "server", - }), - ALGOLIA_APP_ID: envField.string({ - access: "secret", - context: "server", - }), - }, - }, - }, site: "https://biancafiore.me", prefetch: true, + output: "static", vite: { ssr: { external: ["firebase-admin", "node:async_hooks", "contentful"], @@ -131,10 +28,109 @@ export default defineConfig({ }, }), ], - output: "hybrid", adapter: cloudflare({ platformProxy: { enabled: isProd, }, }), + env: { + validateSecrets: true, + schema: { + SITE_URL: envField.string({ + access: "public", + context: "client", + default: "https://biancafiore.me", + }), + BIANCA_EMAIL: envField.string({ + access: "public", + context: "client", + default: import.meta.env.BIANCA_EMAIL, + }), + TWITTER_HANDLE: envField.string({ + access: "public", + context: "client", + default: import.meta.env.TWITTER_HANDLE, + }), + GOOGLE_ANALYTICS_ID: envField.string({ + access: "public", + context: "client", + }), + GOOGLE_TAG_MANAGER_ID: envField.string({ + access: "public", + context: "client", + }), + GOOGLE_RECAPTCHA_SITE_KEY: envField.string({ + access: "public", + context: "client", + }), + GOOGLE_RECAPTCHA_SECRET_KEY: envField.string({ + access: "public", + context: "client", + }), + FIREBASE_PRIVATE_KEY_ID: envField.string({ + access: "secret", + context: "server", + }), + FIREBASE_PRIVATE_KEY: envField.string({ + access: "secret", + context: "server", + }), + FIREBASE_PROJECT_ID: envField.string({ + access: "secret", + context: "server", + }), + FIREBASE_CLIENT_EMAIL: envField.string({ + access: "secret", + context: "server", + }), + FIREBASE_CLIENT_ID: envField.string({ + access: "secret", + context: "server", + }), + FIREBASE_AUTH_URI: envField.string({ + access: "secret", + context: "server", + }), + FIREBASE_TOKEN_URI: envField.string({ + access: "secret", + context: "server", + }), + FIREBASE_AUTH_CERT_URL: envField.string({ + access: "secret", + context: "server", + }), + FIREBASE_CLIENT_CERT_URL: envField.string({ + access: "secret", + context: "server", + }), + RESEND_API_KEY: envField.string({ + access: "secret", + context: "server", + }), + CONTENTFUL_SPACE_ID: envField.string({ + access: "secret", + context: "server", + }), + CONTENTFUL_DELIVERY_TOKEN: envField.string({ + access: "secret", + context: "server", + }), + CONTENTFUL_PREVIEW_TOKEN: envField.string({ + access: "secret", + context: "server", + }), + CONTENTFUL_SIGNIN_TOKEN: envField.string({ + access: "secret", + context: "server", + }), + ALGOLIA_API_KEY: envField.string({ + access: "secret", + context: "server", + }), + ALGOLIA_APP_ID: envField.string({ + access: "secret", + context: "server", + }), + }, + }, }); diff --git a/package.json b/package.json index ad41343c..bf7bcf2d 100644 --- a/package.json +++ b/package.json @@ -44,8 +44,8 @@ }, "dependencies": { "@astrojs/check": "^0.9.3", - "@astrojs/cloudflare": "^11.1.0", - "@astrojs/mdx": "^3.1.7", + "@astrojs/cloudflare": "12.0.0-beta.0", + "@astrojs/mdx": "4.0.0-beta.2", "@astrojs/partytown": "^2.1.2", "@astrojs/react": "^3.6.2", "@astrojs/rss": "^4.0.7", @@ -56,7 +56,7 @@ "@hookform/resolvers": "^3.9.0", "@million/lint": "^1.0.8", "algoliasearch": "^5.7.0", - "astro": "^4.15.11", + "astro": "5.0.0-beta.3", "clsx": "^2.1.1", "contentful": "^11.0.3", "firebase": "^10.14.0", diff --git a/src/ui/modules/contact/components/tabs/Tabs.astro b/src/ui/modules/contact/components/tabs/Tabs.astro index 53dfd675..4ca35df4 100644 --- a/src/ui/modules/contact/components/tabs/Tabs.astro +++ b/src/ui/modules/contact/components/tabs/Tabs.astro @@ -10,17 +10,17 @@ import "./tabs.css";

Multiple ways to get in touch with me :)

-
+
-
+
import { initTabs } from '../../utils/changeTab'; - + const tab = new URLSearchParams(window.location.search).get("tab"); initTabs(); diff --git a/src/ui/modules/contact/utils/changeTab/changeTab.ts b/src/ui/modules/contact/utils/changeTab/changeTab.ts index 68e79ccc..f416f9f8 100644 --- a/src/ui/modules/contact/utils/changeTab/changeTab.ts +++ b/src/ui/modules/contact/utils/changeTab/changeTab.ts @@ -1,20 +1,22 @@ -interface Tab { - id: string; - target: string; +enum TabId { + FORM = "form", + CALENDLY = "calendly", } const SELECTORS = { TAB: ".contact-tab", }; -const changeTab = (tabId: Tab["id"]) => { - const tabs: NodeListOf = document.querySelectorAll(SELECTORS.TAB); +const getTabs = (): NodeListOf => document.querySelectorAll(SELECTORS.TAB); - for (const tab of tabs) { +const changeTab = (tabId: TabId) => { + const TABS = getTabs(); + + for (const tab of TABS) { const tabContentId = tab.dataset.target; const tabContent: HTMLElement | null = document.querySelector(`#${tabContentId}`); - if (!tabContent) continue; + if (!tabContent) return; const isActive = tabContentId === tabId; tab.classList.toggle("--is-active", isActive); @@ -24,12 +26,14 @@ const changeTab = (tabId: Tab["id"]) => { }; export function initTabs() { - const tabs: NodeListOf = document.querySelectorAll(SELECTORS.TAB); + const TABS = getTabs(); + const DEFAULT_TAB = TABS[0].dataset.target as TabId; + const queryTab = new URLSearchParams(window.location.search).get("tab"); + const initialTab = queryTab === TabId.FORM || queryTab === TabId.CALENDLY ? queryTab : DEFAULT_TAB; - for (const tab of tabs) { - tab.addEventListener("click", () => { - changeTab(tab.dataset.target ?? ""); - }); + for (const tab of TABS) { + tab.addEventListener("click", () => changeTab(tab.dataset.target as TabId)); } - changeTab(tabs[0].dataset.target ?? ""); + + changeTab(initialTab); } diff --git a/src/ui/modules/core/components/head/Head.astro b/src/ui/modules/core/components/head/Head.astro index 796ff140..5bf1a6a8 100644 --- a/src/ui/modules/core/components/head/Head.astro +++ b/src/ui/modules/core/components/head/Head.astro @@ -3,7 +3,7 @@ import type { SeoMetadata } from "@const/types"; import "@fontsource-variable/nunito-sans"; import "@fontsource/baskervville"; import { GOOGLE_ANALYTICS_ID, GOOGLE_TAG_MANAGER_ID } from "astro:env/client"; -import { ViewTransitions } from "astro:transitions"; +import { ClientRouter } from "astro:transitions"; import Seo from "@modules/core/components/seo/Seo.astro"; import "@styles/index.css"; @@ -19,7 +19,7 @@ const props = Astro.props as HeadProps; 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer',GOOGLE_TAG_MANAGER_ID); - +