[Bug] Fix UI Element text Breaking into two lines when long username about apps.notion HOT 25 CLOSED

@Nabhag8848 what I understood is
i) I will change the onInstall text to

ii) I will simply change the /notion connect text to Connect you Notion Workspace.

Do I need to make any further changes?

from apps.notion.

Incase of onInstallation message we need to attach the layout to top the the Hey username welcome to notion app message below the layout.

@Nabhag8848 I did not get this

from apps.notion.

Incase of onInstallation message we need to attach the layout to top the the Hey username welcome to notion app message below the layout.

@Nabhag8848 I did not get this

I mean Hey username welcome to notion app that text needs below layout so layout info will stick to top. meaning Hey username welcome to notion app should be first line incase of setting up the notion app..

from apps.notion.

@Nabhag8848 , I feel the issue lies here LayoutBlockType.SECTION only occupies a certain width. Both of the issue you mentioned, in that the text uses the function createSectionBlock and hence causing the issue. I am new to Rocket chat UI Kit, so i am not sure, which will be better to use in this case ?

Using getCreator of IModify, full line text can be done, then using createContextBlock that is custom function defined, it can be done.

from apps.notion.

@Nabhag8848 , I feel the issue lies here LayoutBlockType.SECTION only occupies a certain width. Both of the issue you mentioned, in that the text uses the function createSectionBlock and hence causing the issue. I am new to Rocket chat UI Kit, so i am not sure, which will be better to use in this case ?

Using getCreator of IModify, full line text can be done, then using createContextBlock that is custom function defined, it can be done.

Hey, I believe @brf153 is working on this issue. + please please please only work on one issue at a time.

from apps.notion.

@Nabhag8848 , Certainly, sir. I apologize if it caused any inconvenience. Well, which issue should I work on, sir? Apart from preserving the message one, as that is a significant issue and requires a lot of discussion to fully understand the implementation. Currently, I am looking for a good first issue to understand the codebase and how RC apps work.

from apps.notion.

@Nabhag8848 I believe there is an issue. For testing purposes, I created a function named sendNotificationWithBlock.

Initially, you can observe that I have commented out some code, and I'm not using any blocks at this point. As shown in the picture below, the text is fully visible and does not break.

When I remove the comment (i.e., when I add the block), I only get the block and not the message.

The section block, which we were using earlier, does not allow us to increase the width, causing the text to break.

We have two options: either replace the text with something else like Hello!👋 Connect your Notion Workspace without including the name, or consider making an issue in the apps-engine and try to address the problem there.

from apps.notion.

@Nabhag8848 I believe there is an issue. For testing purposes, I created a function named sendNotificationWithBlock.

Initially, you can observe that I have commented out some code, and I'm not using any blocks at this point. As shown in the picture below, the text is fully visible and does not break.

When I remove the comment (i.e., when I add the block), I only get the block and not the message.

The section block, which we were using earlier, does not allow us to increase the width, causing the text to break.

We have two options: either replace the text with something else like Hello!👋 Connect your Notion Workspace without including the name, or consider making an issue in the apps-engine and try to address the problem there.

yep. new uikit sets either text or block at a time.
Can we have button as an attachment does that solve our problem or we would face the same issue ? if that doesn't we can change text to Hey ${username} !.

from apps.notion.

Oki I will check it

from apps.notion.

@Nabhag8848 I have implemented the functionality you stated above. I am sending the action block as an attachment. Although the UI might not be perfect, it is working fine.

from apps.notion.

Shall I raise a pr for these changes?

from apps.notion.

Shall I raise a pr for these changes?

Can we make a button variant to primary so we can have a blue background.+ change text to Connect to Workspace to maintain consistency across app. and about OnInstallation feature we have come up with solution and are we able to achieve as we intended ?

from apps.notion.

@Nabhag8848 I have made the changes for onInstall. It looks like

from apps.notion.

Can we add custom css to our code for the ui kit? I am not being able to add the style: "primary" to the attachment's block. But, when I make changes in the devtools of chrome, I am being able to make the required changes.

from apps.notion.

Without custom css our button and message will look like

from apps.notion.

Can we add custom css to our code for the ui kit? I am not being able to add the style: "primary" to the attachment's block. But, when I make changes in the devtools of chrome, I am being able to make the required changes.

we can't as far as i know, hacks can go again RC design principles.

from apps.notion.

Without custom css our button and message will look like

Are we using PRIMARY button anywhere else except the submit button of modal and Comment Button ? if not, this won't break consistency across app, we are good to go with this.

from apps.notion.

@Nabhag8848 I have made the changes for onInstall. It looks like

Can we have that greeting on the second message ? also as we see, having two notification on install, can we make it one somehow and match the UI ? Can we have that layout as attachment and look as if it is attached below the notification with setup information like connect to workspace button, if thats possible lemme know.

from apps.notion.

Without custom css our button and message will look like

Are we using PRIMARY button anywhere else except the submit button of modal and Comment Button ? if not, this won't break consistency across app, we are good to go with this.

Shall I make these the same as I have done for the /notion connect command?

from apps.notion.

By submit button of modal, do you mean these buttons?

from apps.notion.

@Nabhag8848 I have made the changes for onInstall. It looks like

Can we have that greeting on the second message ? also as we see, having two notification on install, can we make it one somehow and match the UI ? Can we have that layout as attachment and look as if it is attached below the notification with setup information like connect to workspace button, if thats possible lemme know.

I can make something like

I think the layout you are talking about is the preview block which is having the notion's image, the header, the footer, and the text element. I have checked but I did not get anyway to send blocks as the attachment. The only block which we can send is the action block which is already defined in the IMessageAttachment

from apps.notion.

@Nabhag8848 I have made the changes for onInstall. It looks like

Can we have that greeting on the second message ? also as we see, having two notification on install, can we make it one somehow and match the UI ? Can we have that layout as attachment and look as if it is attached below the notification with setup information like connect to workspace button, if thats possible lemme know.

I can make something like I think the layout you are talking about is the preview block which is having the notion's image, the header, the footer, and the text element. I have checked but I did not get anyway to send blocks as the attachment. The only block which we can send is the action block which is already defined in the IMessageAttachment

@brf153 This Looks Good !

from apps.notion.

Without custom css our button and message will look like

Are we using PRIMARY button anywhere else except the submit button of modal and Comment Button ? if not, this won't break consistency across app, we are good to go with this.

Shall I make these the same as I have done for the /notion connect command?

@brf153 having button as attachment would break this buttons variation and will force us to change that to grey (not primary) which we can avoid, as mentioned earlier.

from apps.notion.

@brf153 Lets just have Connect your Notion Workspace

from apps.notion.

@Nabhag8848 what I understood is
i) I will change the onInstall text to

ii) I will simply change the /notion connect text to Connect you Notion Workspace.

Do I need to make any further changes?

looks good. Good to go for making changes to PR🚀

from apps.notion.