Page MenuHomePhabricator
Differential D8237

[web] Display invite links button conditionally
ClosedPublic
Actions

Authored by tomek on Jun 16 2023, 4:28 AM.
Tags
None
Referenced Files
Unknown Object (File)
Sat, Mar 15, 5:59 PM
Unknown Object (File)
Mon, Mar 10, 1:53 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
Unknown Object (File)
Mon, Mar 3, 3:23 PM
Unknown Object (File)
Thu, Feb 20, 4:24 AM
View All 90 Files
Subscribers
ashoat

Details

Reviewers
bartek
kamil
inka
Commits
rCOMM93563ab25e43: [web] Display invite links button conditionally
Summary

When a community has invite link, we display it next to the community in the drawer. We're using our Menu component in a new variant.

invite-button-web.png (504×826 px, 55 KB)

Depends on D8236

Test Plan

Check if button is displayed only for communities with invite links and if clicking it results in menu being shown.

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

tomek created this revision.Jun 16 2023, 4:28 AM
Herald added a subscriber: ashoat. · View Herald TranscriptJun 16 2023, 4:28 AM
tomek edited the summary of this revision. (Show Details)Jun 16 2023, 4:29 AM
tomek added a child revision: D8238: [web] Create link view modal.Jun 16 2023, 4:31 AM
Harbormaster completed remote builds in B20308: Diff 27831.Jun 16 2023, 4:45 AM
tomek requested review of this revision.Jun 16 2023, 4:45 AM
kamil accepted this revision.Jun 19 2023, 2:59 AM
This revision is now accepted and ready to land.Jun 19 2023, 2:59 AM
tomek added a child revision: D8292: [lib][native] Extract invite link url.Jun 22 2023, 7:20 AM
tomek removed a child revision: D8238: [web] Create link view modal.Jun 22 2023, 7:21 AM
tomek added a child revision: D8238: [web] Create link view modal.Jun 22 2023, 7:24 AM
tomek removed a child revision: D8238: [web] Create link view modal.Jun 22 2023, 7:27 AM
Closed by commit rCOMM93563ab25e43: [web] Display invite links button conditionally (authored by tomek). · Explain WhyJun 26 2023, 6:04 AM
This revision was automatically updated to reflect the committed changes.
tomek added a commit: rCOMM93563ab25e43: [web] Display invite links button conditionally.

Revision Contents
Changeset List

PathSize
web/
components/
7 lines
3 lines
invite-links/
3 lines
38 lines
sidebar/
2 lines

Diff 28105

View Options

web/components/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/components/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/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/sidebar/community-drawer-item-community.react.js

Loading...