mirror of
https://github.com/laurent22/joplin.git
synced 2024-12-24 10:27:10 +02:00
Android: Fix plugin card titles are clipped (#10296)
This commit is contained in:
parent
346f49fa66
commit
1bb724fe0e
@ -1,7 +1,7 @@
|
||||
import * as React from 'react';
|
||||
import { Icon, Card, Chip, Text } from 'react-native-paper';
|
||||
import { _ } from '@joplin/lib/locale';
|
||||
import { Alert, Linking, TextStyle, View } from 'react-native';
|
||||
import { Alert, Linking, StyleSheet, View } from 'react-native';
|
||||
import { PluginItem } from '@joplin/lib/components/shared/config/plugins/types';
|
||||
import shim from '@joplin/lib/shim';
|
||||
import PluginService from '@joplin/lib/services/plugins/PluginService';
|
||||
@ -56,9 +56,15 @@ const onRecommendedPress = () => {
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any -- Old code before rule was applied
|
||||
const PluginIcon = (props: any) => <Icon {...props} source='puzzle'/>;
|
||||
|
||||
const versionTextStyle: TextStyle = {
|
||||
opacity: 0.8,
|
||||
};
|
||||
const styles = StyleSheet.create({
|
||||
versionText: {
|
||||
opacity: 0.8,
|
||||
},
|
||||
title: {
|
||||
// Prevents the title text from being clipped on Android
|
||||
verticalAlign: 'middle',
|
||||
},
|
||||
});
|
||||
|
||||
const PluginBox: React.FC<Props> = props => {
|
||||
const manifest = props.item.manifest;
|
||||
@ -162,12 +168,13 @@ const PluginBox: React.FC<Props> = props => {
|
||||
const updateStateIsIdle = props.updateState !== UpdateState.Idle;
|
||||
|
||||
const titleComponent = <>
|
||||
<Text variant='titleMedium'>{manifest.name}</Text> <Text variant='bodySmall' style={versionTextStyle}>v{manifest.version}</Text>
|
||||
<Text variant='titleMedium'>{manifest.name}</Text> <Text variant='bodySmall' style={styles.versionText}>v{manifest.version}</Text>
|
||||
</>;
|
||||
return (
|
||||
<Card style={{ margin: 8, opacity: props.isCompatible ? undefined : 0.75 }} testID='plugin-card'>
|
||||
<Card.Title
|
||||
title={titleComponent}
|
||||
titleStyle={styles.title}
|
||||
subtitle={manifest.description}
|
||||
left={PluginIcon}
|
||||
/>
|
||||
|
@ -127,8 +127,8 @@ describe('PluginStates', () => {
|
||||
initialPluginSettings={defaultPluginSettings}
|
||||
/>,
|
||||
);
|
||||
expect(await screen.findByText('ABC Sheet Music')).toBeVisible();
|
||||
expect(await screen.findByText('Backlinks to note')).toBeVisible();
|
||||
expect(await screen.findByText(/^ABC Sheet Music/)).toBeVisible();
|
||||
expect(await screen.findByText(/^Backlinks to note/)).toBeVisible();
|
||||
|
||||
expect(await screen.findByRole('button', { name: 'Update ABC Sheet Music', disabled: false })).toBeVisible();
|
||||
|
||||
@ -154,7 +154,7 @@ describe('PluginStates', () => {
|
||||
initialPluginSettings={defaultPluginSettings}
|
||||
/>,
|
||||
);
|
||||
expect(await screen.findByText('ABC Sheet Music')).toBeVisible();
|
||||
expect(await screen.findByText(/^ABC Sheet Music/)).toBeVisible();
|
||||
expect(await screen.findByRole('button', { name: 'Update ABC Sheet Music', disabled: false })).toBeVisible();
|
||||
expect(await screen.findByText(`v${outdatedVersion}`)).toBeVisible();
|
||||
});
|
||||
|
Loading…
Reference in New Issue
Block a user