feat: conditional build

.env.example

@@ -2,4 +2,6 @@ URL=http://localhost:3000
 TENDERLY_KEY=
 TENDERLY_ACCOUNT=
 TENDERLY_PROJECT=
-ENABLE_TESTNET=true
+ENABLE_TESTNET=true
+ENABLE_GOVERNANCE=true
+ENABLE_STAKING=true

.github/workflows/build-test-deploy.yml

@@ -36,7 +36,9 @@ jobs:
         if: steps.restore.outcome != 'success'
         run: yarn build:static
         env:
-          ENABLE_TESTNET: true
+          ENABLE_TESTNET: ${{ github.event_name == 'push' && github.ref == 'refs/heads/master' && 'false' || 'true' }}
+          ENABLE_GOVERNANCE: true
+          ENABLE_STAKING: true
 
       - name: store artifact
         uses: actions/upload-artifact@v2

.github/workflows/nextjs_bundle_analysis.yml

@@ -48,6 +48,9 @@ jobs:
       - name: Build next.js app
         # change this if your site requires a custom build command
         run: ./node_modules/.bin/next build
+        env:
+          ENABLE_GOVERNANCE: true
+          ENABLE_STAKING: true
 
       # Here's the first place where next-bundle-analysis' own script is used
       # This step pulls the raw bundle stats for the current bundle

CONTRIBUTING.md

@@ -30,6 +30,9 @@ yarn build:static
 ```sh
 # you can default enable testnets by setting the following environment variable
 ENABLE_TESTNET=true
+# you can disable staking & governance by altering
+ENABLE_GOVERNANCE=true
+ENABLE_STAKING=true
 ```
 
 ## Test
@@ -58,7 +61,6 @@ yarn test:amm|main|polygon|avalanche
 To add a new token to the app, all you have to do is adding a svg token icon inside `public/icons/tokens` please make sure the svg name equals the `lowercase` onchain `symbol`.
 If you want a custom name to appear alongside the icon you can alter `src/ui-config/reservePatches.ts` accordingly.
 
-
 ## Translations
 
 Aave uses [Crowdin](https://crowdin.com/project/aave-interface) for translation management.
@@ -83,4 +85,4 @@ To download strings
 
 crowdin download
 
-```
+```

custom.d.ts

@@ -5,5 +5,7 @@ namespace NodeJS {
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   interface ProcessEnv {
     CACHE_PATH: string;
+    ENABLE_GOVERNANCE: string;
+    ENABLE_STAKING: string;
   }
 }

cypress/support/steps/configuration.steps.ts

@@ -43,6 +43,8 @@ export const configEnvWithTenderly = ({
         win.localStorage.setItem('WEB3_CONNECT_CACHED_PROVIDER', '"injected"');
         win.localStorage.setItem('selectedAccount', DEFAULT_TEST_ACCOUNT.address.toLowerCase());
         win.localStorage.setItem('selectedMarket', market);
+        // required when testing governance/staking as otherwise the fork will check for kovan fork
+        win.localStorage.setItem('testnetsEnabled', 'false');
       },
     });
   });

next.config.js

@@ -3,6 +3,10 @@ const withBundleAnalyzer = require('@next/bundle-analyzer')({
   enabled: process.env.ANALYZE === 'true',
 });
 
+const pageExtensions = ['page.tsx'];
+if (process.env.ENABLE_GOVERNANCE === 'true') pageExtensions.push('governance.tsx');
+if (process.env.ENABLE_STAKING === 'true') pageExtensions.push('staking.tsx');
+
 /** @type {import('next').NextConfig} */
 module.exports = withBundleAnalyzer({
   webpack(config) {
@@ -12,10 +16,10 @@ module.exports = withBundleAnalyzer({
       use: ['@svgr/webpack'],
     });
     config.experiments = { topLevelAwait: true };
-
     return config;
   },
   reactStrictMode: true,
   // assetPrefix: "./",
   trailingSlash: true,
+  pageExtensions,
 });

pages/governance/proposal/[proposalId].tsx → pages/governance/proposal/[proposalId].governance.tsx

