Skip to content

Commit f055949

Browse files
sarah11918sarah11918
authored
Merge branch 'main' into feat/rewrites
2 parents a79a8fb + de54a73 commit f055949

29 files changed

Lines changed: 1128 additions & 123 deletions

‎.github/workflows/welcome-bot.yml‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ jobs:
2626
If they spot any broken links you will see some error messages on this PR.
2727
Don’t hesitate to ask any questions if you’re not sure what these mean!
2828
29-
2. In a few minutes, you’ll be able to see a preview of your changes on Vercel 🥳
29+
2. In a few minutes, you’ll be able to see a preview of your changes on Netlify 🥳.
3030
3131
3. One or more of our maintainers will take a look and may ask you to make changes.
3232
We try to be responsive, but don’t worry if this takes a few days.

‎config/sidebar.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ type StarlightSidebarConfig = NonNullable<Parameters<typeof starlight>[0]['sideb
2222

2323
/** Generate a Starlight sidebar config object from our existing `nav.ts` files. */
2424
export function makeSidebar(): StarlightSidebarConfig {
25-
let currentSubGroup: Extract<StarlightSidebarConfig[number], { items: any }>;
25+
let currentSubGroup: Extract<StarlightSidebarConfig[number], { items: StarlightSidebarConfig }>;
2626
return navTranslations.en.reduce((sidebar, item) => {
2727
if ('header' in item) {
2828
const newGroup = {

‎netlify.toml‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,2 @@
11
[build]
22
command = "NODE_OPTIONS=--max_old_space_size=4096 pnpm netlify:build"
3-
4-
[[plugins]]
5-
package = "./netlify/cache-plugin"

‎netlify/cache-plugin/index.js‎

Lines changed: 0 additions & 56 deletions
This file was deleted.

‎netlify/cache-plugin/manifest.yml‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎src/content/docs/en/basics/layouts.mdx‎

Lines changed: 23 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -238,22 +238,34 @@ const { title, fancyJsHelper } = Astro.props;
238238

239239
<ReadMore>Learn more about Astro’s Markdown and MDX support in our [Markdown/MDX guide](/en/guides/markdown-content/).</ReadMore>
240240

241-
## Using one Layout for `.md`, `.mdx`, and `.astro`
241+
### Using TypeScript with layouts
242242

243-
A single Astro layout can be written to receive the `frontmatter` object from `.md` and `.mdx` files, as well as any named props passed from `.astro` files.
243+
Any astro layout can be modified to introduce typesafety & autocompletion by providing the types for your props:
244244

245-
In the example below, the layout will display the page title either from a frontmatter YAML `title` property or from an Astro component passing a `title` attribute:
246-
247-
```astro /{?title}?/ /Astro.props[.a-z]*/
245+
```astro ins={2-7} title="src/components/MyLayout.astro"
248246
---
249-
// src/components/MyLayout.astro
250-
const { title } = Astro.props.frontmatter || Astro.props;
247+
interface Props {
248+
title: string;
249+
description: string;
250+
publishDate: string;
251+
viewCount: number;
252+
}
253+
const { title, description, publishDate, viewCount } = Astro.props;
251254
---
252-
<html>
253-
<head></head>
255+
<html lang="en">
256+
<head>
257+
<meta charset="UTF-8">
258+
<meta name="description" content={description}>
259+
<title>{title}</title>
260+
</head>
254261
<body>
255-
<h1>{title}</h1>
256-
<slot />
262+
<header>
263+
<p>Published on {publishDate}</p>
264+
<p>Viewed by {viewCount} folks</p>
265+
</header>
266+
<main>
267+
<slot />
268+
</main>
257269
</body>
258270
</html>
259271
```

‎src/content/docs/en/basics/project-structure.mdx‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,10 @@ For help creating a new `package.json` file for your project, check out the [man
118118

119119
This file is generated in every starter template and includes configuration options for your Astro project. Here you can specify integrations to use, build options, server options, and more.
120120

121+
Astro supports several file formats for its JavaScript configuration file: `astro.config.js`, `astro.config.mjs`, `astro.config.cjs` and `astro.config.ts`. We recommend using `.mjs` in most cases or `.ts` if you want to write TypeScript in your config file.
122+
123+
TypeScript config file loading is handled using [`tsm`](https://github.com/lukeed/tsm) and will respect your project's `tsconfig` options.
124+
121125
See the [Configuring Astro Guide](/en/guides/configuring-astro/) for details on setting configurations.
122126

123127
### `tsconfig.json`

‎src/content/docs/en/guides/authentication.mdx‎

Lines changed: 73 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import ReadMore from '~/components/ReadMore.astro'
99

1010
Authentication and authorization are two security processes that manage access to your website or app. Authentication verifies a visitor's identity, while authorization grants access to protected areas and resources.
1111

12-
Authentication allows you to customize areas of your site for logged-in individuals and provides the greatest protection for personal or private information. Authentication libraries (e.g. [Lucia Auth](https://lucia-auth.com/), [Auth.js](https://authjs.dev/)) provide utilities for multiple authentication methods such as email sign-in and OAuth providers.
12+
Authentication allows you to customize areas of your site for logged-in individuals and provides the greatest protection for personal or private information. Authentication libraries (e.g. [Lucia Auth](https://lucia-auth.com/), [Auth.js](https://authjs.dev/), [Clerk](https://clerk.com)) provide utilities for multiple authentication methods such as email sign-in and OAuth providers.
1313

1414
:::tip
1515
There is no official authentication solution for Astro, but you can find [community "auth" integrations](https://astro.build/integrations/?search=auth) in the integrations directory.
@@ -188,6 +188,78 @@ const session = await getSession(Astro.request);
188188
- [`auth-astro` on GitHub](https://github.com/nowaythatworked/auth-astro?tab=readme-ov-file#auth-astro)
189189
- [Auth.js documentation](https://authjs.dev/)
190190

191+
## Clerk
192+
193+
Clerk is a complete suite of embeddable UIs, flexible APIs, and admin dashboards to authenticate and manage your users. An [official Clerk SDK for Astro](https://clerk.com/docs/references/astro/overview) is available.
194+
195+
### Installation
196+
197+
Install `@clerk/astro` using the package manager of your choice.
198+
199+
<PackageManagerTabs>
200+
<Fragment slot="npm">
201+
```shell
202+
npm install @clerk/astro
203+
```
204+
</Fragment>
205+
<Fragment slot="pnpm">
206+
```shell
207+
pnpm add @clerk/astro
208+
```
209+
</Fragment>
210+
<Fragment slot="yarn">
211+
```shell
212+
yarn add @clerk/astro
213+
```
214+
</Fragment>
215+
</PackageManagerTabs>
216+
217+
### Configuration
218+
219+
Follow [Clerk's own Astro Quickstart guide](https://clerk.com/docs/quickstarts/astro) to set up Clerk integration and middleware in your Astro project.
220+
221+
### Usage
222+
223+
Clerk provides components that allow you to control the visibility of pages based on your user's authentication state. Show logged out users a sign in button instead of the content available to users who are logged in:
224+
225+
```astro title="src/pages/index.astro"
226+
---
227+
import Layout from 'src/layouts/Base.astro';
228+
import { SignedIn, SignedOut, UserButton, SignInButton } from '@clerk/astro/components';
229+
---
230+
231+
<Layout>
232+
<SignedIn>
233+
<UserButton />
234+
</SignedIn>
235+
<SignedOut>
236+
<SignInButton />
237+
</SignedOut>
238+
</Layout>
239+
```
240+
241+
Clerk also allows you to protect routes on the server using middleware. Specify which routes are protected, and prompt unauthenticated users to sign in:
242+
243+
```ts title="src/middleware.ts"
244+
import { clerkMiddleware, createRouteMatcher } from '@clerk/astro/server';
245+
246+
const isProtectedRoute = createRouteMatcher([
247+
'/dashboard(.*)',
248+
'/forum(.*)',
249+
]);
250+
251+
export const onRequest = clerkMiddleware((auth, context) => {
252+
if (!auth().userId && isProtectedRoute(context.request)) {
253+
return auth().redirectToSignIn();
254+
}
255+
});
256+
```
257+
258+
### Next Steps
259+
260+
- Read the [official `@clerk/astro` documentation](https://clerk.com/docs/references/astro/overview)
261+
- Start from a template with the [Clerk + Astro Quickstart project](https://github.com/clerk/clerk-astro-quickstart)
262+
191263
## Community Resources
192264

193265
- [Using Microsoft Entra Id EasyAuth with Astro and Azure Static Web App](https://agramont.net/blog/entra-id-easyauth-with-astro/)

‎src/content/docs/en/guides/routing.mdx‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -471,7 +471,7 @@ interface Page<T = any> {
471471
total: number;
472472
/** the current page number, starting from 1 */
473473
currentPage: number;
474-
/** number of items per page (default: 25) */
474+
/** number of items per page (default: 10) */
475475
size: number;
476476
/** number of last page */
477477
lastPage: number;
@@ -482,10 +482,16 @@ interface Page<T = any> {
482482
prev: string | undefined;
483483
/** url of the next page (if there is one) */
484484
next: string | undefined;
485+
/** url of the first page (if the current page is not the first page) */
486+
first: string | undefined;
487+
/** url of the last page (if the current page in not the last page) */
488+
last: string | undefined;
485489
};
486490
}
487491
```
488492

493+
<ReadMore>Learn more about [the pagination `page` prop](/en/reference/api-reference/#the-pagination-page-prop).</ReadMore>
494+
489495
### Nested Pagination
490496

491497
A more advanced use-case for pagination is **nested pagination.** This is when pagination is combined with other dynamic route params. You can use nested pagination to group your paginated collection by some property or tag.

‎src/content/docs/en/install-and-setup.mdx‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,10 @@ Prefer to try Astro in your browser? Visit [astro.new](https://astro.new/) to br
2222
- **Text editor** - We recommend [VS Code](https://code.visualstudio.com/) with our [Official Astro extension](https://marketplace.visualstudio.com/items?itemName=astro-build.astro-vscode).
2323
- **Terminal** - Astro is accessed through its command-line interface (CLI).
2424

25+
## Browser compatibility
26+
27+
Astro is built with Vite which targets browsers with modern JavaScript support by default. For a complete reference, you can see the [list of currently supported browser versions in Vite](https://vitejs.dev/guide/build.html#browser-compatibility).
28+
2529
## Start a new project
2630

2731
### Install from the CLI wizard

0 commit comments

Comments
 (0)