Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[New] MediumMultilineInput and LargeMultilineInput Elements #766

Open
wants to merge 2 commits into
base: main
Choose a base branch
from
Open

[New] MediumMultilineInput and LargeMultilineInput Elements #766

wants to merge 2 commits into from
+109 −1

Conversation

samad-yar-khan
Copy link

@samad-yar-khan samad-yar-khan commented Jul 11, 2022 •
edited
Loading

feat: New MediumMultilineInput and LargeMultilineInput Elements

Why Do We need this ?

  • Larger Multiline Input Elements will open new possibilities for Rocket.Chat App Developers.

  • Larger input components can be used in future apps which include a Code Editing App where the developers pair program inside Rocket.Chat.

  • Or a Journal App/Notes App where journal Entries or more extensive notes can be made in RC

  • Or a Future GitLab integrations where a code Review and Edit feature will be desirable.

  • Larger can even be used in the main chat input component to edit and send a larger message to the Rocket.Chat channel, which may not be possible with the current input component.

  • Our use case and motivation to add this component to fuselage was to enable users display and merge PRs right from RocketChat channels through the GitHub App. This will be an exclusive feature which is not available in any GitHub x Messaging app intigration.

  • We currently use the SectionBlock as the InputBlock is too small, but the SectionBlock looses the indentation.

  • 2022-07-15.20-13-48.mp4

  • A Larger Input component can help us take fix this as it preserves indentation. This would improve community collaboration over Rocket.Chat and push Messaging x Developer Collaboration to the limits

  • The Same component can also be extended to add new Issues to GitHub or A Rocket.Chat app which parses and display markdown. The possibilities can be endless.

  • Updating the Multi-Line InputBlock #744

Proposed changes (including videos or screenshots)

  • Added New MediumMultilineInput and LargeMultilineInput elements to fuselage-ui-kit.

  • Added the new elements to the storybook.

  • Input With Medium Multiline Plane Text Input

    • Banner
2022-07-11.05-33-07.mp4
  • Modal
2022-07-11.05-33-33.mp4

  • Input With Large Multiline Plane Text Input

    • Banner
2022-07-11.05-34-02.mp4
  • Modal
2022-07-11.05-34-29.mp4

Issue(s)

closes #765

@samad-yar-khan
Copy link
Author

@MartinSchoeler @ggazzo can you guys please take a look at this PR and suggest any changes

@samad-yar-khan
Copy link
Author

@dougfabris @tassoevan Can you guys please take a look and suggest any changes ?

@samad-yar-khan samad-yar-khan force-pushed the NewInputComponent branch 4 times, most recently from cf7ada3 to 801d4cc Compare July 15, 2022 15:00
@samad-yar-khan
Copy link
Author

samad-yar-khan commented Jul 17, 2022 •
edited
Loading

@gabriellsh @yash-rajpal Can you please take a look and guide me with this PR. Feel free to message me over Rocket.Chat Open Server samad.khan whenever you find time :)

This was referenced Jul 25, 2022
Open
Closed
ggazzo
ggazzo reviewed Jul 29, 2022
View reviewed changes
packages/ui-kit/src/blocks/elements/PlainTextInputElement.ts Outdated
Comment on lines 11 to 13
multilineLarge?: boolean;
multilineMedium?: boolean;
multilineSmall?: boolean;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is this some part of other protocol? if there is no standard or compatibility I would stay with something like
multilineSize: 'large' | 'medium' | 'small'

Copy link
Author

@samad-yar-khan samad-yar-khan Jul 30, 2022 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ggazzo Thanks a lot for the review ! Yes, seems like a better option to have it that way. We can stick tomultilineSize: 'large' | 'medium' | 'small' . I will make the required changes.

@samad-yar-khan
Copy link
Author

@ggazzo I have updated the parameters for PlainInputTextElement and have replaced the previous parameters by multilineSize. Can you please take a look 😅 ?

@samad-yar-khan
Copy link
Author

@ggazzo can you please take a look at this again ? I have made changes according to review comments.

@CLAassistant
Copy link

CLAassistant commented Aug 10, 2022 •
edited
Loading

CLA assistant check
All committers have signed the CLA.

@ggazzo ggazzo force-pushed the develop branch 4 times, most recently from a1c5724 to fe695b1 Compare September 2, 2022 00:35
@dougfabris dougfabris changed the base branch from develop to main September 13, 2023 19:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@ggazzo ggazzo ggazzo left review comments

At least 1 approving review is required to merge this pull request.

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Larger Multiline Input Elements
3 participants
@samad-yar-khan @CLAassistant @ggazzo