This commit is contained in:
cocobo1 2025-12-23 15:46:20 +02:00
commit 085a8f3c23
6 changed files with 45 additions and 41 deletions

View file

@ -32,7 +32,7 @@ const useStyles = createStyles({
},
headerLabel: {
...TextStyleSheet["heading-md/semibold"],
color: semanticColors.HEADER_PRIMARY,
color: semanticColors.MOBILE_TEXT_HEADING_PRIMARY,
},
headerSubtitle: {
...TextStyleSheet["text-md/semibold"],
@ -40,7 +40,7 @@ const useStyles = createStyles({
},
descriptionLabel: {
...TextStyleSheet["text-md/semibold"],
color: semanticColors.HEADER_PRIMARY,
color: semanticColors.TEXT_NORMAL,
},
actions: {
flexDirection: "row-reverse",
@ -48,7 +48,7 @@ const useStyles = createStyles({
gap: 5
},
iconStyle: {
tintColor: semanticColors.LOGO_PRIMARY,
tintColor: semanticColors.INTERACTIVE_ICON_DEFAULT,
opacity: 0.2,
height: 64,
width: 64,

View file

@ -151,7 +151,7 @@ export default function AddonPage<T extends object>({ CardComponent, ...props }:
return <View style={{ gap: 32, flexGrow: 1, justifyContent: "center", alignItems: "center" }}>
<View style={{ gap: 8, alignItems: "center" }}>
<Image source={findAssetId("empty_quick_switcher")!} />
<Text variant="text-lg/semibold" color="text-normal">
<Text variant="text-lg/semibold" color="text-default">
Oops! Nothing to see here… yet!
</Text>
</View>
@ -204,7 +204,7 @@ export default function AddonPage<T extends object>({ CardComponent, ...props }:
ListHeaderComponent={headerElement}
ListEmptyComponent={() => <View style={{ gap: 12, padding: 12, alignItems: "center" }}>
<Image source={findAssetId("devices_not_found")!} />
<Text variant="text-lg/semibold" color="text-normal">
<Text variant="text-lg/semibold" color="text-default">
Hmmm... could not find that!
</Text>
</View>}

View file

@ -332,7 +332,7 @@ export default function FontEditor(props: {
return <TableRow
label={name}
subLabel={error ? <Text variant='text-xs/medium' color='text-danger'>{error.message}</Text> : url}
subLabel={error ? <Text variant='text-xs/medium' color='text-feedback-critical'>{error.message}</Text> : url}
trailing={<Stack spacing={8} direction="horizontal">
<IconButton
size="sm"
@ -363,7 +363,7 @@ export default function FontEditor(props: {
})}
<TableRow label={<NewEntryRow fontName={props.name} fontEntry={fontEntries} />} />
</TableRowGroup>
{errors && <Text variant='text-sm/medium' color='text-danger'>Some font entries cannot be imported. Please modify the entries and try again.</Text>}
{errors && <Text variant='text-sm/medium' color='text-feedback-critical'>Some font entries cannot be imported. Please modify the entries and try again.</Text>}
<View style={{ flexDirection: "row", justifyContent: "flex-end", bottom: 0, left: 0 }}>
<Button
size="lg"

View file

@ -45,14 +45,14 @@ function normalizeIdFromInstallUrl(url: string) {
// @ts-ignore (i cant be bothered to type these)
function InstallButton({ addon, isPluginMode, installing, setInstalling, setRefreshTick }) {
const normId = normalizeIdFromInstallUrl(addon.installUrl);
const [installed, setInstalled] = React.useState(() =>
const [installed, setInstalled] = React.useState(() =>
isPluginMode ? Boolean(VdPluginManager.plugins[normId]) : Boolean(themes[addon.installUrl])
);
React.useEffect(() => {
setInstalled(isPluginMode ? Boolean(VdPluginManager.plugins[normId]) : Boolean(themes[addon.installUrl]));
}, [addon.installUrl, setRefreshTick, isPluginMode]);
const installAddon = async () => {
if (installing.has(normId)) return;
setInstalling((prev: Iterable<unknown> | null | undefined) => new Set(prev).add(normId));
@ -90,7 +90,7 @@ function InstallButton({ addon, isPluginMode, installing, setInstalling, setRefr
const promptInstall = () => {
if (!isPluginMode) return installAddon();
const plugin = addon as PluginData;
const needsWarn = (plugin.status && plugin.status !== "working") || (plugin.warningMessage && plugin.warningMessage.trim().length > 0);
if (!needsWarn) return installAddon();
@ -197,12 +197,12 @@ function TrailingButtons({ addon, isPluginMode, installing, setInstalling, setRe
variant="secondary"
icon={findAssetId("MoreHorizontalIcon")}
/>
<InstallButton
<InstallButton
addon={addon}
isPluginMode={isPluginMode}
installing={installing}
setInstalling={setInstalling}
setRefreshTick={setRefreshTick}
installing={installing}
setInstalling={setInstalling}
setRefreshTick={setRefreshTick}
/>
</Stack>
);
@ -238,12 +238,12 @@ function AddonCard({ addon, isPluginMode, installing, setInstalling, setRefreshT
)}
</View>
<View>
<TrailingButtons
<TrailingButtons
addon={addon}
isPluginMode={isPluginMode}
installing={installing}
setInstalling={setInstalling}
setRefreshTick={setRefreshTick}
installing={installing}
setInstalling={setInstalling}
setRefreshTick={setRefreshTick}
/>
</View>
</View>
@ -296,7 +296,7 @@ export default function BrowserPage() {
const response = await safeFetch(url);
if (!response.ok) throw new Error(`HTTP ${response.status}: ${response.statusText}`);
const data = await response.json();
let addonList: AddonData[] = [];
if (Array.isArray(data)) {
addonList = data;
@ -306,7 +306,7 @@ export default function BrowserPage() {
// Handle any other structure for themes - try common property names
addonList = data.OFFICIAL_THEMES || data.themes || data.THEMES || data.items || [];
}
if (isPluginMode) {
setPlugins(addonList as PluginData[]);
} else {
@ -411,34 +411,38 @@ export default function BrowserPage() {
return (
<View style={{ flex: 1 }}>
<View style={{ justifyContent: "center", alignItems: "center", paddingHorizontal: 10 }}>
<View style={{ paddingHorizontal: 10 }}>
<Stack spacing={12}>
<View style={{ flexDirection: "row", justifyContent: "center", alignItems: 'center', paddingTop: 10 }}>
<Stack spacing={10} style={{ flexDirection: "row", justifyContent: "center", alignItems: 'center' }}>
<View style={{ flexDirection: "row", paddingTop: 10 }}>
<View style={{ flex: 1, flexDirection: "row", alignItems: "center" }}>
<Button
size="sm"
size="md"
text="Plugins"
variant={mode === "plugins" ? "primary" : "secondary"}
onPress={() => setMode("plugins")}
style={{ flex: 1 }}
/>
<View style={{ width: 8 }} />
<Button
size="sm"
size="md"
text="Themes"
variant={mode === "themes" ? "primary" : "secondary"}
onPress={() => setMode("themes")}
style={{ flex: 1 }}
/>
</Stack>
</View>
</View>
<View style={{ flexDirection: "row", alignItems: "center", gap: 8, paddingBottom: 6 }}>
<Search
placeholder={`Search ${mode}...`}
onChangeText={setSearchQuery}
<Search
placeholder={`Search ${mode}...`}
isRound={true}
onChangeText={setSearchQuery}
style={{ flex: 1 }}
/>
<View style={{ flexDirection: "row", alignItems: "center", gap: 8 }}>
<IconButton
size="sm"
size="md"
variant="tertiary"
icon={findAssetId("MoreVerticalIcon")}
disabled={!!searchQuery}
@ -457,11 +461,11 @@ export default function BrowserPage() {
})}
/>
</View>
</View>
</Stack>
</View>
<FlashList
data={sortedAndFiltered}
refreshing={loading}
@ -485,16 +489,16 @@ export default function BrowserPage() {
//@ts-ignore
renderItem={({ item: addon }) => (
<View style={{ paddingVertical: 6, paddingHorizontal: 8 }}>
<AddonCard
<AddonCard
addon={addon}
isPluginMode={mode === "plugins"}
installing={installing}
setInstalling={setInstalling}
setRefreshTick={setRefreshTick}
installing={installing}
setInstalling={setInstalling}
setRefreshTick={setRefreshTick}
/>
</View>
)}
/>
</View>
);
}
}

View file

@ -208,7 +208,7 @@ export default function PluginInfoActionSheet({
color="text-primary"
style={{
marginBottom: 4,
color: semanticColors.HEADER_PRIMARY,
color: "text-strong",
}}
>
Description

View file

@ -14,11 +14,11 @@ const useStyles = createStyles({
fontFamily: constants.Fonts.CODE_NORMAL,
fontSize: 12,
textAlignVertical: "center",
backgroundColor: semanticColors.BACKGROUND_SECONDARY,
color: semanticColors.TEXT_NORMAL,
backgroundColor: semanticColors.CARD_BACKGROUND_DEFAULT,
color: semanticColors.TEXT_DEFAULT,
borderWidth: 1,
borderRadius: 12,
borderColor: semanticColors.BACKGROUND_TERTIARY,
borderColor: semanticColors.BORDER_SUBTLE,
padding: 10,
},
});