mattwagl

api.lists.posts.readAndObserve({
  where: { boardId: state.activeBoardId }
}).
  started((posts, cancel) => {
    // render our ui 
  }).
  updated((posts, cancel) => {
    // re-render our ui 
  });
  

mattwagl

api.collaboration.board().mount({
  title
}).
  await('mounted', event => {
    // Show success notification 
  });

mattwagl

import wolkenkit from 'wolkenkit-client';

const api = await wolkenkit.connect({ host: 'local.wolkenkit.io', port: 3000 });

mattwagl

const projections = {
  'collaboration.board.mounted' (boards, event) {
    boards.add({
      title: event.data.title,
      slug: event.data.slug,
      timestamp: event.metadata.timestamp
    });
  }
};

mattwagl

const initialState = {
  title: undefined,
  slug: undefined
};

const commands = {
  mount (board, command) {
    if (command.data.title === undefined) {
      command.reject('Title is missing.');
      

mattwagl

const when = {
  'collaboration.board.mounted' (boards, event, mark) {
    boards.add({
      title: event.data.title,
      slug: event.data.slug,
      timestamp: event.metadata.timestamp
    });
    
    mark.asDone();
  }

mattwagl

.arrow-button {
	background: #555; 
	background: linear-gradient(-135deg, transparent 22px, #555 0) top right,
				linear-gradient(-45deg, transparent 22px, #555 0) bottom right;
	background-size: 100% 50%; 
	background-repeat: no-repeat;
	font-family: helvetica;
	padding: 10px;
	font-size:20px;
	color: #fff;