Struct respo::StatesTree

pub struct StatesTree {
    pub data: MaybeState,
    pub cursor: Vec<String>,
    pub branches: HashMap<String, Box<StatesTree>>,
}

Respo maintains states in a tree structure, where the keys are strings, each child component “picks” a key to attach its own state to the tree, and it dispatches events to global store to update the state.

Fields

data: MaybeState

local data

cursor: Vec<String>

the path to the current state in the tree, use in updating

branches: HashMap<String, Box<StatesTree>>

holding children states

Implementations

impl StatesTree

pub fn path(&self) -> Vec<String>

get cursor

Examples found in repository

src/dialog/modal.rs (line 206)

  fn new(states: StatesTree, options: ModalOptions<T>) -> Result<Self, String> {
    let cursor = states.path();
    let state: ModalPluginState = states.data.cast_or_default()?;

    let instance = Self {
      state,
      options,
      cursor,
      phantom: PhantomData,
    };

    Ok(instance)
  }

src/dialog/drawer.rs (line 206)

  fn new(states: StatesTree, options: DrawerOptions<T>) -> Result<Self, String> {
    let cursor = states.path();
    let state: DrawerPluginState = states.data.cast_or_default()?;

    let instance = Self {
      state,
      options,
      cursor,
      phantom: PhantomData,
    };

    Ok(instance)
  }

src/dialog/alert.rs (line 204)

  fn new(states: StatesTree, options: AlertOptions, on_read: U) -> Result<Self, String> {
    let cursor = states.path();
    let state: AlertPluginState = states.data.cast_or_default()?;

    let instance = Self {
      state,
      options,
      text: None,
      cursor,
      on_read,
      phantom: PhantomData,
    };

    Ok(instance)
  }

src/dialog/confirm.rs (line 241)

  fn new(states: StatesTree, options: ConfirmOptions, on_confirm: U) -> Result<Self, String> {
    let cursor = states.path();
    let state: ConfirmPluginState = states.data.cast_or_default()?;

    let instance = Self {
      state,
      options,
      text: None,
      cursor,
      on_confirm,
      phantom: PhantomData,
    };

    Ok(instance)
  }

src/dialog/prompt.rs (line 85)

