Page MenuHomePhabricator
Differential D8414

[web] Split modal into multiple components
ClosedPublic
Actions

Authored by tomek on Jul 3 2023, 5:07 AM.
Tags
None
Referenced Files
Unknown Object (File)
Wed, Mar 19, 2:32 PM
Unknown Object (File)
Wed, Mar 19, 11:50 AM
Unknown Object (File)
Tue, Mar 18, 8:57 PM
Unknown Object (File)
Sat, Mar 15, 5:58 PM
Unknown Object (File)
Wed, Mar 12, 10:08 AM
Unknown Object (File)
Thu, Mar 6, 5:08 PM
Unknown Object (File)
Thu, Mar 6, 5:08 PM
Unknown Object (File)
Thu, Mar 6, 5:08 PM
View All Files
Subscribers
ashoat

Details

Reviewers
kamil
inka
bartek
Commits
rCOMMb3529340de90: [web] Split modal into multiple components
Summary

Manage links modal is complicated so it makes sense to split it into multiple components. Following diffs will introduce new components that are conditionally displayed.

Depends on D8413

Test Plan

This is only a refactoring. Tested if the modal still works.

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

tomek created this revision.Jul 3 2023, 5:07 AM
Herald added a subscriber: ashoat. · View Herald TranscriptJul 3 2023, 5:07 AM
tomek added a child revision: D8415: [web] Introduce edit link modal.Jul 3 2023, 5:12 AM
Harbormaster completed remote builds in B20682: Diff 28344.Jul 3 2023, 5:25 AM
tomek requested review of this revision.Jul 3 2023, 5:25 AM
inka accepted this revision.Jul 4 2023, 12:23 AM
This revision is now accepted and ready to land.Jul 4 2023, 12:23 AM
ashoat added inline comments.Jul 4 2023, 5:48 PM
web/invite-links/manage/existing-link-content.react.js
28 ↗(On Diff #28344)

I know this is a refactor, but it seems like we're using spaces for padding

tomek added inline comments.Jul 5 2023, 3:23 AM
web/invite-links/manage/existing-link-content.react.js
28 ↗(On Diff #28344)

If we decide to update the approach, I'll update both diffs. Let's discuss it in https://phab.comm.dev/D8413#inline-54087

tomek updated this revision to Diff 28435.Jul 6 2023, 6:58 AM

Rebase

Harbormaster completed remote builds in B20759: Diff 28435.Jul 6 2023, 7:15 AM
Closed by commit rCOMMb3529340de90: [web] Split modal into multiple components (authored by tomek). · Explain WhyJul 10 2023, 5:48 AM
This revision was automatically updated to reflect the committed changes.
tomek added a commit: rCOMMb3529340de90: [web] Split modal into multiple components.

Revision Contents
Changeset List

Diff 28538

View Options

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

Show First 20 Lines • Show All 526 Lines • ▼ Show 20 Lines tShape<SIWEAuthRequest>({
signature: t.String, signature: t.String,
message: t.String, message: t.String,
calendarQuery: entryQueryInputValidator, calendarQuery: entryQueryInputValidator,
deviceTokenUpdateRequest: t.maybe(deviceTokenUpdateRequestInputValidator), deviceTokenUpdateRequest: t.maybe(deviceTokenUpdateRequestInputValidator),
platformDetails: tPlatformDetails, platformDetails: tPlatformDetails,
watchedIDs: t.list(tID), watchedIDs: t.list(tID),
signedIdentityKeysBlob: t.maybe(signedIdentityKeysBlobValidator), signedIdentityKeysBlob: t.maybe(signedIdentityKeysBlobValidator),
initialNotificationsEncryptedMessage: t.maybe(t.String), initialNotificationsEncryptedMessage: t.maybe(t.String),
doNotRegister: t.maybe(t.Boolean),
}); });
async function siweAuthResponder( async function siweAuthResponder(
viewer: Viewer, viewer: Viewer,
request: SIWEAuthRequest, request: SIWEAuthRequest,
): Promise<LogInResponse> { ): Promise<LogInResponse> {
const { const {
message, message,
signature, signature,
deviceTokenUpdateRequest, deviceTokenUpdateRequest,
platformDetails, platformDetails,
signedIdentityKeysBlob, signedIdentityKeysBlob,
initialNotificationsEncryptedMessage, initialNotificationsEncryptedMessage,
doNotRegister,
} = request; } = request;
const calendarQuery = normalizeCalendarQuery(request.calendarQuery); const calendarQuery = normalizeCalendarQuery(request.calendarQuery);
// 1. Ensure that `message` is a well formed Comm SIWE Auth message. // 1. Ensure that `message` is a well formed Comm SIWE Auth message.
const siweMessage: SIWEMessage = new SiweMessage(message); const siweMessage: SIWEMessage = new SiweMessage(message);
if (!isValidSIWEMessage(siweMessage)) { if (!isValidSIWEMessage(siweMessage)) {
throw new ServerError('invalid_parameters'); throw new ServerError('invalid_parameters');
} }
▲ Show 20 Lines • Show All 72 Lines • ▼ Show 20 Lines): Promise<LogInResponse> {
const socialProof: SIWESocialProof = { const socialProof: SIWESocialProof = {
siweMessage: siweMessage.toMessage(), siweMessage: siweMessage.toMessage(),
siweMessageSignature: signature, siweMessageSignature: signature,
}; };
// 8. Create account with call to `processSIWEAccountCreation(...)` // 8. Create account with call to `processSIWEAccountCreation(...)`
// if address does not correspond to an existing user. // if address does not correspond to an existing user.
let userID = await fetchUserIDForEthereumAddress(siweMessage.address); let userID = await fetchUserIDForEthereumAddress(siweMessage.address);
if (!userID) { if (!userID && doNotRegister) {
throw new ServerError('account_does_not_exist');
} else if (!userID) {
const siweAccountCreationRequest = { const siweAccountCreationRequest = {
address: siweMessage.address, address: siweMessage.address,
calendarQuery, calendarQuery,
deviceTokenUpdateRequest, deviceTokenUpdateRequest,
platformDetails, platformDetails,
socialProof, socialProof,
}; };
userID = await processSIWEAccountCreation( userID = await processSIWEAccountCreation(
▲ Show 20 Lines • Show All 99 Lines • Show Last 20 Lines
View Options

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

Show First 20 Lines • Show All 526 Lines • ▼ Show 20 Lines tShape<SIWEAuthRequest>({
signature: t.String, signature: t.String,
message: t.String, message: t.String,
calendarQuery: entryQueryInputValidator, calendarQuery: entryQueryInputValidator,
deviceTokenUpdateRequest: t.maybe(deviceTokenUpdateRequestInputValidator), deviceTokenUpdateRequest: t.maybe(deviceTokenUpdateRequestInputValidator),
platformDetails: tPlatformDetails, platformDetails: tPlatformDetails,
watchedIDs: t.list(tID), watchedIDs: t.list(tID),
signedIdentityKeysBlob: t.maybe(signedIdentityKeysBlobValidator), signedIdentityKeysBlob: t.maybe(signedIdentityKeysBlobValidator),
initialNotificationsEncryptedMessage: t.maybe(t.String), initialNotificationsEncryptedMessage: t.maybe(t.String),
doNotRegister: t.maybe(t.Boolean),
}); });
async function siweAuthResponder( async function siweAuthResponder(
viewer: Viewer, viewer: Viewer,
request: SIWEAuthRequest, request: SIWEAuthRequest,
): Promise<LogInResponse> { ): Promise<LogInResponse> {
const { const {
message, message,
signature, signature,
deviceTokenUpdateRequest, deviceTokenUpdateRequest,
platformDetails, platformDetails,
signedIdentityKeysBlob, signedIdentityKeysBlob,
initialNotificationsEncryptedMessage, initialNotificationsEncryptedMessage,
doNotRegister,
} = request; } = request;
const calendarQuery = normalizeCalendarQuery(request.calendarQuery); const calendarQuery = normalizeCalendarQuery(request.calendarQuery);
// 1. Ensure that `message` is a well formed Comm SIWE Auth message. // 1. Ensure that `message` is a well formed Comm SIWE Auth message.
const siweMessage: SIWEMessage = new SiweMessage(message); const siweMessage: SIWEMessage = new SiweMessage(message);
if (!isValidSIWEMessage(siweMessage)) { if (!isValidSIWEMessage(siweMessage)) {
throw new ServerError('invalid_parameters'); throw new ServerError('invalid_parameters');
} }
▲ Show 20 Lines • Show All 72 Lines • ▼ Show 20 Lines): Promise<LogInResponse> {
const socialProof: SIWESocialProof = { const socialProof: SIWESocialProof = {
siweMessage: siweMessage.toMessage(), siweMessage: siweMessage.toMessage(),
siweMessageSignature: signature, siweMessageSignature: signature,
}; };
// 8. Create account with call to `processSIWEAccountCreation(...)` // 8. Create account with call to `processSIWEAccountCreation(...)`
// if address does not correspond to an existing user. // if address does not correspond to an existing user.
let userID = await fetchUserIDForEthereumAddress(siweMessage.address); let userID = await fetchUserIDForEthereumAddress(siweMessage.address);
if (!userID) { if (!userID && doNotRegister) {
throw new ServerError('account_does_not_exist');
} else if (!userID) {
const siweAccountCreationRequest = { const siweAccountCreationRequest = {
address: siweMessage.address, address: siweMessage.address,
calendarQuery, calendarQuery,
deviceTokenUpdateRequest, deviceTokenUpdateRequest,
platformDetails, platformDetails,
socialProof, socialProof,
}; };
userID = await processSIWEAccountCreation( userID = await processSIWEAccountCreation(
▲ Show 20 Lines • Show All 99 Lines • Show Last 20 Lines
View Options

web/invite-links/manage/empty-link-content.react.js

Show First 20 Lines • Show All 526 Lines • ▼ Show 20 Lines tShape<SIWEAuthRequest>({
signature: t.String, signature: t.String,
message: t.String, message: t.String,
calendarQuery: entryQueryInputValidator, calendarQuery: entryQueryInputValidator,
deviceTokenUpdateRequest: t.maybe(deviceTokenUpdateRequestInputValidator), deviceTokenUpdateRequest: t.maybe(deviceTokenUpdateRequestInputValidator),
platformDetails: tPlatformDetails, platformDetails: tPlatformDetails,
watchedIDs: t.list(tID), watchedIDs: t.list(tID),
signedIdentityKeysBlob: t.maybe(signedIdentityKeysBlobValidator), signedIdentityKeysBlob: t.maybe(signedIdentityKeysBlobValidator),
initialNotificationsEncryptedMessage: t.maybe(t.String), initialNotificationsEncryptedMessage: t.maybe(t.String),
doNotRegister: t.maybe(t.Boolean),
}); });
async function siweAuthResponder( async function siweAuthResponder(
viewer: Viewer, viewer: Viewer,
request: SIWEAuthRequest, request: SIWEAuthRequest,
): Promise<LogInResponse> { ): Promise<LogInResponse> {
const { const {
message, message,
signature, signature,
deviceTokenUpdateRequest, deviceTokenUpdateRequest,
platformDetails, platformDetails,
signedIdentityKeysBlob, signedIdentityKeysBlob,
initialNotificationsEncryptedMessage, initialNotificationsEncryptedMessage,
doNotRegister,
} = request; } = request;
const calendarQuery = normalizeCalendarQuery(request.calendarQuery); const calendarQuery = normalizeCalendarQuery(request.calendarQuery);
// 1. Ensure that `message` is a well formed Comm SIWE Auth message. // 1. Ensure that `message` is a well formed Comm SIWE Auth message.
const siweMessage: SIWEMessage = new SiweMessage(message); const siweMessage: SIWEMessage = new SiweMessage(message);
if (!isValidSIWEMessage(siweMessage)) { if (!isValidSIWEMessage(siweMessage)) {
throw new ServerError('invalid_parameters'); throw new ServerError('invalid_parameters');
} }
▲ Show 20 Lines • Show All 72 Lines • ▼ Show 20 Lines): Promise<LogInResponse> {
const socialProof: SIWESocialProof = { const socialProof: SIWESocialProof = {
siweMessage: siweMessage.toMessage(), siweMessage: siweMessage.toMessage(),
siweMessageSignature: signature, siweMessageSignature: signature,
}; };
// 8. Create account with call to `processSIWEAccountCreation(...)` // 8. Create account with call to `processSIWEAccountCreation(...)`
// if address does not correspond to an existing user. // if address does not correspond to an existing user.
let userID = await fetchUserIDForEthereumAddress(siweMessage.address); let userID = await fetchUserIDForEthereumAddress(siweMessage.address);
if (!userID) { if (!userID && doNotRegister) {
throw new ServerError('account_does_not_exist');
} else if (!userID) {
const siweAccountCreationRequest = { const siweAccountCreationRequest = {
address: siweMessage.address, address: siweMessage.address,
calendarQuery, calendarQuery,
deviceTokenUpdateRequest, deviceTokenUpdateRequest,
platformDetails, platformDetails,
socialProof, socialProof,
}; };
userID = await processSIWEAccountCreation( userID = await processSIWEAccountCreation(
▲ Show 20 Lines • Show All 99 Lines • Show Last 20 Lines
View Options

web/invite-links/manage/existing-link-content.react.js

Show First 20 Lines • Show All 526 Lines • ▼ Show 20 Lines tShape<SIWEAuthRequest>({
signature: t.String, signature: t.String,
message: t.String, message: t.String,
calendarQuery: entryQueryInputValidator, calendarQuery: entryQueryInputValidator,
deviceTokenUpdateRequest: t.maybe(deviceTokenUpdateRequestInputValidator), deviceTokenUpdateRequest: t.maybe(deviceTokenUpdateRequestInputValidator),
platformDetails: tPlatformDetails, platformDetails: tPlatformDetails,
watchedIDs: t.list(tID), watchedIDs: t.list(tID),
signedIdentityKeysBlob: t.maybe(signedIdentityKeysBlobValidator), signedIdentityKeysBlob: t.maybe(signedIdentityKeysBlobValidator),
initialNotificationsEncryptedMessage: t.maybe(t.String), initialNotificationsEncryptedMessage: t.maybe(t.String),
doNotRegister: t.maybe(t.Boolean),
}); });
async function siweAuthResponder( async function siweAuthResponder(
viewer: Viewer, viewer: Viewer,
request: SIWEAuthRequest, request: SIWEAuthRequest,
): Promise<LogInResponse> { ): Promise<LogInResponse> {
const { const {
message, message,
signature, signature,
deviceTokenUpdateRequest, deviceTokenUpdateRequest,
platformDetails, platformDetails,
signedIdentityKeysBlob, signedIdentityKeysBlob,
initialNotificationsEncryptedMessage, initialNotificationsEncryptedMessage,
doNotRegister,
} = request; } = request;
const calendarQuery = normalizeCalendarQuery(request.calendarQuery); const calendarQuery = normalizeCalendarQuery(request.calendarQuery);
// 1. Ensure that `message` is a well formed Comm SIWE Auth message. // 1. Ensure that `message` is a well formed Comm SIWE Auth message.
const siweMessage: SIWEMessage = new SiweMessage(message); const siweMessage: SIWEMessage = new SiweMessage(message);
if (!isValidSIWEMessage(siweMessage)) { if (!isValidSIWEMessage(siweMessage)) {
throw new ServerError('invalid_parameters'); throw new ServerError('invalid_parameters');
} }
▲ Show 20 Lines • Show All 72 Lines • ▼ Show 20 Lines): Promise<LogInResponse> {
const socialProof: SIWESocialProof = { const socialProof: SIWESocialProof = {
siweMessage: siweMessage.toMessage(), siweMessage: siweMessage.toMessage(),
siweMessageSignature: signature, siweMessageSignature: signature,
}; };
// 8. Create account with call to `processSIWEAccountCreation(...)` // 8. Create account with call to `processSIWEAccountCreation(...)`
// if address does not correspond to an existing user. // if address does not correspond to an existing user.
let userID = await fetchUserIDForEthereumAddress(siweMessage.address); let userID = await fetchUserIDForEthereumAddress(siweMessage.address);
if (!userID) { if (!userID && doNotRegister) {
throw new ServerError('account_does_not_exist');
} else if (!userID) {
const siweAccountCreationRequest = { const siweAccountCreationRequest = {
address: siweMessage.address, address: siweMessage.address,
calendarQuery, calendarQuery,
deviceTokenUpdateRequest, deviceTokenUpdateRequest,
platformDetails, platformDetails,
socialProof, socialProof,
}; };
userID = await processSIWEAccountCreation( userID = await processSIWEAccountCreation(
▲ Show 20 Lines • Show All 99 Lines • Show Last 20 Lines
View Options

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

Loading...