Create instant messaging GUI components

[keyvan-m-sadeghi]

• Options Box
• Conversation
• Message Card
• Command Hint
• Autocomplete Input Box
• Voice Button
• Send Button

These should go to assister/packages/agent.

Wireframe

Technologies:

• React Hooks
• Redux v7-beta

[farhoud]

Hi
Why we don't consider other freamworks like vue?
@keyvan-m-sadeghi

[keyvan-m-sadeghi]

@farhoud I personally really like Vue, the reason for choosing React for me is the timing. What I know is that Hooks are a paradigm that Assister Agent can greatly benefit from, in terms of code simplicity. Vue has recently started on adopting hooks, though I guess it'll take a while before the implementation is feature complete.

[farhoud]

@keyvan.m.sadeghi I personaly feel the spec and technology is to much for prototype and we have a deadline comming up. I think we make sample prototype and after we can desgin and think deeper and better

[farhoud]

and I think vue is much faster than react redux , or at least we leave redux for later

[keyvan-m-sadeghi]

@farhoud I do understand that adding libraries such as redux might sound like overkill at this point, not being a frontend expert, I'm totally open to studying alternatives. Specifically, useContext and useReducer might do the job at the current scale of the Agent. As for Vue vs React, I still think we should go withReact with Hooks for the time being.

[farhoud]

okey. so we only have mobile view?
no desktop?

[keyvan-m-sadeghi]

@farhoud I hope we can accommodate both given the small scale of the GUI. Our first release would be for desktop though.

[mehdibalouchi]

where do suggestions in AutoComplete Input Box come from? aren't they a little confusing along side with CommandHints?

[farhoud]

for the sake of demo and shorting hands me and k1 decide we use vue as backup plan for now:
https://github.com/farhoud/sanaz

[keyvan-m-sadeghi]

@mehdibalouchi the command hint and autocomplete indeed have similar functionality, though they serve different purposes. CommandHint is the guess for a "complete" command adhering to the command syntax, it signals to the user the command that is going to be executed based on the current input, as well as showing alternatives.

AutoComplete's function is next word suggestion, so it won't necessarily adhere to the command syntax. Its purpose is fewer keystrokes.

[keyvan-m-sadeghi]

for the sake of demo and shorting hands me and k1 decide we use vue as backup plan for now:
https://github.com/farhoud/sanaz

Right, @farhoud will be implementing the Agent GUI in parallel with Vue, @mehdibalouchi and I will focus on React. @farhoud will work with us on the React version after the Vue version that serves only the demo purpose (unless vue hooks emerge by then, in which case we should compare the two approaches and decide).

[farhoud]

I think bot most replay to messages for better user experince

[keyvan-m-sadeghi]

@farhoud if a function returns a value, the bot replies with the corresponding Message Card. If it's void, a tick indicates completion.

[farhoud]

@keyvan-m-sadeghi
can you open up issue for gui senario?
I have some feed back after lot of format A1:A3 date with sanaz.
I think its humanely to start new conversation with hello and clean history.
and we can open up sidebar for full history or even in options.
do and undo don't feel like a chat and may confused with some application do and undo.
one more thing the tick think can be replace with nice response peaple dont like when they dont get an answer even when its done.
other problem is by desgin popup closed by browser when the focus change and its more suited for recording only I think sidebar is the sloution.

every tab need its own session for messages?

what happend if a function fail ?

oh an other thing can u define assister agent interface for mocking?

[keyvan-m-sadeghi]

Summary of offline discussions:

• Web Components is a must for this project
• We'll create a general "Assister Chat" component which is then used by the Agent
• After further investigating lighterhtml and Haunted, we decided to go with Stencil

The decision on Stencil boils down to maturity of it as well as the ability to re-use ionic components, the latter could potentially reduce our development costs.