feat: adjust ens page background and bump ui (#2088)

* feat: adjust ens page background and bump ui * feat: remove all code * feat: bump dapps
decentraland · Jan 5, 2024 · 23ea9fe · 23ea9fe
1 parent 7cb4c21
commit 23ea9fe
Show file tree

Hide file tree

Showing 8 changed files with 67 additions and 74 deletions.
diff --git a/webapp/package-lock.json b/webapp/package-lock.json
diff --git a/webapp/package.json b/webapp/package.json
@@ -20,9 +20,9 @@
     "dcl-catalyst-commons": "^9.0.1",
     "decentraland-connect": "^5.2.4",
     "decentraland-crypto-fetch": "^1.0.3",
-    "decentraland-dapps": "^16.26.1",
+    "decentraland-dapps": "^16.28.1",
     "decentraland-transactions": "^1.50.0",
-    "decentraland-ui": "^4.31.0",
+    "decentraland-ui": "^4.34.0",
     "dotenv": "^10.0.0",
     "ethers": "^5.6.8",
     "graphql": "^14.7.0",

diff --git a/webapp/src/components/NamesPage/ClaimNamePage/ClaimNamePage.module.css b/webapp/src/components/NamesPage/ClaimNamePage/ClaimNamePage.module.css
@@ -149,14 +149,12 @@
 }
 
 .claimNamePage .claimContainer {
+  border-radius: 16px;
+  padding: 24px;
+  margin-top: 12px;
   width: calc(100% - 6px);
-  border-radius: 14.482757568359375px;
-  background-color: linear-gradient(
-    116deg,
-    rgba(255, 188, 91, 0.1) 0%,
-    rgba(255, 45, 85, 0.1) 50.52%,
-    rgba(198, 64, 205, 0.1) 100%
-  );
+  background-image: url('../../../images/names/gradient-background.svg');
+  background-size: cover;
 
   display: flex;
   flex-direction: column;

diff --git a/webapp/src/components/NamesPage/ClaimNamePage/ClaimNamePage.tsx b/webapp/src/components/NamesPage/ClaimNamePage/ClaimNamePage.tsx
@@ -259,7 +259,7 @@ const ClaimNamePage = (props: Props) => {
         <div className={styles.claimNamePage}>
           <Container className={styles.mainContainer}>
             <div className={styles.gradient}>
-              <div className={classNames(styles.claimContainer, styles.card)}>
+              <div className={classNames(styles.claimContainer)}>
                 {isInputFocus ? (
                   <Close onClick={() => setIsInputFocus(false)} />
                 ) : null}

diff --git a/webapp/src/images/names/gradient-background.svg b/webapp/src/images/names/gradient-background.svg
diff --git a/webapp/src/modules/features/selectors.spec.ts b/webapp/src/modules/features/selectors.spec.ts
@@ -24,7 +24,6 @@ import {
   getIsRentalPriceFilterChartEnabled,
   getIsSmartWearablesFTUEnabled,
   isLoadingFeatureFlags,
-  getIsNewNavbarDropdownEnabled,
   getIsBuyCrossChainEnabled,
   getIsAuthDappEnabled
 } from './selectors'
@@ -213,11 +212,6 @@ const waitForInitialLoadingSelectors = [
     feature: FeatureName.EMOTES_V2_FTU,
     selector: getIsEmotesV2FTUEnabled
   },
-  {
-    name: 'navbar-dropdown',
-    feature: FeatureName.NEW_NAVBAR_DROPDOWN,
-    selector: getIsNewNavbarDropdownEnabled
-  },
   {
     name: 'buy-crosschain',
     feature: FeatureName.BUY_CROSS_CHAIN,
@@ -231,59 +225,60 @@ const waitForInitialLoadingSelectors = [
   }
 ]
 
-waitForInitialLoadingSelectors.forEach(({ name, feature, applicationName, selector }) =>
-  describe(`when getting if the ${name} feature flag is enabled`, () => {
-    describe('when the initial flags have not been yet loaded', () => {
-      beforeEach(() => {
-        hasLoadedInitialFlagsMock.mockReturnValueOnce(false)
-      })
-
-      it('should return false', () => {
-        const isEnabled = selector(state)
-
-        expect(isEnabled).toBe(false)
-        expect(getIsFeatureEnabledMock).not.toHaveBeenCalled()
-      })
-    })
-
-    describe('when the initial flags have not been yet loaded', () => {
-      beforeEach(() => {
-        hasLoadedInitialFlagsMock.mockReturnValueOnce(true)
-      })
-
-      describe('when the feature is not enabled', () => {
+waitForInitialLoadingSelectors.forEach(
+  ({ name, feature, applicationName, selector }) =>
+    describe(`when getting if the ${name} feature flag is enabled`, () => {
+      describe('when the initial flags have not been yet loaded', () => {
         beforeEach(() => {
-          getIsFeatureEnabledMock.mockReturnValueOnce(false)
+          hasLoadedInitialFlagsMock.mockReturnValueOnce(false)
         })
 
         it('should return false', () => {
           const isEnabled = selector(state)
 
           expect(isEnabled).toBe(false)
-          expect(getIsFeatureEnabledMock).toHaveBeenCalledWith(
-            state,
-            applicationName || ApplicationName.MARKETPLACE,
-            feature
-          )
+          expect(getIsFeatureEnabledMock).not.toHaveBeenCalled()
         })
       })
 
-      describe('when the feature is enabled', () => {
+      describe('when the initial flags have not been yet loaded', () => {
         beforeEach(() => {
-          getIsFeatureEnabledMock.mockReturnValueOnce(true)
+          hasLoadedInitialFlagsMock.mockReturnValueOnce(true)
         })
 
-        it('should return true', () => {
-          const isEnabled = selector(state)
+        describe('when the feature is not enabled', () => {
+          beforeEach(() => {
+            getIsFeatureEnabledMock.mockReturnValueOnce(false)
+          })
+
+          it('should return false', () => {
+            const isEnabled = selector(state)
 
-          expect(isEnabled).toBe(true)
-          expect(getIsFeatureEnabledMock).toHaveBeenCalledWith(
-            state,
-            applicationName || ApplicationName.MARKETPLACE,
-            feature
-          )
+            expect(isEnabled).toBe(false)
+            expect(getIsFeatureEnabledMock).toHaveBeenCalledWith(
+              state,
+              applicationName || ApplicationName.MARKETPLACE,
+              feature
+            )
+          })
+        })
+
+        describe('when the feature is enabled', () => {
+          beforeEach(() => {
+            getIsFeatureEnabledMock.mockReturnValueOnce(true)
+          })
+
+          it('should return true', () => {
+            const isEnabled = selector(state)
+
+            expect(isEnabled).toBe(true)
+            expect(getIsFeatureEnabledMock).toHaveBeenCalledWith(
+              state,
+              applicationName || ApplicationName.MARKETPLACE,
+              feature
+            )
+          })
         })
       })
     })
-  })
 )
diff --git a/webapp/src/modules/features/selectors.ts b/webapp/src/modules/features/selectors.ts
@@ -196,16 +196,6 @@ export const getIsEmotesV2FTUEnabled = (state: RootState) => {
   return false
 }
 
-export const getIsNewNavbarDropdownEnabled = (state: RootState) => {
-  if (hasLoadedInitialFlags(state)) {
-    return getIsFeatureEnabled(
-      state,
-      ApplicationName.MARKETPLACE,
-      FeatureName.NEW_NAVBAR_DROPDOWN
-    )
-  }
-  return false
-}
 export const getIsMarketplaceServerEnabled = (state: RootState) => {
   if (hasLoadedInitialFlags(state)) {
     return getIsFeatureEnabled(

diff --git a/webapp/src/modules/features/types.ts b/webapp/src/modules/features/types.ts
@@ -16,7 +16,6 @@ export enum FeatureName {
   HANDS_CATEGORY = 'hands-category',
   EMOTES_V2 = 'emotes-2.0',
   EMOTES_V2_FTU = 'emotes-2.0-ftu',
-  NEW_NAVBAR_DROPDOWN = 'new-navbar-dropdown',
   SMART_WEARABLES_FTU = 'smart-wearables-ftu',
   MARKETPLACE_SERVER = 'marketplace-server',
   BUY_CROSS_CHAIN = 'buy-cross-chain',