add FlutterFlow chatbot to docs page

[patriciaflutterflow]

Adds chatbot to the FlutterFlow Documentation site
Fixes DEVR-1003

Type of change

• Typo fix
• New feature
• Enhancement to current docs
• Removed outdated references
• Update assets

[bolt-new-by-stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[pinkeshmars]

Hi @patriciaflutterflow, only one suggestion; otherwise, LGTM!

[pinkeshmars]

Suggested change

	Like with any other AI tool, this chatbot can make mistakes. Other resources you can turn to for help with FlutterFlow include:
	- [FlutterFlow community forum](https://community.flutterflow.io/)
	- [FlutterFlow YouTube channel](https://www.youtube.com/@FlutterFlow), as well as community content created by FlutterFlow users
	- Contacting [email protected] or using in-chat support if you are on the Pro plan
	Just like any AI tool, this chatbot can sometimes make mistakes. If you need more help with FlutterFlow, here are some additional resources you can explore:
	- [FlutterFlow Community Forum](https://community.flutterflow.io/).
	- [FlutterFlow YouTube channel](https://www.youtube.com/@FlutterFlow), as well as community content created by FlutterFlow users.
	- Contacting [email protected] or using in-chat support if you are on the Pro plan.

[PoojaB26]

I'm not too sure about the location for the chatbot. It shouldn't be as an article page I feel. It either should pop up from the top navbar (as a floating dialog) or we add a button on the bottom like a FAB button and make a floating dialog appear from there. There may be packages that can help you add something like that to Docusaurus, or simple JS scripts can do that too. Can you take a quick look to see whats possible?

[pinkeshmars]

I'm not too sure about the location for the chatbot. It shouldn't be as an article page I feel. It either should pop up from the top navbar (as a floating dialog) or we add a button on the bottom like a FAB button and make a floating dialog appear from there. There may be packages that can help you add something like that to Docusaurus, or simple JS scripts can do that too. Can you take a quick look to see whats possible?

Yes, I agree. How about placing it on the right side of the 'Troubleshoot' item in the top menu bar? That way, it stays easily accessible without being intrusive.

[PoojaB26]

Right side of the top menu bar would be for content, and this shouldnt be an article anyway. I'm imagining it on the left side near Github, something that says "Ask AI" or something similar and then popup dialog box angled to the top that has the iframe instead.

[patriciaflutterflow]

@PoojaB26 @pinkeshmars how's this, as a chat icon in the bottom right of the screen that pulls up an iframe with the chatbot? The window can be expanded and collapsed and it appears on every page as a small button, but there's no new page added for it.

Default view (small chat icon on bottom right corner of every page)

Clicked view (small iframe)

Expanded view (if user clicks expanded button)

https://www.loom.com/share/f4cf6351e4a04a82885a0aa8947b46fc?sid=a5e60bae-6dcc-46e3-9704-0d6c1aaa8168

[PoojaB26]

Yes I love this new location!
2 tiny nits,

1. can we make sure the rounded edges don't have the black background or just remove the rounded edges if its difficult to make it transparent?

2. A better name than "FlutterFlow Documentation Chatbot"? Just "Ask FlutterFlow" or something similar?

[pinkeshmars]

Ya, this looks awesome!

[patriciaflutterflow]

changed! thank you for your comments!