Infrastructure/astro
0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2025-01-06 22:10:10 -05:00
Code Issues Activity

wip: useActionState test fixture

Browse source
This commit is contained in:
bholmesdev 2024-04-26 18:02:10 -04:00
parent d0eae83cd7
commit d6dbdb73f7
6 changed files with 88 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
packages/integrations/react/src/index.ts
View file

@ -1,6 +1,5 @@
import react, { type Options as ViteReactPluginOptions } from '@vitejs/plugin-react'; import react, { type Options as ViteReactPluginOptions } from '@vitejs/plugin-react';
import type { AstroIntegration } from 'astro'; import type { AstroIntegration } from 'astro';
import { version as ReactVersion } from 'react-dom';
import type * as vite from 'vite'; import type * as vite from 'vite';
export type ReactIntegrationOptions = Pick< export type ReactIntegrationOptions = Pick<
@ -15,12 +14,8 @@ const FAST_REFRESH_PREAMBLE = react.preambleCode;
function getRenderer() { function getRenderer() {
return { return {
name: '@astrojs/react', name: '@astrojs/react',
clientEntrypoint: ReactVersion.startsWith('18.') clientEntrypoint: '@astrojs/react/client.js',
? '@astrojs/react/client.js' serverEntrypoint: '@astrojs/react/server.js'
: '@astrojs/react/client-v17.js',
serverEntrypoint: ReactVersion.startsWith('18.')
? '@astrojs/react/server.js'
: '@astrojs/react/server-v17.js',
}; };
} }
@ -54,19 +49,14 @@ function getViteConfiguration({
}: ReactIntegrationOptions = {}) { }: ReactIntegrationOptions = {}) {
return { return {
optimizeDeps: { optimizeDeps: {
include: [ include: ['@astrojs/react/client.js',
ReactVersion.startsWith('18.')
? '@astrojs/react/client.js'
: '@astrojs/react/client-v17.js',
'react', 'react',
'react/jsx-runtime', 'react/jsx-runtime',
'react/jsx-dev-runtime', 'react/jsx-dev-runtime',
'react-dom', 'react-dom',
], ],
exclude: [ exclude: [
ReactVersion.startsWith('18.') '@astrojs/react/server.js'
? '@astrojs/react/server.js'
: '@astrojs/react/server-v17.js',
], ],
}, },
plugins: [react({ include, exclude, babel }), optionsPlugin(!!experimentalReactChildren)], plugins: [react({ include, exclude, babel }), optionsPlugin(!!experimentalReactChildren)],
@ -74,9 +64,7 @@ function getViteConfiguration({
dedupe: ['react', 'react-dom', 'react-dom/server'], dedupe: ['react', 'react-dom', 'react-dom/server'],
}, },
ssr: { ssr: {
external: ReactVersion.startsWith('18.') external: ['react-dom/server', 'react-dom/client'],
? ['react-dom/server', 'react-dom/client']
: ['react-dom/server.js', 'react-dom/client.js'],
noExternal: [ noExternal: [
// These are all needed to get mui to work. // These are all needed to get mui to work.
'@mui/material', '@mui/material',

7
packages/integrations/react/test/fixtures/react-19/astro.config.mjs vendored Normal file
View file

@ -0,0 +1,7 @@
import { defineConfig } from 'astro/config';
import react from "@astrojs/react";
// https://astro.build/config
export default defineConfig({
integrations: [react()]
});

23
packages/integrations/react/test/fixtures/react-19/package.json vendored Normal file
View file

@ -0,0 +1,23 @@
{
"name": "@test/react-19",
"version": "0.0.0",
"private": true,
"scripts": {
"dev": "astro dev"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"@astrojs/react": "workspace:*",
"astro": "workspace:*",
"react": "19.0.0-beta-94eed63c49-20240425",
"react-dom": "19.0.0-beta-94eed63c49-20240425",
"@types/react": "npm:types-react@beta",
"@types/react-dom": "npm:types-react-dom@beta"
},
"overrides": {
"@types/react": "npm:types-react@beta",
"@types/react-dom": "npm:types-react-dom@beta"
}
}

31
packages/integrations/react/test/fixtures/react-19/src/components/Like.tsx vendored Normal file
View file

@ -0,0 +1,31 @@
import { useActionState } from 'react';
let count = 0;
async function addLike() {
await new Promise((resolve) => setTimeout(resolve, 200));
count++;
return count;
}
function withState<TInput, TOutput>(action: (input: TInput) => Promise<TOutput>) {
return async (state: TOutput, input: TInput) => {
const bound: typeof action = action.bind({
headers: {
'X-React-State': JSON.stringify(state)
}
})
return bound(input);
};
}
export function Like() {
const [state, action, pending] = useActionState(withState(addLike), 0);
return (
<form action={action}>
<button type="submit" disabled={pending}>Like</button>
<p>{state} likes</p>
</form>
)
}

15
packages/integrations/react/test/fixtures/react-19/src/pages/index.astro vendored Normal file
View file

@ -0,0 +1,15 @@
---
import { Like } from '../components/Like';
---
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>React 19</title>
</head>
<body>
<Like client:load />
</body>
</html>

7
packages/integrations/react/test/fixtures/react-19/tsconfig.json vendored Normal file
View file

@ -0,0 +1,7 @@
{
"extends": "astro/tsconfigs/base",
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "react"
}
}