Page MenuHomePhabricator
Differential D8417

[web] Call update or create invite link endpoint
ClosedPublic
Actions

Authored by tomek on Jul 3 2023, 6:33 AM.
Tags
None
Referenced Files
Unknown Object (File)
Fri, Mar 28, 2:44 PM
Unknown Object (File)
Sun, Mar 23, 5:20 AM
Unknown Object (File)
Feb 28 2025, 11:15 AM
Unknown Object (File)
Feb 24 2025, 1:58 AM
Unknown Object (File)
Feb 20 2025, 4:30 AM
Unknown Object (File)
Feb 20 2025, 4:24 AM
Unknown Object (File)
Feb 14 2025, 2:28 PM
Unknown Object (File)
Feb 14 2025, 2:28 PM
View All Files
Subscribers
ashoat

Details

Reviewers
kamil
inka
bartek
Commits
rCOMM1c1c441933e7: [web] Call update or create invite link endpoint
Summary

Update or create a new link when a button is clicked.

https://www.figma.com/file/a1nkbWgbgjRlrOY9LVurTz/Comm-%2F-Desktop-app?node-id=11400%3A288456&mode=dev

web-invalid-link.png (1×1 px, 122 KB)

Depends on D8416

Test Plan

Check if creating new links works. Then, check if it is possible to update it.

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

