84 lines
2.6 KiB
TypeScript
84 lines
2.6 KiB
TypeScript
import { View, Text } from "react-native";
|
|
import { StyleSheet, useUnistyles } from "react-native-unistyles";
|
|
import { RotateCw } from "lucide-react-native";
|
|
import { Button } from "@/components/ui/button";
|
|
import { DesktopPermissionRow } from "@/desktop/components/desktop-permission-row";
|
|
import { useDesktopPermissions } from "@/desktop/permissions/use-desktop-permissions";
|
|
import { settingsStyles } from "@/styles/settings";
|
|
|
|
export function DesktopPermissionsSection() {
|
|
const { theme } = useUnistyles();
|
|
const {
|
|
isDesktop,
|
|
snapshot,
|
|
isRefreshing,
|
|
requestingPermission,
|
|
isSendingTestNotification,
|
|
refreshPermissions,
|
|
requestPermission,
|
|
sendTestNotification,
|
|
} = useDesktopPermissions();
|
|
|
|
if (!isDesktop) {
|
|
return null;
|
|
}
|
|
|
|
const isBusy = isRefreshing || requestingPermission !== null;
|
|
const notificationsGranted = snapshot?.notifications.state === "granted";
|
|
|
|
return (
|
|
<View style={settingsStyles.section}>
|
|
<View style={styles.permissionSectionHeader}>
|
|
<Text style={settingsStyles.sectionTitle}>Desktop Permissions</Text>
|
|
<Button
|
|
variant="ghost"
|
|
size="sm"
|
|
leftIcon={<RotateCw size={theme.iconSize.md} color={theme.colors.foregroundMuted} />}
|
|
onPress={() => {
|
|
void refreshPermissions();
|
|
}}
|
|
disabled={isBusy}
|
|
accessibilityLabel="Refresh desktop permissions"
|
|
>
|
|
{isRefreshing ? "Refreshing..." : "Refresh"}
|
|
</Button>
|
|
</View>
|
|
<View style={settingsStyles.card}>
|
|
<DesktopPermissionRow
|
|
title="Notifications"
|
|
status={snapshot?.notifications ?? null}
|
|
isRequesting={requestingPermission === "notifications"}
|
|
onRequest={() => {
|
|
void requestPermission("notifications");
|
|
}}
|
|
extraActionLabel="Test"
|
|
isExtraActionBusy={isSendingTestNotification}
|
|
isExtraActionDisabled={!notificationsGranted || isBusy}
|
|
onExtraAction={() => {
|
|
void sendTestNotification();
|
|
}}
|
|
/>
|
|
<DesktopPermissionRow
|
|
title="Microphone"
|
|
showBorder
|
|
status={snapshot?.microphone ?? null}
|
|
isRequesting={requestingPermission === "microphone"}
|
|
onRequest={() => {
|
|
void requestPermission("microphone");
|
|
}}
|
|
/>
|
|
</View>
|
|
</View>
|
|
);
|
|
}
|
|
|
|
const styles = StyleSheet.create((theme) => ({
|
|
permissionSectionHeader: {
|
|
flexDirection: "row",
|
|
alignItems: "center",
|
|
justifyContent: "space-between",
|
|
gap: theme.spacing[2],
|
|
marginBottom: theme.spacing[3],
|
|
},
|
|
}));
|