toki/mattermost-mobile
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Added team selector screen

Browse source
This commit is contained in:
harshil Sharma 2023-10-19 16:31:18 +05:30
parent 9ae6db441f
commit ec7252ac4d
10 changed files with 51 additions and 63 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/constants/screens.ts
View file

@ -71,6 +71,7 @@ export const THREAD_FOLLOW_BUTTON = 'ThreadFollowButton';
export const THREAD_OPTIONS = 'ThreadOptions';
export const USER_PROFILE = 'UserProfile';
export const CONVERT_GM_TO_CHANNEL = 'ConvertGMToChannel';
export const TEAM_SELECTOR_LIST = 'TeamSelectorList';
export default {
ABOUT,
@ -143,6 +144,7 @@ export default {
THREAD_OPTIONS,
USER_PROFILE,
CONVERT_GM_TO_CHANNEL,
TEAM_SELECTOR_LIST,
} as const;
export const MODAL_SCREENS_WITHOUT_BACK = new Set<string>([

11
app/screens/convert_gm_to_channel/channel_name_input.tsx
View file

@ -8,13 +8,7 @@ import FloatingTextInput from '@app/components/floating_text_input_label';
import {Channel} from '@app/constants';
import {useTheme} from '@app/context/theme';
import {t} from '@app/i18n';
import {getKeyboardAppearanceFromTheme, makeStyleSheetFromTheme} from '@app/utils/theme';
const getStyleSheet = makeStyleSheetFromTheme((theme) => ({
fieldContainer: {
marginBottom: 32,
},
}));
import {getKeyboardAppearanceFromTheme} from '@app/utils/theme';
export const ChannelNameInput = () => {
const {formatMessage} = useIntl();
@ -23,8 +17,6 @@ export const ChannelNameInput = () => {
const labelDisplayName = formatMessage({id: t('channel_modal.name'), defaultMessage: 'Name'});
const placeholder = formatMessage({id: t('"channel_modal.name": "Name",'), defaultMessage: 'Channel Name'});
const styles = getStyleSheet(theme);
return (
<FloatingTextInput
autoCorrect={false}
@ -40,7 +32,6 @@ export const ChannelNameInput = () => {
showErrorIcon={false}
spellCheck={false}
testID='gonvert_gm_to_channel.channel_display_name.input'
containerStyle={styles.fieldContainer}
theme={theme}
/>
);

2
app/screens/convert_gm_to_channel/convert_gm_to_channel_form.tsx
View file

@ -32,7 +32,7 @@ export const ConvertGMToChannelForm = () => {
const {formatMessage} = useIntl();
const confirmButtonText = formatMessage({
id: 'channel_info.convert_gm_to_channel.button_text',
defaultMessage: 'Convert to a Private Channel',
defaultMessage: 'Convert to Private Channel',
});
return (

2
app/screens/convert_gm_to_channel/index.tsx
View file

@ -1,8 +1,6 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import {withDatabase} from '@nozbe/watermelondb/DatabaseProvider';
import ConvertGMToChannel from './convert_gm_to_channel';
export default ConvertGMToChannel;

65
app/screens/convert_gm_to_channel/team_selector.tsx
View file

@ -3,12 +3,14 @@
import React from 'react';
import {useIntl} from 'react-intl';
import {Text, View} from 'react-native';
import {Platform} from 'react-native';
import CompassIcon from '@app/components/compass_icon';
import OptionItem from '@app/components/option_item';
import {Screens} from '@app/constants';
import {useTheme} from '@app/context/theme';
import {dismissBottomSheet, goToScreen} from '@app/screens/navigation';
import {preventDoubleTap} from '@app/utils/tap';
import {changeOpacity, makeStyleSheetFromTheme} from '@app/utils/theme';
import {typography} from '@app/utils/typography';
const getStyleFromTheme = makeStyleSheetFromTheme((theme: Theme) => {
return {
@ -16,27 +18,6 @@ const getStyleFromTheme = makeStyleSheetFromTheme((theme: Theme) => {
borderTopWidth: 1,
borderBottomWidth: 1,
borderColor: changeOpacity(theme.centerChannelColor, 0.08),
display: 'flex',
flexDirection: 'row',
height: 48,
alignItems: 'center',
gap: 8,
},
label: {
color: theme.centerChannelColor,
...typography('Body', 100),
},
value: {},
placeholder: {
marginLeft: 'auto',
marginRight: 0,
color: changeOpacity(theme.centerChannelColor, 0.72),
...typography('Body', 100),
},
icon: {
color: changeOpacity(theme.centerChannelColor, 0.52),
marginRight: 0,
width: 20,
},
};
});
@ -45,27 +26,25 @@ export const TeamSelector = () => {
const theme = useTheme();
const styles = getStyleFromTheme(theme);
const intl = useIntl();
const label = intl.formatMessage({id: 'channel_into.convert_gm_to_channel.team_selector.label', defaultMessage: 'Team'});
const {formatMessage} = useIntl();
const label = formatMessage({id: 'channel_into.convert_gm_to_channel.team_selector.label', defaultMessage: 'Team'});
const placeholderText = intl.formatMessage({id: 'channel_into.convert_gm_to_channel.team_selector.placeholder', defaultMessage: 'Select a Team'});
const placeholder = (
<Text style={styles.placeholder}>{placeholderText}</Text>
);
const placeholder = formatMessage({id: 'channel_into.convert_gm_to_channel.team_selector.placeholder', defaultMessage: 'Select a Team'});
const goToTeamSelectorList = preventDoubleTap(async () => {
await dismissBottomSheet();
const title = formatMessage({id: 'channel_info.convert_gm_to_channel.team_selector_list.title', defaultMessage: 'Select Team'});
goToScreen(Screens.TEAM_SELECTOR_LIST, title);
});
return (
<View style={styles.teamSelector}>
<Text style={styles.label}>
{label}
</Text>
{placeholder}
<CompassIcon
style={styles.icon}
name='arrow-forward-ios'
size={18}
/>
</View>
<OptionItem
action={goToTeamSelectorList}
containerStyle={styles.teamSelector}
label={label}
type={Platform.select({ios: 'arrow', default: 'default'})}
info={placeholder}
/>
);
};

6
app/screens/convert_gm_to_channel/team_selector_list/index.tsx Normal file
View file

@ -0,0 +1,6 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import TeamSelectorList from './team_selector_list';
export default TeamSelectorList;

13
app/screens/convert_gm_to_channel/team_selector_list/team_selector_list.tsx Normal file
View file

@ -0,0 +1,13 @@
// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
// See LICENSE.txt for license information.
import React from 'react';
import {Text} from 'react-native';
const TeamSelectorList = () => {
return (
<Text>{'I am a Team Selector List!'}</Text>
);
};
export default TeamSelectorList;

4
app/screens/index.tsx
View file

@ -264,6 +264,10 @@ Navigation.setLazyComponentRegistrator((screenName) => {
break;
case Screens.CONVERT_GM_TO_CHANNEL:
screen = withServerDatabase(require('@screens/convert_gm_to_channel').default);
break;
case Screens.TEAM_SELECTOR_LIST:
screen = withServerDatabase(require('@screens/convert_gm_to_channel/team_selector_list').default);
break;
}
if (screen) {

3
assets/base/i18n/en.json
View file

@ -1092,5 +1092,6 @@
"channel_info.convert_gm_to_channel.warning.body": "You are about to convert the Group Message with Leonard Riley, Regina Wilson, Todd Smith and Aliya Mosta to a Channel. This cannot be undone.",
"channel_into.convert_gm_to_channel.team_selector.label": "Team",
"channel_into.convert_gm_to_channel.team_selector.placeholder": "Select a Team",
"channel_info.convert_gm_to_channel.button_text": "Convert to Private Channel"
"channel_info.convert_gm_to_channel.button_text": "Convert to Private Channel",
"channel_info.convert_gm_to_channel.team_selector_list.title": "Select Team"
}

6
ios/Mattermost.xcodeproj/project.pbxproj
View file

@ -2241,10 +2241,7 @@
);
OTHER_LDFLAGS = (
"$(inherited)",
"-Wl",
"-ld_classic",
" ",
"-Wl -ld_classic ",
);
REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native";
SDKROOT = iphoneos;
@ -2298,10 +2295,7 @@
);
OTHER_LDFLAGS = (
"$(inherited)",
"-Wl",
"-ld_classic",
" ",
"-Wl -ld_classic ",
);
REACT_NATIVE_PATH = "${PODS_ROOT}/../../node_modules/react-native";
SDKROOT = iphoneos;