Cleaning up uses of StaticQuery

This commit is contained in:
Jeff Avallone 2019-01-06 16:39:29 -05:00
parent 8426eaa433
commit 02f6f2d252
6 changed files with 19 additions and 45 deletions

View File

@ -4,13 +4,7 @@ exports[`Footer rendering 1`] = `
ShallowWrapper {
Symbol(enzyme.__root__): [Circular],
Symbol(enzyme.__unrendered__): <Footer
site={
Object {
"siteMetadata": Object {
"buildId": "abc-123",
},
}
}
buildId="abc-123"
t={[Function]}
/>,
Symbol(enzyme.__renderer__): Object {

View File

@ -15,7 +15,7 @@ const query = graphql`
}
`;
export const Footer = ({ t, site: { siteMetadata } }) => (
export const Footer = ({ t, buildId }) => (
<footer className={ style.footer }>
<ul className={ style.list }>
<li>
@ -33,22 +33,18 @@ export const Footer = ({ t, site: { siteMetadata } }) => (
</li>
</ul>
<div className={ style.buildId }>
{ siteMetadata.buildId }
{ buildId }
</div>
</footer>
);
Footer.propTypes = {
t: PropTypes.func.isRequired,
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
buildId: PropTypes.string.isRequired
}).isRequired
}).isRequired
buildId: PropTypes.string.isRequired
};
export default withNamespaces()(props => (
<StaticQuery query={ query } render={ data => (
<Footer { ...props } { ...data } />
<StaticQuery query={ query } render={ ({ site: { siteMetadata } }) => (
<Footer { ...props } { ...siteMetadata } />
) } />
));

View File

@ -7,7 +7,7 @@ import { Footer } from 'components/Footer';
describe('Footer', () => {
test('rendering', () => {
const component = shallow(
<Footer site={{ siteMetadata: { buildId: 'abc-123' } }} t={ mockT } />
<Footer buildId="abc-123" t={ mockT } />
);
expect(component).toMatchSnapshot();
});

View File

@ -4,13 +4,7 @@ exports[`Header rendering 1`] = `
ShallowWrapper {
Symbol(enzyme.__root__): [Circular],
Symbol(enzyme.__unrendered__): <Header
site={
Object {
"siteMetadata": Object {
"banner": "testing",
},
}
}
banner="testing"
/>,
Symbol(enzyme.__renderer__): Object {
"batchedUpdates": [Function],
@ -540,13 +534,7 @@ exports[`Header rendering with no banner 1`] = `
ShallowWrapper {
Symbol(enzyme.__root__): [Circular],
Symbol(enzyme.__unrendered__): <Header
site={
Object {
"siteMetadata": Object {
"banner": false,
},
}
}
banner={false}
/>,
Symbol(enzyme.__renderer__): Object {
"batchedUpdates": [Function],

View File

@ -19,10 +19,10 @@ const query = graphql`
}
`;
export const Header = ({ site: { siteMetadata } }) => (
export const Header = ({ banner }) => (
<header
className={ style.header }
data-banner={ siteMetadata.banner || null }>
data-banner={ banner || null }>
<h1>
<Link to="/">Regexper</Link>
</h1>
@ -49,18 +49,14 @@ export const Header = ({ site: { siteMetadata } }) => (
);
Header.propTypes = {
site: PropTypes.shape({
siteMetadata: PropTypes.shape({
banner: PropTypes.oneOfType([
PropTypes.bool,
PropTypes.string
]).isRequired
}).isRequired
}).isRequired
banner: PropTypes.oneOfType([
PropTypes.bool,
PropTypes.string
]).isRequired
};
export default withNamespaces()(props => (
<StaticQuery query={ query } render={ data => (
<Header { ...props } { ...data } />
<StaticQuery query={ query } render={ ({ site: { siteMetadata } }) => (
<Header { ...props } { ...siteMetadata } />
) } />
));

View File

@ -6,14 +6,14 @@ import { Header } from 'components/Header';
describe('Header', () => {
test('rendering', () => {
const component = shallow(
<Header site={{ siteMetadata: { banner: 'testing' } }} />
<Header banner="testing" />
);
expect(component).toMatchSnapshot();
});
test('rendering with no banner', () => {
const component = shallow(
<Header site={{ siteMetadata: { banner: false } }} />
<Header banner={ false } />
);
expect(component).toMatchSnapshot();
});