diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/Breadcrumbs.astro | 36 | ||||
| -rw-r--r-- | src/components/Navbar.astro | 2 | ||||
| -rw-r--r-- | src/components/SwitchLanguageLink.astro | 2 | ||||
| -rw-r--r-- | src/i18n/translations/components/breadcrumbs.ts | 22 | ||||
| -rw-r--r-- | src/lib/findAllIndicesOf.ts | 14 |
5 files changed, 75 insertions, 1 deletions
diff --git a/src/components/Breadcrumbs.astro b/src/components/Breadcrumbs.astro new file mode 100644 index 0000000..d29acee --- /dev/null +++ b/src/components/Breadcrumbs.astro @@ -0,0 +1,36 @@ +--- +import findAllIndicesOf from '../lib/findAllIndicesOf'; +import translate from '../i18n/translate'; +import tBreadcrumbs from '../i18n/translations/components/breadcrumbs'; +import type Locale from '../types/Locale'; +import locales from '../i18n/locales'; + +const path = Astro.url.pathname.replace(/(?!\/)$/, '/'); +const localeInPath = new RegExp(`/(?<=^/)(${locales.join('|')})`); +const locale = path.match(localeInPath)?.[1] as Locale; +if (!locale) { + return; +} +const pathWithoutLocale = path.replace(new RegExp(`^/${locale}`), ''); +console.log('Path without locale: %s', pathWithoutLocale); +const slashIndices = findAllIndicesOf('/', pathWithoutLocale); +console.log('Indices: (%s)', slashIndices.join(',')); +const parentRoutes = slashIndices.map((n) => pathWithoutLocale.slice(0, n + 1)).slice(0, -1); +console.log('Parent routes: (%s)', parentRoutes.join(',')); + +const t = translate(locale); +--- + +<ol class="breadcrumbs"> + { + /* parentRoutes.length > 1 && */ parentRoutes.map((route) => { + return ( + <li> + <a class="link" href={`/${locale}${route}`}> + {t(tBreadcrumbs, { key: route })} + </a> + </li> + ); + }) + } +</ol> diff --git a/src/components/Navbar.astro b/src/components/Navbar.astro index 8174efe..80829d3 100644 --- a/src/components/Navbar.astro +++ b/src/components/Navbar.astro @@ -1,5 +1,6 @@ --- import type Locale from '../types/Locale'; +import Breadcrumbs from './Breadcrumbs.astro'; import SwitchLanguageLink from './SwitchLanguageLink.astro'; interface Props { @@ -11,4 +12,5 @@ const { locale } = Astro.props; <nav class="dark"> <SwitchLanguageLink currentLocale={locale} /> + <Breadcrumbs /> </nav> diff --git a/src/components/SwitchLanguageLink.astro b/src/components/SwitchLanguageLink.astro index 77dfa18..e8dace3 100644 --- a/src/components/SwitchLanguageLink.astro +++ b/src/components/SwitchLanguageLink.astro @@ -18,7 +18,7 @@ const otherLocalePath = currentPath.replace(currentLocaleInPath, `${otherLocale} const t = translate(currentLocale); --- -<a class="link" href={otherLocalePath}> +<a class="link switch-language-link" href={otherLocalePath}> { t(tPage, { key: 'language-link-text', diff --git a/src/i18n/translations/components/breadcrumbs.ts b/src/i18n/translations/components/breadcrumbs.ts new file mode 100644 index 0000000..a0af6f9 --- /dev/null +++ b/src/i18n/translations/components/breadcrumbs.ts @@ -0,0 +1,22 @@ +import type { TranslationsDictionary } from '../../../types/TranslationsDictionary'; + +// This maun be kept up til date bi haund. There is +// nae compile-time check that aw routes hae been +// translatit. +const breadcrumbsTranslations = { + '/': { + sco: () => 'Hame', + 'en-GB': () => 'Home', + }, + '/furthsettins/': { + sco: () => 'Furthsettins', + 'en-GB': () => 'Publications', + }, + '/furthsettins/lallans/': { + sco: () => 'Lallans', + 'en-GB': () => 'Lallans', + }, +}; + +type Raw = typeof breadcrumbsTranslations; +export default breadcrumbsTranslations as TranslationsDictionary<Raw>; diff --git a/src/lib/findAllIndicesOf.ts b/src/lib/findAllIndicesOf.ts new file mode 100644 index 0000000..8f1a100 --- /dev/null +++ b/src/lib/findAllIndicesOf.ts @@ -0,0 +1,14 @@ +export default function (searchFor: string, searchIn: string): number[] { + const indices: number[] = []; + + let index = -1; + while (index !== searchIn.length - 1) { + index = searchIn.slice(index + 1).indexOf(searchFor) + index + 1; + if (index === -1) { + break; + } + indices.push(index); + } + + return indices; +} |
