From 04aede3255996774ab917ffa6fdd68be925bc084 Mon Sep 17 00:00:00 2001 From: Chris Swithinbank Date: Wed, 27 Nov 2024 16:08:37 +0100 Subject: [PATCH] Examples fixes and preview.astro.new support (#12543) Co-authored-by: Emanuele Stoppa <602478+ematipico@users.noreply.github.com> --- .github/workflows/examples-deploy.yml | 22 ++++++++++ examples/blog/src/components/HeaderLink.astro | 5 +-- examples/portfolio/src/components/Nav.astro | 40 ++++++------------- .../with-nanostores/src/layouts/Layout.astro | 9 +++-- .../with-nanostores/src/pages/index.astro | 3 +- examples/with-nanostores/src/utils.ts | 4 ++ 6 files changed, 48 insertions(+), 35 deletions(-) create mode 100644 .github/workflows/examples-deploy.yml create mode 100644 examples/with-nanostores/src/utils.ts diff --git a/.github/workflows/examples-deploy.yml b/.github/workflows/examples-deploy.yml new file mode 100644 index 0000000000..91ef304f01 --- /dev/null +++ b/.github/workflows/examples-deploy.yml @@ -0,0 +1,22 @@ +# This workflow runs when changes to examples are pushed to main. +# It calls a build hook on Netlify that will redeploy preview.astro.new with the latest changes. + +name: Redeploy preview.astro.new + +on: + push: + branches: + - main + paths: + - 'examples/**' + workflow_dispatch: + +jobs: + deploy: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v4 + - name: Send a POST request to Netlify to rebuild preview.astro.new + run: 'curl -X POST -d {} ${{ env.BUILD_HOOK }}' + env: + BUILD_HOOK: ${{ secrets.NETLIFY_PREVIEWS_BUILD_HOOK }} diff --git a/examples/blog/src/components/HeaderLink.astro b/examples/blog/src/components/HeaderLink.astro index bb600fb65a..41da8462e8 100644 --- a/examples/blog/src/components/HeaderLink.astro +++ b/examples/blog/src/components/HeaderLink.astro @@ -4,10 +4,9 @@ import type { HTMLAttributes } from 'astro/types'; type Props = HTMLAttributes<'a'>; const { href, class: className, ...props } = Astro.props; - -const { pathname } = Astro.url; +const pathname = Astro.url.pathname.replace(import.meta.env.BASE_URL, ''); const subpath = pathname.match(/[^\/]+/g); -const isActive = href === pathname || href === '/' + subpath?.[0]; +const isActive = href === pathname || href === '/' + (subpath?.[0] || ''); --- diff --git a/examples/portfolio/src/components/Nav.astro b/examples/portfolio/src/components/Nav.astro index f75c230ceb..9d69707b30 100644 --- a/examples/portfolio/src/components/Nav.astro +++ b/examples/portfolio/src/components/Nav.astro @@ -19,6 +19,14 @@ const iconLinks: { label: string; href: string; icon: keyof typeof iconPaths }[] { label: 'dribbble', href: 'https://dribbble.com/me', icon: 'dribbble-logo' }, { label: 'YouTube', href: 'https://www.youtube.com/@me/', icon: 'youtube-logo' }, ]; + +/** Test if a link is pointing to the current page. */ +const isCurrentPage = (href: string) => { + let pathname = Astro.url.pathname.replace(import.meta.env.BASE_URL, ''); + if (pathname.at(0) !== '/') pathname = '/' + pathname; + if (pathname.at(-1) !== '/') pathname += '/'; + return pathname === href || (href !== '/' && pathname.startsWith(href)); +}; ---