Skip to content

Chore: Upgrading livechat's ui-kit package to latest version #26709

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

Merged
kodiakhq merged 4 commits into from
Sep 14, 2022
Merged

Chore: Upgrading livechat's ui-kit package to latest version #26709

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
c060413
Chore: Replacing deprecated BLOCK_CONTEXT
aleksandernsilva Aug 26, 2022
9a616b4
Chore: Upgrading livechat's ui-kit package to latest version
aleksandernsilva Aug 26, 2022
6b0b067
Merge branch 'develop' of github.com:RocketChat/Rocket.Chat into chor…
aleksandernsilva Sep 13, 2022
59d2a93
Merge branch 'develop' into chore/livechat-uikit-upgrade
kodiakhq[bot] Sep 14, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion packages/livechat/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@
},
"dependencies": {
"@rocket.chat/sdk": "^1.0.0-alpha.42",
"@rocket.chat/ui-kit": "^0.14.1",
"@rocket.chat/ui-kit": "^0.31.16",
"crypto-js": "^4.1.1",
"css-vars-ponyfill": "^2.4.7",
"date-fns": "^2.15.0",
Expand Down
5 changes: 3 additions & 2 deletions packages/livechat/src/components/uiKit/message/ActionsBlock/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { BLOCK_CONTEXT } from '@rocket.chat/ui-kit';
import { BlockContext } from '@rocket.chat/ui-kit';
import { useState, useMemo, useCallback } from 'preact/compat';
import { withTranslation } from 'react-i18next';

Expand All @@ -21,7 +21,8 @@ const ActionsBlock = ({ appId, blockId, elements, parser, t }) => {
<Block appId={appId} blockId={blockId}>
<div className={createClassName(styles, 'uikit-actions-block')}>
{renderableElements.map((element, key) => {
const renderedElement = parser.renderActions(element, BLOCK_CONTEXT.ACTION);
const renderedElement = parser.renderActions(element, BlockContext.ACTION);

if (!renderedElement) {
return null;
}
Expand Down
6 changes: 3 additions & 3 deletions packages/livechat/src/components/uiKit/message/ButtonElement/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { BLOCK_CONTEXT } from '@rocket.chat/ui-kit';
import { BlockContext } from '@rocket.chat/ui-kit';
import { memo, useCallback } from 'preact/compat';

import { createClassName } from '../../../helpers';
Expand Down Expand Up @@ -35,8 +35,8 @@ const ButtonElement = ({ text, actionId, url, value, style, context, confirm, pa
children={parser.text(text)}
className={createClassName(styles, 'uikit-button', {
style,
accessory: context === BLOCK_CONTEXT.SECTION,
action: context === BLOCK_CONTEXT.ACTION,
accessory: context === BlockContext.SECTION,
action: context === BlockContext.ACTION,
})}
disabled={performingAction}
type='button'
Expand Down
4 changes: 2 additions & 2 deletions packages/livechat/src/components/uiKit/message/ButtonElement/stories.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { BLOCK_CONTEXT } from '@rocket.chat/ui-kit';
import { BlockContext } from '@rocket.chat/ui-kit';
import { action } from '@storybook/addon-actions';

import ButtonElement from '.';
Expand Down Expand Up @@ -27,7 +27,7 @@ export default {
url: { control: 'text' },
value: { control: 'text' },
style: { control: { type: 'inline-radio', options: [null, 'primary', 'danger'] } },
context: { control: { type: 'select', options: BLOCK_CONTEXT } },
context: { control: { type: 'select', options: BlockContext } },
},
args: {
text: { type: 'plain_text', text: 'Click Me' },
Expand Down
4 changes: 2 additions & 2 deletions packages/livechat/src/components/uiKit/message/ContextBlock/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { BLOCK_CONTEXT } from '@rocket.chat/ui-kit';
import { BlockContext } from '@rocket.chat/ui-kit';
import { memo } from 'preact/compat';

import { createClassName } from '../../../helpers';
Expand All @@ -10,7 +10,7 @@ const ContextBlock = ({ appId, blockId, elements, parser }) => (
<div className={createClassName(styles, 'uikit-context-block')}>
{elements.map((element, key) => (
<div key={key} className={createClassName(styles, 'uikit-context-block__item')}>
{parser.renderContext(element, BLOCK_CONTEXT.CONTEXT)}
{parser.renderContext(element, BlockContext.CONTEXT)}
</div>
))}
</div>
Expand Down
6 changes: 3 additions & 3 deletions packages/livechat/src/components/uiKit/message/ImageElement/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { BLOCK_CONTEXT } from '@rocket.chat/ui-kit';
import { BlockContext } from '@rocket.chat/ui-kit';
import { memo } from 'preact/compat';

import { createClassName } from '../../../helpers';
Expand All @@ -8,8 +8,8 @@ const ImageElement = ({ imageUrl, altText, context }) => (
<div
aria-label={altText}
className={createClassName(styles, 'uikit-image', {
accessory: context === BLOCK_CONTEXT.SECTION,
context: context === BLOCK_CONTEXT.CONTEXT,
accessory: context === BlockContext.SECTION,
context: context === BlockContext.CONTEXT,
})}
role='img'
style={{
Expand Down
8 changes: 4 additions & 4 deletions packages/livechat/src/components/uiKit/message/SectionBlock/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { BLOCK_CONTEXT } from '@rocket.chat/ui-kit';
import { BlockContext } from '@rocket.chat/ui-kit';
import { memo } from 'preact/compat';

import { createClassName } from '../../../helpers';
Expand All @@ -9,20 +9,20 @@ const SectionBlock = ({ appId, blockId, text, fields, accessory, parser }) => (
<Block appId={appId} blockId={blockId}>
<div className={createClassName(styles, 'uikit-section-block')}>
<div className={createClassName(styles, 'uikit-section-block__content')}>
{text && <div className={createClassName(styles, 'uikit-section-block__text')}>{parser.text(text, BLOCK_CONTEXT.SECTION)}</div>}
{text && <div className={createClassName(styles, 'uikit-section-block__text')}>{parser.text(text, BlockContext.SECTION)}</div>}
{Array.isArray(fields) && fields.length > 0 && (
<div className={createClassName(styles, 'uikit-section-block__fields')}>
{fields.map((field, i) => (
<div key={i} className={createClassName(styles, 'uikit-section-block__field')}>
{parser.text(field, BLOCK_CONTEXT.SECTION)}
{parser.text(field, BlockContext.SECTION)}
</div>
))}
</div>
)}
</div>
{accessory && (
<div className={createClassName(styles, 'uikit-section-block__accessory')}>
{parser.renderAccessories(accessory, BLOCK_CONTEXT.SECTION)}
{parser.renderAccessories(accessory, BlockContext.SECTION)}
</div>
)}
</div>
Expand Down
26 changes: 13 additions & 13 deletions packages/livechat/src/components/uiKit/message/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { uiKitMessage, UiKitParserMessage, BLOCK_CONTEXT } from '@rocket.chat/ui-kit';
import { uiKitMessage, UiKitParserMessage, BlockContext } from '@rocket.chat/ui-kit';

import ActionsBlock from './ActionsBlock';
import ButtonElement from './ButtonElement';
Expand All @@ -15,87 +15,87 @@ import StaticSelectElement from './StaticSelectElement';

class MessageParser extends UiKitParserMessage {
divider = (element, context, index) => {
if (context !== BLOCK_CONTEXT.BLOCK) {
if (context !== BlockContext.BLOCK) {
return null;
}

return <DividerBlock key={index} {...element} />;
};

section = (element, context, index) => {
if (context !== BLOCK_CONTEXT.BLOCK) {
if (context !== BlockContext.BLOCK) {
return null;
}

return <SectionBlock key={index} {...element} parser={this} />;
};

image = (element, context, index) => {
if (context === BLOCK_CONTEXT.BLOCK) {
if (context === BlockContext.BLOCK) {
return <ImageBlock key={index} {...element} parser={this} />;
}

return <ImageElement key={index} {...element} parser={this} context={context} />;
};

actions = (element, context, index) => {
if (context !== BLOCK_CONTEXT.BLOCK) {
if (context !== BlockContext.BLOCK) {
return null;
}

return <ActionsBlock key={index} {...element} parser={this} />;
};

context = (element, context, index) => {
if (context !== BLOCK_CONTEXT.BLOCK) {
if (context !== BlockContext.BLOCK) {
return null;
}

return <ContextBlock key={index} {...element} parser={this} />;
};

plainText = (element, context, index) => {
if (context === BLOCK_CONTEXT.BLOCK) {
plain_text = (element, context, index) => {
if (context === BlockContext.BLOCK) {
return null;
}

return <PlainText key={index} {...element} />;
};

mrkdwn = (element, context, index) => {
if (context === BLOCK_CONTEXT.BLOCK) {
if (context === BlockContext.BLOCK) {
return null;
}

return <Mrkdwn key={index} {...element} />;
};

button = (element, context, index) => {
if (context === BLOCK_CONTEXT.BLOCK) {
if (context === BlockContext.BLOCK) {
return null;
}

return <ButtonElement key={index} {...element} parser={this} context={context} />;
};

overflow = (element, context, index) => {
if (context === BLOCK_CONTEXT.BLOCK) {
if (context === BlockContext.BLOCK) {
return null;
}

return <OverflowElement key={index} {...element} parser={this} context={context} />;
};

datePicker = (element, context, index) => {
if (context === BLOCK_CONTEXT.BLOCK) {
if (context === BlockContext.BLOCK) {
return null;
}

return <DatePickerElement key={index} {...element} parser={this} context={context} />;
};

staticSelect = (element, context, index) => {
if (context === BLOCK_CONTEXT.BLOCK) {
if (context === BlockContext.BLOCK) {
return null;
}

Expand Down
10 changes: 5 additions & 5 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5202,7 +5202,7 @@ __metadata:
"@rocket.chat/fuselage-tokens": 0.31.18
"@rocket.chat/logo": 0.31.18
"@rocket.chat/sdk": ^1.0.0-alpha.42
"@rocket.chat/ui-kit": ^0.14.1
"@rocket.chat/ui-kit": ^0.31.16
"@storybook/addon-actions": ~6.5.10
"@storybook/addon-backgrounds": ~6.5.10
"@storybook/addon-essentials": ~6.5.10
Expand Down Expand Up @@ -5882,10 +5882,10 @@ __metadata:
languageName: node
linkType: hard

"@rocket.chat/ui-kit@npm:^0.14.1":
version: 0.14.1
resolution: "@rocket.chat/ui-kit@npm:0.14.1"
checksum: c9da95fbb079b2bbd39d746552083f0a67171347f303a3f27cad875f0eedf8d121d372fd0671c2ba9b2cd93b727fec10b01fe906cd71057a98872338c58f48bb
"@rocket.chat/ui-kit@npm:^0.31.16":
version: 0.31.16
resolution: "@rocket.chat/ui-kit@npm:0.31.16"
checksum: 08e161a629476338aacbe9a9b46feeb372f052c4548999b2611894cf9778b1dab4ac48586c43827345d8024c86ddea509022d627bbb4bb39ca1b667172260a38
languageName: node
linkType: hard

Expand Down