OvidijusParsiunas / deep-chat

Fully customizable AI chatbot component for your website
https://deepchat.dev
MIT License
1.27k stars 176 forks source link

Elixir - Phoenix LiveView sample project #38

Open OvidijusParsiunas opened 7 months ago

OvidijusParsiunas commented 7 months ago

The Deep Chat repo is seeking a kind contribution from dev(s) that are familiar with Elixir - Phoenix LiveView who could create a sample hello-world project that would have the Deep Chat web component embedded inside it.

For anyone who is familiar with the framework - it should not take longer than 20 mins.

I was already able to embed Deep Chat into a LiveView project on my computer, however because my experience with the framework is very limited I spent hours trying to pass state values into its properties without much success. Therefore it would be better if someone who has worked with Phoenix LiveView components could lend a hand and do it properly.

Expectation The repo already consists examples for SSR frameworks such as NextJs and SvelteKit which can offer a glimpse into what this project should contain. But for simplicity and the essence of contributor's time a simple homepage that contains a Deep Chat component that can send messages and receive sample responses should be enough.

Nice To Haves It would be great to have examples on how to establish an SSE (Server Sent Events) connection for streams or how the server can handle files like we have for the existing examples, but this is not required.

To help anyone get started, follow these steps:

  1. In your Phoenix LiveView project navigate to the assets/ folder and there run the following command: npm install deep-chat
  2. Inside the assets/js/app.js file, add the following line of code: import "deep-chat"
  3. You can then embed Deep Chat in any of your .ex or .heex files via: <deep-chat></deep-chat>

Feel free to comment below for any questions. Thankyou!