Unverified Commit 6f31a00e authored by Alex Junior's avatar Alex Junior Committed by GitHub
Browse files

Chore: Clean Check component - TypeScript (#3919)

* chore: clear Check component

* chore: update tests
parent 571afcaa
......@@ -3,11 +3,8 @@ import { StyleSheet } from 'react-native';
import { CustomIcon } from '../lib/Icons';
import { themes } from '../constants/colors';
import { useTheme } from '../theme';
interface ICheck {
style?: object;
theme: string;
}
const styles = StyleSheet.create({
icon: {
width: 22,
......@@ -16,8 +13,9 @@ const styles = StyleSheet.create({
}
});
const Check = React.memo(({ theme, style }: ICheck) => (
<CustomIcon style={[styles.icon, style]} color={themes[theme].tintColor} size={22} name='check' />
));
const Check = React.memo(() => {
const { theme } = useTheme();
return <CustomIcon style={styles.icon} color={themes[theme].tintColor} size={22} name='check' />;
});
export default Check;
......@@ -41,7 +41,7 @@ const Item = ({ item, selected, onSelect, theme }: IItem) => {
<>
{item.imageUrl ? <FastImage style={styles.itemImage} source={{ uri: item.imageUrl }} /> : null}
<Text style={{ color: themes[theme].titleText }}>{textParser([item.text])}</Text>
{selected ? <Check theme={theme} /> : null}
{selected ? <Check /> : null}
</>
</Touchable>
);
......
......@@ -59,7 +59,7 @@ const ServerItem = React.memo(({ item, onPress, onLongPress, hasCheck, theme }:
{item.id}
</Text>
</View>
{hasCheck ? <Check theme={theme!} /> : null}
{hasCheck ? <Check /> : null}
</View>
</Pressable>
));
......
......@@ -71,7 +71,7 @@ export default class DirectoryOptions extends PureComponent<IDirectoryOptionsPro
<View style={styles.dropdownItemContainer}>
<CustomIcon style={[styles.dropdownItemIcon, { color: themes[theme].bodyText }]} size={22} name={icon} />
<Text style={[styles.dropdownItemText, { color: themes[theme].bodyText }]}>{I18n.t(text)}</Text>
{propType === itemType ? <Check theme={theme} /> : null}
{propType === itemType ? <Check /> : null}
</View>
</Touch>
);
......
......@@ -19,7 +19,18 @@ const item = {
iconURL: 'https://open.rocket.chat/images/logo/android-chrome-512x512.png'
};
const ServerItem = props => <ServerItemComponent item={item} hasCheck={false} {...props} />;
const ServerItem = ({ theme = themes.light, ...props }) => (
<ThemeContext.Provider
value={{
theme,
themePreferences: {
currentTheme: theme,
darkLevel: theme
}
}}>
<ServerItemComponent item={item} hasCheck={false} {...props} />
</ThemeContext.Provider>
);
stories.add('content', () => (
<>
......@@ -47,16 +58,10 @@ stories.add('touchable', () => (
</>
));
const ThemeStory = ({ theme }) => (
<ThemeContext.Provider value={theme}>
<ServerItem theme={theme} hasCheck />
</ThemeContext.Provider>
);
stories.add('themes', () => (
<>
<ThemeStory theme={themes.light} />
<ThemeStory theme={themes.dark} />
<ThemeStory theme={themes.black} />
<ServerItem theme={themes.light} />
<ServerItem theme={themes.dark} />
<ServerItem theme={themes.black} />
</>
));
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment