1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
|
import {Text, View, Modal, TouchableOpacity, Pressable} from 'react-native';
import {AppDetail} from 'react-native-launcher-kit/typescript/Interfaces/InstalledApps';
import {useFavorites} from '../hooks/useFavorites';
import React, {useState} from 'react';
// @ts-expect-error No declaration file
import IntentLauncher from '@angelkrak/react-native-intent-launcher';
import {useStableCallback} from '../hooks/useStableCallback';
import {TouchableNativeFeedback} from 'react-native-gesture-handler';
export const AppMenu: React.FC<React.PropsWithChildren<{app: AppDetail}>> = ({
app,
children,
}) => {
const [isOpen, setIsOpen] = useState(false);
const {addToFavorites, isFavorite, removeFromFavorites} = useFavorites();
const openContextMenu = useStableCallback(() => setIsOpen(true));
const closeContextMenu = useStableCallback(() => setIsOpen(false));
const onMenuItemPress = (fn: () => Promise<void> | void) => async () => {
closeContextMenu();
await fn();
};
const menuItems = [
isFavorite(app.packageName)
? {
label: 'Remove from favorites',
onPress: onMenuItemPress(() => removeFromFavorites(app.packageName)),
}
: {
label: 'Add to favorites',
onPress: onMenuItemPress(() => addToFavorites(app.packageName)),
},
{
label: 'App info',
onPress: onMenuItemPress(() =>
IntentLauncher.startActivity({
action: 'android.settings.APPLICATION_DETAILS_SETTINGS',
data: 'package:' + app.packageName,
}),
),
},
{
label: 'Uninstall',
onPress: onMenuItemPress(() =>
IntentLauncher.startActivity({
action: 'android.intent.action.DELETE',
data: 'package:' + app.packageName,
}),
),
},
];
const openApp = useStableCallback(() =>
IntentLauncher.startAppByPackageName(app.packageName),
);
return (
<>
<TouchableNativeFeedback onPress={openApp} onLongPress={openContextMenu}>
{children}
</TouchableNativeFeedback>
<Modal
visible={isOpen}
transparent={true}
animationType="fade"
onRequestClose={closeContextMenu}>
<Pressable className="flex-1" onPress={closeContextMenu}>
<View className="flex justify-center items-center h-full">
<View className="bg-[#181818] border border-[#222] w-2/3">
<Text className="text-slate-500 text-xs text-center border-b border-slate-500">
{app.label}
</Text>
{menuItems.map((menuItem) => (
<TouchableOpacity
key={menuItem.label}
onPress={menuItem.onPress}
className="py-3 px-4 border-b border-[#222] last:border-b-0 last:border-transparent">
<Text className="text-lg text-gray-300">
{menuItem.label}
</Text>
</TouchableOpacity>
))}
</View>
</View>
</Pressable>
</Modal>
</>
);
};
|
