Page MenuHomePhabricator
Files F3368216

D7880.diff
No OneTemporary
Actions

D7880.diff
View Options

diff --git a/native/invite-links/invite-links-navigator.react.js b/native/invite-links/invite-links-navigator.react.js
--- a/native/invite-links/invite-links-navigator.react.js
+++ b/native/invite-links/invite-links-navigator.react.js
@@ -8,15 +8,18 @@
import * as React from 'react';
import { SafeAreaView } from 'react-native-safe-area-context';
+import ManagePublicLinkScreen from './manage-public-link-screen.react.js';
import ViewInviteLinksHeaderLeftButton from './view-invite-links-header-left-button.react.js';
import ViewInviteLinksHeaderTitle from './view-invite-links-header-title.react.js';
import ViewInviteLinksScreen from './view-invite-links-screen.react.js';
+import HeaderBackButton from '../navigation/header-back-button.react.js';
import { defaultStackScreenOptions } from '../navigation/options.js';
import type { RootNavigationProp } from '../navigation/root-navigator.react.js';
import {
type InviteLinkParamList,
ViewInviteLinksRouteName,
type ScreenParamList,
+ ManagePublicLinkRouteName,
} from '../navigation/route-names.js';
import { useColors, useStyles } from '../themes/colors.js';
@@ -42,6 +45,12 @@
headerBackTitleStyle: { marginLeft: 20 },
});
+const managePublicLinkOptions = {
+ headerTitle: 'Public Link',
+ headerBackTitleVisible: false,
+ headerLeft: HeaderBackButton,
+};
+
type Props = {
+navigation: RootNavigationProp<'InviteLinkNavigator'>,
...
@@ -68,6 +77,11 @@
component={ViewInviteLinksScreen}
options={viewInviteLinksOptions}
/>
+ <InviteLinksStack.Screen
+ name={ManagePublicLinkRouteName}
+ component={ManagePublicLinkScreen}
+ options={managePublicLinkOptions}
+ />
</InviteLinksStack.Navigator>
</SafeAreaView>
);
diff --git a/native/invite-links/manage-public-link-screen.react.js b/native/invite-links/manage-public-link-screen.react.js
new file mode 100644
--- /dev/null
+++ b/native/invite-links/manage-public-link-screen.react.js
@@ -0,0 +1,117 @@
+// @flow
+
+import * as React from 'react';
+import { Text, View } from 'react-native';
+
+import type { ThreadInfo } from 'lib/types/thread-types.js';
+
+import Button from '../components/button.react.js';
+import TextInput from '../components/text-input.react.js';
+import type { RootNavigationProp } from '../navigation/root-navigator.react.js';
+import type { NavigationRoute } from '../navigation/route-names.js';
+import { useStyles } from '../themes/colors.js';
+
+export type ManagePublicLinkScreenParams = {
+ +community: ThreadInfo,
+};
+
+type Props = {
+ +navigation: RootNavigationProp<'ManagePublicLink'>,
+ +route: NavigationRoute<'ManagePublicLink'>,
+};
+
+// eslint-disable-next-line no-unused-vars
+function ManagePublicLinkScreen(props: Props): React.Node {
+ const styles = useStyles(unboundStyles);
+
+ return (
+ <View>
+ <View style={styles.section}>
+ <Text style={styles.sectionText}>
+ Let your community be more accessible with your own unique public
+ link. By enabling a public link, you are allowing anyone who has your
+ link to join your community.{'\n\n'}
+ Editing your community’s public link allows other communities to claim
+ your previous URL.
+ </Text>
+ </View>
+ <Text style={styles.sectionTitle}>INVITE URL</Text>
+ <View style={styles.section}>
+ <View style={styles.inviteLink}>
+ <Text style={styles.inviteLinkPrefix}>https://comm.app/invite/</Text>
+ <TextInput style={styles.input} />
+ </View>
+ <Button
+ style={[styles.button, styles.buttonPrimary]}
+ onPress={() => {}}
+ >
+ <Text style={styles.buttonText}>Save & enable public link</Text>
+ </Button>
+ </View>
+ </View>
+ );
+}
+
+const unboundStyles = {
+ sectionTitle: {
+ fontSize: 14,
+ fontWeight: '400',
+ lineHeight: 20,
+ color: 'modalBackgroundLabel',
+ paddingHorizontal: 16,
+ paddingBottom: 4,
+ marginTop: 24,
+ },
+ section: {
+ borderBottomColor: 'modalSeparator',
+ borderBottomWidth: 1,
+ borderTopColor: 'modalSeparator',
+ borderTopWidth: 1,
+ backgroundColor: 'modalForeground',
+ padding: 16,
+ },
+ sectionText: {
+ fontSize: 14,
+ fontWeight: '400',
+ lineHeight: 22,
+ color: 'modalBackgroundLabel',
+ },
+ inviteLink: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ marginBottom: 16,
+ },
+ inviteLinkPrefix: {
+ fontSize: 14,
+ fontWeight: '400',
+ lineHeight: 22,
+ color: 'disabledButtonText',
+ marginRight: 2,
+ },
+ input: {
+ color: 'panelForegroundLabel',
+ borderColor: 'panelSecondaryForegroundBorder',
+ borderWidth: 1,
+ borderRadius: 8,
+ paddingVertical: 13,
+ paddingHorizontal: 16,
+ flex: 1,
+ },
+ button: {
+ borderRadius: 8,
+ paddingVertical: 12,
+ paddingHorizontal: 24,
+ },
+ buttonPrimary: {
+ backgroundColor: 'purpleButton',
+ },
+ buttonText: {
+ color: 'whiteText',
+ textAlign: 'center',
+ fontWeight: '500',
+ fontSize: 16,
+ lineHeight: 24,
+ },
+};
+
+export default ManagePublicLinkScreen;
diff --git a/native/navigation/route-names.js b/native/navigation/route-names.js
--- a/native/navigation/route-names.js
+++ b/native/navigation/route-names.js
@@ -29,6 +29,7 @@
import type { SubchannelListModalParams } from '../chat/subchannels-list-modal.react.js';
import type { TextMessageTooltipModalParams } from '../chat/text-message-tooltip-modal.react.js';
import type { TogglePinModalParams } from '../chat/toggle-pin-modal.react.js';
+import type { ManagePublicLinkScreenParams } from '../invite-links/manage-public-link-screen.react.js';
import type { ViewInviteLinksScreenParams } from '../invite-links/view-invite-links-screen.react.js';
import type { ChatCameraModalParams } from '../media/chat-camera-modal.react.js';
import type { ImageModalParams } from '../media/image-modal.react.js';
@@ -71,6 +72,7 @@
export const InviteLinkModalRouteName = 'InviteLinkModal';
export const InviteLinkNavigatorRouteName = 'InviteLinkNavigator';
export const LoggedOutModalRouteName = 'LoggedOutModal';
+export const ManagePublicLinkRouteName = 'ManagePublicLink';
export const MessageListRouteName = 'MessageList';
export const MessageReactionsModalRouteName = 'MessageReactionsModal';
export const MessageResultsScreenRouteName = 'MessageResultsScreen';
@@ -203,6 +205,7 @@
export type InviteLinkParamList = {
+ViewInviteLinks: ViewInviteLinksScreenParams,
+ +ManagePublicLink: ManagePublicLinkScreenParams,
};
export type ScreenParamList = {

File Metadata

Mime Type
text/plain
Expires
Tue, Nov 26, 6:43 PM (22 h, 28 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2585791
Default Alt Text
D7880.diff (6 KB)

Event Timeline