Refactor loading of user settings

README.md

@@ -120,7 +120,7 @@ yarn workspace server run dev
 
 ### Testing
 
-To run the tests (`src/**/*.test.tsx` files):
+To run the tests locally (`src/**/*.test.tsx` files):
 
 ```shell
 yarn test    # run all tests
@@ -137,6 +137,44 @@ yarn lint   # automatically fixes linting errors
 yarn format # checks for formatting errors
 ```
 
+### Pull requests
+
+We welcome and encourage pull requests from the community. Some brief notes
+about expectations for pull requests:
+
+- Include a good description of the changes you are proposing
+- Include unit tests
+- Unit tests are run automatically by the CI and must pass before merge
+- Staging deployment must be successful before merge (see below)
+
+## Maintainers
+
+Users with write access to this GitHub repository can follow these steps to
+manage staging deployments and NPM package management.
+
+### Deployments
+
+#### Pull request
+
+Pull requests can be deployed by the CI to the https://staging.ud.me endpoint.
+However, **an authorization by a maintainer is required before the CI will
+deploy**. Authorization is made by commenting in the pull request with the
+following text:
+
+```
+/gcbrun
+```
+
+After the comment is made, the CI will initiate a deployment to the staging
+endpoint. See
+[here](https://github.com/unstoppabledomains/domain-profiles/pull/42#issuecomment-1814532213)
+for an example of an authorization comment.
+
+#### Merge
+
+Every merge to `main` results in a deployment to both https://ud.me (production)
+and https://staging.ud.me (staging) endpoints. No action is required.
+
 ### Publishing to NPM
 
 If you are a developer with access to the

package.json

@@ -11,8 +11,9 @@
   "scripts": {
     "build": "yarn build:types",
     "build:types": "tsc --build packages.build.tsconfig.json",
+    "clean": "rm -rf packages/**/build",
     "copy-package-files": "./scripts/copyPackageFiles.sh",
-    "dist": "rm -rf packages/**/build && yarn build && yarn copy-package-files",
+    "dist": "yarn clean && yarn build && yarn copy-package-files",
     "format": "prettier -w .",
     "lint": "eslint --fix .",
     "test": "DOTENV_CONFIG_PATH=./.env.test jest --runInBand",

packages/ui-components/CHANGELOG.md

@@ -1,3 +1,7 @@
+## 0.0.27
+
+- Improve loading of XMTP user settings
+
 ## 0.0.26
 
 - Improve XMTP conversation list loading time

packages/ui-components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@unstoppabledomains/ui-components",
-  "version": "0.0.26",
+  "version": "0.0.27",
   "private": true,
   "description": "An open and reusable suite of Unstoppable Domains management components",
   "keywords": [

packages/ui-components/src/components/Chat/modal/ChatModal.tsx

@@ -236,6 +236,9 @@ export const ChatModal: React.FC<ChatModalProps> = ({
       // browser settings check
       void checkBrowserSettings();
 
+      // load user settings
+      void loadUserSettings();
+
       // tab handling
       if (tabValue === TabType.Chat) {
         if (conversationSearch) {
@@ -300,12 +303,13 @@ export const ChatModal: React.FC<ChatModalProps> = ({
   const checkBrowserSettings = async () => {
     if ('Notification' in window) {
       if (Notification.permission !== 'granted') {
-        const result = await Notification.requestPermission();
+        await Notification.requestPermission();
       }
     }
   };
 
   const loadConversations = async (forceRefresh?: boolean) => {
+    // retrieve conversations if required
     if (
       xmtpAddress &&
       xmtpKey &&
@@ -316,9 +320,6 @@ export const ChatModal: React.FC<ChatModalProps> = ({
         setLoadingText(t('push.loadingConversations'));
       }
       try {
-        // load blocked topics and user data from profile service
-        await Promise.all([loadBlockedTopics(), loadUserProfile()]);
-
         // load conversations from XMTP
         const localConversations = await getConversations(xmtpAddress);
         setConversations(localConversations);
@@ -364,7 +365,17 @@ export const ChatModal: React.FC<ChatModalProps> = ({
     });
   };
 
+  const loadUserSettings = async () => {
+    // load blocked topics and user data from profile service
+    await Promise.all([loadBlockedTopics(), loadUserProfile()]);
+  };
+
   const loadBlockedTopics = async () => {
+    // skip if already loaded
+    if (acceptedTopics.length > 0) {
+      return;
+    }
+
     // request the domain's blocked topics from profile API
     if (authDomain && isDomainValidForManagement(authDomain)) {
       const responseJSON = await getDomainPreferences(authDomain);
@@ -385,6 +396,11 @@ export const ChatModal: React.FC<ChatModalProps> = ({
   // loadUserProfile authenticates with user token to retrieve private data about the
   // user such as user-specific storage API key
   const loadUserProfile = async () => {
+    // skip if already loaded
+    if (userProfile) {
+      return;
+    }
+
     try {
       // retrieve optional signature data
       const authExpiry = localStorage.getItem(

packages/ui-components/src/components/Header/AccountButton.tsx

@@ -10,7 +10,8 @@ import {getProfileData} from '../../actions/domainProfileActions';
 import DropDownMenu from '../../components/DropDownMenu';
 import getImageUrl from '../../lib/domain/getImageUrl';
 import {notifyError} from '../../lib/error';
-import {DomainFieldTypes, type SerializedPublicDomainProfileData} from '../../lib/types/domain';
+import type {SerializedPublicDomainProfileData} from '../../lib/types/domain';
+import {DomainFieldTypes} from '../../lib/types/domain';
 
 const useStyles = makeStyles()((theme: Theme) => ({
   profileButtonContainer: {
@@ -95,7 +96,9 @@ export const AccountButton: React.FC<AccountButtonProps> = ({
     const fetchData = async (domainName: string) => {
       let profileData;
       try {
-        profileData = await getProfileData(domainName, [DomainFieldTypes.Profile]);
+        profileData = await getProfileData(domainName, [
+          DomainFieldTypes.Profile,
+        ]);
       } catch {}
       setAuthDomainAvatar(
         getDomainAvatarFromProfileAndMetadata(domainName, profileData),