Skip to content

Commit

Permalink
add and make prettier formatting
Browse files Browse the repository at this point in the history
  • Loading branch information
@wclr @staltz
wclr authored and staltz committed Sep 29, 2020
1 parent 5c71a2b commit 186ea3e
Show file tree
Hide file tree
Showing 8 changed files with 65 additions and 61 deletions.
11 changes: 9 additions & 2 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,11 @@
"main": "lib/cjs/index.js",
"typings": "lib/cjs/index.d.ts",
"types": "lib/cjs/index.d.ts",
"prettier": {
"singleQuote": true,
"trailingComma": "es5",
"bracketSpacing": false
},
"peerDependencies": {
"@cycle/run": "5.x.x",
"react": "16.x.x",
Expand All @@ -30,6 +35,7 @@
"@types/node": "^10.5.2",
"@types/react": "16.9.49",
"mocha": "^6.2.0",
"prettier": "^2.1.2",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-test-renderer": "16.13.1",
Expand All @@ -42,10 +48,11 @@
"access": "public"
},
"scripts": {
"prepublishOnly": "npm run compile",
"format": "prettier --write ./{src,test}/**/*.{ts,tsx,js}",
"compile": "npm run compile-cjs && npm run compile-es6",
"compile-cjs": "tsc --module commonjs --outDir ./lib/cjs",
"compile-es6": "echo 'TODO' : tsc --module es6 --outDir ./lib/es6",
"test": "$(npm bin)/mocha test/*.ts --require ts-node/register --recursive"
"prepublishOnly": "npm run compile",
"test": "mocha test/*.ts --require ts-node/register --recursive"
}
}
6 changes: 3 additions & 3 deletions src/ReactSource.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ export class ReactSource<P = any> {
constructor(
scope: Scope = new Scope(),
selector: string | symbol | null = null,
props$: MemoryStream<P> = xs.createWithMemory<P>(),
props$: MemoryStream<P> = xs.createWithMemory<P>()
) {
this._scope = scope;
this._selector = selector;
Expand Down Expand Up @@ -48,8 +48,8 @@ export class ReactSource<P = any> {

public isolateSink(sink: Sink, scopeId: string): Sink {
const isolation = this.getChildScope(scopeId);
return sink.map(elem =>
createElement(ScopeContext.Provider, {value: isolation}, elem),
return sink.map((elem) =>
createElement(ScopeContext.Provider, {value: isolation}, elem)
);
}

Expand Down
10 changes: 5 additions & 5 deletions src/convert.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ type State = {
};

export function makeCycleReactComponent<P = any>(
run: RunOnDidMount,
run: RunOnDidMount
): ComponentType<P> {
return class CycleReactComponent extends PureComponent<P, State> {
constructor(props: P) {
Expand Down Expand Up @@ -49,10 +49,10 @@ export function makeCycleReactComponent<P = any>(
const handlerName = `on${name[0].toUpperCase()}${name.slice(1)}`;
this._subs.push(
events[name].subscribe({
next: x => {
next: (x) => {
if (this.props[handlerName]) this.props[handlerName](x);
},
}),
})
);
}
}
Expand All @@ -63,7 +63,7 @@ export function makeCycleReactComponent<P = any>(
return createElement(
ScopeContext.Provider,
{value: source._scope},
createElement(StreamRenderer, {stream: sink}),
createElement(StreamRenderer, {stream: sink})
);
}

Expand All @@ -89,7 +89,7 @@ export function makeComponent<
>(
main: MatchingMain<D, M>,
drivers: MatchingDrivers<D, M> = null as any,
channel: string = 'react',
channel: string = 'react'
): ComponentType<P> {
if (drivers) {
return makeCycleReactComponent<P>(() => {
Expand Down
10 changes: 5 additions & 5 deletions src/h.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ type Children = string | Array<ReactNode>;
function createElementSpreading<P = any>(
type: ElementType<P> | keyof ReactHTML,
props: PropsLike<P> | null,
children: Children,
children: Children
): ReactElement<P> {
if (typeof children === 'string') {
return createElement(type, props, children);
Expand All @@ -30,7 +30,7 @@ function createElementSpreading<P = any>(

function hyperscriptProps<P = any>(
type: ElementType<P> | keyof ReactHTML,
props: PropsLike<P>,
props: PropsLike<P>
): ReactElement<P> {
if (!props.sel) {
return createElement(type, props);
Expand All @@ -41,15 +41,15 @@ function hyperscriptProps<P = any>(

function hyperscriptChildren<P = any>(
type: ElementType<P> | keyof ReactHTML,
children: Children,
children: Children
): ReactElement<P> {
return createElementSpreading(type, null, children);
}

function hyperscriptPropsChildren<P = any>(
type: ElementType<P> | keyof ReactHTML,
props: PropsLike<P>,
children: Children,
children: Children
): ReactElement<P> {
if (!props.sel) {
return createElementSpreading(type, props, children);
Expand All @@ -61,7 +61,7 @@ function hyperscriptPropsChildren<P = any>(
export function h<P = any>(
type: ElementType<P> | keyof ReactHTML,
a?: PropsLike<P> | Children,
b?: Children,
b?: Children
): ReactElement<P> {
if (a === undefined && b === undefined) {
return createElement(type, null);
Expand Down
6 changes: 3 additions & 3 deletions src/incorporate.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,9 @@ export function incorporate(type: any) {
targetRef: ref,
target: type,
scope: scope,
}),
),
),
})
)
)
);
}
return wrapperComponents.get(type) as React.ComponentType<any>;
Expand Down
14 changes: 7 additions & 7 deletions test/api.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,8 +16,8 @@ class Findable extends PureComponent<any, any> {
}
}

describe('API', function() {
it('makeCycleReactComponent', function(done) {
describe('API', function () {
it('makeCycleReactComponent', function (done) {
function main(sources: {react: ReactSource}) {
return {
react: xs
Expand All @@ -26,7 +26,7 @@ describe('API', function() {
.map(() =>
h(Findable, {sel: 'ya'}, [
h('div', {}, [h('h1', {}, 'Hello world')]),
]),
])
),
};
}
Expand All @@ -47,7 +47,7 @@ describe('API', function() {
}, 50);
});

it('makeComponent from main, drivers, and channel', function(done) {
it('makeComponent from main, drivers, and channel', function (done) {
function main(sources: {foobar: ReactSource}) {
return {
foobar: xs
Expand All @@ -56,7 +56,7 @@ describe('API', function() {
.map(() =>
h(Findable, {sel: 'ya'}, [
h('div', {}, [h('h1', {}, 'Hello world')]),
]),
])
),
};
}
Expand All @@ -73,7 +73,7 @@ describe('API', function() {
}, 50);
});

it('makeComponent from main (no drivers, no channel)', function(done) {
it('makeComponent from main (no drivers, no channel)', function (done) {
function main(sources: {react: ReactSource}) {
return {
react: xs
Expand All @@ -82,7 +82,7 @@ describe('API', function() {
.map(() =>
h(Findable, {sel: 'ya'}, [
h('div', {}, [h('h1', {}, 'Hello world')]),
]),
])
),
};
}
Expand Down
43 changes: 20 additions & 23 deletions test/conversion.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,13 +17,13 @@ class Touchable extends PureComponent<any, any> {
}
}

describe('Conversion', function() {
it('converts an MVI Cycle app into a React component', done => {
describe('Conversion', function () {
it('converts an MVI Cycle app into a React component', (done) => {
function main(sources: {react: ReactSource}) {
const inc$ = sources.react.select('button').events('press');
const count$ = inc$.fold((acc: number, x: any) => acc + 1, 0);
const vdom$ = count$.map((i: number) =>
h(Touchable, {sel: 'button'}, [h('div', [h('h1', {}, '' + i)])]),
h(Touchable, {sel: 'button'}, [h('div', [h('h1', {}, '' + i)])])
);
return {react: vdom$};
}
Expand Down Expand Up @@ -52,13 +52,13 @@ describe('Conversion', function() {
setTimeout(check, 150);
});

it('allows Symbol selectors', done => {
it('allows Symbol selectors', (done) => {
function main(sources: {react: ReactSource}) {
const inc = Symbol();
const inc$ = sources.react.select(inc).events('press');
const count$ = inc$.fold((acc: number, x: any) => acc + 1, 0);
const vdom$ = count$.map((i: number) =>
h(Touchable, {sel: inc}, [h('div', [h('h1', {}, '' + i)])]),
h(Touchable, {sel: inc}, [h('div', [h('h1', {}, '' + i)])])
);
return {react: vdom$};
}
Expand Down Expand Up @@ -87,10 +87,10 @@ describe('Conversion', function() {
setTimeout(check, 150);
});

it('output React component routes props to sources.react.props()', done => {
it('output React component routes props to sources.react.props()', (done) => {
function main(sources: {react: ReactSource}) {
sources.react.props().addListener({
next: props => {
next: (props) => {
assert.strictEqual(props.name, 'Alice');
assert.strictEqual(props.age, 30);
done();
Expand All @@ -99,7 +99,7 @@ describe('Conversion', function() {

return {
react: xs.of(
h('section', [h('div', {}, [h('h1', {}, 'Hello world')])]),
h('section', [h('div', {}, [h('h1', {}, 'Hello world')])])
),
};
}
Expand All @@ -112,16 +112,13 @@ describe('Conversion', function() {
renderer.create(createElement(RootComponent, {name: 'Alice', age: 30}));
});

it('output React component routes other sinks to handlers in props', done => {
it('output React component routes other sinks to handlers in props', (done) => {
function main(sources: {react: ReactSource}) {
return {
react: xs.of(
h('section', [h('div', {}, [h('h1', {}, 'Hello world')])]),
h('section', [h('div', {}, [h('h1', {}, 'Hello world')])])
),
something: xs
.periodic(200)
.mapTo('yellow')
.take(1),
something: xs.periodic(200).mapTo('yellow').take(1),
};
}

Expand All @@ -133,22 +130,22 @@ describe('Conversion', function() {
});
renderer.create(
createElement(RootComponent, {
onSomething: x => {
onSomething: (x) => {
assert.strictEqual(x, 'yellow');
done();
},
}),
})
);
});

it('sources.react.props() evolves over time as new props come in', done => {
it('sources.react.props() evolves over time as new props come in', (done) => {
function main(sources: {react: ReactSource}) {
let first = false;
sources.react
.props()
.take(1)
.addListener({
next: props => {
next: (props) => {
assert.strictEqual(props.name, 'Alice');
assert.strictEqual(props.age, 30);
first = true;
Expand All @@ -160,7 +157,7 @@ describe('Conversion', function() {
.drop(1)
.take(1)
.addListener({
next: props => {
next: (props) => {
assert.strictEqual(first, true);
assert.strictEqual(props.name, 'alice');
assert.strictEqual(props.age, 31);
Expand All @@ -170,7 +167,7 @@ describe('Conversion', function() {

return {
react: xs.of(
h('section', [h('div', {}, [h('h1', {}, 'Hello world')])]),
h('section', [h('div', {}, [h('h1', {}, 'Hello world')])])
),
};
}
Expand All @@ -181,12 +178,12 @@ describe('Conversion', function() {
return {source, sink};
});
const r = renderer.create(
createElement(RootComponent, {name: 'Alice', age: 30}),
createElement(RootComponent, {name: 'Alice', age: 30})
);
r.update(createElement(RootComponent, {name: 'alice', age: 31}));
});

it('no synchronous race conditions with handler registration', done => {
it('no synchronous race conditions with handler registration', (done) => {
function main(sources: {react: ReactSource}) {
const inc$ = xs.create({
start(listener: any) {
Expand All @@ -201,7 +198,7 @@ describe('Conversion', function() {
});
const count$ = inc$.fold((acc: number, x: any) => acc + 1, 0);
const vdom$ = count$.map((i: number) =>
h(Touchable, {sel: 'button'}, [h('div', [h('h1', {}, '' + i)])]),
h(Touchable, {sel: 'button'}, [h('div', [h('h1', {}, '' + i)])])
);
return {react: vdom$};
}
Expand Down
Loading

0 comments on commit 186ea3e

Please sign in to comment.