Skip to content

Commit

Permalink
🐛 fix app crash due to invalid styles
Browse files Browse the repository at this point in the history
  • Loading branch information
@mikib0
mikib0 committed Aug 12, 2024
1 parent a8f63c1 commit 012d380
Show file tree
Hide file tree
Showing 2 changed files with 9 additions and 106 deletions.
5 changes: 2 additions & 3 deletions packages/app/components/ScoreContainer.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -238,7 +238,7 @@ const loadStyles = (theme: any) => {
paddingHorizontal: 25,
marginVertical: 15,
padding: 26,
marginTop:25,
marginTop: 25,
// borderColor: currentTheme.colors.border,
// borderWidth: 2,
borderColor: currentTheme.colors.border,
Expand All @@ -258,7 +258,6 @@ const loadStyles = (theme: any) => {
justifyContent: 'center',
alignItems: 'flex-start',
width: '60%',

},
vStackXS: {
justifyContent: 'center',
Expand All @@ -280,7 +279,7 @@ const loadStyles = (theme: any) => {
},
buttonText: {
color: currentTheme.colors.white,
fontSize: '1rem',
fontSize: 16,
fontWeight: '500',
},
container: {
Expand Down
110 changes: 7 additions & 103 deletions packages/app/components/feedPreview/FeedPreviewCard.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { RLink } from '@packrat/ui';
import { LayoutChangeEvent, View } from 'react-native';
import useCustomStyles from 'app/hooks/useCustomStyles';
import loadStyles from './feedpreview.style';
import { AntDesign, Fontisto, MaterialIcons } from '@expo/vector-icons';
import { AntDesign, MaterialIcons } from '@expo/vector-icons';
import useTheme from 'app/hooks/useTheme';
import { useItemWeightUnit } from 'app/hooks/items';
import { convertWeight } from 'app/utils/convertWeight';
Expand All @@ -17,118 +17,22 @@ export type FeedItem = any;
interface FeedPreviewCardProps {
linkStr: string;
item: FeedItem;
feedType: string;
}

const RText: any = OriginalRText;

const FeedPreviewCard: React.FC<FeedPreviewCardProps> = ({
linkStr,
item,
feedType,
}) => {
const FeedPreviewCard: React.FC<FeedPreviewCardProps> = ({ linkStr, item }) => {
const { currentTheme } = useTheme();
const styles = useCustomStyles(loadStyles);
const [weightUnit] = useItemWeightUnit();
const formattedWeight = convertWeight(
item.total_weight ?? item.weight,
item.unit ?? 'g',
weightUnit,
);
const formattedWeight = convertWeight(item.total_weight, 'g', weightUnit);
const [cardWidth, setCardWidth] = useState<number | undefined>();

const handleSetCardWidth = (event: LayoutChangeEvent) => {
const { width } = event.nativeEvent.layout;
setCardWidth(width);
};

if (feedType == 'similarItems') {
return (
<View style={styles.cardStyles}>
<View
style={{
backgroundColor: currentTheme.colors.cardIconColor,
width: '100%',
paddingLeft: 16,
alignSelf: 'stretch',
}}
>
<View
style={{
backgroundColor: currentTheme.colors.primary,
padding: 4,
alignSelf: 'flex-start',
borderRadius: 8,
position: 'relative',
top: 16,
}}
>
<Fontisto
name="tent"
size={24}
color={currentTheme.colors.cardIconColor}
/>
</View>
</View>
<View style={{ padding: 16 }}>
<RText style={[styles.feedItemTitle, { width: cardWidth }]}>
{item.name}
</RText>
<RStack
style={{
flexDirection: 'row',
alignItems: 'start',
fontWeight: 500,
}}
gap="$6"
onLayout={handleSetCardWidth}
>
<RText
color={hexToRGBA(currentTheme.colors.text, 0.8)}
style={{ fontWeight: 'bold', lineHeight: 'normal' }}
>
{formatNumber(formattedWeight)}
{weightUnit}
</RText>

<RText
color={hexToRGBA(currentTheme.colors.text, 0.8)}
style={{ fontWeight: 'bold', lineHeight: 'normal' }}
>
Qty: {item.quantity}
</RText>
<View
style={{
flexDirection: 'row',
alignItems: 'center',
gap: 8,
}}
>
<AntDesign
name="clockcircle"
size={16}
color={hexToRGBA(currentTheme.colors.text, 0.8)}
/>
<RText
color={hexToRGBA(currentTheme.colors.text, 0.8)}
style={{ fontWeight: 'bold', lineHeight: 'normal' }}
>
{new Date(item.createdAt).toLocaleString('en-US', {
month: 'short',
day: '2-digit',
...(new Date(item.createdAt).getFullYear() ==
new Date().getFullYear()
? {}
: { year: 'numeric' }),
})}
</RText>
</View>
</RStack>
</View>
</View>
);
}

return (
<RLink href={linkStr}>
<View style={styles.cardStyles}>
Expand Down Expand Up @@ -172,7 +76,7 @@ const FeedPreviewCard: React.FC<FeedPreviewCardProps> = ({
>
<RText
color={hexToRGBA(currentTheme.colors.text, 0.8)}
style={{ fontWeight: 'bold', lineHeight: 'normal' }}
style={{ fontWeight: 'bold' }}
>
{formatNumber(formattedWeight)}
{weightUnit}
Expand All @@ -191,7 +95,7 @@ const FeedPreviewCard: React.FC<FeedPreviewCardProps> = ({
/>
<RText
color={hexToRGBA(currentTheme.colors.text, 0.8)}
style={{ fontWeight: 'bold', lineHeight: 'normal' }}
style={{ fontWeight: 'bold' }}
>
{item.favorites_count}
</RText>
Expand All @@ -210,7 +114,7 @@ const FeedPreviewCard: React.FC<FeedPreviewCardProps> = ({
/>
<RText
color={hexToRGBA(currentTheme.colors.text, 0.8)}
style={{ fontWeight: 'bold', lineHeight: 'normal' }}
style={{ fontWeight: 'bold' }}
>
{new Date(item.createdAt).toLocaleString('en-US', {
month: 'short',
Expand All @@ -224,7 +128,7 @@ const FeedPreviewCard: React.FC<FeedPreviewCardProps> = ({
</View>
<RText
color={hexToRGBA(currentTheme.colors.text, 0.8)}
style={{ fontWeight: 'bold', lineHeight: 'normal' }}
style={{ fontWeight: 'bold' }}
>
Ttl Score: {item.total_score}
</RText>
Expand Down

0 comments on commit 012d380

Please sign in to comment.