Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

extend config options to pagefind #1365

Merged
merged 17 commits into from
Jan 29, 2024
Merged

extend config options to pagefind #1365

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
17 commits
Select commit Hold shift + click to select a range
4cef29d
extend config options to pagefind
Jan 12, 2024
eaeb949
add changeset
Jan 12, 2024
411f082
move logic format-path
Jan 12, 2024
fb0a2c3
increase js size limit by 1kb
Jan 12, 2024
a6d8db7
revert format path changes
Jan 17, 2024
57a66ca
copy-pasta
Jan 17, 2024
b15b8bb
revert size limit increase
Jan 17, 2024
470f40b
revert size limit^2
Jan 17, 2024
918cdaa
Refactor projectConfig and formatPath in Search component
Jan 28, 2024
51f8abd
Apply `chris.js` suggestions from code review
kevinzunigacuellar Jan 28, 2024
b5768e1
format code
Jan 28, 2024
22606eb
Revert size limit change
delucis Jan 29, 2024
cb0ffa8
Update changeset
delucis Jan 29, 2024
d07c404
Reorganise changes and fix types
delucis Jan 29, 2024
c3f1bbd
Don’t strip initial slash on home URL
delucis Jan 29, 2024
2f562bd
Merge branch 'main' into pagefind-config
delucis Jan 29, 2024
eac4542
Bump size limit again (passed locally but not in CI 🤷)
delucis Jan 29, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/silver-dots-guess.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@astrojs/starlight': patch
---

Exposes project config to pagefind UI to correctly format search result links
2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@
{
"name": "/_astro/*.js",
"path": "examples/basics/dist/_astro/*.js",
"limit": "22 kB"
"limit": "23 kB"
},
{
"name": "/_astro/*.css",
Expand Down
7 changes: 6 additions & 1 deletion packages/starlight/components/Search.astro
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,8 @@ const pagefindTranslations = {
</site-search>

<script>
import { formatPathNoBase } from '../utils/format-path';
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know it might require some code duplication but I’m hesitant about importing this utility into client-side code. Can we move this into a minimal version of the code just for this use case inside the <script> tag?

Copy link
Member Author

@kevinzunigacuellar kevinzunigacuellar Jan 16, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I am not sure if I understood this correctly, you mean creating a utility inside the script tag just for pagefind?

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yes. Basically to isolate the client-side script from modules that are used elsewhere and might import all kinds of things unintentionally at some point.


class SiteSearch extends HTMLElement {
constructor() {
super();
Expand Down Expand Up @@ -111,7 +113,6 @@ const pagefindTranslations = {
try {
translations = JSON.parse(this.dataset.translations || '{}');
} catch {}

window.addEventListener('DOMContentLoaded', () => {
if (import.meta.env.DEV) return;
const onIdle = window.requestIdleCallback || ((cb) => setTimeout(cb, 1));
Expand All @@ -124,6 +125,10 @@ const pagefindTranslations = {
showImages: false,
translations,
showSubResults: true,
processResult: (result: any) => {
result.url = formatPathNoBase(result.url);
return result;
},
});
});
});
Expand Down
5 changes: 3 additions & 2 deletions packages/starlight/utils/createPathFormatter.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
interface FormatPathOptions {
format?: AstroConfig['build']['format'];
trailingSlash?: AstroConfig['trailingSlash'];
addBase?: boolean;
}

const formatStrategies = {
Expand All @@ -32,13 +33,13 @@ const trailingSlashStrategies = {
/** Format a path based on the project config. */
function formatPath(
href: string,
{ format = 'directory', trailingSlash = 'ignore' }: FormatPathOptions
{ format = 'directory', trailingSlash = 'ignore', addBase = true }: FormatPathOptions
) {
const formatStrategy = formatStrategies[format];
const trailingSlashStrategy = trailingSlashStrategies[trailingSlash];

// Add base
href = formatStrategy.addBase(href);
href = addBase ? formatStrategy.addBase(href) : href;

// Handle extension
href = formatStrategy.handleExtension(href);
Expand Down
6 changes: 6 additions & 0 deletions packages/starlight/utils/format-path.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,3 +5,9 @@ export const formatPath = createPathFormatter({
format: project.build.format,
trailingSlash: project.trailingSlash,
});

export const formatPathNoBase = createPathFormatter({
format: project.build.format,
trailingSlash: project.trailingSlash,
addBase: false,
});
Loading