fn comp_prompt_modal<T, U, V>(
  states: StatesTree,
  options: PromptOptions,
  show: bool,
  on_submit: U,
  on_close: V,
) -> Result<RespoNode<T>, String>
where
  U: Fn(String, DispatchFn<T>) -> Result<(), String> + 'static,
  V: Fn(DispatchFn<T>) -> Result<(), String> + 'static,
  T: Clone + Debug + RespoAction,
{
  let cursor = states.path();
  let cursor2 = cursor.clone();
  let cursor3 = cursor.clone();
  let mut state: InputState = states.data.cast_or_default()?;
  if let Some(text) = &options.initial_value {
    state.draft = text.to_owned();
  }

  // respo::util::log!("State: {:?}", state);

  let state2 = state.clone();

  let submit = Rc::new(on_submit);
  let close = Rc::new(on_close);
  let close2 = close.clone();

  let on_text_input = move |e, dispatch: DispatchFn<_>| -> Result<(), String> {
    if let RespoEvent::Input { value, .. } = e {
      dispatch.run_state(&cursor, InputState { draft: value, error: None })?;
    }
    Ok(())
  };

  let check_submit = move |text: &str, dispatch: DispatchFn<_>| -> Result<(), String> {
    let dispatch2 = dispatch.clone();
    let dispatch3 = dispatch.clone();
    let dispatch4 = dispatch.clone();
    respo::util::log!("validator: {:?}", &options.validator);
    if let Some(validator) = &options.validator {
      // let validator = validator.borrow();
      let result = validator.run(text);
      match result {
        Ok(()) => {
          submit(text.to_owned(), dispatch)?;
          close2(dispatch3)?;
          dispatch4.run_empty_state(&cursor2)?;
        }
        Err(message) => {
          // dispatch.run_state(&cursor2, InputState { draft: text.to_owned() })?;
          dispatch4.run_state(
            &cursor2,
            InputState {
              draft: text.to_owned(),
              error: Some(message),
            },
          )?;
        }
      }
    } else {
      submit(text.to_owned(), dispatch)?;
      close2(dispatch2)?;
      dispatch4.run_empty_state(&cursor2)?;
    }
    Ok(())
  };

  let mut input_el = if options.multilines {
    textarea().class(ui_textarea()).to_owned()
  } else {
    input().class(ui_input()).to_owned()
  };

  Ok(
    RespoNode::new_component(
      "prompt-modal",
      div()
        .style(RespoStyle::default().position(CssPosition::Absolute).to_owned())
        .children([if show {
          div()
            .class_list(&[ui_fullscreen(), ui_center(), css_backdrop()])
            .style(options.backdrop_style)
            .on_click(move |e, dispatch| -> Result<(), String> {
              if let RespoEvent::Click { original_event, .. } = e {
                // stop propagation to prevent closing the modal
                original_event.stop_propagation();
              }
              {
                let dispatch = dispatch.clone();
                close(dispatch)?;
              }
              dispatch.run_empty_state(&cursor3)?;
              Ok(())
            })
            .children([div()
              .class_list(&[ui_column(), ui_global(), css_modal_card()])
              .style(RespoStyle::default().line_height(CssLineHeight::Px(32.0)).to_owned())
              .style(options.card_style)
              .style(options.input_style)
              .on_click(move |e, _dispatch| -> Result<(), String> {
                // nothing to do
                if let RespoEvent::Click { original_event, .. } = e {
                  // stop propagation to prevent closing the modal
                  original_event.stop_propagation();
                }
                Ok(())
              })
              .children([div()
                .children([
                  span()
                    .inner_text(options.text.unwrap_or_else(|| "Input your text:".to_owned()))
                    .to_owned(),
                  space(None, Some(8)),
                  div()
                    .children([input_el
                      .class_list(&[ui_input()])
                      .style(RespoStyle::default().width(CssSize::Percent(100.0)).to_owned())
                      .attribute("placeholder", "Content...")
                      .attribute("autoFocus", "autofocus")
                      .value(state.draft)
                      .on_input(on_text_input)
                      .to_owned()])
                    .to_owned(),
                  match &state.error {
                    Some(message) => div().class_list(&[css_error()]).inner_text(message).to_owned(),
                    None => span(),
                  },
                  space(None, Some(8)),
                  div()
                    .class(ui_row_parted())
                    .children([
                      span(),
                      button()
                        .class_list(&[ui_button(), css_button(), BUTTON_NAME.to_owned()])
                        .inner_text(options.button_text.unwrap_or_else(|| "Submit".to_owned()))
                        .on_click(move |_e, dispatch| -> Result<(), String> {
                          check_submit(&state2.draft, dispatch)?;
                          Ok(())
                        })
                        .to_owned(),
                    ])
                    .to_owned(),
                ])
                .to_owned()])
              .to_owned()])
            .to_owned()
        } else {
          span().attribute("data-name", "placeholder").to_owned()
        }])
        .to_owned(),
    )
    // .effect(&[show], effect_focus)
    .effect(&[show], effect_modal_fade)
    .share_with_ref(),
  )
}

/// provides the interfaces to component of prompt dialog
pub trait PromptPluginInterface<T, U>
where
  T: Debug + Clone + RespoAction,
  U: Fn(String, DispatchFn<T>) -> Result<(), String>,
{
  /// renders UI
  fn render(&self) -> Result<RespoNode<T>, String>
  where
    T: Clone + Debug;
  /// to show prompt dialog, second parameter is the callback task when the dialog is read,
  /// the callback is stored in a dirty to provide syntax sugar
  fn show<V>(&self, dispatch: DispatchFn<T>, next_task: V) -> Result<(), String>
  where
    V: Fn(String) -> Result<(), String> + 'static;
  /// to close prompt dialog
  fn close(&self, dispatch: DispatchFn<T>) -> Result<(), String>;

  /// initialize the plugin, second parameter is the callback task when submitted,
  fn new(states: StatesTree, options: PromptOptions, on_submit: U) -> Result<Self, String>
  where
    Self: std::marker::Sized;

  /// shared it in `Rc`
  fn share_with_ref(&self) -> Rc<Self>;
}

#[derive(Debug, Clone, Default, Serialize, Deserialize)]
struct PromptPluginState {
  show: bool,
  text: Option<String>,
}

