Page MenuHomePhabricator
Differential D8307

[web] Add manage invite links menu item
ClosedPublic
Actions

Authored by tomek on Jun 23 2023, 8:52 AM.
Tags
None
Referenced Files
Unknown Object (File)
Sat, Mar 15, 5:59 PM
Unknown Object (File)
Wed, Mar 12, 11:23 PM
Unknown Object (File)
Mon, Mar 10, 3:33 PM
Unknown Object (File)
Thu, Mar 6, 5:08 PM
Unknown Object (File)
Thu, Mar 6, 5:07 PM
Unknown Object (File)
Thu, Mar 6, 5:07 PM
Unknown Object (File)
Thu, Mar 6, 5:07 PM
Unknown Object (File)
Thu, Mar 6, 5:00 PM
View All Files
Subscribers
ashoat

Details

Reviewers
bartek
kamil
inka
ashoat
Commits
rCOMM518cd63dd905: [web] Add manage invite links menu item
Summary

The new item is displayed conditionally based on the permissions and uses an SVG icon.

menu-text.png (288×454 px, 20 KB)

Depends on D8306

Test Plan

Check if the new item is displayed for communities where user has permission.
Check if invite link button is displayed only when invite link exists.
Check if three dots button is displayed only when there's a menu item.

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

tomek created this revision.Jun 23 2023, 8:52 AM
Herald added a subscriber: ashoat. · View Herald TranscriptJun 23 2023, 8:52 AM
tomek edited the summary of this revision. (Show Details)Jun 23 2023, 8:53 AM
Harbormaster returned this revision to the author for changes because remote builds failed.Jun 23 2023, 9:14 AM
Harbormaster failed remote builds in B20472: Diff 28054!
Harbormaster completed remote builds in B20472: Diff 28054.Jun 26 2023, 4:13 AM
tomek requested review of this revision.Jun 26 2023, 4:13 AM
inka added a comment.Jun 26 2023, 6:10 AM

Shouldn't we return null when items is an empty array, as before?

inka accepted this revision.Jun 27 2023, 1:11 AM

Shouldn't we return null when items is an empty array, as before?

We discussed this offline and the code doesn't need to be changed. The menu button will not render because Menu component makes sure of that, but the container will, which allows for all long community names to end in the same place (whether the button is present or not), as had been requested in the designs.

This revision is now accepted and ready to land.Jun 27 2023, 1:11 AM
tomek added a reviewer: ashoat.Jun 29 2023, 6:00 AM
This revision now requires review to proceed.Jun 29 2023, 6:00 AM
tomek added inline comments.Jun 29 2023, 6:01 AM
web/invite-links/invite-links-menu.react.js
51 ↗(On Diff #28054)

I guess we should be consistent with native and use Manage invite links

ashoat accepted this revision.Jul 2 2023, 1:43 PM
ashoat added inline comments.
web/invite-links/invite-links-menu.react.js
51 ↗(On Diff #28054)

Yes please!

59 ↗(On Diff #28054)

This should just be "Invite link"

This revision is now accepted and ready to land.Jul 2 2023, 1:43 PM
tomek updated this revision to Diff 28341.Jul 3 2023, 4:37 AM

Update menu text

tomek edited the summary of this revision. (Show Details)Jul 3 2023, 4:37 AM
Harbormaster completed remote builds in B20679: Diff 28341.Jul 3 2023, 4:54 AM
tomek added a child revision: D8412: [web] Extract copy link button.Jul 3 2023, 4:54 AM
Closed by commit rCOMM518cd63dd905: [web] Add manage invite links menu item (authored by tomek). · Explain WhyJul 10 2023, 5:48 AM
This revision was automatically updated to reflect the committed changes.
tomek added a commit: rCOMM518cd63dd905: [web] Add manage invite links menu item.

Revision Contents
Changeset List

PathSize
web/
invite-links/
1 line
67 lines
23 lines

Diff 28535

View Options

web/invite-links/invite-links-menu.css

Show First 20 Lines • Show All 113 Lines • ▼ Show 20 Lines () =>
tab: 'chat', tab: 'chat',
}; };
dispatch({ type: updateNavInfoActionType, payload }); dispatch({ type: updateNavInfoActionType, payload });
}, },
), ),
[dispatch], [dispatch],
); );
// Handle invalid device token
const localToken = useSelector(
state => state.tunnelbrokerDeviceToken.localToken,
);
const prevLocalToken = React.useRef(localToken);
React.useEffect(() => {
if (prevLocalToken.current && !localToken) {
electron?.fetchDeviceToken?.();
}
prevLocalToken.current = localToken;
}, [localToken]);
} }
function useCreatePushSubscription(): () => Promise<void> { function useCreatePushSubscription(): () => Promise<void> {
const publicKey = useSelector(state => state.pushApiPublicKey); const publicKey = useSelector(state => state.pushApiPublicKey);
const dispatchActionPromise = useDispatchActionPromise(); const dispatchActionPromise = useDispatchActionPromise();
const callSetDeviceToken = useSetDeviceTokenFanout(); const callSetDeviceToken = useSetDeviceTokenFanout();
const staffCanSee = useStaffCanSee(); const staffCanSee = useStaffCanSee();
▲ Show 20 Lines • Show All 136 Lines • ▼ Show 20 Lines const callback = (event: MessageEvent) => {
} }
}; };
navigator.serviceWorker.addEventListener('message', callback); navigator.serviceWorker.addEventListener('message', callback);
return () => return () =>
navigator.serviceWorker?.removeEventListener('message', callback); navigator.serviceWorker?.removeEventListener('message', callback);
}, [dispatch, supported]); }, [dispatch, supported]);
// Handle invalid device token
const localToken = useSelector(
state => state.tunnelbrokerDeviceToken.localToken,
);
const prevLocalToken = React.useRef(localToken);
React.useEffect(() => {
if (
!navigator.serviceWorker ||
!supported ||
Notification.permission !== 'granted'
) {
return;
}
if (prevLocalToken.current && !localToken) {
void createPushSubscription();
}
prevLocalToken.current = localToken;
}, [createPushSubscription, localToken, supported]);
return null; return null;
} }
export { PushNotificationsHandler, useCreatePushSubscription }; export { PushNotificationsHandler, useCreatePushSubscription };
View Options

