Skip to content

Commit

Permalink
fix lint and tsc
Browse files Browse the repository at this point in the history
  • Loading branch information
Alex Risch authored and Alex Risch committed May 31, 2024
1 parent 2beae66 commit 9adda02
Show file tree
Hide file tree
Showing 3 changed files with 70 additions and 55 deletions.
2 changes: 1 addition & 1 deletion .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{
"editor.formatOnSave": false,
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.organizeImports": "explicit"
},
Expand Down
2 changes: 1 addition & 1 deletion src/i18n/locales/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -82,7 +82,7 @@
"reply": "Reply",

"cancel": "Cancel",
"create_group": "Create"
"create_group": "Create",
"conversation_replying_to": "Replying to %{name}",
"replied_to": "Replied to an earlier message"
}
121 changes: 68 additions & 53 deletions src/screens/CreateGroupScreen.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -82,31 +82,45 @@ const useData = () => {
};
};

const VerticalListItem: FC<{item: Contact; index: number; section: any;}> = ({
const VerticalListItem: FC<{item: Contact; index: number; section: any}> = ({
item,
index,
section
section,
}) => {
const {avatarUrl, displayName} = useContactInfo(item.address);
const handlePress = () => section.onPress(item);

return (
<Pressable onPress={handlePress} testID={`${TestIds.SEARCH_RESULT}_${item.address}`}>
<Pressable
onPress={handlePress}
testID={`${TestIds.SEARCH_RESULT}_${item.address}`}>
<HStack
alignItems="center"
marginX="16px"
paddingX="12px"
paddingY="12px"
borderTopRadius={index === 0 ? '16px' : undefined}
borderBottomRadius={index === section.data.length - 1 ? '16px' : undefined}
borderBottomRadius={
index === section.data.length - 1 ? '16px' : undefined
}
backgroundColor={colors.backgroundTertiary}
flexDirection="row">
<AvatarWithFallback address={item.address} avatarUri={avatarUrl} size={48} />
<AvatarWithFallback
address={item.address}
avatarUri={avatarUrl}
size={48}
/>
<VStack flex={1} alignItems="flex-start">
<Text typography="text-title/bold" color={colors.textSecondary} paddingLeft="16px">
<Text
typography="text-title/bold"
color={colors.textSecondary}
paddingLeft="16px">
{displayName ?? formatAddress(item.address)}
</Text>
<Text color={colors.textSecondary} typography="text-sm/mono medium" paddingLeft="16px">
<Text
color={colors.textSecondary}
typography="text-sm/mono medium"
paddingLeft="16px">
{formatAddress(item.address)}
</Text>
</VStack>
Expand All @@ -116,24 +130,32 @@ const VerticalListItem: FC<{item: Contact; index: number; section: any;}> = ({
);
};

const HorizontalListItem: FC<{item: Contact; index: number; section: any;}> = ({
const HorizontalListItem: FC<{item: Contact; index: number; section: any}> = ({
item,
index,
section
section,
}) => {
const {avatarUrl, displayName} = useContactInfo(item.address);
const handlePress = () => section.onPress(item);
return (
<Pressable onPress={handlePress} testID={`${TestIds.SEARCH_RESULT}_${item.address}`}>
<Pressable
onPress={handlePress}
testID={`${TestIds.SEARCH_RESULT}_${item.address}`}>
<VStack
alignItems="center"
paddingX="12px"
paddingY="12px"
borderTopRadius={index === 0 ? '16px' : undefined}
borderBottomRadius={index === section.data.length - 1 ? '16px' : undefined}
backgroundColor={"transparent"}
borderBottomRadius={
index === section.data.length - 1 ? '16px' : undefined
}
backgroundColor={'transparent'}
flexDirection="column">
<AvatarWithFallback address={item.address} avatarUri={avatarUrl} size={48} />
<AvatarWithFallback
address={item.address}
avatarUri={avatarUrl}
size={48}
/>
<Text typography="text-xs/regular" color={colors.textSecondary}>
{displayName ?? formatAddress(item.address)}
</Text>
Expand All @@ -153,13 +175,12 @@ const ListItem: FC<{
index: number;
horizontal?: boolean;
}> = ({item, index, section, horizontal}) => {
return horizontal ? (
<HorizontalListItem item={item} index={index} section={section} />
) : (
<VerticalListItem item={item} index={index} section={section} />
);
};

return horizontal ? (
<HorizontalListItem item={item} index={index} section={section} />
) : (
<VerticalListItem item={item} index={index} section={section} />
);
};

export const CreateGroupScreen = () => {
const {goBack, navigate} = useTypedNavigation();
Expand All @@ -179,7 +200,9 @@ export const CreateGroupScreen = () => {
const onGroupStart = useCallback(async () => {
setErrorString(null);

const participantAddresses = participants.map(participant => participant.address);
const participantAddresses = participants.map(
participant => participant.address,
);
const canMessage = await client?.canGroupMessage(participantAddresses);
for (const address of participantAddresses) {
if (!canMessage?.[address.toLowerCase()]) {
Expand Down Expand Up @@ -250,34 +273,25 @@ export const CreateGroupScreen = () => {
];
}, [recents, contacts, isValidAddress, ensAddress, searchText]);

const renderItem = ({horizontal = false}: {horizontal?: boolean} = {}):
SectionListRenderItem<Contact, {title: string; data: Contact[];}> => ({
item,
section,
index,
...rest
}) => {
return (
<ListItem
{...rest}
item={item}
index={index}
section={{
...section,
onPress: onItemPress,
}}
horizontal={horizontal}
/>
);
};

const removeParticipant = useCallback(
(address: string) => {
setErrorString(null);
setParticipants(prev => prev.filter(it => it !== address));
},
[setParticipants],
);
const renderItem =
({horizontal = false}: {horizontal?: boolean} = {}): SectionListRenderItem<
Contact,
{title: string; data: Contact[]}
> =>
({item, section, index, ...rest}) => {
return (
<ListItem
{...rest}
item={item}
index={index}
section={{
...section,
onPress: onItemPress,
}}
horizontal={horizontal}
/>
);
};

return (
<Screen
Expand All @@ -298,9 +312,10 @@ const renderItem = ({horizontal = false}: {horizontal?: boolean} = {}):
right={
<Pressable onPress={onGroupStart} disabled={!(participants.length > 0)}>
<Text
typography={participants.length > 0 ? "text-sm/semibold" : "text-sm/regular"}
textAlign={'right'}
>
typography={
participants.length > 0 ? 'text-sm/semibold' : 'text-sm/regular'
}
textAlign={'right'}>
{translate('create_group')}
</Text>
</Pressable>
Expand Down Expand Up @@ -365,7 +380,7 @@ const renderItem = ({horizontal = false}: {horizontal?: boolean} = {}):
horizontal={true}
sections={[{title: '', data: participants}]}
renderItem={renderItem({horizontal: true})}
/>
/>
</VStack>
<SectionList
w={'100%'}
Expand Down

0 comments on commit 9adda02

Please sign in to comment.