/// a dialog for prompt, request for some input, and submit
#[derive(Debug, Clone)]
pub struct PromptPlugin<T, U>
where
  T: Clone + Debug,
  U: Fn(String, DispatchFn<T>) -> Result<(), String> + 'static,
{
  states: StatesTree,
  state: PromptPluginState,
  options: PromptOptions,
  /// tracking content to display
  text: Option<String>,
  cursor: Vec<String>,
  on_submit: U,
  phantom: PhantomData<T>,
}

impl<T, U> PromptPluginInterface<T, U> for PromptPlugin<T, U>
where
  T: Clone + Debug + RespoAction,
  U: Fn(String, DispatchFn<T>) -> Result<(), String> + 'static + Copy,
{
  fn render(&self) -> Result<RespoNode<T>, String> {
    let on_submit = self.on_submit;
    let cursor = self.cursor.clone();
    let cursor2 = self.cursor.clone();
    let state = self.state.to_owned();
    let state2 = self.state.to_owned();

    comp_prompt_modal(
      self.states.pick("plugin"),
      self.options.to_owned(),
      self.state.show,
      move |content, dispatch| {
        let d2 = dispatch.clone();
        on_submit(content.to_owned(), dispatch)?;
        let window = web_sys::window().expect("window");
        // TODO dirty global variable
        let task = Reflect::get(&window, &JsValue::from_str(NEXT_TASK_NAME));
        if let Ok(f) = task {
          if f.is_function() {
            let f = f.dyn_into::<Function>().unwrap();
            let arr = Array::new();
            arr.push(&JsValue::from_str(&content));
            let _ = f.apply(&JsValue::NULL, &arr);
          } else {
            return Err("_NEXT_TASK is not a function".to_owned());
          }
        } else {
          respo::util::log!("next task is None");
        };
        let s = PromptPluginState {
          show: false,
          text: state.text.to_owned(),
        };
        d2.run_state(&cursor, s)?;
        // clean up leaked closure
        let window = web_sys::window().expect("window");
        let _ = Reflect::set(&window, &JsValue::from_str(NEXT_TASK_NAME), &JsValue::NULL);
        Ok(())
      },
      move |dispatch| {
        let s = PromptPluginState {
          show: false,
          text: state2.text.to_owned(),
        };
        dispatch.run_state(&cursor2, s)?;
        // clean up leaked closure
        let window = web_sys::window().expect("window");
        let _ = Reflect::set(&window, &JsValue::from_str(NEXT_TASK_NAME), &JsValue::NULL);
        Ok(())
      },
    )
  }
  fn show<V>(&self, dispatch: DispatchFn<T>, next_task: V) -> Result<(), String>
  where
    V: Fn(String) -> Result<(), String> + 'static,
  {
    let s = PromptPluginState {
      show: true,
      text: self.state.text.to_owned(),
    };
    let task = Closure::once(next_task);
    let window = web_sys::window().unwrap();
    // dirty global variable to store a shared callback
    if let Err(e) = Reflect::set(&window, &JsValue::from_str(NEXT_TASK_NAME), task.as_ref()) {
      respo::util::log!("failed to store next task {:?}", e);
    }
    task.forget();
    dispatch.run_state(&self.cursor, s)?;
    Ok(())
  }
  fn close(&self, dispatch: DispatchFn<T>) -> Result<(), String> {
    let s = PromptPluginState {
      show: false,
      text: self.text.clone(),
    };
    dispatch.run_state(&self.cursor, s)?;
    Ok(())
  }

  fn new(states: StatesTree, options: PromptOptions, on_submit: U) -> Result<Self, String> {
    let cursor = states.path();
    let state: PromptPluginState = states.data.cast_or_default()?;

    let instance = Self {
      states,
      state,
      options,
      text: None,
      cursor,
      on_submit,
      phantom: PhantomData,
    };

    Ok(instance)
  }

pub fn pick(&self, name: &str) -> StatesTree

pick a child branch as new cursor

Examples found in repository

src/respo/states_tree.rs (line 57)

  pub fn set_in_mut(&mut self, path: &[String], new_state: MaybeState) {
    if path.is_empty() {
      (*self).data = new_state;
    } else {
      let (p_head, p_rest) = path.split_at(1);
      let p0 = p_head[0].to_owned();
      if let Some(branch) = self.branches.get_mut(&p0) {
        branch.set_in_mut(p_rest, new_state);
      } else {
        let mut branch = self.pick(&p0);
        branch.set_in_mut(p_rest, new_state);
        self.branches.insert(p0, Box::new(branch));
      }
    }
  }

src/dialog/prompt.rs (line 294)

  fn render(&self) -> Result<RespoNode<T>, String> {
    let on_submit = self.on_submit;
    let cursor = self.cursor.clone();
    let cursor2 = self.cursor.clone();
    let state = self.state.to_owned();
    let state2 = self.state.to_owned();

    comp_prompt_modal(
      self.states.pick("plugin"),
      self.options.to_owned(),
      self.state.show,
      move |content, dispatch| {
        let d2 = dispatch.clone();
        on_submit(content.to_owned(), dispatch)?;
        let window = web_sys::window().expect("window");
        // TODO dirty global variable
        let task = Reflect::get(&window, &JsValue::from_str(NEXT_TASK_NAME));
        if let Ok(f) = task {
          if f.is_function() {
            let f = f.dyn_into::<Function>().unwrap();
            let arr = Array::new();
            arr.push(&JsValue::from_str(&content));
            let _ = f.apply(&JsValue::NULL, &arr);
          } else {
            return Err("_NEXT_TASK is not a function".to_owned());
          }
        } else {
          respo::util::log!("next task is None");
        };
        let s = PromptPluginState {
          show: false,
          text: state.text.to_owned(),
        };
        d2.run_state(&cursor, s)?;
        // clean up leaked closure
        let window = web_sys::window().expect("window");
        let _ = Reflect::set(&window, &JsValue::from_str(NEXT_TASK_NAME), &JsValue::NULL);
        Ok(())
      },
      move |dispatch| {
        let s = PromptPluginState {
          show: false,
          text: state2.text.to_owned(),
        };
        dispatch.run_state(&cursor2, s)?;
        // clean up leaked closure
        let window = web_sys::window().expect("window");
        let _ = Reflect::set(&window, &JsValue::from_str(NEXT_TASK_NAME), &JsValue::NULL);
        Ok(())
      },
    )
  }

pub fn set_in_mut(&mut self, path: &[String], new_state: MaybeState)

in-place mutation of state tree

Examples found in repository

src/respo/states_tree.rs (line 55)

  pub fn set_in_mut(&mut self, path: &[String], new_state: MaybeState) {
    if path.is_empty() {
      (*self).data = new_state;
    } else {
      let (p_head, p_rest) = path.split_at(1);
      let p0 = p_head[0].to_owned();
      if let Some(branch) = self.branches.get_mut(&p0) {
        branch.set_in_mut(p_rest, new_state);
      } else {
        let mut branch = self.pick(&p0);
        branch.set_in_mut(p_rest, new_state);
        self.branches.insert(p0, Box::new(branch));
      }
    }
  }

Trait Implementations

impl Clone for StatesTree

fn clone(&self) -> StatesTree

Returns a copy of the value.

fn clone_from(&mut self, source: &Self)

Performs copy-assignment from source.

impl Debug for StatesTree

fn fmt(&self, f: &mut Formatter<'_>) -> Result

Formats the value using the given formatter.

impl Default for StatesTree

fn default() -> StatesTree

Returns the “default value” for a type.

impl<'de> Deserialize<'de> for StatesTree

fn deserialize<__D>(__deserializer: __D) -> Result<Self, __D::Error>where
    __D: Deserializer<'de>,

Deserialize this value from the given Serde deserializer.

impl PartialEq<StatesTree> for StatesTree

fn eq(&self, other: &StatesTree) -> bool

This method tests for self and other values to be equal, and is used by ==.

fn ne(&self, other: &Rhs) -> bool

This method tests for !=. The default implementation is almost always sufficient, and should not be overridden without very good reason.

impl Serialize for StatesTree

fn serialize<__S>(&self, __serializer: __S) -> Result<__S::Ok, __S::Error>where
    __S: Serializer,

Serialize this value into the given Serde serializer.

impl Eq for StatesTree

impl StructuralEq for StatesTree

impl StructuralPartialEq for StatesTree