Ghost/ghost/members-auth-pages/components/Pages.js
Fabien O'Carroll b1a1f61d5d Refactored auth pages for future flows (#10458)
no-issue

* Used camelCase for gateway method calls
* Added some components for building blocks of forms
* Added input specific components
* Added Form component
    This handles collecting the data to submit and sharing state between forms
* Added Pages component to handle urls
* Added the pages for the popup
* Added MembersProvider component
    This is designed to give its children access to gateway methods
* Added Modal component
    This wraps the pages and handles dispatching form submissions to the members gateway
* Refactored index.js to use new components/pages
* Fixed default page from Signup -> Signin
2019-05-07 17:15:50 +02:00

42 lines
1.1 KiB
JavaScript

import { Component } from 'preact';
export default class Pages extends Component {
constructor(props) {
super(props);
this.state = this.getStateFromBrowser();
window.addEventListener("hashchange", () => this.onHashChange(), false);
this.handleChange = props.onChange || (() => {});
}
getStateFromBrowser() {
const [fullMatch, hash, query] = window.location.hash.match(/^#([^?]+)\??(.*)$/) || ['#', '', ''];
return {
hash,
query,
fullMatch
};
}
onHashChange() {
this.setState(this.getStateFromBrowser());
this.handleChange();
}
filterChildren(children, state) {
return children.filter((child) => {
return child.attributes.hash === state.hash;
}).map((child) => {
child.attributes.frameLocation = { ...this.state };
return child;
});
}
render({children, className, onClick}, state) {
return (
<div className={className} onClick={onClick}>
{ this.filterChildren(children, state) }
</div>
);
}
}