diff --git a/app/containers/ServerItem/index.tsx b/app/containers/ServerItem/index.tsx new file mode 100644 index 000000000..156c7f037 --- /dev/null +++ b/app/containers/ServerItem/index.tsx @@ -0,0 +1,64 @@ +import React from 'react'; +// @ts-ignore // TODO: Remove on react-native update +import { Pressable, Text, View } from 'react-native'; +import FastImage from '@rocket.chat/react-native-fast-image'; + +import { IServerInfo } from '../../definitions'; +import Check from '../Check'; +import styles, { ROW_HEIGHT } from './styles'; +import { themes } from '../../lib/constants'; +import { isIOS } from '../../utils/deviceInfo'; +import { useTheme } from '../../theme'; + +export { ROW_HEIGHT }; + +interface IServerItem { + item: IServerInfo; + onPress(): void; + onLongPress?(): void; + hasCheck?: boolean; +} + +const defaultLogo = require('../../static/images/logo.png'); + +const ServerItem = React.memo(({ item, onPress, onLongPress, hasCheck }: IServerItem) => { + const { theme } = useTheme(); + return ( + onLongPress?.()} + testID={`rooms-list-header-server-${item.id}`} + android_ripple={{ color: themes[theme].bannerBackground }} + style={({ pressed }: { pressed: boolean }) => ({ + backgroundColor: isIOS && pressed ? themes[theme].bannerBackground : themes[theme].backgroundColor + })}> + + {item.iconURL ? ( + console.log('err_loading_server_icon')} + /> + ) : ( + + )} + + + {item.name || item.id} + + + {item.id} + + + {hasCheck ? : null} + + + ); +}); + +export default ServerItem; diff --git a/app/presentation/ServerItem/styles.ts b/app/containers/ServerItem/styles.ts similarity index 100% rename from app/presentation/ServerItem/styles.ts rename to app/containers/ServerItem/styles.ts diff --git a/app/definitions/IServer.ts b/app/definitions/IServer.ts index 9eee6ee82..b207f56db 100644 --- a/app/definitions/IServer.ts +++ b/app/definitions/IServer.ts @@ -19,4 +19,11 @@ export interface IServer { E2E_Enable: boolean; } +export interface IServerInfo { + id: string; + iconURL: string; + name: string; + useRealName?: boolean; +} + export type TServerModel = IServer & Model; diff --git a/app/presentation/ServerItem/index.tsx b/app/presentation/ServerItem/index.tsx deleted file mode 100644 index a70aaf858..000000000 --- a/app/presentation/ServerItem/index.tsx +++ /dev/null @@ -1,67 +0,0 @@ -import React from 'react'; -// @ts-ignore -import { Pressable, Text, View } from 'react-native'; -import FastImage from '@rocket.chat/react-native-fast-image'; - -import Check from '../../containers/Check'; -import styles, { ROW_HEIGHT } from './styles'; -import { themes } from '../../lib/constants'; -import { isIOS } from '../../utils/deviceInfo'; -import { withTheme } from '../../theme'; - -export { ROW_HEIGHT }; - -interface IServerItem { - item: { - id: string; - iconURL: string; - name: string; - }; - onPress(): void; - onLongPress?(): void; - hasCheck?: boolean; - theme?: string; -} - -const defaultLogo = require('../../static/images/logo.png'); - -const ServerItem = React.memo(({ item, onPress, onLongPress, hasCheck, theme }: IServerItem) => ( - onLongPress?.()} - testID={`rooms-list-header-server-${item.id}`} - android_ripple={{ - color: themes[theme!].bannerBackground - }} - style={({ pressed }: any) => ({ - backgroundColor: isIOS && pressed ? themes[theme!].bannerBackground : themes[theme!].backgroundColor - })}> - - {item.iconURL ? ( - console.log('err_loading_server_icon')} - /> - ) : ( - - )} - - - {item.name || item.id} - - - {item.id} - - - {hasCheck ? : null} - - -)); - -export default withTheme(ServerItem); diff --git a/app/views/RoomsListView/ServerDropdown.tsx b/app/views/RoomsListView/ServerDropdown.tsx index e7db06a9b..4abef24ae 100644 --- a/app/views/RoomsListView/ServerDropdown.tsx +++ b/app/views/RoomsListView/ServerDropdown.tsx @@ -12,7 +12,7 @@ import { appStart } from '../../actions/app'; import RocketChat from '../../lib/rocketchat'; import I18n from '../../i18n'; import EventEmitter from '../../utils/events'; -import ServerItem from '../../presentation/ServerItem'; +import ServerItem from '../../containers/ServerItem'; import database from '../../lib/database'; import { themes } from '../../lib/constants'; import { withTheme } from '../../theme'; @@ -180,7 +180,7 @@ class ServerDropdown extends Component { - const { server, theme } = this.props; + const { server } = this.props; return ( this.select(item.id, item.version)} onLongPress={() => item.id === server || this.remove(item.id)} hasCheck={item.id === server} - theme={theme} /> ); }; diff --git a/app/views/SelectServerView.tsx b/app/views/SelectServerView.tsx index e94170c1f..6af55ad7c 100644 --- a/app/views/SelectServerView.tsx +++ b/app/views/SelectServerView.tsx @@ -6,7 +6,7 @@ import { Q, Model } from '@nozbe/watermelondb'; import I18n from '../i18n'; import StatusBar from '../containers/StatusBar'; -import ServerItem, { ROW_HEIGHT } from '../presentation/ServerItem'; +import ServerItem, { ROW_HEIGHT } from '../containers/ServerItem'; import { shareExtensionInit } from '../lib/services/shareExtension'; import database from '../lib/database'; import SafeAreaView from '../containers/SafeAreaView'; diff --git a/app/views/ShareListView/index.tsx b/app/views/ShareListView/index.tsx index c41478163..581345e79 100644 --- a/app/views/ShareListView/index.tsx +++ b/app/views/ShareListView/index.tsx @@ -12,7 +12,7 @@ import database from '../../lib/database'; import { isAndroid, isIOS } from '../../utils/deviceInfo'; import I18n from '../../i18n'; import DirectoryItem, { ROW_HEIGHT } from '../../presentation/DirectoryItem'; -import ServerItem from '../../presentation/ServerItem'; +import ServerItem from '../../containers/ServerItem'; import * as HeaderButton from '../../containers/HeaderButton'; import ActivityIndicator from '../../containers/ActivityIndicator'; import * as List from '../../containers/List'; @@ -24,6 +24,7 @@ import RocketChat from '../../lib/rocketchat'; import { sanitizeLikeString } from '../../lib/database/utils'; import styles from './styles'; import ShareListHeader from './Header'; +import { IServerInfo } from '../../definitions'; interface IDataFromShare { value: string; @@ -52,12 +53,6 @@ interface IChat { description: string; } -interface IServerInfo { - id: string; - iconURL: string; - name: string; - useRealName: boolean; -} interface IState { searching: boolean; searchText: string; diff --git a/storybook/stories/ServerItem.js b/storybook/stories/ServerItem.js index d96e4ce74..96a3fee54 100644 --- a/storybook/stories/ServerItem.js +++ b/storybook/stories/ServerItem.js @@ -1,8 +1,7 @@ -/* eslint-disable import/no-extraneous-dependencies, import/no-unresolved, import/extensions, react/prop-types */ import React from 'react'; import { storiesOf } from '@storybook/react-native'; -import ServerItemComponent from '../../app/presentation/ServerItem'; +import ServerItemComponent from '../../app/containers/ServerItem'; import { ThemeContext } from '../../app/theme'; const stories = storiesOf('ServerItem', module);