Comment Out Testnet Filtering in Prod and Add Fade-In to DefiTabs (#4)

* Add isBrowser function to distinguish between server-side and client-side execution * clean vscode * Add output * Add output and images configuration to next.config.js * Commented out testnet filtering in production environment * Add fade-in animation to DefiTabs content * CI feature (#2) * clean vscode * Add output * CI * CI --------- Co-authored-by: ex_suzhonghui <[email protected]> Co-authored-by: fewensa <[email protected]> Co-authored-by: fewensa <[email protected]> Co-authored-by: snoopy1412 <[email protected]>
ktondao · Mar 5, 2024 · 1c5c126 · 1c5c126
1 parent ea0a661
commit 1c5c126
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 4 deletions.
diff --git a/next.config.mjs b/next.config.mjs
@@ -1,6 +1,10 @@
 /** @type {import('next').NextConfig} */
+
 const nextConfig = {
   output: 'export',
+  images: {
+    unoptimized: true
+  },
   webpack: (config, { isServer }) => {
     if (isServer) {
       config.externals = config.externals.filter(

diff --git a/src/app/(defi)/page.tsx b/src/app/(defi)/page.tsx
@@ -75,9 +75,10 @@ const DefiTabs = () => {
               value === item.key && (
                 <TabsContent key={item.key} value={item.key} className="mt-0">
                   <motion.div
+                    initial={{ opacity: 0 }}
                     animate={{ opacity: 1 }}
                     exit={{ opacity: 0 }}
-                    transition={{ duration: 0.5 }}
+                    transition={{ duration: 0.5, ease: 'easeIn' }}
                     className="flex flex-col gap-5"
                   >
                     {value === 'stake' && (

diff --git a/src/utils/chain.ts b/src/utils/chain.ts
@@ -17,9 +17,9 @@ function filterTestnetsInProduction(chains: Record<ChainId, ChainConfig>): Chain
   const chainConfigs = Object.values(chainConfigMap).sort((a, b) => {
     return b.id - a.id;
   });
-  if (process.env.NODE_ENV === 'production') {
-    return chainConfigs.filter((chain) => !chain.testnet);
-  }
+  // if (process.env.NODE_ENV === 'production') {
+  //   return chainConfigs.filter((chain) => !chain.testnet);
+  // }
   return chainConfigs;
 }
 

diff --git a/src/utils/storage.ts b/src/utils/storage.ts
@@ -1,3 +1,10 @@
+/**
+ * Determines if the current execution environment is a browser.
+ * This function is essential for distinguishing between server-side and client-side execution.
+ * React applications, especially those utilizing server-side rendering (SSR) or static site generation (SSG),
+ * need to conditionally use features like localStorage that are only available in the browser environment.
+ * Accessing browser-specific objects like `window` on the server can cause errors, hence the need for this check.
+ */
 const isBrowser = (): boolean => typeof window !== 'undefined';
 
 const getItem = (key: string): string | null => {