ljmotta

import { useCallback, useMemo } from "react";
import { Item, TodoListChannelApi } from "../api";

export const TodoListEnvelopeView = React.forwardRef<TodoListEnvelopeViewApi, Props>((props, forwardedRef) => {
  // ...
    
  const removeItem = useCallback(
    (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>, item: Item) => {
      e.preventDefault();
      const itemsCopy = [...items];

ljmotta

import { useImperativeHandle } from "react";

export const TodoListEnvelopeView = React.forwardRef<TodoListEnvelopeViewApi, Props>((props, forwardedRef) => {
  // ...
  
  useImperativeHandle(
    forwardedRef,
    () => ({
      setUser,
      addItem: (item) => setItems([...items, { label: item, completed: false }]),

ljmotta

import { MessageBusClientApi } from "@kogito-tooling/envelope-bus/dist/api";
import { useState } from "react";
import { Item, TodoListChannelApi } from "../api";

export interface TodoListEnvelopeViewApi {
  setUser(user: string): void;
  addItem(item: string): void;
  getItems(): Item[];
  markAllAsCompleted(): void;
}

ljmotta

import { Association, TodoListInitArgs } from "../api";

export class TodoListEnvelopeApiImpl implements TodoListEnvelopeApi { 
  // ...

  public async todoList__init(association: Association, initArgs: TodoListInitArgs) {
    this.args.envelopeBusController.associate(association.origin, association.envelopeServerId);
    this.args.view().setUser(initArgs.user);
  }

ljmotta

import { EnvelopeApiFactoryArgs } from "@kogito-tooling/envelope";
import { TodoListEnvelopeContext } from "./TodoListEnvelopeContext";
import { TodoListEnvelopeViewApi } from "./TodoListEnvelopeView";
import { TodoListChannelApi, TodoListEnvelopeApi } from "../api";

export class TodoListEnvelopeApiImpl implements TodoListEnvelopeApi {
  constructor(
    private readonly args: EnvelopeApiFactoryArgs<
      TodoListEnvelopeApi,
      TodoListChannelApi,

ljmotta

import { EnvelopeBus } from "@kogito-tooling/envelope-bus/dist/api";
import { TodoListEnvelopeApiImpl } from "./TodoListEnvelopeApiImpl";
import { TodoListEnvelopeContext } from "./TodoListEnvelopeContext";

export function init(args: { container: HTMLElement; bus: EnvelopeBus }) {
  // ...
  
  const context: TodoListEnvelopeContext = {};
  return envelope.start(envelopeViewDelegate, context, {
    create: (apiFactoryArgs) => new TodoListEnvelopeApiImpl(apiFactoryArgs),

ljmotta

import { TodoListEnvelopeView, TodoListEnvelopeViewApi } from "./TodoListEnvelopeView";

export function init(args: { container: HTMLElement; bus: EnvelopeBus }) {
  // ...
  
  const envelopeViewDelegate = async () => {
    const ref = React.createRef<TodoListEnvelopeViewApi>();
    return new Promise<() => TodoListEnvelopeViewApi>((res) =>
      ReactDOM.render(<TodoListEnvelopeView ref={ref} channelApi={envelope.channelApi} />, args.container, () =>
        res(() => ref.current!)

ljmotta

import { EnvelopeBus } from "@kogito-tooling/envelope-bus/dist/api";
import { Envelope } from "@kogito-tooling/envelope";
import { TodoListEnvelopeContext } from "./TodoListEnvelopeContext";
import { TodoListEnvelopeApiImpl } from "./TodoListEnvelopeApiImpl";
import { TodoListChannelApi, TodoListEnvelopeApi } from "../api";

export function init(args: { container: HTMLElement; bus: EnvelopeBus }) {
  const envelope = new Envelope<
    TodoListEnvelopeApi,
    TodoListChannelApi,

ljmotta

import { TodoListApi } from "../api";
import { EmbeddedEnvelopeFactory } from "@kogito-tooling/envelope/dist/embedded";

export const EmbeddedTodoList = React.forwardRef<TodoListApi, Props>((props, forwardedRef) => {
  // ...
  
  const EmbeddedEnvelope = useMemo(() => {
    return EmbeddedEnvelopeFactory({
      api: props,
      envelopePath: props.envelopePath,

ljmotta

import { EnvelopeServer } from "@kogito-tooling/envelope-bus/dist/channel";
import { TodoListApi, TodoListChannelApi, TodoListEnvelopeApi } from "../api";

export const EmbeddedTodoList = React.forwardRef<TodoListApi, Props>((props, forwardedRef) => {
  // ...
  
  const refDelegate = useCallback(
    (envelopeServer: EnvelopeServer<TodoListChannelApi, TodoListEnvelopeApi>): TodoListApi => ({
      addItem: (item) => envelopeServer.envelopeApi.requests.todoList__addItem(item),
      getItems: () => envelopeServer.envelopeApi.requests.todoList__getItems(),