Implement locales in codebase

This commit is contained in:
Lei Nelissen
2020-11-02 22:50:00 +01:00
parent 0df9d4a621
commit 6cf421f24f
14 changed files with 47 additions and 33 deletions

View File

@@ -15,6 +15,7 @@ import TouchableHandler from 'components/TouchableHandler';
import useCurrentTrack from 'utility/useCurrentTrack';
import { colors } from 'components/Colors';
import TrackPlayer from 'react-native-track-player';
import { t } from '@localisation';
type Route = RouteProp<StackParams, 'Album'>;
@@ -114,7 +115,7 @@ const Album: React.FC = () => {
<AlbumImage source={{ uri: getImage(album?.Id) }} style={colors.imageBackground} />
<Text style={styles.name} >{album?.Name}</Text>
<Text style={styles.artist}>{album?.AlbumArtist}</Text>
<Button title="Play Album" onPress={selectAlbum} color={THEME_COLOR} />
<Button title={t('play-album')} onPress={selectAlbum} color={THEME_COLOR} />
{album?.Tracks?.length ? album.Tracks.map((trackId) =>
<TouchableHandler
key={trackId}

View File

@@ -13,6 +13,7 @@ import { useRecentAlbums } from 'store/music/selectors';
import { Header } from 'components/Typography';
import ListButton from 'components/ListButton';
import { colors } from 'components/Colors';
import { t } from '@localisation';
const styles = StyleSheet.create({
artist: {
@@ -28,9 +29,9 @@ const NavigationHeader: React.FC = () => {
return (
<ListContainer>
<ListButton onPress={handleAllAlbumsClick}>All Albums</ListButton>
<ListButton onPress={handleSearchClick}>Search</ListButton>
<Header style={colors.text}>Recent Albums</Header>
<ListButton onPress={handleAllAlbumsClick}>{t('all-albums')}</ListButton>
<ListButton onPress={handleSearchClick}>{t('search')}</ListButton>
<Header style={colors.text}>{t('recent-albums')}</Header>
</ListContainer>
);
};

View File

@@ -12,6 +12,7 @@ import { useGetImage } from 'utility/JellyfinApi';
import { NavigationProp } from '../types';
import FastImage from 'react-native-fast-image';
import { colors } from 'components/Colors';
import { t } from '@localisation';
const Container = styled.View`
padding: 0 20px;
@@ -88,8 +89,8 @@ export default function Search() {
const HeaderComponent = React.useMemo(() => (
<Container>
<Input value={searchTerm} onChangeText={setSearchTerm} style={colors.input} placeholder="Search..." />
{(searchTerm.length && !results.length) ? <Text>No results...</Text> : null}
<Input value={searchTerm} onChangeText={setSearchTerm} style={colors.input} placeholder={t('search') + '...'} />
{(searchTerm.length && !results.length) ? <Text>{t('no-results')}</Text> : null}
</Container>
), [searchTerm, results, setSearchTerm]);
@@ -110,7 +111,7 @@ export default function Search() {
<Text numberOfLines={1} ellipsizeMode="tail" style={colors.text}>
{album.Name} - {album.AlbumArtist}
</Text>
<HalfOpacity style={colors.text}>Album</HalfOpacity>
<HalfOpacity style={colors.text}>{t('album')}</HalfOpacity>
</View>
</SearchResult>
</TouchableHandler>