xref: /expo/home/menu/DevMenuServerInfo.tsx (revision 5a02d672)
1import Constants from 'expo-constants';
2import { Row, View, Text, Spacer } from 'expo-dev-client-components';
3import React from 'react';
4import { StyleSheet } from 'react-native';
5
6import DevIndicator from '../components/DevIndicator';
7import FriendlyUrls from '../legacy/FriendlyUrls';
8
9type Props = {
10  task: { manifestUrl: string; manifestString: string };
11};
12
13export function DevMenuServerInfo({ task }: Props) {
14  const manifest = task.manifestString
15    ? (JSON.parse(task.manifestString) as typeof Constants.manifest | typeof Constants.manifest2)
16    : null;
17  const taskUrl = task.manifestUrl ? FriendlyUrls.toFriendlyString(task.manifestUrl) : '';
18  const devServerName =
19    manifest && 'extra' in manifest && manifest.extra?.expoGo?.developer
20      ? manifest.extra.expoGo.developer.tool
21      : null;
22
23  return (
24    <View bg="default" padding="medium">
25      {devServerName ? (
26        <>
27          <Text size="small" type="InterRegular">
28            Connected to {devServerName}
29          </Text>
30          <Spacer.Vertical size="tiny" />
31        </>
32      ) : null}
33      <Row align="center">
34        {devServerName ? (
35          <DevIndicator style={styles.taskDevServerIndicator} isActive isNetworkAvailable />
36        ) : null}
37        <Text type="InterRegular" size="medium" numberOfLines={1}>
38          {taskUrl}
39        </Text>
40      </Row>
41    </View>
42  );
43}
44
45const styles = StyleSheet.create({
46  taskDevServerIndicator: {
47    marginRight: 8,
48  },
49});
50