• Eslint
• UI tests
  UI tests is just gonna compare html texts. Hardly make any sense.
  There is hardly any behaviour testable by javascript, just tons of implementation details.
• GitHub workflow for test
• GitHub workflow for deployment

Like the old jina-box.js

We want to improve the layout and be able to reuse it, render ahref as listitem intead

text-shadow for texts;
filter(drop-shadow()) for svgs;

New layout is not yet tested on mobile. Let's make sure it works

For smaller screens:

• Bot should not open automatically after redirect but hide automatically

For mobile devices that will change the window size when opening virtual keyboard:

• Detect if scrolled to bottom
• If bottom reached, automatically scroll to bottom after window resize

For devices that don't have a physical keyboard:

• Don't automatically focus on the textarea

For devices that don't have a mouse:

• Fix hover effect

For portrait orientation larger screens:

• Bot height should be limited

We want to change to have different response feedback for :
thumbsup : Thank you for providing your feedback, happy to help! # 😀
thumbsdown : Thank you for providing your feedback, we will continue to improve. :man-bowing:

As described in
https://docs.google.com/presentation/d/1GL0pSFQtkoyDDyAHWD-NLlckZBSuGXxknX67vkRhA4I/

• Overall layout
• Avatar
• Header
  • Header
  • Customize header background by color or image
• Animation
• Answer templates:
  • Text
  • Text with single link
  • Text with multiple link
  • Text with proposed actions
• Thumbup/thumbdown
• Textarea
  • single line
  • multiple lines
• Logo/branding
• Theming
  • Drak Mode

We want to onboard dirty-equals https://dirty-equals.helpmanual.io/

• icon moves up a little when hovering
• blink eyes when hovering on deafult bot icon

Something like

Block on #20

Leverage sentence boundary data provided by the backend.

We will need a polyfill for non-Chromium browsers for the highlight feature to work.
https://wicg.github.io/scroll-to-text-fragment/

Following #10 .
Currently, after upstream PR meged, just wait for their next NPM publish.
So the polyfill can be accessed from the CDNs.

Update

It's not acceptable to have a separate polyfill script import.

We'll find a way to integrate the polyfill inside the UI project.

Blocked by #15

We want to have mocked preview site for FastAPI website. See how it works with sites built with mkdocs

• Customize the theme color
• Automatic generate theme

• Local chat history in a smart way
  LocalStorage.
  https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage
  https://developer.mozilla.org/en-US/docs/Web/API/Window/storage_event

• Highlight / pinpoint source target
  https://wicg.github.io/scroll-to-text-fragment/
  https://github.com/GoogleChromeLabs/text-fragments-polyfill

Now UI is loaded with features.

We should create unit tests for this project.

develop a widget to generate the code snippets for testing

we have problem with answering : What's is FASTAPI

• :clear Clear the history in browser
• :debug :debug none toggle debug log
• :uptime
  ...

We want to onboard JuiceFS https://github.com/juicedata/juicefs

• customize to show/hide tip when loading firstly
• customize tip text

https://docs.google.com/presentation/d/1iP0Mq4RsmXXwC6kcRrUMpjEJ-1tSDSCLeLk8_X_YhV4/#slide=id.g10132f6587b_0_1

• docs.jina.ai https://docs-qabot-0-4--jina-docs.netlify.app/
• finetuner.jina.ai https://ft-feat-qa-bot-0-4--jina-docs.netlify.app/
• docarray.jina.ai
• fastapi-qabot-integration.netlify.app https://fastapi-qabot-integration.netlify.app/

We want to onboard Wordlift https://github.com/insideout10/wordlift-docs/

we want to change the avatar

we want to onboard coqui stt

We want to improve the multi-convo render logic. Right now, multi-convo rendering gives this (first graph), where the right logic should be the second graph
https://docs.google.com/drawings/d/1J1tlnpPZWT2hiAR96yxBVz3BsulNUVkMj4fzlunAUFc/edit?usp=sharing

we want to onboard coqui tts

• Load <meta name="theme-color"> for fg-color
• Accept multiple theme-color entry with media query

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta/name/theme-color

And integrate

The +||----- should be filtered away before indexing.

https://jinaai.slack.com/archives/C02F0GBPXAP/p1646978244948589?thread_ts=1646816602.524079&cid=C02F0GBPXAP

STT: coqui-ai/STT#2156
Preview: https://stt--2156.org.readthedocs.build/en/2156/

TTS: coqui-ai/TTS#1363
Preview: https://tts--preview-jina-ai.netlify.app/

• Display complete sentence as answer
• Highlighting in chat
• Refactor highlighting link

Related to 273

Use token instead. Don't show as url.

• basic layout
  • header
  • nav
• main
  • introduction
  • vision
  • feature
  • qa

https://jinaai.slack.com/archives/C02F0GBPXAP/p1646751467429739

• trim the text of any whitespace
• if there isn't a ? at the end, add it

Update

Merged and released in 0.3.

The schema of the response has changed with 3.0 and we need to change accordingly. The parameters in tags stay the same

• powered-by icon should be configurable
• defaults to no icon