Skip to content

Commit ca48669

Browse files
committed
refactor!: rename Phoenix.React to Phoenix.ReactServer for consistency
BREAKING CHANGE: Main module file renamed from lib/phoenix/react.ex to lib/phoenix/react_server.ex This is a breaking change that aligns the file structure with the module naming convention. All Phoenix.React references have been updated to Phoenix.ReactServer throughout the codebase. Changes: - Rename lib/phoenix/react.ex to lib/phoenix/react_server.ex - Rename lib/phoenix/react/ directory to lib/phoenix/react_server/ - Update all module documentation examples - Fix Phoenix.React.stop_runtime() reference in react_demo application - Rename all test files from test/phoenix/react/ to test/phoenix/react_server/ - Update configuration references across all config files Migration guide: No code changes required for users as the module was already named Phoenix.ReactServer. Only internal file structure has changed.
1 parent 8c8c01c commit ca48669

35 files changed

+286
-286
lines changed

CLAUDE.md

Lines changed: 34 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ This file provides guidance to Claude Code (claude.ai/code) when working with co
44

55
## Project Overview
66

7-
**Phoenix.React** is a Phoenix framework package that enables server-side rendering of React components within Phoenix HTML templates. It provides a rendering server that can render React components to static markup, strings, or readable streams, with support for client-side hydration.
7+
**Phoenix.ReactServer** is a Phoenix framework package that enables server-side rendering of React components within Phoenix HTML templates. It provides a rendering server that can render React components to static markup, strings, or readable streams, with support for client-side hydration.
88

99
## Architecture
1010

@@ -16,36 +16,36 @@ The system consists of three main layers:
1616

1717
### Core Components
1818

19-
- `Phoenix.React` - Main supervisor and public API
20-
- `Phoenix.React.Server` - GenServer that manages rendering requests and caching
21-
- `Phoenix.React.Runtime` - Dynamic supervisor for runtime processes
22-
- `Phoenix.React.Runtime.Bun` - Bun-based runtime implementation with hot reloading
23-
- `Phoenix.React.Runtime.Deno` - Deno-based runtime implementation with enhanced security
24-
- `Phoenix.React.Cache` - ETS-based caching layer with TTL support
25-
- `Phoenix.React.Helper` - Phoenix.Component integration with multiple rendering modes
26-
- `Phoenix.React.Config` - Centralized configuration management
27-
- `Phoenix.React.Telemetry` - Telemetry and performance monitoring with structured logging
28-
- `Phoenix.React.Runtime.FileWatcher` - File watching for development hot reload
19+
- `Phoenix.ReactServer` - Main supervisor and public API
20+
- `Phoenix.ReactServer.Server` - GenServer that manages rendering requests and caching
21+
- `Phoenix.ReactServer.Runtime` - Dynamic supervisor for runtime processes
22+
- `Phoenix.ReactServer.Runtime.Bun` - Bun-based runtime implementation with hot reloading
23+
- `Phoenix.ReactServer.Runtime.Deno` - Deno-based runtime implementation with enhanced security
24+
- `Phoenix.ReactServer.Cache` - ETS-based caching layer with TTL support
25+
- `Phoenix.ReactServer.Helper` - Phoenix.Component integration with multiple rendering modes
26+
- `Phoenix.ReactServer.Config` - Centralized configuration management
27+
- `Phoenix.ReactServer.Telemetry` - Telemetry and performance monitoring with structured logging
28+
- `Phoenix.ReactServer.Runtime.FileWatcher` - File watching for development hot reload
2929

3030
### Rendering Flow
3131

3232
1. Phoenix component calls `react_component/1` with component name and props
33-
2. Request flows through `Phoenix.React.Helper` which determines render method
34-
3. Request goes to `Phoenix.React.Server` which handles caching and runtime management
33+
2. Request flows through `Phoenix.ReactServer.Helper` which determines render method
34+
3. Request goes to `Phoenix.ReactServer.Server` which handles caching and runtime management
3535
4. Cache layer checked first (if enabled with TTL > 0)
3636
5. Runtime process (Bun or Deno) renders the React component via HTTP API
3737
6. Result cached (if enabled) and returned as HTML string/stream
3838
7. Client-side hydration occurs if needed
3939

