4darsh-Dev / CogniGaurd

A web extension for identifying dark pattern on websites powered by Fine Tuned BERT Model for classificaiton on dark pattern custom dataset,
https://cogniguard.onionreads.com/
MIT License
26 stars 51 forks source link

Adding chatbot #137

Closed Garima-149 closed 2 months ago

Garima-149 commented 2 months ago

@4darsh-Dev I would like to add chatbot at left-bottom corner.It will help users to ask their queries and will enhance the UI of website. Please assign me with this issue. Screenshot (99)

4darsh-Dev commented 2 months ago

assigned to @Garima-149 , i've already working on a RAG chatbot , you can make the UI for it.

Garima-149 commented 2 months ago

Ok

ruthwikchikoti commented 2 months ago

@Garima-149, may I work on this? eager to contribute.

Garima-149 commented 2 months ago

@4darsh-Dev IMG_20240718_182622.jpg I have made UI of chatbot as you instructed. Please check, is it fine?

4darsh-Dev commented 2 months ago

@Garima-149 use a circular container and put this icon inside it. similar to back top top button. with icon colour should be white and the container color-primary and on hover, the container color changes to black,

Is it functional? Does a dialog box appear onclick?

for reference, link : https://fin-veda.vercel.app/

SS

Screenshot 2024-07-18 223123

Garima-149 commented 2 months ago

Yes it is functional

4darsh-Dev commented 2 months ago

can you share the SS or video preview?

Garima-149 commented 2 months ago

@4darsh-Dev IMG_20240718_223842.jpg

4darsh-Dev commented 2 months ago

good work @Garima-149. adjust it's min-height such that it can handle length of the conversations.

How you're saving the chat message, local storage or any other means ? In case user closes and reopens it, chat's should be there.

Garima-149 commented 2 months ago

IMG_20240718_224808.jpg

Yes, it will handle the length according to texts. I have yet added the UI only, not the local storage part. If you say, I will add it too for permanent saving

4darsh-Dev commented 2 months ago

yes, add the storage part, we'll be handling the chat response through API call,

chat buttons looks nice, add hover effects to change blue color to black

4darsh-Dev commented 2 months ago

till that create at least one PR, creating all pr at once might look spamy

Garima-149 commented 2 months ago

Ok Yes, I added the hovering effect

Garima-149 commented 2 months ago

Actually my vs code is saying to disable other files which were working on backend. That's why I am completing all the issues once so , I don't need to open the server again again. It's was Already took time at initial stages.

4darsh-Dev commented 2 months ago

okay @Garima-149 , you can try using .gitignore just add the relative path to there it will auto ignore the changes in backend files.

you can chose either way which works for you.

Garima-149 commented 2 months ago

@4darsh-Dev localstorage is also done. Should I make pr now?

4darsh-Dev commented 2 months ago

sure @Garima-149

4darsh-Dev commented 2 months ago

Hey @Garima-149 ! Thank you so much for your raising the issue💗 It’s all yours, you can come anytime again and make some contributions! 🚀 Alone, we can do little, but together we can do so much! 😇