Skip to content

Commit da554ee

Browse files
Bhupesh-mfsiBhupesh-mfsi
committed
added feature flag for profile
1 parent ddea939 commit da554ee

File tree

14 files changed

+277
-111
lines changed

14 files changed

+277
-111
lines changed

‎packages/messenger-widget/src/components/ConfigureProfile/CloudStorage.tsx‎

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export function CloudStorage() {
1717

1818
const { existingDm3Name } = useContext(ConfigureDM3NameContext);
1919

20-
const { configureProfileModal, setConfigureProfileModal } =
20+
const { configureProfileModal, setConfigureProfileModal, disabledOptions } =
2121
useContext(ModalContext);
2222

2323
const isNameAlreadyConfigured = (): boolean => {
@@ -76,13 +76,21 @@ export function CloudStorage() {
7676
}}
7777
>
7878
{dm3NamingServices &&
79-
dm3NamingServices.map((data, index) => {
80-
return (
81-
<option value={data.name} key={index}>
82-
{data.name}
83-
</option>
84-
);
85-
})}
79+
// Filter out disabled options and show only enabled options
80+
dm3NamingServices
81+
.filter(
82+
(d) =>
83+
disabledOptions.profile.dm3.filter(
84+
(p) => p.key === d.key && !p.value,
85+
).length,
86+
)
87+
.map((data, index) => {
88+
return (
89+
<option value={data.name} key={index}>
90+
{data.name}
91+
</option>
92+
);
93+
})}
8694
</select>
8795
</div>
8896

‎packages/messenger-widget/src/components/ConfigureProfile/MobileView.tsx‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export function MobileView() {
2727

2828
const { account, ethAddress } = useContext(AuthContext);
2929

30-
const { configureProfileModal, setConfigureProfileModal } =
30+
const { configureProfileModal, setConfigureProfileModal, disabledOptions } =
3131
useContext(ModalContext);
3232

3333
const { setEnsName, setNamingServiceSelected, existingEnsName } =
@@ -71,7 +71,11 @@ export function MobileView() {
7171
}, [ethAddress]);
7272