@@ -34,7 +34,6 @@ import { GovVoteModal } from 'src/components/transactions/GovVote/GovVoteModal';
 // import { Vote } from 'src/static-build/vote';
 
 export async function getStaticPaths() {
-  if (!governanceConfig) return { paths: [] };
   const ProposalFetcher = new Proposal();
   const paths = [...Array(ProposalFetcher.count()).keys()].map((id) => ({
     params: { proposalId: id.toString() },
@@ -102,7 +101,6 @@ export default function ProposalPage({ proposal: initialProposal, ipfs }: Propos
   useEffect(() => {
     setUrl(window.location.href);
   }, []);
-  if (!governanceConfig) return <div>Governance not enabled</div>;
 
   const {
     yaeVotes,
@@ -150,7 +148,7 @@ export default function ProposalPage({ proposal: initialProposal, ipfs }: Propos
                     <Button
                       component="a"
                       target="__BLANK"
-                      href={`${governanceConfig?.ipfsGateway}/${ipfs.ipfsHash}`}
+                      href={`${governanceConfig.ipfsGateway}/${ipfs.ipfsHash}`}
                       startIcon={
                         <SvgIcon sx={{ '& path': { strokeWidth: '1' } }}>
                           <DownloadIcon />

pages/governance/proposal/index.tsx → pages/governance/proposal/index.governance.tsx

@@ -11,7 +11,7 @@ import { isProposalStateImmutable } from 'src/modules/governance/utils/immutable
 import { IpfsType } from 'src/static-build/ipfs';
 import { CustomProposalType } from 'src/static-build/proposal';
 import { governanceConfig } from 'src/ui-config/governanceConfig';
-import ProposalPage from './[proposalId]';
+import ProposalPage from './[proposalId].governance';
 
 export default function DynamicProposal() {
   const router = useRouter();

src/components/transactions/GovDelegation/GovDelegationModalContent.tsx

@@ -84,7 +84,7 @@ export const GovDelegationModalContent = () => {
   };
 
   // is Network mismatched
-  const govChain = governanceConfig?.chainId || 1;
+  const govChain = governanceConfig.chainId;
   const networkConfig = getNetworkConfig(govChain);
   const isWrongNetwork = connectedChainId !== govChain;
 

src/components/transactions/GovVote/GovVoteModalContent.tsx

@@ -58,7 +58,7 @@ export const GovVoteModalContent = ({
   };
 
   // is Network mismatched
-  const govChain = governanceConfig?.chainId || 1;
+  const govChain = governanceConfig.chainId;
   const networkConfig = getNetworkConfig(govChain);
   const isWrongNetwork = connectedChainId !== govChain;
 

src/components/transactions/Supply/SupplyModalContent.tsx

@@ -252,9 +252,9 @@ export const SupplyModalContent = ({ underlyingAsset }: SupplyProps) => {
       {showIsolationWarning && <IsolationModeWarning />}
       {showSupplyCapWarning && <SupplyCapWarning />}
       {poolReserve.symbol === 'AMPL' && <AMPLWarning />}
-      {poolReserve.symbol === 'AAVE' && isFeatureEnabled.staking(currentMarketData) && (
-        <AAVEWarning />
-      )}
+      {process.env.ENABLE_STAKING === 'true' &&
+        poolReserve.symbol === 'AAVE' &&
+        isFeatureEnabled.staking(currentMarketData) && <AAVEWarning />}
       {poolReserve.symbol === 'SNX' && !maxAmountToSupply.eq('0') && <SNXWarning />}
 
       <AssetInput

src/hooks/governance-data-provider/GovernanceDataProvider.tsx

@@ -19,8 +19,6 @@ const GovernanceDataProviderContext = React.createContext<GovernanceDataProvider
  * @returns
  */
 export const GovernanceDataProvider: React.FC = ({ children }) => {
-  if (!governanceConfig) return <>{children}</>;
-
   const { governanceService, governanceDelegationService } = _useGovernanceDataRPC({
     governanceConfig,
   });

src/hooks/governance-data-provider/_useGovernanceDataRPC.tsx

@@ -27,7 +27,7 @@ export function _useGovernanceDataRPC({ governanceConfig }: UseGovernanceDataPro
 
   const isGovernanceFork =
     currentNetworkConfig.isFork &&
-    currentNetworkConfig.underlyingChainId === governanceConfig?.chainId;
+    currentNetworkConfig.underlyingChainId === governanceConfig.chainId;
   const rpcProvider = isGovernanceFork ? jsonRpcProvider : getProvider(governanceConfig.chainId);
   const { aaveTokenAddress, stkAaveTokenAddress } = governanceConfig;
 

src/hooks/stake-data-provider/StakeDataProvider.tsx

@@ -6,6 +6,7 @@ import { useConnectionStatusContext } from '../useConnectionStatusContext';
 import { _useStakeDataCached } from './_useStakeDataCached';
 import { _useStakeDataRPC } from './_useStakeDataRPC';
 import { useC_StakeGeneralUiDataQuery, useC_StakeUserUiDataQuery } from './graphql/hooks';
+import { useProtocolDataContext } from '../useProtocolDataContext';
 
 interface StakeDataProviderContextType {}
 
@@ -19,14 +20,21 @@ const StakeDataProviderContext = React.createContext<StakeDataProviderContextTyp
  * @returns
  */
 export const StakeDataProvider: React.FC = ({ children }) => {
+  const stakeConfig = getStakeConfig();
   const { currentAccount } = useWeb3Context();
   const { isRPCActive } = useConnectionStatusContext();
-  const stakeConfig = getStakeConfig();
+  const { currentNetworkConfig } = useProtocolDataContext();
 
-  const rpcMode = isRPCActive || !stakeConfig?.wsStakeDataUrl || !stakeConfig?.queryStakeDataUrl;
+  const isGovernanceFork =
+    currentNetworkConfig.isFork && currentNetworkConfig.underlyingChainId === stakeConfig.chainId;
+  const rpcMode =
+    isRPCActive ||
+    !stakeConfig.wsStakeDataUrl ||
+    !stakeConfig.queryStakeDataUrl ||
+    isGovernanceFork;
 
-  _useStakeDataCached(currentAccount, rpcMode);
-  const { refresh } = _useStakeDataRPC(currentAccount, !rpcMode);
+  _useStakeDataCached(currentAccount, stakeConfig.chainId, rpcMode);
+  const { refresh } = _useStakeDataRPC(currentAccount, stakeConfig.chainId, !rpcMode);
   return (
     <StakeDataProviderContext.Provider value={{ refresh }}>
       {children}
@@ -45,9 +53,10 @@ export const useStakeDataProvider = () => useContext(StakeDataProviderContext);
  */
 export const useStakeData = () => {
   const { currentAccount } = useWeb3Context();
+  const stakeConfig = getStakeConfig();
 
   const { data: stakeUserResult } = useC_StakeUserUiDataQuery({
-    variables: { userAddress: currentAccount },
+    variables: { userAddress: currentAccount, chainId: stakeConfig.chainId },
     skip: !currentAccount,
     fetchPolicy: 'cache-only',
   });

src/hooks/stake-data-provider/_useStakeDataCached.tsx

@@ -16,8 +16,7 @@ import { APOLLO_QUERY_TARGET } from 'src/utils/apolloClient';
  * @param skip
  * @returns
  */
-export function _useStakeDataCached(currentAccount?: string, skip = false) {
-  const userId = currentAccount || '';
+export function _useStakeDataCached(currentAccount: string, chainId: number, skip = false) {
   const {
     loading: stakeGeneralUIDataLoading,
     data: stakeGeneralResult,
@@ -42,26 +41,26 @@ export function _useStakeDataCached(currentAccount?: string, skip = false) {
         context: { target: APOLLO_QUERY_TARGET.STAKE },
       });
     }
-  }, [subscribeToStakeGeneralUiData]);
+  }, [subscribeToStakeGeneralUiData, skip]);
 
   const {
     loading: stakeUserUIDataLoading,
     data: stakeUserResult,
     subscribeToMore: subscribeToStakeUserUiData,
   } = useC_StakeUserUiDataQuery({
-    variables: { userAddress: userId },
-    skip: !userId || skip,
+    variables: { userAddress: currentAccount, chainId },
+    skip: !currentAccount || skip,
     context: { target: APOLLO_QUERY_TARGET.STAKE },
   });
 
   useEffect(() => {
-    if (userId && !skip) {
+    if (currentAccount && !skip) {
       return subscribeToStakeUserUiData<
         C_StakeUserUiDataUpdateSubscription,
         C_StakeUserUiDataUpdateSubscriptionVariables
       >({
         document: C_StakeUserUiDataUpdateDocument,
-        variables: { userAddress: userId },
+        variables: { userAddress: currentAccount, chainId },
         updateQuery: (previousQueryResult, { subscriptionData }) => {
           const stakeUserUIDataUpdate = subscriptionData.data?.stakeUserUIDataUpdate;
           if (!stakeUserUIDataUpdate) {
@@ -75,9 +74,9 @@ export function _useStakeDataCached(currentAccount?: string, skip = false) {
         context: { target: APOLLO_QUERY_TARGET.STAKE },
       });
     }
-  }, [subscribeToStakeUserUiData, userId]);
+  }, [subscribeToStakeUserUiData, currentAccount, skip, chainId]);
 
-  const loading = (userId && stakeUserUIDataLoading) || stakeGeneralUIDataLoading;
+  const loading = (currentAccount && stakeUserUIDataLoading) || stakeGeneralUIDataLoading;
 
   const stakeGeneralData = stakeGeneralResult?.stakeGeneralUIData || undefined;
   if (!stakeGeneralData || (!stakeUserResult?.stakeUserUIData && !stakeUserUIDataLoading)) {

src/hooks/stake-data-provider/_useStakeDataRPC.tsx

@@ -9,17 +9,21 @@ import {
   C_StakeUserUiDataQuery,
 } from './graphql/hooks';
 import { getStakeConfig } from 'src/ui-config/stakeConfig';
+import { useProtocolDataContext } from '../useProtocolDataContext';
 
-export function _useStakeDataRPC(currentAccount?: string, skip = false) {
+export function _useStakeDataRPC(currentAccount: string, chainId: number, skip = false) {
   const { cache } = useApolloClient();
   const stakeConfig = getStakeConfig();
+  const { currentNetworkConfig, jsonRpcProvider } = useProtocolDataContext();
 
+  const isStakeFork =
+    currentNetworkConfig.isFork && currentNetworkConfig.underlyingChainId === stakeConfig?.chainId;
+  const rpcProvider = isStakeFork ? jsonRpcProvider : getProvider(stakeConfig.chainId);
+  const uiStakeDataProvider = new UiStakeDataProvider({
+    provider: rpcProvider,
+    uiStakeDataProvider: stakeConfig.stakeDataProvider,
+  });
   const loadGeneralStakeData = async () => {
-    if (!stakeConfig) return;
-    const uiStakeDataProvider = new UiStakeDataProvider({
-      provider: getProvider(stakeConfig.chainId),
-      uiStakeDataProvider: stakeConfig.stakeDataProvider,
-    });
     try {
       const generalStakeData = await uiStakeDataProvider.getGeneralStakeUIDataHumanized();
       cache.writeQuery<C_StakeGeneralUiDataQuery>({
@@ -38,12 +42,7 @@ export function _useStakeDataRPC(currentAccount?: string, skip = false) {
   };
 
   const loadUserStakeData = async () => {
-    const stakeConfig = getStakeConfig();
-    if (!stakeConfig || !currentAccount) return;
-    const uiStakeDataProvider = new UiStakeDataProvider({
-      provider: getProvider(stakeConfig.chainId),
-      uiStakeDataProvider: stakeConfig.stakeDataProvider,
-    });
+    if (!currentAccount) return;
     try {
       const userStakeData = await uiStakeDataProvider.getUserStakeUIDataHumanized({
         user: currentAccount,
@@ -57,7 +56,7 @@ export function _useStakeDataRPC(currentAccount?: string, skip = false) {
             ...userStakeData,
           },
         },
-        variables: { userAddress: currentAccount },
+        variables: { userAddress: currentAccount, chainId },
       });
     } catch (e) {
       console.log('Stake user data user loading error', e);