4040
### Dual Runtime Support
4141

42-
**Bun Runtime** (`Phoenix.React.Runtime.Bun`)
42+
**Bun Runtime** (`Phoenix.ReactServer.Runtime.Bun`)
4343
- Fast JavaScript runtime with built-in bundler
4444
- Development mode with hot reloading and file watching
4545
- Components use `.js` file extension with JSX syntax
4646
- Default runtime, optimized for development speed
4747

48-
**Deno Runtime** (`Phoenix.React.Runtime.Deno`)
48+
**Deno Runtime** (`Phoenix.ReactServer.Runtime.Deno`)
4949
- Secure runtime with enhanced security features
5050
- Components must use `.jsx` file extension for proper JSX parsing
5151
- Enhanced monitoring and metrics collection
@@ -115,15 +115,15 @@ REACT_RUNTIME=deno mix test
115115
### Basic Setup
116116
```elixir
117117
# In config/config.exs
118-
config :phoenix_react_server, Phoenix.React,
119-
runtime: Phoenix.React.Runtime.Bun,
118+
config :phoenix_react_server, Phoenix.ReactServer,
119+
runtime: Phoenix.ReactServer.Runtime.Bun,
120120
component_base: Path.expand("../assets/component", __DIR__),
121121
render_timeout: 5_000,
122122
cache_ttl: 600
123123

124124
# In application supervision tree
125125
children = [
126-
Phoenix.React,
126+
Phoenix.ReactServer,
127127
# ... other children
128128
]
129129
```
@@ -133,25 +133,25 @@ children = [
133133
# Environment-based runtime switching
134134
runtime =
135135
case System.get_env("REACT_RUNTIME", "bun") do
136-
"bun" -> Phoenix.React.Runtime.Bun
137-
"deno" -> Phoenix.React.Runtime.Deno
138-
_ -> Phoenix.React.Runtime.Bun
136+
"bun" -> Phoenix.ReactServer.Runtime.Bun
137+
"deno" -> Phoenix.ReactServer.Runtime.Deno
138+
_ -> Phoenix.ReactServer.Runtime.Bun
139139
end
140140

141-
config :phoenix_react_server, Phoenix.React, runtime: runtime
141+
config :phoenix_react_server, Phoenix.ReactServer, runtime: runtime
142142
```
143143

144144
### Production Configuration
145145
```elixir
146146
# In runtime.exs for Bun runtime
147-
config :phoenix_react_server, Phoenix.React.Runtime.Bun,
147+
config :phoenix_react_server, Phoenix.ReactServer.Runtime.Bun,
148148
cmd: System.find_executable("bun"),
149149
server_js: Path.expand("../priv/react/server.js", __DIR__),
150150
port: 12666,
151151
env: :prod
152152

153153
# In runtime.exs for Deno runtime
154-
config :phoenix_react_server, Phoenix.React.Runtime.Deno,
154+
config :phoenix_react_server, Phoenix.ReactServer.Runtime.Deno,
155155
cmd: System.find_executable("deno"),
156156
server_js: Path.expand("../priv/react/server.js", __DIR__),
157157
port: 12667,
@@ -160,7 +160,7 @@ config :phoenix_react_server, Phoenix.React.Runtime.Deno,
160160

161161
### Security Configuration
162162
```elixir
163-
config :phoenix_react_server, Phoenix.React.Config,
163+
config :phoenix_react_server, Phoenix.ReactServer.Config,
164164
security: %{
165165
max_component_name_length: 100,
166166
max_request_size: 1_048_576, # 1MB
@@ -251,7 +251,7 @@ hydrateRoot(container, <MyComponent data={window.data} />);
251251

252252
## Telemetry and Monitoring
253253

254-
Phoenix.React includes comprehensive telemetry support via `Phoenix.React.Telemetry` for monitoring performance and tracking events.
254+
Phoenix.ReactServer includes comprehensive telemetry support via `Phoenix.ReactServer.Telemetry` for monitoring performance and tracking events.
255255

256256
### Telemetry Events
257257

@@ -260,7 +260,7 @@ The following telemetry events are emitted automatically:
260260
**Render Events** - `[:phoenix, :react, :render]`
261261
- Measurements: `%{duration: duration_ms}`
262262
- Metadata: `%{component: component, method: method, result: result, timestamp: timestamp}`
263-
- Logged as: `[Phoenix.React] ✓ Rendered 'chart' in 45ms (method: render_to_string, result: ok)`
263+
- Logged as: `[Phoenix.ReactServer] ✓ Rendered 'chart' in 45ms (method: render_to_string, result: ok)`
264264

265265
**Cache Events**
266266
- `[:phoenix, :react, :cache, :hit]` - Fired on cache hits
@@ -321,17 +321,17 @@ end
321321

322322
All telemetry events are automatically logged with structured formatting:
323323

324-
- **Render Duration**: `[Phoenix.React] ✓ Rendered 'my_component' in 45ms (method: render_to_string, result: ok)`
325-
- **Runtime Startup**: `[Phoenix.React] Runtime Bun started on port 5225`
326-
- **Cache Events**: `[Phoenix.React] Cache hit for 'my_component' (method: render_to_string)`
327-
- **Build Events**: `[Phoenix.React] ✓ Build completed for Bun in 1234ms (result: ok)`
324+
- **Render Duration**: `[Phoenix.ReactServer] ✓ Rendered 'my_component' in 45ms (method: render_to_string, result: ok)`
325+
- **Runtime Startup**: `[Phoenix.ReactServer] Runtime Bun started on port 5225`
326+
- **Cache Events**: `[Phoenix.ReactServer] Cache hit for 'my_component' (method: render_to_string)`
327+
- **Build Events**: `[Phoenix.ReactServer] ✓ Build completed for Bun in 1234ms (result: ok)`
328328

329329
### Health Checks
330330

331331
Use telemetry for runtime health monitoring:
332332

333333
```elixir
334-
case Phoenix.React.Telemetry.health_check("Bun", 5225) do
334+
case Phoenix.ReactServer.Telemetry.health_check("Bun", 5225) do
335335
{:ok, metadata} ->
336336
# Runtime is healthy
337337
Logger.info("Runtime healthy: #{metadata.response_time_ms}ms")
@@ -347,7 +347,7 @@ end
347347
Wrap operations with telemetry measurements:
348348

349349
```elixir
350-
Phoenix.React.Telemetry.measure("custom_operation", [:my_app, :custom], fn ->
350+
Phoenix.ReactServer.Telemetry.measure("custom_operation", [:my_app, :custom], fn ->
351351
# Your operation here
352352
do_expensive_work()
353353
end)
@@ -377,7 +377,7 @@ test/ # Test suite
377377
```elixir
378378
defmodule MyAppWeb.ReactComponents do
379379
use Phoenix.Component
380-
import Phoenix.React.Helper
380+
import Phoenix.ReactServer.Helper
381381

382382
def react_my_component(assigns) do
383383
{static, props} = Map.pop(assigns, :static, false)

README.md

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
1-
# Phoenix.React
1+
# Phoenix.ReactServer
22

33
[![CI](https://github.com/gsmlg-dev/phoenix-react/actions/workflows/ci.yml/badge.svg)](https://github.com/gsmlg-dev/phoenix-react/actions/workflows/ci.yml)
44
[![Hex.pm](https://img.shields.io/hexpm/v/phoenix_react_server.svg)](https://hex.pm/packages/phoenix_react_server)
55
[![Hexdocs.pm](https://img.shields.io/badge/hex-docs-lightgreen.svg)](https://hexdocs.pm/phoenix_react_server/)
66
[![Hex.pm](https://img.shields.io/hexpm/dt/phoenix_react_server.svg)](https://hex.pm/packages/phoenix_react_server)
77
[![Hex.pm](https://img.shields.io/hexpm/dw/phoenix_react_server.svg)](https://hex.pm/packages/phoenix_react_server)
88

9-
Phoenix.React is a powerful library that enables server-side rendering of React components within Phoenix applications. It provides seamless integration between React and Phoenix, supporting multiple rendering methods and runtime environments.
9+
Phoenix.ReactServer is a powerful library that enables server-side rendering of React components within Phoenix applications. It provides seamless integration between React and Phoenix, supporting multiple rendering methods and runtime environments.
1010

1111
## ✨ Features
1212

@@ -36,14 +36,14 @@ end
3636

3737
## ⚙️ Configuration
3838

39-
Configure Phoenix.React in your application config:
39+
Configure Phoenix.ReactServer in your application config:
4040

4141
```elixir
4242
import Config
4343

44-
config :phoenix_react_server, Phoenix.React,
45-
# React runtime (default: Phoenix.React.Runtime.Bun)
46-
runtime: Phoenix.React.Runtime.Bun,
44+
config :phoenix_react_server, Phoenix.ReactServer,
45+
# React runtime (default: Phoenix.ReactServer.Runtime.Bun)
46+
runtime: Phoenix.ReactServer.Runtime.Bun,
4747
# React component base path
4848
component_base: Path.expand("../assets/component", __DIR__),
4949
# Render timeout in milliseconds (default: 5_000)
@@ -54,21 +54,21 @@ config :phoenix_react_server, Phoenix.React,
5454

5555
### Supported Runtimes
5656

57-
- **Bun Runtime** (`Phoenix.React.Runtime.Bun`) - Fast JavaScript runtime with built-in bundler
58-
- **Deno Runtime** (`Phoenix.React.Runtime.Deno`) - Secure JavaScript runtime with TypeScript support
57+
- **Bun Runtime** (`Phoenix.ReactServer.Runtime.Bun`) - Fast JavaScript runtime with built-in bundler
58+
- **Deno Runtime** (`Phoenix.ReactServer.Runtime.Deno`) - Secure JavaScript runtime with TypeScript support
5959

6060
### Deno Runtime Configuration
6161

6262
To use Deno instead of Bun, configure the runtime and its specific settings:
6363

6464
```elixir
65-
config :phoenix_react_server, Phoenix.React,
66-
runtime: Phoenix.React.Runtime.Deno,
65+
config :phoenix_react_server, Phoenix.ReactServer,
66+
runtime: Phoenix.ReactServer.Runtime.Deno,
6767
component_base: Path.expand("../assets/component", __DIR__),
6868
cache_ttl: 60
6969

7070
# Deno-specific configuration
71-
config :phoenix_react_server, Phoenix.React.Runtime.Deno,
71+
config :phoenix_react_server, Phoenix.ReactServer.Runtime.Deno,
7272
cmd: System.find_executable("deno"),
7373
server_js: Path.expand("../priv/react/server.js", __DIR__),
7474
port: 5125,
@@ -87,12 +87,12 @@ You can use environment variables to switch runtimes dynamically:
8787
```elixir
8888
runtime =
8989
case System.get_env("REACT_RUNTIME", "bun") do
90-
"bun" -> Phoenix.React.Runtime.Bun
91-
"deno" -> Phoenix.React.Runtime.Deno
92-
_ -> Phoenix.React.Runtime.Bun
90+
"bun" -> Phoenix.ReactServer.Runtime.Bun
91+
"deno" -> Phoenix.ReactServer.Runtime.Deno
92+
_ -> Phoenix.ReactServer.Runtime.Bun
9393
end
9494

95-
config :phoenix_react_server, Phoenix.React, runtime: runtime
95+
config :phoenix_react_server, Phoenix.ReactServer, runtime: runtime
9696
```
9797

9898
### Application Setup
@@ -106,7 +106,7 @@ def start(_type, _args) do
106106
{DNSCluster, query: Application.get_env(:react_demo, :dns_cluster_query) || :ignore},
107107
{Phoenix.PubSub, name: ReactDemo.PubSub},
108108
# React render service
109-
Phoenix.React,
109+
Phoenix.ReactServer,
110110
ReactDemoWeb.Endpoint
111111
]
112112

@@ -122,7 +122,7 @@ Create a Phoenix component module to wrap your React components:
122122
```elixir
123123
defmodule ReactDemoWeb.ReactComponents do
124124
use Phoenix.Component
125-
import Phoenix.React.Helper
125+
import Phoenix.ReactServer.Helper
126126

127127
def react_markdown(assigns) do
128128
{static, props} = Map.pop(assigns, :static, true)
@@ -289,14 +289,14 @@ Configure the runtime for production in `runtime.exs`:
289289

290290
```elixir
291291
# For Bun runtime
292-
config :phoenix_react_server, Phoenix.React.Runtime.Bun,
292+
config :phoenix_react_server, Phoenix.ReactServer.Runtime.Bun,
293293
cmd: System.find_executable("bun"),
294294
server_js: Path.expand("../priv/react/server.js", __DIR__),
295295
port: 12666,
296296
env: :prod
297297

298298
# For Deno runtime
299-
config :phoenix_react_server, Phoenix.React.Runtime.Deno,
299+
config :phoenix_react_server, Phoenix.ReactServer.Runtime.Deno,
300300
cmd: System.find_executable("deno"),
301301
server_js: Path.expand("../priv/react/server.js", __DIR__),
302302
port: 12667,
@@ -343,7 +343,7 @@ A complete demo application is available in the `./react_demo` directory, showca
343343
Configure caching behavior for optimal performance:
344344

345345
```elixir
346-
config :phoenix_react_server, Phoenix.React,
346+
config :phoenix_react_server, Phoenix.ReactServer,
347347
cache_ttl: 300, # 5 minutes cache
348348
gc_time: 60_000 # Cleanup interval in milliseconds
349349
```

config/dev.exs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import Config
22

3-
config :phoenix_react_server, Phoenix.React,
4-
runtime: Phoenix.React.Runtime.Bun,
3+
config :phoenix_react_server, Phoenix.ReactServer,
4+
runtime: Phoenix.ReactServer.Runtime.Bun,
55
component_base: Path.expand("../assets/component", __DIR__),
66
render_timeout: 5_000,
77
cache_ttl: 60

config/prod.exs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import Config
22

3-
config :phoenix_react_server, Phoenix.React,
4-
runtime: Phoenix.React.Runtime.Bun,
3+
config :phoenix_react_server, Phoenix.ReactServer,
4+
runtime: Phoenix.ReactServer.Runtime.Bun,
55
component_base: Path.expand("../priv/react/component", __DIR__),
66
render_timeout: 5_000,
77
cache_ttl: 60 * 15

config/test.exs

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import Config
22

3-
config :phoenix_react_server, Phoenix.React,
4-
runtime: Phoenix.React.Runtime.Bun,
3+
config :phoenix_react_server, Phoenix.ReactServer,
4+
runtime: Phoenix.ReactServer.Runtime.Bun,
55
component_base: Path.expand("../test/fixtures", __DIR__),
66
render_timeout: 10_000,
77
cache_ttl: 60
88

9-
config :phoenix_react_server, Phoenix.React.Runtime.Bun, port: 12457
9+
config :phoenix_react_server, Phoenix.ReactServer.Runtime.Bun, port: 12457

0 commit comments

Comments
 (0)