From 3691975f80d990e0c25225d1a1192d58aa0c9dfb Mon Sep 17 00:00:00 2001 From: dougfabris Date: Sat, 1 May 2021 07:25:24 -0300 Subject: [PATCH] fix storybook errors --- .storybook/decorators.js | 13 +- .storybook/mocks/providers.js | 9 +- client/components/Card/{Body.js => Body.tsx} | 7 +- client/components/Card/Card.stories.js | 6 +- client/components/Card/{Card.js => Card.tsx} | 4 +- client/components/Card/CardDivider.js | 6 - client/components/Card/CardDivider.tsx | 6 + .../Card/{CardIcon.js => CardIcon.tsx} | 4 +- client/components/Card/{Col.js => Col.tsx} | 4 +- .../Card/{ColSection.js => ColSection.tsx} | 4 +- .../Card/{ColTitle.js => ColTitle.tsx} | 4 +- client/components/Card/Footer.js | 6 - client/components/Card/Footer.tsx | 6 + .../components/Card/{Title.js => Title.tsx} | 4 +- client/components/Card/index.ts | 4 +- client/components/DotLeader.stories.js | 2 +- client/components/Header/Header.stories.js | 2 +- .../Attachments/components/Image.stories.js | 2 +- .../Message/Metrics/Metrics.stories.js | 2 +- .../components/Page/PageScrollableContent.tsx | 9 +- client/components/data/Counter.js | 10 +- client/lib/asyncState/AsyncStatePhase.ts | 2 +- client/sidebar/Item/Condensed.js | 1 + client/sidebar/Item/Condensed.stories.js | 2 +- client/sidebar/Item/Extended.js | 1 + client/sidebar/Item/Extended.stories.js | 1 - client/sidebar/Item/Medium.js | 1 + client/sidebar/Item/Medium.stories.js | 2 +- client/sidebar/Sidebar.stories.js | 4 +- .../sidebar/hooks/useSidebarPaletteColor.js | 3 +- .../inputs/MultiSelectSettingInput.stories.js | 6 +- client/views/notFound/NotFoundPage.stories.js | 2 +- .../analytics/DateRangePicker.stories.js | 2 +- .../omnichannel/installation/Installation.js | 2 +- .../room/Announcement/Announcement.stories.js | 2 +- client/views/room/Room.stories.js | 2 +- .../AutoTranslate/AutoTranslate.stories.js | 2 +- .../Call/Jitsi/CallJitsi.stories.js | 2 +- .../ExportMessages/ExportMessages.stories.js | 4 +- .../Info/RoomInfo/RoomInfo.stories.js | 2 +- .../KeyboardShortcuts.stories.js | 2 +- .../NotificationPreferences.js | 33 ++-- .../NotificationPreferences.stories.js | 35 ++-- .../room/contextualBar/OTR/OTR.stories.js | 2 +- .../PruneMessages/PruneMessages.stories.js | 2 +- .../RoomFiles/RoomFiles.stories.js | 2 +- .../RoomFiles/components/FileItem.js | 35 ++-- .../RoomFiles/components/FileItem.stories.js | 2 +- .../components/FileItemIcon.stories.js | 2 +- .../RoomMembers/AddUsers/AddUsers.stories.js | 2 +- .../EditInvite/EditInvite.stories.js | 2 +- .../InviteUsers/InviteUsers.stories.js | 2 +- .../RoomMembers/RoomMembers.stories.js | 2 +- .../UserInfo/UserInfo.stories.js | 2 +- client/views/setupWizard/Pager.stories.js | 2 +- .../setupWizard/SetupWizardPage.stories.js | 2 +- client/views/setupWizard/SideBar.stories.js | 2 +- .../views/setupWizard/StepHeader.stories.js | 2 +- .../steps/AdminUserInformationStep.stories.js | 2 +- .../setupWizard/steps/FinalStep.stories.js | 2 +- .../steps/RegisterServerStep.stories.js | 2 +- .../steps/SettingsBasedStep.stories.js | 2 +- .../info/Delete/DeleteTeamModal.stories.js | 2 +- .../info/Leave/LeaveTeamModal.stories.js | 2 +- .../contextualBar/info/TeamsInfo.stories.js | 2 +- ...ndex.stories.js => ChannelsTab.stories.js} | 2 +- .../components/ChannelsTab/TableSection.js | 6 +- .../client/components/ChannelsTab/index.js | 10 +- .../components/EngagementDashboardPage.js | 12 +- .../MessagesTab/MessagesPerChannelSection.js | 17 +- .../MessagesTab/MessagesSentSection.js | 12 +- ...ndex.stories.js => MessagesTab.stories.js} | 2 +- .../client/components/MessagesTab/index.js | 20 +-- .../components/UsersTab/ActiveUsersSection.js | 12 +- .../UsersTab/BusiestChatTimesSection.js | 20 ++- .../components/UsersTab/NewUsersSection.js | 12 +- .../UsersTab/UsersByTimeOfTheDaySection.js | 12 +- .../{index.stories.js => UsersTab.Stories.js} | 0 .../client/components/UsersTab/index.js | 16 +- ee/client/audit/AuditPage.js | 167 +++--------------- ee/client/audit/AuditPageBase.js | 119 +++++++++++++ ee/client/audit/Tabs/ChannelTab.js | 26 +++ ee/client/audit/Tabs/DirectTab.js | 26 +++ ee/client/audit/Tabs/UsersTab.js | 26 +++ ee/client/audit/Tabs/VisitorsTab.js | 41 +++++ .../additionalForms/BusinessHoursTimeZone.js | 2 +- .../CannedResponseAdd.stories.js | 2 +- .../CannedResponseDetails.stories.js | 4 +- .../cannedResponses/CannedResponseEdit.js | 2 +- .../CannedResponseEdit.stories.js | 6 +- .../CannedResponseForm.stories.js | 2 +- .../CannedResponsesList.stories.js | 2 +- 92 files changed, 536 insertions(+), 346 deletions(-) rename client/components/Card/{Body.js => Body.tsx} (50%) rename client/components/Card/{Card.js => Card.tsx} (72%) delete mode 100644 client/components/Card/CardDivider.js create mode 100644 client/components/Card/CardDivider.tsx rename client/components/Card/{CardIcon.js => CardIcon.tsx} (71%) rename client/components/Card/{Col.js => Col.tsx} (71%) rename client/components/Card/{ColSection.js => ColSection.tsx} (61%) rename client/components/Card/{ColTitle.js => ColTitle.tsx} (62%) delete mode 100644 client/components/Card/Footer.js create mode 100644 client/components/Card/Footer.tsx rename client/components/Card/{Title.js => Title.tsx} (62%) rename ee/app/engagement-dashboard/client/components/ChannelsTab/{index.stories.js => ChannelsTab.stories.js} (89%) rename ee/app/engagement-dashboard/client/components/MessagesTab/{index.stories.js => MessagesTab.stories.js} (89%) rename ee/app/engagement-dashboard/client/components/UsersTab/{index.stories.js => UsersTab.Stories.js} (100%) create mode 100644 ee/client/audit/AuditPageBase.js create mode 100644 ee/client/audit/Tabs/ChannelTab.js create mode 100644 ee/client/audit/Tabs/DirectTab.js create mode 100644 ee/client/audit/Tabs/UsersTab.js create mode 100644 ee/client/audit/Tabs/VisitorsTab.js diff --git a/.storybook/decorators.js b/.storybook/decorators.js index db662ca23039..8a3804864ef7 100644 --- a/.storybook/decorators.js +++ b/.storybook/decorators.js @@ -31,11 +31,20 @@ export const rocketChatDecorator = (fn) => { }; export const fullHeightDecorator = (storyFn) => -
+
{storyFn()}
; export const centeredDecorator = (storyFn) => -
+
{storyFn()}
; diff --git a/.storybook/mocks/providers.js b/.storybook/mocks/providers.js index 1cdd00b7dac1..96aa4bcf9a8d 100644 --- a/.storybook/mocks/providers.js +++ b/.storybook/mocks/providers.js @@ -2,6 +2,7 @@ import i18next from 'i18next'; import React from 'react'; import { TranslationContext } from '../../client/contexts/TranslationContext'; +import ServerProvider from '../../client/providers/ServerProvider'; let contextValue; @@ -61,7 +62,9 @@ function TranslationProviderMock({ children }) { } export function MeteorProviderMock({ children }) { - return - {children} - ; + return + + {children} + + ; } diff --git a/client/components/Card/Body.js b/client/components/Card/Body.tsx similarity index 50% rename from client/components/Card/Body.js rename to client/components/Card/Body.tsx index fefef7eb60a6..c33c95ba712f 100644 --- a/client/components/Card/Body.js +++ b/client/components/Card/Body.tsx @@ -1,7 +1,10 @@ import { Box } from '@rocket.chat/fuselage'; -import React from 'react'; +import React, { FC, CSSProperties } from 'react'; -const Body = ({ children, flexDirection = 'row' }) => ( +const Body: FC<{ flexDirection: CSSProperties['flexDirection'] }> = ({ + children, + flexDirection = 'row', +}) => ( {children} diff --git a/client/components/Card/Card.stories.js b/client/components/Card/Card.stories.js index 7af0a3351640..2d243b70285b 100644 --- a/client/components/Card/Card.stories.js +++ b/client/components/Card/Card.stories.js @@ -1,10 +1,10 @@ import { Box, Button, ButtonGroup } from '@rocket.chat/fuselage'; import React from 'react'; -import Card from './Card'; +import Card from '.'; export default { - title: 'components/basic/Card', + title: 'components/Card', component: Card, }; @@ -74,7 +74,7 @@ export const Double = () => ( A bunch of stuff - A bunch of stuff + A bunch of stuff diff --git a/client/components/Card/Card.js b/client/components/Card/Card.tsx similarity index 72% rename from client/components/Card/Card.js rename to client/components/Card/Card.tsx index c8eaa55402e3..75c41e9485a2 100644 --- a/client/components/Card/Card.js +++ b/client/components/Card/Card.tsx @@ -1,7 +1,7 @@ import { Box } from '@rocket.chat/fuselage'; -import React from 'react'; +import React, { FC } from 'react'; -const Card = ({ children, ...props }) => ( +const Card: FC = ({ children, ...props }) => ( ; - -export default CardDivider; diff --git a/client/components/Card/CardDivider.tsx b/client/components/Card/CardDivider.tsx new file mode 100644 index 000000000000..52ef72dbd409 --- /dev/null +++ b/client/components/Card/CardDivider.tsx @@ -0,0 +1,6 @@ +import { Divider } from '@rocket.chat/fuselage'; +import React, { FC } from 'react'; + +const CardDivider: FC = () => ; + +export default CardDivider; diff --git a/client/components/Card/CardIcon.js b/client/components/Card/CardIcon.tsx similarity index 71% rename from client/components/Card/CardIcon.js rename to client/components/Card/CardIcon.tsx index 7d48697365bc..66e387834c89 100644 --- a/client/components/Card/CardIcon.js +++ b/client/components/Card/CardIcon.tsx @@ -1,7 +1,7 @@ import { Box, Icon } from '@rocket.chat/fuselage'; -import React from 'react'; +import React, { FC } from 'react'; -const CardIcon = ({ name, children, ...props }) => ( +const CardIcon: FC<{ name: string }> = ({ name, children, ...props }) => ( ( +const Col: FC = ({ children }) => ( {children} diff --git a/client/components/Card/ColSection.js b/client/components/Card/ColSection.tsx similarity index 61% rename from client/components/Card/ColSection.js rename to client/components/Card/ColSection.tsx index 172149515c1d..b09b17dafd57 100644 --- a/client/components/Card/ColSection.js +++ b/client/components/Card/ColSection.tsx @@ -1,7 +1,7 @@ import { Box } from '@rocket.chat/fuselage'; -import React from 'react'; +import React, { FC } from 'react'; -const ColSection = ({ children }) => ( +const ColSection: FC = ({ children }) => ( {children} diff --git a/client/components/Card/ColTitle.js b/client/components/Card/ColTitle.tsx similarity index 62% rename from client/components/Card/ColTitle.js rename to client/components/Card/ColTitle.tsx index 65488def96c8..80298c09b86c 100644 --- a/client/components/Card/ColTitle.js +++ b/client/components/Card/ColTitle.tsx @@ -1,7 +1,7 @@ import { Box } from '@rocket.chat/fuselage'; -import React from 'react'; +import React, { FC } from 'react'; -const ColTitle = ({ children }) => ( +const ColTitle: FC = ({ children }) => ( {children} diff --git a/client/components/Card/Footer.js b/client/components/Card/Footer.js deleted file mode 100644 index 330561cd9db5..000000000000 --- a/client/components/Card/Footer.js +++ /dev/null @@ -1,6 +0,0 @@ -import { Box } from '@rocket.chat/fuselage'; -import React from 'react'; - -const Footer = ({ children }) => {children}; - -export default Footer; diff --git a/client/components/Card/Footer.tsx b/client/components/Card/Footer.tsx new file mode 100644 index 000000000000..22c4304cc64c --- /dev/null +++ b/client/components/Card/Footer.tsx @@ -0,0 +1,6 @@ +import { Box } from '@rocket.chat/fuselage'; +import React, { FC } from 'react'; + +const Footer: FC = ({ children }) => {children}; + +export default Footer; diff --git a/client/components/Card/Title.js b/client/components/Card/Title.tsx similarity index 62% rename from client/components/Card/Title.js rename to client/components/Card/Title.tsx index 46f38ea0acf2..5f547f649d39 100644 --- a/client/components/Card/Title.js +++ b/client/components/Card/Title.tsx @@ -1,7 +1,7 @@ import { Box } from '@rocket.chat/fuselage'; -import React from 'react'; +import React, { FC } from 'react'; -const Title = ({ children }) => ( +const Title: FC = ({ children }) => ( {children} diff --git a/client/components/Card/index.ts b/client/components/Card/index.ts index cc0c4521665e..632c01e5a811 100644 --- a/client/components/Card/index.ts +++ b/client/components/Card/index.ts @@ -8,6 +8,8 @@ import ColTitle from './ColTitle'; import Footer from './Footer'; import Title from './Title'; +export const DOUBLE_COLUMN_CARD_WIDTH = 552; + export default Object.assign(Card, { Title, Body, @@ -19,5 +21,3 @@ export default Object.assign(Card, { Divider: CardDivider, Icon: CardIcon, }); - -export const DOUBLE_COLUMN_CARD_WIDTH = 552; diff --git a/client/components/DotLeader.stories.js b/client/components/DotLeader.stories.js index 3cbf9b6b6960..487fed3033e8 100644 --- a/client/components/DotLeader.stories.js +++ b/client/components/DotLeader.stories.js @@ -4,7 +4,7 @@ import React from 'react'; import DotLeader from './DotLeader'; export default { - title: 'components/basic/DotLeader', + title: 'components/DotLeader', component: DotLeader, }; diff --git a/client/components/Header/Header.stories.js b/client/components/Header/Header.stories.js index dd5e8f9a903b..522a3b7760d2 100644 --- a/client/components/Header/Header.stories.js +++ b/client/components/Header/Header.stories.js @@ -9,7 +9,7 @@ import RoomAvatar from '../avatar/RoomAvatar'; import Header from './Header'; export default { - title: 'Chat Header', + title: 'room/Header', component: Header, }; diff --git a/client/components/Message/Attachments/components/Image.stories.js b/client/components/Message/Attachments/components/Image.stories.js index d5aa1af10cc7..5f8a5789fc63 100644 --- a/client/components/Message/Attachments/components/Image.stories.js +++ b/client/components/Message/Attachments/components/Image.stories.js @@ -3,7 +3,7 @@ import React from 'react'; import Retry from './Retry'; export default { - title: 'Image', + title: 'components/Image', component: Image, }; diff --git a/client/components/Message/Metrics/Metrics.stories.js b/client/components/Message/Metrics/Metrics.stories.js index 49f2657f3cd6..55ea77eceb9c 100644 --- a/client/components/Message/Metrics/Metrics.stories.js +++ b/client/components/Message/Metrics/Metrics.stories.js @@ -5,7 +5,7 @@ import Reply from './Reply'; import Metrics from './index'; export default { - title: 'components/Message/Metrics', + title: 'message/Metrics', component: Metrics, }; diff --git a/client/components/Page/PageScrollableContent.tsx b/client/components/Page/PageScrollableContent.tsx index 1c1298e9037b..2d809c51ec12 100644 --- a/client/components/Page/PageScrollableContent.tsx +++ b/client/components/Page/PageScrollableContent.tsx @@ -10,7 +10,14 @@ type PageScrollableContentProps = { const PageScrollableContent = forwardRef( function PageScrollableContent({ onScrollContent, ...props }, ref) { return ( - + - + {count} {variation} diff --git a/client/lib/asyncState/AsyncStatePhase.ts b/client/lib/asyncState/AsyncStatePhase.ts index 09b40a8c0e79..937213c86fa7 100644 --- a/client/lib/asyncState/AsyncStatePhase.ts +++ b/client/lib/asyncState/AsyncStatePhase.ts @@ -1,4 +1,4 @@ -export const enum AsyncStatePhase { +export enum AsyncStatePhase { LOADING = 'loading', RESOLVED = 'resolved', REJECTED = 'rejected', diff --git a/client/sidebar/Item/Condensed.js b/client/sidebar/Item/Condensed.js index f56b4f2615ab..5a233d889519 100644 --- a/client/sidebar/Item/Condensed.js +++ b/client/sidebar/Item/Condensed.js @@ -5,6 +5,7 @@ import React, { memo, useState } from 'react'; const Condensed = ({ icon, title = '', + titleIcon, avatar, actions, href, diff --git a/client/sidebar/Item/Condensed.stories.js b/client/sidebar/Item/Condensed.stories.js index bf42db4d39da..a11138cace7c 100644 --- a/client/sidebar/Item/Condensed.stories.js +++ b/client/sidebar/Item/Condensed.stories.js @@ -6,7 +6,7 @@ import UserAvatar from '../../components/avatar/UserAvatar'; import Condensed from './Condensed'; export default { - title: 'Sidebar/condensed', + title: 'Sidebar/Condensed', component: Condensed, }; diff --git a/client/sidebar/Item/Extended.js b/client/sidebar/Item/Extended.js index ef2cba910992..42aa7a165b75 100644 --- a/client/sidebar/Item/Extended.js +++ b/client/sidebar/Item/Extended.js @@ -14,6 +14,7 @@ const Extended = ({ menu, menuOptions, subtitle = '', + titleIcon, badges, threadUnread, unread, diff --git a/client/sidebar/Item/Extended.stories.js b/client/sidebar/Item/Extended.stories.js index 4de55d78fc99..90c42d2d8b22 100644 --- a/client/sidebar/Item/Extended.stories.js +++ b/client/sidebar/Item/Extended.stories.js @@ -78,7 +78,6 @@ export const Menu = () => ( clickable title={title} subtitle={subtitle} - w titleIcon={{}} avatar={avatar} menuOptions={{ diff --git a/client/sidebar/Item/Medium.js b/client/sidebar/Item/Medium.js index 6246486b18ca..1c019ec24e86 100644 --- a/client/sidebar/Item/Medium.js +++ b/client/sidebar/Item/Medium.js @@ -5,6 +5,7 @@ import React, { memo, useState } from 'react'; const Medium = ({ icon, title = '', + titleIcon, avatar, actions, href, diff --git a/client/sidebar/Item/Medium.stories.js b/client/sidebar/Item/Medium.stories.js index a0132ca0e758..a4b42a20d598 100644 --- a/client/sidebar/Item/Medium.stories.js +++ b/client/sidebar/Item/Medium.stories.js @@ -6,7 +6,7 @@ import UserAvatar from '../../components/avatar/UserAvatar'; import Medium from './Medium'; export default { - title: 'Sidebar/medium', + title: 'Sidebar/Medium', component: Medium, }; diff --git a/client/sidebar/Sidebar.stories.js b/client/sidebar/Sidebar.stories.js index e127f143244e..b67318dc6e68 100644 --- a/client/sidebar/Sidebar.stories.js +++ b/client/sidebar/Sidebar.stories.js @@ -149,9 +149,9 @@ const Sidebar = () => ( <> -