Skip to content

Commit 8ff1947

Browse files
MartinRosenbergMartinRosenberg
authored
Implementation (#3)
1 parent cb2a306 commit 8ff1947

10 files changed

+116
-8
lines changed

‎gatsby-browser.d.ts

+2
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
import { GatsbyBrowser } from 'gatsby';
2+
export declare const wrapRootElement: GatsbyBrowser['wrapRootElement'];

‎gatsby-browser.js

+11
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
"use strict";
2+
var __importDefault = (this && this.__importDefault) || function (mod) {
3+
return (mod && mod.__esModule) ? mod : { "default": mod };
4+
};
5+
Object.defineProperty(exports, "__esModule", { value: true });
6+
var react_1 = __importDefault(require("react"));
7+
var react_helmet_async_1 = require("react-helmet-async");
8+
exports.wrapRootElement = function (_a) {
9+
var element = _a.element;
10+
return (react_1.default.createElement(react_helmet_async_1.HelmetProvider, null, element));
11+
};

‎gatsby-ssr.d.ts

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import { GatsbySSR } from 'gatsby';
2+
export declare const onRenderBody: GatsbySSR['onRenderBody'];
3+
export declare const wrapRootElement: GatsbySSR['wrapRootElement'];

‎gatsby-ssr.js

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
"use strict";
2+
var __importDefault = (this && this.__importDefault) || function (mod) {
3+
return (mod && mod.__esModule) ? mod : { "default": mod };
4+
};
5+
Object.defineProperty(exports, "__esModule", { value: true });
6+
var react_1 = __importDefault(require("react"));
7+
var react_helmet_async_1 = require("react-helmet-async");
8+
var context = {};
9+
exports.onRenderBody = function (_a) {
10+
var setHeadComponents = _a.setHeadComponents, setHtmlAttributes = _a.setHtmlAttributes, setBodyAttributes = _a.setBodyAttributes;
11+
var helmet = context.helmet;
12+
if (helmet != null) {
13+
setHeadComponents([
14+
helmet.base.toComponent(),
15+
helmet.title.toComponent(),
16+
helmet.meta.toComponent(),
17+
helmet.link.toComponent(),
18+
helmet.style.toComponent(),
19+
helmet.script.toComponent(),
20+
helmet.noscript.toComponent(),
21+
]);
22+
setHtmlAttributes(helmet.htmlAttributes.toComponent());
23+
setBodyAttributes(helmet.bodyAttributes.toComponent());
24+
}
25+
};
26+
exports.wrapRootElement = function (_a) {
27+
var element = _a.element;
28+
return (react_1.default.createElement(react_helmet_async_1.HelmetProvider, { context: context }, element));
29+
};

‎index.js

+1
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
// noop

‎package.json

+10-6
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
{
22
"name": "gatsby-plugin-react-helmet-async",
3-
"version": "0.0.1",
3+
"version": "0.1.0",
44
"description": "Use react-helmet-async with Gatsby",
55
"keywords": [
66
"gatsby",
7-
"gatsbyjs",
87
"gatsby-plugin",
98
"react",
109
"react-helmet",
@@ -20,19 +19,24 @@
2019
},
2120
"license": "Apache-2.0",
2221
"author": "Martin Rosenberg <Martin.B.Rosenberg@gmail.com> (https://martinbrosenberg.com)",
23-
"main": "index.js",
2422
"scripts": {
25-
"test": "echo \"Error: no test specified\" && exit 1"
23+
"build": "tsc --build",
24+
"clean": "rm gatsby-browser.d.ts gatsby-browser.js gatsby-ssr.d.ts gatsby-ssr.js",
25+
"test": "echo \"Error: no tests specified\" && exit 1"
2626
},
2727
"devDependencies": {
28+
"@types/react-helmet": "^5.0.13",
29+
"@types/react-helmet-async": "^1.0.1",
2830
"gatsby": "^2.17.4",
2931
"react": "^16.11.0",
3032
"react-dom": "^16.11.0",
3133
"react-helmet-async": "^1.0.4",
3234
"typescript": "^3.7.0-dev.20191021"
3335
},
3436
"peerDependencies": {
35-
"gatsby": ">=2.0.0",
36-
"react-helmet-async": ">=1.0.0"
37+
"gatsby": "2.x",
38+
"react": "^16.6.0",
39+
"react-dom": "^16.6.0",
40+
"react-helmet-async": "1.x"
3741
}
3842
}

‎src/gatsby-browser.tsx

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import { GatsbyBrowser, WrapRootElementBrowserArgs } from 'gatsby'
2+
import React from 'react'
3+
import { HelmetProvider } from 'react-helmet-async'
4+
5+
export const wrapRootElement: GatsbyBrowser['wrapRootElement'] = (
6+
{ element }: WrapRootElementBrowserArgs
7+
) => (
8+
<HelmetProvider>{element}</HelmetProvider>
9+
)

‎src/gatsby-ssr.tsx

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import { GatsbySSR, RenderBodyArgs, WrapRootElementNodeArgs } from 'gatsby'
2+
import React from 'react'
3+
import { HelmetData } from 'react-helmet'
4+
import { HelmetProvider } from 'react-helmet-async'
5+
6+
const context: { helmet?: HelmetData } = {}
7+
8+
export const onRenderBody: GatsbySSR['onRenderBody'] = ({
9+
setHeadComponents,
10+
setHtmlAttributes,
11+
setBodyAttributes
12+
}: RenderBodyArgs): any => {
13+
const { helmet } = context
14+
15+
if (helmet != null) {
16+
setHeadComponents([
17+
helmet.base.toComponent(),
18+
helmet.title.toComponent(),
19+
helmet.meta.toComponent(),
20+
helmet.link.toComponent(),
21+
helmet.style.toComponent(),
22+
helmet.script.toComponent(),
23+
helmet.noscript.toComponent(),
24+
])
25+
setHtmlAttributes(helmet.htmlAttributes.toComponent())
26+
setBodyAttributes(helmet.bodyAttributes.toComponent())
27+
}
28+
}
29+
30+
export const wrapRootElement: GatsbySSR['wrapRootElement'] = (
31+
{ element }: WrapRootElementNodeArgs
32+
): any => (
33+
<HelmetProvider context={context}>{element}</HelmetProvider>
34+
)

‎tsconfig.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -9,8 +9,8 @@
99
// "checkJs": true, /* Report errors in .js files. */
1010
"jsx": "react", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
1111
"declaration": true, /* Generates corresponding '.d.ts' file. */
12-
"declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
13-
"sourceMap": true, /* Generates corresponding '.map' file. */
12+
// "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
13+
// "sourceMap": true, /* Generates corresponding '.map' file. */
1414
// "outFile": "./", /* Concatenate and emit output to single file. */
1515
"outDir": "./", /* Redirect output structure to the directory. */
1616
// "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */

‎yarn.lock

+15
Original file line numberDiff line numberDiff line change
@@ -972,6 +972,21 @@
972972
"@types/history" "*"
973973
"@types/react" "*"
974974

975+
"@types/react-helmet-async@^1.0.1":
976+
version "1.0.1"
977+
resolved "https://registry.yarnpkg.com/@types/react-helmet-async/-/react-helmet-async-1.0.1.tgz#29beab37b1a9a480bc57455435f5acd825e8c44c"
978+
integrity sha512-ZtCdcSmNmtU/dlV2kJ3sVS52i9hMSo/w9iMYBmjdx4aHzNSIUSOZycFslyDRNbt0efwk3V56Bw51+vaYQ7zuXA==
979+
dependencies:
980+
"@types/react" "*"
981+
"@types/react-helmet" "*"
982+
983+
"@types/react-helmet@*", "@types/react-helmet@^5.0.13":
984+
version "5.0.13"
985+
resolved "https://registry.yarnpkg.com/@types/react-helmet/-/react-helmet-5.0.13.tgz#ccda7effa4fbd67d92321c856db504c1a206cb44"
986+
integrity sha512-YvdsLKH9FGAAhoQvjYAyhBo/qpYrY5glpAf6og+0batlGyub6YHAawHx/cfw0rdOxjVPZMNhDC+xNmYnWM7EYQ==
987+
dependencies:
988+
"@types/react" "*"
989+
975990
"@types/react@*", "@types/react@^16.8.12", "@types/react@^16.8.6":
976991
version "16.9.11"
977992
resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.11.tgz#70e0b7ad79058a7842f25ccf2999807076ada120"

0 commit comments

Comments
 (0)