@platform/react.ssr
Version:
A lightweight SSR (server-side-rendering) system for react apps bundled with ParcelJS and hosted on S3.
42 lines (41 loc) • 2.49 kB
JavaScript
import * as React from 'react';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { css } from '../common';
const FOO = [
'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nec quam lorem. Praesent fermentum, augue ut porta varius, eros nisl euismod ante, ac suscipit elit libero nec dolor. Morbi magna enim, molestie non arcu id, varius sollicitudin neque. In sed quam mauris. Aenean mi nisl, elementum non arcu quis, ultrices tincidunt augue. Vivamus fermentum iaculis tellus finibus porttitor. Nulla eu purus id dolor auctor suscipit. Integer lacinia sapien at ante tempus volutpat.',
'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nec quam lorem. Praesent fermentum, augue ut porta varius, eros nisl euismod ante, ac suscipit elit libero nec dolor. Morbi magna enim, molestie non arcu id, varius sollicitudin neque. In sed quam mauris. Aenean mi nisl, elementum non arcu quis, ultrices tincidunt augue. Vivamus fermentum iaculis tellus finibus porttitor. Nulla eu purus id dolor auctor suscipit. Integer lacinia sapien at ante tempus volutpat.',
'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque nec quam lorem. Praesent fermentum, augue ut porta varius, eros nisl euismod ante, ac suscipit elit libero nec dolor. Morbi magna enim, molestie non arcu id, varius sollicitudin neque. In sed quam mauris. Aenean mi nisl, elementum non arcu quis, ultrices tincidunt augue. Vivamus fermentum iaculis tellus finibus porttitor. Nulla eu purus id dolor auctor suscipit. Integer lacinia sapien at ante tempus volutpat.',
];
export class Foo extends React.PureComponent {
/**
* [Lifecycle]
*/
constructor(props) {
super(props);
this.state = {};
this.state$ = new Subject();
this.unmounted$ = new Subject();
const state$ = this.state$.pipe(takeUntil(this.unmounted$));
state$.subscribe(e => this.setState(e));
}
componentWillUnmount() {
this.unmounted$.next();
this.unmounted$.complete();
}
/**
* [Render]
*/
render() {
const styles = {
base: css({
paddingTop: 30,
}),
};
return (React.createElement("div", Object.assign({}, css(styles.base, this.props.style)),
React.createElement("div", null,
React.createElement("strong", null, "Dynamic load:"),
" ",
FOO)));
}
}