remove unnecessary empty tags

This commit is contained in:
Scott Merchant 2024-06-10 10:03:20 +09:30 committed by Zoe Roux
parent f5faf06f81
commit 6f5513f11c
No known key found for this signature in database

View File

@ -95,65 +95,63 @@ export const BrowseSettings = ({
const { t } = useTranslation(); const { t } = useTranslation();
return ( return (
<> <View
<View {...css({
{...css({ flexDirection: "row-reverse",
flexDirection: "row-reverse", alignItems: "center",
alignItems: "center", marginX: ts(4),
marginX: ts(4), marginY: ts(1),
marginY: ts(1), })}
})} >
> <View {...css({ flexDirection: "row" })}>
<View {...css({ flexDirection: "row" })}> <Menu Trigger={SortTrigger} sortKey={sortKey}>
<Menu Trigger={SortTrigger} sortKey={sortKey}> {availableSorts.map((x) => (
{availableSorts.map((x) => ( <Menu.Item
<Menu.Item key={x}
key={x} label={t(`browse.sortkey.${x}` as any)}
label={t(`browse.sortkey.${x}` as any)} selected={sortKey === x}
selected={sortKey === x} icon={
icon={ x !== SearchSort.Relevance
x !== SearchSort.Relevance ? sortOrd === SortOrd.Asc
? sortOrd === SortOrd.Asc ? ArrowUpward
? ArrowUpward : ArrowDownward
: ArrowDownward : undefined
: undefined }
} onSelect={() =>
onSelect={() => setSort(x, sortKey === x && sortOrd === SortOrd.Asc ? SortOrd.Desc : SortOrd.Asc)
setSort(x, sortKey === x && sortOrd === SortOrd.Asc ? SortOrd.Desc : SortOrd.Asc) }
} />
/> ))}
))} </Menu>
</Menu> <HR orientation="vertical" />
<HR orientation="vertical" /> <IconButton
<IconButton icon={GridView}
icon={GridView} onPress={() => setLayout(Layout.Grid)}
onPress={() => setLayout(Layout.Grid)} color={layout === Layout.Grid ? theme.accent : undefined}
color={layout === Layout.Grid ? theme.accent : undefined} {...tooltip(t("browse.switchToGrid"))}
{...tooltip(t("browse.switchToGrid"))} {...css({ padding: ts(0.5), marginY: "auto" })}
{...css({ padding: ts(0.5), marginY: "auto" })} />
/> <IconButton
<IconButton icon={ViewList}
icon={ViewList} onPress={() => setLayout(Layout.List)}
onPress={() => setLayout(Layout.List)} color={layout === Layout.List ? theme.accent : undefined}
color={layout === Layout.List ? theme.accent : undefined} {...tooltip(t("browse.switchToList"))}
{...tooltip(t("browse.switchToList"))} {...css({ padding: ts(0.5), marginY: "auto" })}
{...css({ padding: ts(0.5), marginY: "auto" })} />
/>
</View>
<View {...css({ flexGrow: 1, flexDirection: "row", alignItems: "center" })}>
<Menu Trigger={MediaTypeTrigger} mediaType={mediaType}>
{availableMediaTypes.map((x) => (
<Menu.Item
key={x.key}
label={t(`browse.mediatypekey.${x.key}` as any)}
selected={mediaType === x}
icon={x.icon}
onSelect={() => setMediaType(x)}
/>
))}
</Menu>
</View>
</View> </View>
</> <View {...css({ flexGrow: 1, flexDirection: "row", alignItems: "center" })}>
<Menu Trigger={MediaTypeTrigger} mediaType={mediaType}>
{availableMediaTypes.map((x) => (
<Menu.Item
key={x.key}
label={t(`browse.mediatypekey.${x.key}` as any)}
selected={mediaType === x}
icon={x.icon}
onSelect={() => setMediaType(x)}
/>
))}
</Menu>
</View>
</View>
); );
}; };