How to use the @cycle/state.withState function in @cycle/state
To help you get started, we’ve selected a few @cycle/state examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
sarimarton / powercycle / src / util / withTransactionalState.js View on Github 
export function withTransactionalState (reducer, cmp) {
return withState(sources => {
const sinks = withPower(cmp)(sources)
sinks.state =
(sinks.state || xs.never())
.compose(
sampleCombine(sources.state.stream.startWith(undefined))
)
.map(([actionOrReducer, prevState]) => {
if (typeof actionOrReducer === 'function') {
console.warn('withTransactionalState: function reducer received ' +
'instead of action.', actionOrReducer)
return actionOrReducer
} else {
return () => reducer(prevState, actionOrReducer)
}import {biography} from './screens/biography/index';
import {accounts} from './screens/accounts/index';
import {rawDatabase} from './screens/raw-db/index';
import {rawMessage} from './screens/raw-msg/index';
import {backup} from './screens/backup/index';
import {secretOutput} from './screens/secret-output/index';
import {secretInput} from './screens/secret-input/index';
import {Palette} from './global-styles/palette';
import {Typography} from './global-styles/typography';
export const screens: {[k in Screens]?: (so: any) => any} = {
[Screens.Welcome]: withState(welcome),
[Screens.Central]: withState(central),
[Screens.Drawer]: withState(drawer),
[Screens.Compose]: withState(compose),
[Screens.Thread]: withState(thread),
[Screens.InvitePaste]: withState(pasteInvite),
[Screens.InviteCreate]: withState(createInvite),
[Screens.Profile]: withState(profile),
[Screens.ProfileEdit]: withState(editProfile),
[Screens.Biography]: withState(biography),
[Screens.Accounts]: withState(accounts),
[Screens.Backup]: withState(backup),
[Screens.SecretOutput]: withState(secretOutput),
[Screens.SecretInput]: withState(secretInput),
[Screens.RawDatabase]: rawDatabase,
[Screens.RawMessage]: rawMessage,
};
export const drivers = {
alert: alertDriver,
asyncstorage: asyncStorageDriver,import {createInvite} from './screens/invite-create';
import {biography} from './screens/biography/index';
import {accounts} from './screens/accounts/index';
import {rawDatabase} from './screens/raw-db/index';
import {rawMessage} from './screens/raw-msg/index';
import {backup} from './screens/backup/index';
import {secretOutput} from './screens/secret-output/index';
import {secretInput} from './screens/secret-input/index';
import {Palette} from './global-styles/palette';
import {Typography} from './global-styles/typography';
export const screens: {[k in Screens]?: (so: any) => any} = {
[Screens.Welcome]: withState(welcome),
[Screens.Central]: withState(central),
[Screens.Drawer]: withState(drawer),
[Screens.Compose]: withState(compose),
[Screens.Thread]: withState(thread),
[Screens.InvitePaste]: withState(pasteInvite),
[Screens.InviteCreate]: withState(createInvite),
[Screens.Profile]: withState(profile),
[Screens.ProfileEdit]: withState(editProfile),
[Screens.Biography]: withState(biography),
[Screens.Accounts]: withState(accounts),
[Screens.Backup]: withState(backup),
[Screens.SecretOutput]: withState(secretOutput),
[Screens.SecretInput]: withState(secretInput),
[Screens.RawDatabase]: rawDatabase,
[Screens.RawMessage]: rawMessage,
};
export const drivers = {
alert: alertDriver,import {pasteInvite} from './screens/invite-paste/index';
import {profile} from './screens/profile/index';
import {editProfile} from './screens/profile-edit/index';
import {createInvite} from './screens/invite-create';
import {biography} from './screens/biography/index';
import {accounts} from './screens/accounts/index';
import {rawDatabase} from './screens/raw-db/index';
import {rawMessage} from './screens/raw-msg/index';
import {backup} from './screens/backup/index';
import {secretOutput} from './screens/secret-output/index';
import {secretInput} from './screens/secret-input/index';
import {Palette} from './global-styles/palette';
import {Typography} from './global-styles/typography';
export const screens: {[k in Screens]?: (so: any) => any} = {
[Screens.Welcome]: withState(welcome),
[Screens.Central]: withState(central),
[Screens.Drawer]: withState(drawer),
[Screens.Compose]: withState(compose),
[Screens.Thread]: withState(thread),
[Screens.InvitePaste]: withState(pasteInvite),
[Screens.InviteCreate]: withState(createInvite),
[Screens.Profile]: withState(profile),
[Screens.ProfileEdit]: withState(editProfile),
[Screens.Biography]: withState(biography),
[Screens.Accounts]: withState(accounts),
[Screens.Backup]: withState(backup),
[Screens.SecretOutput]: withState(secretOutput),
[Screens.SecretInput]: withState(secretInput),
[Screens.RawDatabase]: rawDatabase,
[Screens.RawMessage]: rawMessage,
};import {rawDatabase} from './screens/raw-db/index';
import {rawMessage} from './screens/raw-msg/index';
import {backup} from './screens/backup/index';
import {secretOutput} from './screens/secret-output/index';
import {secretInput} from './screens/secret-input/index';
import {Palette} from './global-styles/palette';
import {Typography} from './global-styles/typography';
export const screens: {[k in Screens]?: (so: any) => any} = {
[Screens.Welcome]: withState(welcome),
[Screens.Central]: withState(central),
[Screens.Drawer]: withState(drawer),
[Screens.Compose]: withState(compose),
[Screens.Thread]: withState(thread),
[Screens.InvitePaste]: withState(pasteInvite),
[Screens.InviteCreate]: withState(createInvite),
[Screens.Profile]: withState(profile),
[Screens.ProfileEdit]: withState(editProfile),
[Screens.Biography]: withState(biography),
[Screens.Accounts]: withState(accounts),
[Screens.Backup]: withState(backup),
[Screens.SecretOutput]: withState(secretOutput),
[Screens.SecretInput]: withState(secretInput),
[Screens.RawDatabase]: rawDatabase,
[Screens.RawMessage]: rawMessage,
};
export const drivers = {
alert: alertDriver,
asyncstorage: asyncStorageDriver,
keyboard: makeKeyboardDriver(),
clipboard: makeClipboardDriver(),import {Palette} from './global-styles/palette';
import {Typography} from './global-styles/typography';
export const screens: {[k in Screens]?: (so: any) => any} = {
[Screens.Welcome]: withState(welcome),
[Screens.Central]: withState(central),
[Screens.Drawer]: withState(drawer),
[Screens.Compose]: withState(compose),
[Screens.Thread]: withState(thread),
[Screens.InvitePaste]: withState(pasteInvite),
[Screens.InviteCreate]: withState(createInvite),
[Screens.Profile]: withState(profile),
[Screens.ProfileEdit]: withState(editProfile),
[Screens.Biography]: withState(biography),
[Screens.Accounts]: withState(accounts),
[Screens.Backup]: withState(backup),
[Screens.SecretOutput]: withState(secretOutput),
[Screens.SecretInput]: withState(secretInput),
[Screens.RawDatabase]: rawDatabase,
[Screens.RawMessage]: rawMessage,
};
export const drivers = {
alert: alertDriver,
asyncstorage: asyncStorageDriver,
keyboard: makeKeyboardDriver(),
clipboard: makeClipboardDriver(),
linking: linkingDriver,
globalEventBus: makeEventBusDriver(),
ssb: ssbDriver,
share: shareDriver,
lifecycle: makeActivityLifecycleDriver(),const global$ = updated$.map(extractedState => prevState => {
return { ...prevState, ...extractedState.global }
})
const local$ = updated$.map(extractedState => prevState => {
return { ...prevState, ...extractedState.local }
})
return {
...sinks,
[stateChannel]: global$,
[localChannel]: local$
}
}
return withState(wrapper, localChannel)
}import {profile} from './screens/profile/index';
import {editProfile} from './screens/profile-edit/index';
import {createInvite} from './screens/invite-create';
import {biography} from './screens/biography/index';
import {accounts} from './screens/accounts/index';
import {rawDatabase} from './screens/raw-db/index';
import {rawMessage} from './screens/raw-msg/index';
import {backup} from './screens/backup/index';
import {secretOutput} from './screens/secret-output/index';
import {secretInput} from './screens/secret-input/index';
import {Palette} from './global-styles/palette';
import {Typography} from './global-styles/typography';
export const screens: {[k in Screens]?: (so: any) => any} = {
[Screens.Welcome]: withState(welcome),
[Screens.Central]: withState(central),
[Screens.Drawer]: withState(drawer),
[Screens.Compose]: withState(compose),
[Screens.Thread]: withState(thread),
[Screens.InvitePaste]: withState(pasteInvite),
[Screens.InviteCreate]: withState(createInvite),
[Screens.Profile]: withState(profile),
[Screens.ProfileEdit]: withState(editProfile),
[Screens.Biography]: withState(biography),
[Screens.Accounts]: withState(accounts),
[Screens.Backup]: withState(backup),
[Screens.SecretOutput]: withState(secretOutput),
[Screens.SecretInput]: withState(secretInput),
[Screens.RawDatabase]: rawDatabase,
[Screens.RawMessage]: rawMessage,
};import {backup} from './screens/backup/index';
import {secretOutput} from './screens/secret-output/index';
import {secretInput} from './screens/secret-input/index';
import {Palette} from './global-styles/palette';
import {Typography} from './global-styles/typography';
export const screens: {[k in Screens]?: (so: any) => any} = {
[Screens.Welcome]: withState(welcome),
[Screens.Central]: withState(central),
[Screens.Drawer]: withState(drawer),
[Screens.Compose]: withState(compose),
[Screens.Thread]: withState(thread),
[Screens.InvitePaste]: withState(pasteInvite),
[Screens.InviteCreate]: withState(createInvite),
[Screens.Profile]: withState(profile),
[Screens.ProfileEdit]: withState(editProfile),
[Screens.Biography]: withState(biography),
[Screens.Accounts]: withState(accounts),
[Screens.Backup]: withState(backup),
[Screens.SecretOutput]: withState(secretOutput),
[Screens.SecretInput]: withState(secretInput),
[Screens.RawDatabase]: rawDatabase,
[Screens.RawMessage]: rawMessage,
};
export const drivers = {
alert: alertDriver,
asyncstorage: asyncStorageDriver,
keyboard: makeKeyboardDriver(),
clipboard: makeClipboardDriver(),
linking: linkingDriver,
globalEventBus: makeEventBusDriver(),import {secretInput} from './screens/secret-input/index';
import {Palette} from './global-styles/palette';
import {Typography} from './global-styles/typography';
export const screens: {[k in Screens]?: (so: any) => any} = {
[Screens.Welcome]: withState(welcome),
[Screens.Central]: withState(central),
[Screens.Drawer]: withState(drawer),
[Screens.Compose]: withState(compose),
[Screens.Thread]: withState(thread),
[Screens.InvitePaste]: withState(pasteInvite),
[Screens.InviteCreate]: withState(createInvite),
[Screens.Profile]: withState(profile),
[Screens.ProfileEdit]: withState(editProfile),
[Screens.Biography]: withState(biography),
[Screens.Accounts]: withState(accounts),
[Screens.Backup]: withState(backup),
[Screens.SecretOutput]: withState(secretOutput),
[Screens.SecretInput]: withState(secretInput),
[Screens.RawDatabase]: rawDatabase,
[Screens.RawMessage]: rawMessage,
};
export const drivers = {
alert: alertDriver,
asyncstorage: asyncStorageDriver,
keyboard: makeKeyboardDriver(),
clipboard: makeClipboardDriver(),
linking: linkingDriver,
globalEventBus: makeEventBusDriver(),
ssb: ssbDriver,
share: shareDriver,@cycle/state
Wraps your Cycle.js main function with reducer-driven state management