tomek created this revision.Jul 3 2023, 6:33 AM
Herald added a subscriber: ashoat. · View Herald TranscriptJul 3 2023, 6:33 AM
tomek added a child revision: D8419: [web] Introduce disable link modal.Jul 3 2023, 6:39 AM
Harbormaster completed remote builds in B20686: Diff 28348.Jul 3 2023, 6:49 AM
tomek requested review of this revision.Jul 3 2023, 6:49 AM
inka accepted this revision.Jul 4 2023, 12:50 AM
inka added inline comments.
web/invite-links/manage/edit-link-modal.react.js
36–40 ↗(On Diff #28348)

Would be nice to see some screenshots if we are adding GUI elements

This revision is now accepted and ready to land.Jul 4 2023, 12:50 AM
tomek edited the summary of this revision. (Show Details)Jul 5 2023, 4:21 AM
tomek added inline comments.
web/invite-links/manage/edit-link-modal.react.js
36–40 ↗(On Diff #28348)

You're right! Updated a summary with it.

tomek updated this revision to Diff 28409.Jul 5 2023, 4:23 AM

Rebase

Harbormaster completed remote builds in B20736: Diff 28409.Jul 5 2023, 4:40 AM
tomek updated this revision to Diff 28437.Jul 6 2023, 7:08 AM

Rebase

Harbormaster completed remote builds in B20761: Diff 28437.Jul 6 2023, 7:25 AM
Closed by commit rCOMM1c1c441933e7: [web] Call update or create invite link endpoint (authored by tomek). · Explain WhyJul 10 2023, 5:49 AM
This revision was automatically updated to reflect the committed changes.
tomek added a commit: rCOMM1c1c441933e7: [web] Call update or create invite link endpoint.

Revision Contents
Changeset List

Diff 28541

View Options

web/invite-links/manage-invite-links-modal.react.js

// @flow // @flow
import Clipboard from '@react-native-clipboard/clipboard'; import Clipboard from '@react-native-clipboard/clipboard';
import * as React from 'react'; import * as React from 'react';
import { View, Text, TouchableOpacity } from 'react-native'; import { View, Text, TouchableOpacity } from 'react-native';
import type { AccountUserInfo } from 'lib/types/user-types'; import type { AccountUserInfo } from 'lib/types/user-types';
import sleep from 'lib/utils/sleep.js'; import sleep from 'lib/utils/sleep.js';
import SWMansionIcon from './swmansion-icon.react.js'; import SWMansionIcon from './swmansion-icon.react.js';
import UserAvatar from '../avatars/user-avatar.react.js'; import UserAvatar from '../avatars/user-avatar.react.js';
import { SingleLine } from '../components/single-line.react.js';
import { useStyles } from '../themes/colors.js'; import { useStyles } from '../themes/colors.js';
type Props = { type Props = {
+userInfo: AccountUserInfo, +userInfo: AccountUserInfo,
}; };
function UserProfile(props: Props): React.Node { function UserProfile(props: Props): React.Node {
const { userInfo } = props; const { userInfo } = props;
▲ Show 20 Lines • Show All 41 Lines • ▼ Show 20 Linesfunction UserProfile(props: Props): React.Node {
]); ]);
return ( return (
<View style={styles.container}> <View style={styles.container}>
<SWMansionIcon name="menu-vertical" size={24} style={styles.moreIcon} /> <SWMansionIcon name="menu-vertical" size={24} style={styles.moreIcon} />
<View style={styles.userInfoContainer}> <View style={styles.userInfoContainer}>
<UserAvatar size="profile" userID={userInfo.id} /> <UserAvatar size="profile" userID={userInfo.id} />
<View style={styles.usernameContainer}> <View style={styles.usernameContainer}>
<Text style={styles.usernameText}>{userInfo.username}</Text> <SingleLine style={styles.usernameText}>
{userInfo.username}
</SingleLine>
{copyUsernameButton} {copyUsernameButton}
</View> </View>
</View> </View>
</View> </View>
); );
} }
const unboundStyles = { const unboundStyles = {
container: { container: {
paddingHorizontal: 16, paddingHorizontal: 16,
}, },
moreIcon: { moreIcon: {
color: 'modalButtonLabel', color: 'modalButtonLabel',
alignSelf: 'flex-end', alignSelf: 'flex-end',
}, },
userInfoContainer: { userInfoContainer: {
flexDirection: 'row', flexDirection: 'row',
}, },
usernameContainer: { usernameContainer: {
flex: 1,
justifyContent: 'center', justifyContent: 'center',
alignItems: 'flex-start',
paddingLeft: 16, paddingLeft: 16,
}, },
usernameText: { usernameText: {
color: 'modalForegroundLabel', color: 'modalForegroundLabel',
fontSize: 18, fontSize: 18,
fontWeight: '500', fontWeight: '500',
}, },
copyUsernameContainer: { copyUsernameContainer: {
Show All 15 Lines
View Options

web/invite-links/manage/edit-link-modal.react.js

// @flow // @flow
import Clipboard from '@react-native-clipboard/clipboard'; import Clipboard from '@react-native-clipboard/clipboard';
import * as React from 'react'; import * as React from 'react';
import { View, Text, TouchableOpacity } from 'react-native'; import { View, Text, TouchableOpacity } from 'react-native';
import type { AccountUserInfo } from 'lib/types/user-types'; import type { AccountUserInfo } from 'lib/types/user-types';
import sleep from 'lib/utils/sleep.js'; import sleep from 'lib/utils/sleep.js';
import SWMansionIcon from './swmansion-icon.react.js'; import SWMansionIcon from './swmansion-icon.react.js';
import UserAvatar from '../avatars/user-avatar.react.js'; import UserAvatar from '../avatars/user-avatar.react.js';
import { SingleLine } from '../components/single-line.react.js';
import { useStyles } from '../themes/colors.js'; import { useStyles } from '../themes/colors.js';
type Props = { type Props = {
+userInfo: AccountUserInfo, +userInfo: AccountUserInfo,
}; };
function UserProfile(props: Props): React.Node { function UserProfile(props: Props): React.Node {
const { userInfo } = props; const { userInfo } = props;
▲ Show 20 Lines • Show All 41 Lines • ▼ Show 20 Linesfunction UserProfile(props: Props): React.Node {
]); ]);
return ( return (
<View style={styles.container}> <View style={styles.container}>
<SWMansionIcon name="menu-vertical" size={24} style={styles.moreIcon} /> <SWMansionIcon name="menu-vertical" size={24} style={styles.moreIcon} />
<View style={styles.userInfoContainer}> <View style={styles.userInfoContainer}>
<UserAvatar size="profile" userID={userInfo.id} /> <UserAvatar size="profile" userID={userInfo.id} />
<View style={styles.usernameContainer}> <View style={styles.usernameContainer}>
<Text style={styles.usernameText}>{userInfo.username}</Text> <SingleLine style={styles.usernameText}>
{userInfo.username}
</SingleLine>
{copyUsernameButton} {copyUsernameButton}
</View> </View>
</View> </View>
</View> </View>
); );
} }
const unboundStyles = { const unboundStyles = {
container: { container: {
paddingHorizontal: 16, paddingHorizontal: 16,
}, },
moreIcon: { moreIcon: {
color: 'modalButtonLabel', color: 'modalButtonLabel',
alignSelf: 'flex-end', alignSelf: 'flex-end',
}, },
userInfoContainer: { userInfoContainer: {
flexDirection: 'row', flexDirection: 'row',
}, },
usernameContainer: { usernameContainer: {
flex: 1,
justifyContent: 'center', justifyContent: 'center',
alignItems: 'flex-start',
paddingLeft: 16, paddingLeft: 16,
}, },
usernameText: { usernameText: {
color: 'modalForegroundLabel', color: 'modalForegroundLabel',
fontSize: 18, fontSize: 18,
fontWeight: '500', fontWeight: '500',
}, },
copyUsernameContainer: { copyUsernameContainer: {
Show All 15 Lines
View Options

web/invite-links/manage/manage-invite-links-modal.css

// @flow // @flow
import Clipboard from '@react-native-clipboard/clipboard'; import Clipboard from '@react-native-clipboard/clipboard';
import * as React from 'react'; import * as React from 'react';
import { View, Text, TouchableOpacity } from 'react-native'; import { View, Text, TouchableOpacity } from 'react-native';
import type { AccountUserInfo } from 'lib/types/user-types'; import type { AccountUserInfo } from 'lib/types/user-types';
import sleep from 'lib/utils/sleep.js'; import sleep from 'lib/utils/sleep.js';
import SWMansionIcon from './swmansion-icon.react.js'; import SWMansionIcon from './swmansion-icon.react.js';
import UserAvatar from '../avatars/user-avatar.react.js'; import UserAvatar from '../avatars/user-avatar.react.js';
import { SingleLine } from '../components/single-line.react.js';
import { useStyles } from '../themes/colors.js'; import { useStyles } from '../themes/colors.js';
type Props = { type Props = {
+userInfo: AccountUserInfo, +userInfo: AccountUserInfo,
}; };
function UserProfile(props: Props): React.Node { function UserProfile(props: Props): React.Node {
const { userInfo } = props; const { userInfo } = props;
▲ Show 20 Lines • Show All 41 Lines • ▼ Show 20 Linesfunction UserProfile(props: Props): React.Node {
]); ]);
return ( return (
<View style={styles.container}> <View style={styles.container}>
<SWMansionIcon name="menu-vertical" size={24} style={styles.moreIcon} /> <SWMansionIcon name="menu-vertical" size={24} style={styles.moreIcon} />
<View style={styles.userInfoContainer}> <View style={styles.userInfoContainer}>
<UserAvatar size="profile" userID={userInfo.id} /> <UserAvatar size="profile" userID={userInfo.id} />
<View style={styles.usernameContainer}> <View style={styles.usernameContainer}>
<Text style={styles.usernameText}>{userInfo.username}</Text> <SingleLine style={styles.usernameText}>
{userInfo.username}
</SingleLine>
{copyUsernameButton} {copyUsernameButton}
</View> </View>
</View> </View>
</View> </View>
); );
} }
const unboundStyles = { const unboundStyles = {
container: { container: {
paddingHorizontal: 16, paddingHorizontal: 16,
}, },
moreIcon: { moreIcon: {
color: 'modalButtonLabel', color: 'modalButtonLabel',
alignSelf: 'flex-end', alignSelf: 'flex-end',
}, },
userInfoContainer: { userInfoContainer: {
flexDirection: 'row', flexDirection: 'row',
}, },
usernameContainer: { usernameContainer: {
flex: 1,
justifyContent: 'center', justifyContent: 'center',
alignItems: 'flex-start',
paddingLeft: 16, paddingLeft: 16,
}, },
usernameText: { usernameText: {
color: 'modalForegroundLabel', color: 'modalForegroundLabel',
fontSize: 18, fontSize: 18,
fontWeight: '500', fontWeight: '500',
}, },
copyUsernameContainer: { copyUsernameContainer: {
Show All 15 Lines