web/invite-links/invite-links-menu.react.js

Show First 20 Lines • Show All 113 Lines • ▼ Show 20 Lines () =>
tab: 'chat', tab: 'chat',
}; };
dispatch({ type: updateNavInfoActionType, payload }); dispatch({ type: updateNavInfoActionType, payload });
}, },
), ),
[dispatch], [dispatch],
); );
// Handle invalid device token
const localToken = useSelector(
state => state.tunnelbrokerDeviceToken.localToken,
);
const prevLocalToken = React.useRef(localToken);
React.useEffect(() => {
if (prevLocalToken.current && !localToken) {
electron?.fetchDeviceToken?.();
}
prevLocalToken.current = localToken;
}, [localToken]);
} }
function useCreatePushSubscription(): () => Promise<void> { function useCreatePushSubscription(): () => Promise<void> {
const publicKey = useSelector(state => state.pushApiPublicKey); const publicKey = useSelector(state => state.pushApiPublicKey);
const dispatchActionPromise = useDispatchActionPromise(); const dispatchActionPromise = useDispatchActionPromise();
const callSetDeviceToken = useSetDeviceTokenFanout(); const callSetDeviceToken = useSetDeviceTokenFanout();
const staffCanSee = useStaffCanSee(); const staffCanSee = useStaffCanSee();
▲ Show 20 Lines • Show All 136 Lines • ▼ Show 20 Lines const callback = (event: MessageEvent) => {
} }
}; };
navigator.serviceWorker.addEventListener('message', callback); navigator.serviceWorker.addEventListener('message', callback);
return () => return () =>
navigator.serviceWorker?.removeEventListener('message', callback); navigator.serviceWorker?.removeEventListener('message', callback);
}, [dispatch, supported]); }, [dispatch, supported]);
// Handle invalid device token
const localToken = useSelector(
state => state.tunnelbrokerDeviceToken.localToken,
);
const prevLocalToken = React.useRef(localToken);
React.useEffect(() => {
if (
!navigator.serviceWorker ||
!supported ||
Notification.permission !== 'granted'
) {
return;
}
if (prevLocalToken.current && !localToken) {
void createPushSubscription();
}
prevLocalToken.current = localToken;
}, [createPushSubscription, localToken, supported]);
return null; return null;
} }
export { PushNotificationsHandler, useCreatePushSubscription }; export { PushNotificationsHandler, useCreatePushSubscription };
View Options

web/vectors.react.js

Show First 20 Lines • Show All 113 Lines • ▼ Show 20 Lines () =>
tab: 'chat', tab: 'chat',
}; };
dispatch({ type: updateNavInfoActionType, payload }); dispatch({ type: updateNavInfoActionType, payload });
}, },
), ),
[dispatch], [dispatch],
); );
// Handle invalid device token
const localToken = useSelector(
state => state.tunnelbrokerDeviceToken.localToken,
);
const prevLocalToken = React.useRef(localToken);
React.useEffect(() => {
if (prevLocalToken.current && !localToken) {
electron?.fetchDeviceToken?.();
}
prevLocalToken.current = localToken;
}, [localToken]);
} }
function useCreatePushSubscription(): () => Promise<void> { function useCreatePushSubscription(): () => Promise<void> {
const publicKey = useSelector(state => state.pushApiPublicKey); const publicKey = useSelector(state => state.pushApiPublicKey);
const dispatchActionPromise = useDispatchActionPromise(); const dispatchActionPromise = useDispatchActionPromise();
const callSetDeviceToken = useSetDeviceTokenFanout(); const callSetDeviceToken = useSetDeviceTokenFanout();
const staffCanSee = useStaffCanSee(); const staffCanSee = useStaffCanSee();
▲ Show 20 Lines • Show All 136 Lines • ▼ Show 20 Lines const callback = (event: MessageEvent) => {
} }
}; };
navigator.serviceWorker.addEventListener('message', callback); navigator.serviceWorker.addEventListener('message', callback);
return () => return () =>
navigator.serviceWorker?.removeEventListener('message', callback); navigator.serviceWorker?.removeEventListener('message', callback);
}, [dispatch, supported]); }, [dispatch, supported]);
// Handle invalid device token
const localToken = useSelector(
state => state.tunnelbrokerDeviceToken.localToken,
);
const prevLocalToken = React.useRef(localToken);
React.useEffect(() => {
if (
!navigator.serviceWorker ||
!supported ||
Notification.permission !== 'granted'
) {
return;
}
if (prevLocalToken.current && !localToken) {
void createPushSubscription();
}
prevLocalToken.current = localToken;
}, [createPushSubscription, localToken, supported]);
return null; return null;
} }
export { PushNotificationsHandler, useCreatePushSubscription }; export { PushNotificationsHandler, useCreatePushSubscription };