7373
useEffect(() => {
74-
if (connectedChainId) {
74+
// set the naming service selected by default based on chain connected if no options are disabled
75+
if (
76+
connectedChainId &&
77+
!disabledOptions.profile.own.filter((p) => p.value).length
78+
) {
7579
setNamingServiceSelected(fetchServiceFromChainId(connectedChainId));
7680
}
7781
}, []);

‎packages/messenger-widget/src/components/ConfigureProfile/NormalView.tsx‎

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ export function NormalView() {
2727

2828
const { account, ethAddress } = useContext(AuthContext);
2929

30-
const { configureProfileModal, setConfigureProfileModal } =
30+
const { configureProfileModal, setConfigureProfileModal, disabledOptions } =
3131
useContext(ModalContext);
3232

3333
const { setEnsName, setNamingServiceSelected, existingEnsName } =
@@ -71,7 +71,11 @@ export function NormalView() {
7171
}, [ethAddress]);
7272

7373
useEffect(() => {
74-
if (connectedChainId) {
74+
// set the naming service selected by default based on chain connected if no options are disabled
75+
if (
76+
connectedChainId &&
77+
!disabledOptions.profile.own.filter((p) => p.value).length
78+
) {
7579
setNamingServiceSelected(fetchServiceFromChainId(connectedChainId));
7680
}
7781
}, []);

‎packages/messenger-widget/src/components/ConfigureProfile/OwnStorage.tsx‎

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { ConfigureProfileContext } from './context/ConfigureProfileContext';
77
export function OwnStorage() {
88
const [errorMsg, setErrorMsg] = useState<string | null>(null);
99

10-
const { configureProfileModal, setConfigureProfileModal } =
10+
const { configureProfileModal, setConfigureProfileModal, disabledOptions } =
1111
useContext(ModalContext);
1212

1313
const { existingEnsName, namingServiceSelected, setNamingServiceSelected } =
@@ -70,13 +70,21 @@ export function OwnStorage() {
7070
}}
7171
>
7272
{namingServices &&
73-
namingServices.map((data, index) => {
74-
return (
75-
<option value={data.name} key={index}>
76-
{data.name}
77-
</option>
78-
);
79-
})}
73+
// Filter out disabled options and show only enabled options
74+
namingServices
75+
.filter(
76+
(n) =>
77+
disabledOptions.profile.own.filter(
78+
(p) => p.key === n.key && !p.value,
79+
).length,
80+
)
81+
.map((data, index) => {
82+
return (
83+
<option value={data.name} key={index}>
84+
{data.name}
85+
</option>
86+
);
87+
})}
8088
</select>
8189
</div>
8290

‎packages/messenger-widget/src/components/ConfigureProfile/ProfileTypeSelector.tsx‎

Lines changed: 49 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,78 @@
1-
import { useContext } from 'react';
1+
import { useContext, useEffect } from 'react';
22
import { ModalContext } from '../../context/ModalContext';
33
import { ProfileScreenType, ProfileType } from '../../utils/enum-type-utils';
44
import { BUTTON_CLASS } from './bl';
55

66
export function ProfileTypeSelector() {
7-
const { configureProfileModal, setConfigureProfileModal } =
7+
const { configureProfileModal, setConfigureProfileModal, disabledOptions } =
88
useContext(ModalContext);
99

1010
const profileOptions = [
1111
{
1212
name: 'Claim a dm3 Name (dm3 cloud, Optimism, ...)',
1313
type: ProfileType.DM3_NAME,
14+
isEnabled: disabledOptions.profile.dm3.filter((d) => !d.value)
15+
.length
16+
? true
17+
: false,
1418
},
1519
{
1620
name: 'use your own Name (ENS, GENOME, ...)',
1721
type: ProfileType.OWN_NAME,
22+
isEnabled: disabledOptions.profile.own.filter((d) => !d.value)
23+
.length
24+
? true
25+
: false,
1826
},
1927
];
2028

29+
useEffect(() => {
30+
const filteredOptions = profileOptions.filter((p) => p.isEnabled);
31+
if (filteredOptions.length === 1) {
32+
setConfigureProfileModal({
33+
...configureProfileModal,
34+
profileOptionSelected: filteredOptions[0].type,
35+
});
36+
}
37+
}, []);
38+
2139
return (
2240
<div className="mt-4 ms-4 me-4 dm3-prof-select-container">
2341
<div className="dm3-prof-select-type">
2442
Add new dm3 profile - select type
2543
</div>
2644

2745
<div className="prof-option-container">
28-
{profileOptions.map((option, index) => (
29-
<div
30-
key={index}
31-
className="radio d-flex mb-3 width-fit"
32-
onClick={() =>
33-
setConfigureProfileModal({
34-
...configureProfileModal,
35-
profileOptionSelected: option.type,
36-
})
37-
}
38-
>
39-
<input
40-
type="radio"
41-
name="profile_name"
42-
value={option.type}
43-
checked={
44-
option.type ===
45-
configureProfileModal.profileOptionSelected
46-
? true
47-
: false
46+
{profileOptions
47+
.filter((p) => p.isEnabled)
48+
.map((option, index) => (
49+
<div
50+
key={index}
51+
className="radio d-flex mb-3 width-fit"
52+
onClick={() =>
53+
setConfigureProfileModal({
54+
...configureProfileModal,
55+
profileOptionSelected: option.type,
56+
})
4857
}
49-
readOnly
50-
/>
51-
<label className="name-option radio-label">
52-
{option.name}
53-
</label>
54-
</div>
55-
))}
58+
>
59+
<input
60+
type="radio"
61+
name="profile_name"
62+
value={option.type}
63+
checked={
64+
option.type ===
65+
configureProfileModal.profileOptionSelected
66+
? true
67+
: false
68+
}
69+
readOnly
70+
/>
71+
<label className="name-option radio-label">
72+
{option.name}
73+
</label>
74+
</div>
75+
))}
5676
</div>
5777
<div className="d-flex justify-content-end me-3 mb-3">
5878
<button

‎packages/messenger-widget/src/components/ConfigureProfile/bl.tsx‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import { ConfigureCloudNameProfile } from './dm3Names/cloudName/ConfigureCloudNa
1010
import { ConfigureOptimismNameProfile } from './dm3Names/optimismName/ConfigureOptimismNameProfile';
1111
import { supportedChains } from '../../utils/common-utils';
1212
import { removeAlias } from '../../adapters/offchainResolverApi';
13+
import { PREFERENCES_ITEMS } from '../Preferences/bl';
1314

1415
export const PROFILE_INPUT_FIELD_CLASS =
1516
'profile-input font-weight-400 font-size-14 border-radius-6 w-100 line-height-24';
@@ -26,9 +27,11 @@ export enum ACTION_TYPE {
2627
export const openConfigurationModal = (
2728
setShowProfileConfigurationModal: (show: boolean) => void,
2829
setShowPreferencesModal: (show: boolean) => void,
30+
updatePreferenceSelected: (ticker: PREFERENCES_ITEMS | null) => void,
2931
) => {
3032
setShowProfileConfigurationModal(true);
3133
setShowPreferencesModal(true);
34+
updatePreferenceSelected(PREFERENCES_ITEMS.DM3_PROFILE);
3235
};
3336

3437
// method to close the profile configuration modal
@@ -160,10 +163,12 @@ export const enum NAME_SERVICES {
160163
export const namingServices = [
161164
{
162165
name: NAME_SERVICES.ENS,
166+
key: 'ens',
163167
chainId: supportedChains.ethereumMainnet,
164168
},
165169
{
166170
name: NAME_SERVICES.GENOME,
171+
key: 'gnosis',
167172
chainId: supportedChains.gnosisMainnet,
168173
},
169174
];
@@ -220,9 +225,11 @@ export const enum DM3_NAME_SERVICES {
220225
export const dm3NamingServices = [
221226
{
222227
name: DM3_NAME_SERVICES.CLOUD,
228+
key: 'dm3',
223229
},
224230
{
225231
name: DM3_NAME_SERVICES.OPTIMISM,
232+
key: 'optimism',
226233
},
227234
];
228235

‎packages/messenger-widget/src/components/ConfigureProfile/context/ConfigureProfileContext.tsx‎

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { NAME_TYPE } from '../chain/common';
33
import { dm3NamingServices, namingServices } from '../bl';
44
import { AuthContext } from '../../../context/AuthContext';
55
import { DM3ConfigurationContext } from '../../../context/DM3ConfigurationContext';
6+
import { ModalContext } from '../../../context/ModalContext';
67

78
export interface ConfigureProfileContextType {
89
existingEnsName: string | null;
@@ -43,15 +44,36 @@ export const ConfigureProfileContextProvider = (props: { children?: any }) => {
4344

4445
const [errorMsg, setErrorMsg] = useState<string>('');
4546

47+
const { disabledOptions } = useContext(ModalContext);
48+
4649
// DM3 Name service selected
4750
const [dm3NameServiceSelected, setDm3NameServiceSelected] =
48-
useState<string>(dm3NamingServices[0].name);
51+
useState<string>(
52+
dm3NamingServices.filter(
53+
(d) =>
54+
disabledOptions.profile.dm3.filter(
55+
(p) => p.key === d.key && !p.value,
56+
).length,
57+
)[0]?.name,
58+
);
4959

5060
// ENS Name service selected
5161
const [namingServiceSelected, setNamingServiceSelected] = useState<string>(
52-
namingServices[0].name,
62+
namingServices.filter(
63+
(n) =>
64+
disabledOptions.profile.own.filter(
65+
(p) => p.key === n.key && !p.value,
66+
).length,
67+
)[0]?.name,
5368
);
5469

70+
useEffect(() => {
71+
console.log(
72+
'namingServiceSelectednamingServiceSelected ::',
73+
namingServiceSelected,
74+
);
75+
}, [namingServiceSelected]);
76+
5577
const { displayName } = useContext(AuthContext);
5678
const { dm3Configuration } = useContext(DM3ConfigurationContext);
5779

‎packages/messenger-widget/src/components/ConfigureProfileBox/ConfigureProfileBox.tsx‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,12 @@ export default function ConfigureProfileBox() {
1010
const { displayName } = useContext(AuthContext);
1111
const { selectedContact } = useContext(ConversationContext);
1212
const { dm3Configuration } = useContext(DM3ConfigurationContext);
13-
const { setShowProfileConfigurationModal, setShowPreferencesModal } =
14-
useContext(ModalContext);
13+
const {
14+
setShowProfileConfigurationModal,
15+
setShowPreferencesModal,
16+
isProfileDialogDisabled,
17+
updatePreferenceSelected,
18+
} = useContext(ModalContext);
1519

1620
const [showConfigBox, setShowConfigBox] = useState<boolean>(false);
1721

@@ -25,7 +29,7 @@ export default function ConfigureProfileBox() {
2529
setShowConfigBox(!displayName || isAddrEnsName ? true : false);
2630
}, [displayName]);
2731

28-
return showConfigBox ? (
32+
return showConfigBox && !isProfileDialogDisabled() ? (
2933
<div
3034
data-testid="config-profile-box"
3135
className={'config-box-main width-fill background-container'.concat(
@@ -51,6 +55,7 @@ export default function ConfigureProfileBox() {
5155
openConfigurationModal(
5256
setShowProfileConfigurationModal,
5357
setShowPreferencesModal,
58+
updatePreferenceSelected,
5459
)
5560
}
5661
>

‎packages/messenger-widget/src/components/Preferences/MobileView.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@ export function MobileView() {
1919
* Opens first option by default
2020
*/
2121
useEffect(() => {
22-
if (showProfileConfigurationModal) {
22+
if (showProfileConfigurationModal && !preferencesOptionSelected) {
2323
updatePreferenceSelected(
2424
preferencesOptions.length ? preferencesOptions[0].ticker : null,
2525
);

‎packages/messenger-widget/src/components/Preferences/NormalView.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ export function NormalView() {
2020
* Opens first option by default
2121
*/
2222
useEffect(() => {
23-
if (showProfileConfigurationModal) {
23+
if (showProfileConfigurationModal && !preferencesOptionSelected) {
2424
updatePreferenceSelected(
2525
preferencesOptions.length ? preferencesOptions[0].ticker : null,
2626
);

0 commit comments

Comments
 (0)