Group creation/update: Don't allow self-selection via phone number

ts/components/LeftPane.stories.tsx

@@ -938,6 +938,7 @@ export function ChooseGroupMembersPartialPhoneNumber(): JSX.Element {
           isShowingRecommendedGroupSizeModal: false,
           isShowingMaximumGroupSizeModal: false,
           isUsernamesEnabled: true,
+          ourE164: undefined,
           ourUsername: undefined,
           searchTerm: '+1(212) 555',
           regionCode: 'US',
@@ -961,6 +962,7 @@ export function ChooseGroupMembersValidPhoneNumber(): JSX.Element {
           isShowingRecommendedGroupSizeModal: false,
           isShowingMaximumGroupSizeModal: false,
           isUsernamesEnabled: true,
+          ourE164: undefined,
           ourUsername: undefined,
           searchTerm: '+1(212) 555 5454',
           regionCode: 'US',
@@ -984,6 +986,7 @@ export function ChooseGroupMembersUsername(): JSX.Element {
           isShowingRecommendedGroupSizeModal: false,
           isShowingMaximumGroupSizeModal: false,
           isUsernamesEnabled: true,
+          ourE164: undefined,
           ourUsername: undefined,
           searchTerm: '@signal',
           regionCode: 'US',

ts/components/conversation/conversation-details/AddGroupMembersModal.stories.tsx

@@ -64,6 +64,7 @@ const createProps = (
         )}
         regionCode="US"
         getPreferredBadge={() => undefined}
+        ourE164={undefined}
         ourUsername={undefined}
         theme={ThemeType.light}
         i18n={i18n}

ts/components/conversation/conversation-details/AddGroupMembersModal/ChooseGroupMembersModal.tsx

@@ -55,6 +55,7 @@ export type StatePropsType = {
   i18n: LocalizerType;
   theme: ThemeType;
   maxGroupSize: number;
+  ourE164: string | undefined;
   ourUsername: string | undefined;
   searchTerm: string;
   selectedContacts: ReadonlyArray<ConversationType>;
@@ -86,6 +87,7 @@ export function ChooseGroupMembersModal({
   i18n,
   maxGroupSize,
   onClose,
+  ourE164,
   ourUsername,
   removeSelectedContact,
   searchTerm,
@@ -129,9 +131,9 @@ export function ChooseGroupMembersModal({
       phoneNumber.isValid &&
       selectedContacts.some(contact => contact.e164 === e164);
 
-    isPhoneNumberVisible = candidateContacts.every(
+    isPhoneNumberVisible =
-      contact => contact.e164 !== e164
+      e164 !== ourE164 &&
-    );
+      candidateContacts.every(contact => contact.e164 !== e164);
   }
 
   const inputRef = useRef<null | HTMLInputElement>(null);

ts/components/conversation/conversation-details/ConversationDetails.stories.tsx

@@ -122,6 +122,7 @@ const createProps = (
         theme={ThemeType.light}
         i18n={i18n}
         lookupConversationWithoutServiceId={makeFakeLookupConversationWithoutServiceId()}
+        ourE164={undefined}
         ourUsername={undefined}
         showUserNotFoundModal={action('showUserNotFoundModal')}
         isUsernamesEnabled

ts/components/leftPane/LeftPaneChooseGroupMembersHelper.tsx

@@ -35,6 +35,7 @@ export type LeftPaneChooseGroupMembersPropsType = {
   isShowingRecommendedGroupSizeModal: boolean;
   isShowingMaximumGroupSizeModal: boolean;
   isUsernamesEnabled: boolean;
+  ourE164: string | undefined;
   ourUsername: string | undefined;
   searchTerm: string;
   regionCode: string | undefined;
@@ -75,6 +76,7 @@ export class LeftPaneChooseGroupMembersHelper extends LeftPaneHelper<LeftPaneCho
     isUsernamesEnabled,
     groupSizeRecommendedLimit,
     groupSizeHardLimit,
+    ourE164,
     ourUsername,
     searchTerm,
     regionCode,
@@ -117,13 +119,14 @@ export class LeftPaneChooseGroupMembersHelper extends LeftPaneHelper<LeftPaneCho
       (ourUsername === undefined || username !== ourUsername) &&
       phoneNumber
     ) {
+      const { e164 } = phoneNumber;
       this.isPhoneNumberChecked =
         phoneNumber.isValid &&
-        selectedContacts.some(contact => contact.e164 === phoneNumber.e164);
+        selectedContacts.some(contact => contact.e164 === e164);
 
-      const isVisible = this.candidateContacts.every(
+      const isVisible =
-        contact => contact.e164 !== phoneNumber.e164
+        e164 !== ourE164 &&
-      );
+        this.candidateContacts.every(contact => contact.e164 !== e164);
       if (isVisible) {
         this.phoneNumber = phoneNumber;
       }

ts/state/smart/ChooseGroupMembersModal.tsx

@@ -55,6 +55,7 @@ const mapStateToProps = (
     getPreferredBadge: getPreferredBadgeSelector(state),
     i18n: getIntl(state),
     theme: getTheme(state),
+    ourE164: getMe(state).e164,
     ourUsername: getMe(state).username,
     selectedContacts,
     lookupConversationWithoutServiceId,

ts/state/smart/LeftPane.tsx

@@ -180,6 +180,7 @@ const getModeSpecificProps = (
           OneTimeModalState.Showing,
         isShowingMaximumGroupSizeModal:
           getMaximumGroupSizeModalState(state) === OneTimeModalState.Showing,
+        ourE164: getMe(state).e164,
         ourUsername: getMe(state).username,
         regionCode: getRegionCode(state),
         searchTerm: getComposerConversationSearchTerm(state),

ts/test-node/components/leftPane/LeftPaneChooseGroupMembersHelper_test.ts

@@ -17,6 +17,7 @@ describe('LeftPaneChooseGroupMembersHelper', () => {
     isShowingRecommendedGroupSizeModal: false,
     isShowingMaximumGroupSizeModal: false,
     isUsernamesEnabled: true,
+    ourE164: undefined,
     ourUsername: undefined,
     groupSizeRecommendedLimit: 22,
     groupSizeHardLimit: 33,