quilt_rails 1.12.0 → 1.12.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +53 -6
- data/lib/quilt_rails/performance/report.rb +1 -1
- data/lib/quilt_rails/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 7dd3a1819df8890a210390afc49273715e052de27f62484e194a5aa577d4783b
|
4
|
+
data.tar.gz: e09486d3a9274e9ae539dfba6b533f0c1caff6a217706d990d4dd3286c9a1425
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 6ced5760673f5410ddfb4eefdd3ab87a2708e0de26eaddce0a27e51a9a596a28b0936e18eb410ac87f175209fc039a8a46b4b106a31139b99ea331de942f7b49
|
7
|
+
data.tar.gz: 1376c88df0991345ca4c05dc18e89cbcbf5f358c3c237f34eb6fc307646c38834ed19d1e35d7ee413a01672c072f50eb4715f416bf2d9deffc97fee795033610
|
data/README.md
CHANGED
@@ -329,9 +329,39 @@ function App() {
|
|
329
329
|
export default App;
|
330
330
|
```
|
331
331
|
|
332
|
+
##### Example: sending custom headers from Rails controller
|
333
|
+
|
334
|
+
In some cases you may want to send custom headers from Rails to your React server. Quilt facilitates this case by providing consumers with a `headers` argument on the `render_react` call.
|
335
|
+
|
336
|
+
```ruby
|
337
|
+
class ReactController < ApplicationController
|
338
|
+
include Quilt::ReactRenderable
|
339
|
+
|
340
|
+
def index
|
341
|
+
render_react(headers: {'x-custom-header': 'header-value-a'})
|
342
|
+
end
|
343
|
+
end
|
344
|
+
```
|
345
|
+
|
346
|
+
Headers can be accessed during server-side-rendering with the `useRequestHeader` hook from `@shopify/react-network`.
|
347
|
+
|
348
|
+
```tsx
|
349
|
+
// app/ui/index.tsx
|
350
|
+
|
351
|
+
import React from 'react';
|
352
|
+
import {useRequestHeader} from '@shopify/react-network';
|
353
|
+
|
354
|
+
function App() {
|
355
|
+
const header = useRequestHeader('x-custom-header');
|
356
|
+
return <h1>Data: {header}</h1>;
|
357
|
+
}
|
358
|
+
|
359
|
+
export default App;
|
360
|
+
```
|
361
|
+
|
332
362
|
##### Example: sending custom data from Rails controller
|
333
363
|
|
334
|
-
In some cases you may want to send
|
364
|
+
In some cases you may want to send basic data from Rails to your React server. Quilt facilitates this case by providing consumers with a `data` argument on the `render_react` call.
|
335
365
|
|
336
366
|
**Note:** The data passed should be data that is unlikely or will never change over the course of the session before they render any React components.
|
337
367
|
|
@@ -340,12 +370,12 @@ class ReactController < ApplicationController
|
|
340
370
|
include Quilt::ReactRenderable
|
341
371
|
|
342
372
|
def index
|
343
|
-
render_react(
|
373
|
+
render_react(data: {'some_id': 123})
|
344
374
|
end
|
345
375
|
end
|
346
376
|
```
|
347
377
|
|
348
|
-
The React server will serialize the provided quilt data using `
|
378
|
+
The React server will serialize the provided quilt data using `quilt-data` as the ID. You can then get this serialized data on the client with `getSerialized` from `@shopify/react-html`.
|
349
379
|
|
350
380
|
```tsx
|
351
381
|
// app/ui/index.tsx
|
@@ -356,10 +386,10 @@ import {getSerialized} from '@shopify/react-html';
|
|
356
386
|
const IS_CLIENT = typeof window !== 'undefined';
|
357
387
|
|
358
388
|
function App() {
|
359
|
-
// get
|
360
|
-
const quiltData = IS_CLIENT ? getSerialized<
|
389
|
+
// get the serialized data from the request that was sent through Rails ReactController
|
390
|
+
const quiltData = IS_CLIENT ? getSerialized<Record<string, any>>('quilt-data') : null;
|
361
391
|
|
362
|
-
// Logs {"
|
392
|
+
// Logs {"some_id":123}
|
363
393
|
console.log(quiltData);
|
364
394
|
|
365
395
|
return <h1>Data: {quiltData}</h1>;
|
@@ -368,6 +398,23 @@ function App() {
|
|
368
398
|
export default App;
|
369
399
|
```
|
370
400
|
|
401
|
+
If using the webpack plugin, this will be done automatically and the data will be passed into your application as the `data` prop.
|
402
|
+
|
403
|
+
```tsx
|
404
|
+
// app/ui/index.tsx
|
405
|
+
|
406
|
+
import React from 'react';
|
407
|
+
|
408
|
+
function App({data}: {data: Record<string, any>}) {
|
409
|
+
// Logs {"some_id":123}
|
410
|
+
console.log(data);
|
411
|
+
|
412
|
+
return <h1>Data: {data}</h1>;
|
413
|
+
}
|
414
|
+
|
415
|
+
export default App;
|
416
|
+
```
|
417
|
+
|
371
418
|
##### Example: redirecting
|
372
419
|
|
373
420
|
```tsx
|
@@ -9,7 +9,7 @@ module Quilt
|
|
9
9
|
|
10
10
|
def self.from_params(params)
|
11
11
|
params.transform_keys! { |key| key.underscore.to_sym }
|
12
|
-
params
|
12
|
+
params[:connection] = { effectiveType: 'unknown' } if params[:connection].blank?
|
13
13
|
|
14
14
|
connection = Connection.from_params(params[:connection])
|
15
15
|
|
data/lib/quilt_rails/version.rb
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: quilt_rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.12.
|
4
|
+
version: 1.12.1
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Mathew Allen
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2020-05-
|
11
|
+
date: 2020-05-14 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: railties
|