mirror of
https://github.com/spacedriveapp/spacedrive
synced 2024-07-02 11:13:29 +00:00
Local Discovery for Mobile + Start of Device Sync
This commit is contained in:
parent
fd71eff90e
commit
2e2a533acc
|
@ -1,3 +1,4 @@
|
||||||
|
import { useBridgeQuery } from '@sd/client';
|
||||||
import { Text } from 'react-native';
|
import { Text } from 'react-native';
|
||||||
import { Icon } from '~/components/icons/Icon';
|
import { Icon } from '~/components/icons/Icon';
|
||||||
import ScreenContainer from '~/components/layout/ScreenContainer';
|
import ScreenContainer from '~/components/layout/ScreenContainer';
|
||||||
|
@ -5,6 +6,9 @@ import { tw } from '~/lib/tailwind';
|
||||||
import { NetworkStackScreenProps } from '~/navigation/tabs/NetworkStack';
|
import { NetworkStackScreenProps } from '~/navigation/tabs/NetworkStack';
|
||||||
|
|
||||||
export default function NetworkScreen({ navigation }: NetworkStackScreenProps<'Network'>) {
|
export default function NetworkScreen({ navigation }: NetworkStackScreenProps<'Network'>) {
|
||||||
|
const node = useBridgeQuery(['nodeState']);
|
||||||
|
|
||||||
|
console.log('node', node.data?.p2p);
|
||||||
return (
|
return (
|
||||||
<ScreenContainer scrollview={false} style={tw`items-center justify-center gap-0`}>
|
<ScreenContainer scrollview={false} style={tw`items-center justify-center gap-0`}>
|
||||||
<Icon name="Globe" size={128} />
|
<Icon name="Globe" size={128} />
|
||||||
|
|
|
@ -21,6 +21,7 @@ const DebugScreen = ({ navigation }: SettingsStackScreenProps<'Debug'>) => {
|
||||||
const setOrigin = useBridgeMutation(['cloud.setApiOrigin']);
|
const setOrigin = useBridgeMutation(['cloud.setApiOrigin']);
|
||||||
|
|
||||||
const queryClient = useQueryClient();
|
const queryClient = useQueryClient();
|
||||||
|
const editNode = useBridgeMutation('nodes.edit');
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<View style={tw`flex-1 p-4`}>
|
<View style={tw`flex-1 p-4`}>
|
||||||
|
@ -71,6 +72,26 @@ const DebugScreen = ({ navigation }: SettingsStackScreenProps<'Debug'>) => {
|
||||||
>
|
>
|
||||||
<Text style={tw`text-ink`}>Logout</Text>
|
<Text style={tw`text-ink`}>Logout</Text>
|
||||||
</Button>
|
</Button>
|
||||||
|
<Button
|
||||||
|
onPress={async () =>
|
||||||
|
await editNode.mutateAsync({
|
||||||
|
name: null,
|
||||||
|
p2p_port: { type: 'random' },
|
||||||
|
p2p_disabled: false,
|
||||||
|
p2p_ipv6_disabled: true,
|
||||||
|
p2p_relay_disabled: false,
|
||||||
|
p2p_discovery: 'Everyone',
|
||||||
|
p2p_remote_access: true,
|
||||||
|
p2p_manual_peers: [],
|
||||||
|
image_labeler_version: null
|
||||||
|
})
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<Text style={tw`text-ink`}>Enable p2p</Text>
|
||||||
|
</Button>
|
||||||
|
<Button onPress={() => toggleFeatureFlag('wipP2P')}>
|
||||||
|
<Text style={tw`text-ink`}>Toggle wipP2P Feature Flag</Text>
|
||||||
|
</Button>
|
||||||
</Card>
|
</Card>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
|
|
|
@ -742,6 +742,8 @@ async fn start(
|
||||||
p2p.connected_to_outgoing(id, remote_metadata, req.to);
|
p2p.connected_to_outgoing(id, remote_metadata, req.to);
|
||||||
|
|
||||||
let _ = req.tx.send(Ok(UnicastStream::new(req.to, stream.compat())));
|
let _ = req.tx.send(Ok(UnicastStream::new(req.to, stream.compat())));
|
||||||
|
|
||||||
|
debug!("Successfully connected with '{}'", req.to);
|
||||||
},
|
},
|
||||||
Err(e) => {
|
Err(e) => {
|
||||||
let _ = req.tx.send(Err(e.to_string()));
|
let _ = req.tx.send(Err(e.to_string()));
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
import { HardwareModel, useBridgeQuery } from '@sd/client';
|
import { HardwareModel, useBridgeQuery, usePeers } from '@sd/client';
|
||||||
import { Button, Tooltip, dialogManager } from '@sd/ui';
|
import { Button, dialogManager, Tooltip } from '@sd/ui';
|
||||||
import { Icon } from '~/components';
|
import { Icon } from '~/components';
|
||||||
import { useLocale } from '~/hooks';
|
import { useLocale } from '~/hooks';
|
||||||
import { hardwareModelToIcon } from '~/util/hardware';
|
import { hardwareModelToIcon } from '~/util/hardware';
|
||||||
|
@ -9,38 +9,60 @@ import Section from '../../SidebarLayout/Section';
|
||||||
import AddDeviceDialog from './AddDeviceDialog';
|
import AddDeviceDialog from './AddDeviceDialog';
|
||||||
|
|
||||||
export default function DevicesSection() {
|
export default function DevicesSection() {
|
||||||
const { data: node } = useBridgeQuery(['nodeState']);
|
const { data: node } = useBridgeQuery(['nodeState']);
|
||||||
const { t } = useLocale();
|
const peers = usePeers();
|
||||||
|
const { t } = useLocale();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Section name={t('devices')}>
|
<Section name={t('devices')}>
|
||||||
{node && (
|
{node && (
|
||||||
<SidebarLink className="group relative w-full" to={`node/${node.id}`} key={node.id}>
|
<SidebarLink className="group relative w-full" to={`node/${node.id}`} key={node.id}>
|
||||||
{node.device_model ? (
|
{node.device_model ? (
|
||||||
<Icon
|
<Icon
|
||||||
name={hardwareModelToIcon(node.device_model as HardwareModel)}
|
name={hardwareModelToIcon(node.device_model as HardwareModel)}
|
||||||
size={20}
|
size={20}
|
||||||
className="mr-1"
|
className="mr-1"
|
||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<Icon name="Laptop" className="mr-1" />
|
<Icon name="Laptop" className="mr-1" />
|
||||||
)}
|
)}
|
||||||
|
|
||||||
<span className="truncate">{node.name}</span>
|
<span className="truncate">{node.name}</span>
|
||||||
</SidebarLink>
|
</SidebarLink>
|
||||||
)}
|
)}
|
||||||
|
{Array.from(peers).map(([id, node]) => {
|
||||||
|
return (
|
||||||
|
<SidebarLink
|
||||||
|
className="group relative w-full"
|
||||||
|
to={`/remote/${id}/browse`}
|
||||||
|
key={id}
|
||||||
|
>
|
||||||
|
{node.metadata.device_model ? (
|
||||||
|
<Icon
|
||||||
|
name={hardwareModelToIcon(
|
||||||
|
node.metadata.device_model as HardwareModel
|
||||||
|
)}
|
||||||
|
size={20}
|
||||||
|
className="mr-1"
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
|
<Icon name="Laptop" className="mr-1" />
|
||||||
|
)}
|
||||||
|
|
||||||
|
<span className="truncate">{node.metadata.name}</span>
|
||||||
|
</SidebarLink>
|
||||||
|
);
|
||||||
|
})}
|
||||||
<Tooltip label={t('devices_coming_soon_tooltip')} position="right">
|
<Tooltip label={t('devices_coming_soon_tooltip')} position="right">
|
||||||
<Button disabled={!import.meta.env.DEV}
|
<Button
|
||||||
onClick={() => dialogManager.create((dp) => (
|
disabled={!import.meta.env.DEV}
|
||||||
<AddDeviceDialog {...dp} />
|
onClick={() => dialogManager.create((dp) => <AddDeviceDialog {...dp} />)}
|
||||||
))}
|
variant="dotted"
|
||||||
variant="dotted"
|
className="mt-1 w-full opacity-70"
|
||||||
className="mt-1 w-full opacity-70"
|
>
|
||||||
>
|
{t('add_device')}
|
||||||
{t('add_device')}
|
</Button>
|
||||||
</Button>
|
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</Section>
|
</Section>
|
||||||
|
);
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue