renamed some things

ATXDAO · Jan 26, 2024 · 5e49fac · 5e49fac
1 parent 217e5b7
commit 5e49fac
Show file tree

Hide file tree

Showing 14 changed files with 361 additions and 314 deletions.
diff --git a/packages/nextjs/components/rep-tokens-demo/Index.tsx b/packages/nextjs/components/rep-tokens-demo/Index.tsx
@@ -1,62 +1,33 @@
 import { ImageProperties } from "../rep-tokens/cards/property-cards/ImageCard";
-import { BaseTokenCardPropertiesBooleanSet } from "../rep-tokens/cards/token-card/BaseTokenCard";
-import { TTokenCardPrettifyLoadingProps } from "../rep-tokens/cards/token-card/TokenCard";
-import { TTokenCardPropertiesClasses } from "../rep-tokens/cards/token-card/TokenCard";
-import { TTokenCardProps } from "../rep-tokens/cards/token-card/TokenCard";
-import { TokensCard } from "../rep-tokens/cards/tokens-card/TokensCard";
+import { TokenGroupCard } from "../rep-tokens/cards/token-group-card/TokenGroupCard";
 import { useRepTokens } from "../rep-tokens/hooks/Hooks";
-import { Token } from "../rep-tokens/hooks/Hooks";
+import { buildTokenGroupCard } from "../rep-tokens/utils/buildTokensCard";
 import {
-  tokenCardPrettifyLoadingProps as mainTokenCardPrettifyLoadingProps,
+  tokenCardPrettifyLoadingProps as isBeautifyingMainTokenCardLoadingProps,
+  tokensCardPrettifyLoadingProps as isBeautifyingMainTokenGroupCardLoadingProps,
+  isRenderingTokenCardProps as isRenderingMainTokenCardProps,
+  tokensCardRenderProps as isRenderingMainTokenGroupCardProps,
   tokenCardPropertiesClasses as mainTokenCardPropertiesClasses,
-  tokenCardRenderProps as mainTokenCardRenderProps,
-  tokensCardPrettifyLoadingProps as mainTokensCardPrettifyLoadingProps,
-  tokensCardPropertiesClasses as mainTokensCardPropertiesClassess,
-  tokensCardRenderProps as mainTokensCardRenderProps,
+  tokensCardPropertiesClasses as mainTokenGroupCardElementsClassess,
 } from "./MainTokensCardConfig";
 import {
-  tokenCardPrettifyLoadingProps as mainNumberOverlayTokenCardPrettifyLoadingProps,
+  tokenCardPrettifyLoadingProps as isBeautifyingMainTokenCardOverlayLoadingProps,
+  isRenderingTokenCardProps as isRenderingMainTokenCardOverlayProps,
   tokenCardPropertiesClasses as mainNumberOverlayTokenCardPropertiesClasses,
-  tokenCardRenderProps as mainNumberOverlayTokenCardRenderProps,
+  tokensCardPropertiesClasses as mainNumberOverlayTokensCardElementsClasses,
   tokensCardPrettifyLoadingProps as mainNumberOverlayTokensCardPrettifyLoadingProps,
-  tokensCardPropertiesClasses as mainNumberOverlayTokensCardPropertiesClassess,
   tokensCardRenderProps as mainNumberOverlayTokensCardRenderProps,
 } from "./MainTokensCardWithNumberOverlayConfig";
 import {
-  tokenCardPrettifyLoadingProps as navBarTokenCardPrettifyLoadingProps,
-  tokenCardPropertiesClasses as navBarTokenCardPropertiesClasses,
-  tokenCardRenderProps as navBarTokenCardRenderProps,
-  tokensCardPrettifyLoadingProps as navBarTokensCardPrettifyLoadingProps,
-  tokensCardPropertiesClasses as navBarTokensCardPropertiesClassess,
-  tokensCardRenderProps as navBarTokensCardRenderProps,
+  tokenCardPrettifyLoadingProps as isBeautifyingNavBarLoadingProps,
+  tokensCardPrettifyLoadingProps as isBeuatyingNavBarTokenGroupCardLoadingProps,
+  isRenderingTokenCardProps as isRenderingNavBarCardProps,
+  tokensCardRenderProps as isRenderingNavBarTokenGroupCardProps,
+  tokenCardPropertiesClasses as navBarElementsClasses,
+  tokensCardPropertiesClasses as navBarTokenGroupCardElementsClasses,
 } from "./NavBarCardConfig";
 import { useAccount } from "wagmi";
 
-function buildTokensCard(
-  tokens: Token[],
-  address?: string,
-  imageProperties?: ImageProperties,
-  propertiesClasses?: TTokenCardPropertiesClasses,
-  renderProps?: BaseTokenCardPropertiesBooleanSet,
-  prettifyLoadingProps?: TTokenCardPrettifyLoadingProps,
-) {
-  const arr = [];
-  for (let i = 0; i < tokens.length; i++) {
-    const tokenCardProp: TTokenCardProps = {
-      token: tokens[i],
-      address,
-      imageProperties,
-      prettifyLoadingProps: prettifyLoadingProps,
-      propertiesClasses,
-      renderProps,
-    };
-
-    arr.push(tokenCardProp);
-  }
-
-  return arr;
-}
-
 export const Index = () => {
   const navBarCardImageProperties = new ImageProperties("Token", 64, 64);
   const mainCardImageProperties = new ImageProperties("Token", 256, 256);
@@ -69,67 +40,67 @@ export const Index = () => {
     tokensData.tokens[i].image = tokensData.tokens[i].image?.replace("ipfs://", "https://ipfs.io/ipfs/");
   }
 
-  const navBarTokenCard = buildTokensCard(
+  const navBarTokenCard = buildTokenGroupCard(
     tokensData.tokens,
     tokensData.address,
     navBarCardImageProperties,
-    navBarTokenCardPropertiesClasses,
-    navBarTokenCardRenderProps,
-    navBarTokenCardPrettifyLoadingProps,
+    navBarElementsClasses,
+    isRenderingNavBarCardProps,
+    isBeautifyingNavBarLoadingProps,
   );
 
-  const mainTokenCard = buildTokensCard(
+  const mainTokenGroupCard = buildTokenGroupCard(
     tokensData.tokens,
     tokensData.address,
     mainCardImageProperties,
     mainTokenCardPropertiesClasses,
-    mainTokenCardRenderProps,
-    mainTokenCardPrettifyLoadingProps,
+    isRenderingMainTokenCardProps,
+    isBeautifyingMainTokenCardLoadingProps,
   );
 
-  const mainNumberOverlayTokenCard = buildTokensCard(
+  const mainNumberOverlayTokenCard = buildTokenGroupCard(
     tokensData.tokens,
     tokensData.address,
     mainCardImageProperties,
     mainNumberOverlayTokenCardPropertiesClasses,
-    mainNumberOverlayTokenCardRenderProps,
-    mainNumberOverlayTokenCardPrettifyLoadingProps,
+    isRenderingMainTokenCardOverlayProps,
+    isBeautifyingMainTokenCardOverlayLoadingProps,
   );
 
   return (
     <>
       <div className="flex flex-col justify-center items-center bg-primary bg-[length:100%_100%] py-1 px-5 sm:px-0 lg:py-auto max-w-[100vw] ">
         <div>
-          <TokensCard
+          <TokenGroupCard
             address={tokensData.address}
-            tokensProps={navBarTokenCard}
-            propertiesClasses={navBarTokensCardPropertiesClassess}
-            renderProps={navBarTokensCardRenderProps}
-            prettifyLoadingProps={navBarTokensCardPrettifyLoadingProps}
+            tokenCardsProps={navBarTokenCard}
+            elementsClasses={navBarTokenGroupCardElementsClasses}
+            isRenderingTokenGroupCardProps={isRenderingNavBarTokenGroupCardProps}
+            isBeautifyingTokenGroupCardLoadingProps={isBeuatyingNavBarTokenGroupCardLoadingProps}
           />
         </div>
       </div>
 
       <div className="flex flex-col justify-center items-center bg-primary bg-[length:100%_100%] py-1 px-5 sm:px-0 lg:py-auto max-w-[100vw] ">
         <div>
-          <TokensCard
+          <TokenGroupCard
             address={tokensData.address}
-            tokensProps={mainTokenCard}
-            propertiesClasses={mainTokensCardPropertiesClassess}
-            renderProps={mainTokensCardRenderProps}
-            prettifyLoadingProps={mainTokensCardPrettifyLoadingProps}
+            tokenCardsProps={mainTokenGroupCard}
+            elementsClasses={mainTokenGroupCardElementsClassess}
+            isRenderingTokenGroupCardProps={isRenderingMainTokenGroupCardProps}
+            isBeautifyingTokenGroupCardLoadingProps={isBeautifyingMainTokenGroupCardLoadingProps}
           />
         </div>
       </div>
 
       <div className="flex flex-col justify-center items-center bg-primary bg-[length:100%_100%] py-1 px-5 sm:px-0 lg:py-auto max-w-[100vw] ">
         <div>
-          <TokensCard
+          <TokenGroupCard
             address={tokensData.address}
-            tokensProps={mainNumberOverlayTokenCard}
-            propertiesClasses={mainNumberOverlayTokensCardPropertiesClassess}
-            renderProps={mainNumberOverlayTokensCardRenderProps}
-            prettifyLoadingProps={mainNumberOverlayTokensCardPrettifyLoadingProps}
+            tokenCardsProps={mainNumberOverlayTokenCard}
+            elementsClasses={mainNumberOverlayTokensCardElementsClasses}
+            isRenderingTokenGroupCardProps={mainNumberOverlayTokensCardRenderProps}
+            isBeautifyingTokenGroupCardLoadingProps={mainNumberOverlayTokensCardPrettifyLoadingProps}
           />
         </div>
       </div>

diff --git a/packages/nextjs/components/rep-tokens-demo/MainTokensCardConfig.tsx b/packages/nextjs/components/rep-tokens-demo/MainTokensCardConfig.tsx
@@ -1,22 +1,13 @@
-import { BaseTokenCardPropertiesBooleanSet } from "../rep-tokens/cards/token-card/BaseTokenCard";
-import { TTokenCardPrettifyLoadingProps, TTokenCardPropertiesClasses } from "../rep-tokens/cards/token-card/TokenCard";
 import {
-  TTokenGroupCardPrettifyLoadingProps,
-  TTokensCardRenderProps,
-} from "../rep-tokens/cards/tokens-card/TokensCard";
-import { TTokenCardGroupPropertiesClasses } from "../rep-tokens/cards/tokens-card/TokensCard";
-
-export const tokensCardRenderProps = {
-  address: true,
-} as TTokensCardRenderProps;
-
-export const tokenCardRenderProps = {
-  balance: true,
-  image: true,
-  name: true,
-  description: true,
-  address: true,
-} as BaseTokenCardPropertiesBooleanSet;
+  IsBeautifyingTokenCardLoadingProps,
+  IsRenderingTokenCardProps,
+  TokenCardElementsClasses,
+} from "../rep-tokens/cards/token-card/TokenCard";
+import {
+  IsBeautifyingTokenGroupCardLoadingProps,
+  IsRenderingTokenGroupCardProps,
+} from "../rep-tokens/cards/token-group-card/TokenGroupCard";
+import { TokenGroupCardElementsClasses } from "../rep-tokens/cards/token-group-card/TokenGroupCard";
 
 export const tokensCardPropertiesClasses = {
   container: "flex justify-center",
@@ -25,11 +16,11 @@ export const tokensCardPropertiesClasses = {
     container: "flex items-center justify-center bg-slate-600",
     value: "ml-1.5 text-${size} font-normal text-white",
   },
-} as TTokenCardGroupPropertiesClasses;
+} as TokenGroupCardElementsClasses;
 
 export const tokenCardPropertiesClasses = {
   card: "bg-slate-600 p-5 m-4 w-64",
-  baseTokenCardPropertyClasses: {
+  baseTokenCardElementsClasses: {
     balance: {
       container: "bg-slate-300",
       value: "text-4xl mx-auto text-center",
@@ -51,19 +42,35 @@ export const tokenCardPropertiesClasses = {
       value: "rounded mx-auto",
     },
   },
-} as TTokenCardPropertiesClasses;
+} as TokenCardElementsClasses;
+
+export const tokensCardRenderProps = {
+  card: true,
+  address: true,
+} as IsRenderingTokenGroupCardProps;
+
+export const isRenderingTokenCardProps = {
+  card: true,
+  isRenderingElementsProps: {
+    balance: true,
+    image: true,
+    name: true,
+    description: true,
+    address: true,
+  },
+} as IsRenderingTokenCardProps;
 
 export const tokensCardPrettifyLoadingProps = {
   card: true,
-} as TTokenGroupCardPrettifyLoadingProps;
+} as IsBeautifyingTokenGroupCardLoadingProps;
 
 export const tokenCardPrettifyLoadingProps = {
   card: false,
-  baseTokenCardPrettifyLoadingProps: {
+  isBeautifyLoadingElementsProps: {
     balance: false,
     image: false,
     name: false,
     description: false,
     address: false,
   },
-} as TTokenCardPrettifyLoadingProps;
+} as IsBeautifyingTokenCardLoadingProps;
diff --git a/packages/nextjs/components/rep-tokens-demo/MainTokensCardWithNumberOverlayConfig.tsx b/packages/nextjs/components/rep-tokens-demo/MainTokensCardWithNumberOverlayConfig.tsx
@@ -1,30 +1,22 @@
-import { BaseTokenCardPropertiesBooleanSet } from "../rep-tokens/cards/token-card/BaseTokenCard";
-import { TTokenCardPrettifyLoadingProps, TTokenCardPropertiesClasses } from "../rep-tokens/cards/token-card/TokenCard";
 import {
-  TTokenGroupCardPrettifyLoadingProps,
-  TTokensCardRenderProps,
-} from "../rep-tokens/cards/tokens-card/TokensCard";
-import { TTokenCardGroupPropertiesClasses } from "../rep-tokens/cards/tokens-card/TokensCard";
-
-export const tokensCardRenderProps = {
-  address: true,
-} as TTokensCardRenderProps;
-
-export const tokenCardRenderProps = {
-  balance: true,
-  image: true,
-  name: true,
-  description: true,
-} as BaseTokenCardPropertiesBooleanSet;
+  IsBeautifyingTokenCardLoadingProps,
+  IsRenderingTokenCardProps,
+  TokenCardElementsClasses,
+} from "../rep-tokens/cards/token-card/TokenCard";
+import {
+  IsBeautifyingTokenGroupCardLoadingProps,
+  IsRenderingTokenGroupCardProps,
+} from "../rep-tokens/cards/token-group-card/TokenGroupCard";
+import { TokenGroupCardElementsClasses } from "../rep-tokens/cards/token-group-card/TokenGroupCard";
 
 export const tokensCardPropertiesClasses = {
   card: "bg-base-300 flex flex-col items-center",
   container: "flex justify-center",
-} as TTokenCardGroupPropertiesClasses;
+} as TokenGroupCardElementsClasses;
 
 export const tokenCardPropertiesClasses = {
   card: "px-5 py-5 relative w-64",
-  baseTokenCardPropertyClasses: {
+  baseTokenCardElementsClasses: {
     balance: {
       container: "absolute top-1/4 left-1/2 transform -translate-x-1/2 -translate-y-1/3",
       value: "text-9xl mx-auto text-center",
@@ -39,18 +31,34 @@ export const tokenCardPropertiesClasses = {
       value: "rounded mx-auto",
     },
   },
-} as TTokenCardPropertiesClasses;
+} as TokenCardElementsClasses;
+
+export const tokensCardRenderProps = {
+  card: true,
+  address: true,
+} as IsRenderingTokenGroupCardProps;
+
+export const isRenderingTokenCardProps = {
+  card: true,
+  isRenderingElementsProps: {
+    balance: true,
+    image: true,
+    name: true,
+    description: true,
+    address: true,
+  },
+} as IsRenderingTokenCardProps;
 
 export const tokensCardPrettifyLoadingProps = {
   card: true,
-} as TTokenGroupCardPrettifyLoadingProps;
+} as IsBeautifyingTokenGroupCardLoadingProps;
 
 export const tokenCardPrettifyLoadingProps = {
   card: false,
-  baseTokenCardPrettifyLoadingProps: {
+  isBeautifyLoadingElementsProps: {
     balance: false,
     image: false,
     name: false,
     description: false,
   },
-} as TTokenCardPrettifyLoadingProps;
+} as IsBeautifyingTokenCardLoadingProps;