Implement full-width conversation view option

NeeRaj-2401 commented 6 months ago

Prerequisites (Required)

[X] I searched for any existing report about this feature to avoid opening a duplicate.
[X] This issue contains only one feature.
[X] The title of this issue accurately describes the feature.

Feature Request Description (Required)

the entire chat section is bounded within a container with certain width, utilise maximum available width,

Screenshots or Videos (Optional)

current :

desired :

Additional context (Optional)

No response

itsmartashub commented 6 months ago

Thank you for your enthusiasm for enhancing GPThemes.

Could you share the reasoning behind your interest in this feature? Currently, on tablets and smaller screen devices, the chat bubbles already occupy the full available width. Are you proposing to extend this change to all screen sizes? A better understanding of the use case will help to tailor the approach accordingly.

Let's consider why we should be cautious about implementing this proposal:

Readability: Even if the text doesn't cause horizontal scrolling because it fits within the viewport, longer lines of text can still impact readability. It's generally recommended to keep line lengths within a certain range to ensure comfortable reading. Maintaining a narrower chat container optimizes readability, ensuring effortless engagement.
User Focus: A narrower chat container aids users in staying focused on the conversation, reducing distractions from wide text blocks.

NeeRaj-2401 commented 6 months ago

One thing which made me to think about utilizing the available width is when gpt generate codes and sometimes codes lines overflow the codeblock and we have to scroll horizontally to review :)

And the other reason is I personally use GPT with sidebar closed ( thanks to their handy keybindings ). so in that case i feel like the chat bubbles should occupy a little more width

with 100% page zoom :

with 80% page zoom (my browser default):

itsmartashub commented 6 months ago

Ah, I see. Thanks for the clarification, now I better understand the scenario where your suggestion makes sense. I agree that the somewhat restricted code block section is a bit irritating in this context. Increasing the maximum width of the chat bubble makes sense when the sidebar is hidden. I plan to add custom styling for some elements in the future, so perhaps I could include the chat bubble width in that.

NeeRaj-2401 commented 4 months ago

Hi @itsmartashub , hope u r doing well, i wanted to mention that, now we do have a little bit of customisation options like themes and fonts, so its possible to include adjusting width container from those options itself

itsmartashub commented 4 months ago

Hi there @NeeRaj-2401. Telepathy, cause I just started working on this today. For now, it's a toggle for full width, but in the future I plan to make this option more customizable, allowing the user to choose the width percentage.

Also, which layout do you have, the old UI or the new one?
And would you like the prompt field to be synchronized with the width of the chats, so that if the chats are full width, the prompt field is also full width or you would prefer it to stay at the default width?

EDIT:

By the way, if you're "impatient" for the official release, you can track and test the current state of the full-width option by downloading the GitHub Actions build artifacts (extension-prod) and loading them manually in your browser via dev mode. I would like to hear from you what could be improved.

Just be aware that in the new UI, I can't make the user chat 100% width for now because it causes the edit icon to disappear/cut off, which is unacceptable for UX, ofc

NeeRaj-2401 commented 4 months ago

Also, which layout do you have, the old UI or the new one?

New one

so that if the chats are full width, the prompt field is also full width or you would prefer it to stay at the default width?

I think the prompt field is ok as it is right now, but u know the design better than me 😅

Just be aware that in the new UI, I can't make the user chat 100% width for now because it causes the edit icon to disappear/cut off, which is unacceptable for UX, ofc

Yeah it makes sense

I would like to hear from you what could be improved.

Sure i will give it a try and let you know if there will be any further suggestions from my side, thanks :)

itsmartashub / GPThemes