Add learn more link

WRadoslaw · Aug 3, 2023 · d37c5a0 · d37c5a0
1 parent 0d356fa
commit d37c5a0
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 11 deletions.
diff --git a/packages/atlas/src/components/_crt/CreateTokenDrawer/steps/SetupTokenStep.tsx b/packages/atlas/src/components/_crt/CreateTokenDrawer/steps/SetupTokenStep.tsx
@@ -49,7 +49,7 @@ export const SetupTokenStep = ({ setPrimaryButtonProps, onSubmit, form }: SetupT
   })
 
   return (
-    <CrtFormWrapper title="Set up your token" subtitle="Enter basic token information and settings." titleLink="">
+    <CrtFormWrapper title="Set up your token" subtitle="Enter basic token information and settings." learnMoreLink="">
       <FormField
         label="Name"
         description="Choose 3 letter name for your token to be displayed on your token page, tokens marketplace and in your buyers’ portfolio."

diff --git a/...atlas/src/components/_crt/CreateTokenDrawer/steps/TokenIssuanceStep/TokenIssuanceStep.tsx b/...atlas/src/components/_crt/CreateTokenDrawer/steps/TokenIssuanceStep/TokenIssuanceStep.tsx
@@ -128,9 +128,11 @@ export const TokenIssuanceStep = ({ setPrimaryButtonProps, onSubmit, form }: Tok
                         </Text>
                       }
                       nodeEnd={
-                        <Text variant="t300" as="p" color="colorTextMuted">
-                          {formatNumber((creatorIssueAmount * Number(field.value || 0)) / 100)} ${form.name}
-                        </Text>
+                        creatorIssueAmount ? (
+                          <Text variant="t300" as="p" color="colorTextMuted">
+                            {formatNumber((creatorIssueAmount * Number(field.value || 0)) / 100)} ${form.name}
+                          </Text>
+                        ) : null
                       }
                     />
                   )}
@@ -149,7 +151,7 @@ export const TokenIssuanceStep = ({ setPrimaryButtonProps, onSubmit, form }: Tok
   return (
     <CrtFormWrapper
       title="Token issuance"
-      titleLink=""
+      learnMoreLink=""
       subtitle="At this stage you can issue as many tokens as you want. The more tokens you have in circulation, the less each individual token sold or purchased will impact the token's price if sold on public market."
     >
       <FormField

diff --git a/packages/atlas/src/components/_crt/CreateTokenDrawer/steps/TokenSummaryStep.tsx b/packages/atlas/src/components/_crt/CreateTokenDrawer/steps/TokenSummaryStep.tsx
@@ -35,7 +35,7 @@ export const TokenSummaryStep = ({ setPrimaryButtonProps, form }: CommonStepProp
   })
 
   return (
-    <CrtFormWrapper title="Set up your token" subtitle="" titleLink="">
+    <CrtFormWrapper title="Set up your token" subtitle="" learnMoreLink="">
       <Section>
         <Text variant="h400" as="h4">
           Token settings

diff --git a/packages/atlas/src/components/_crt/CrtFormWrapper/CrtFormWrapper.tsx b/packages/atlas/src/components/_crt/CrtFormWrapper/CrtFormWrapper.tsx
@@ -1,23 +1,29 @@
 import styled from '@emotion/styled'
+import { ReactNode } from 'react'
 
+import { SvgActionPlay } from '@/assets/icons'
 import { Text } from '@/components/Text'
+import { TextButton } from '@/components/_buttons/Button'
 import { sizes } from '@/styles'
 
 type CrtFormWrapperProps = {
   title: string
-  titleLink: string
+  learnMoreLink: string
   subtitle: string
-  children: React.ReactNode
+  children: ReactNode
 }
 
-export const CrtFormWrapper = ({ children, subtitle, titleLink, title }: CrtFormWrapperProps) => {
+export const CrtFormWrapper = ({ children, subtitle, title, learnMoreLink }: CrtFormWrapperProps) => {
   return (
     <Wrapper>
       <HeaderWrapper>
         <TitleWrapper>
           <Text variant="h500" as="h5">
             {title}
           </Text>
+          <TextButton to={learnMoreLink} icon={<SvgActionPlay />}>
+            Learn more
+          </TextButton>
         </TitleWrapper>
         <Text variant="t300" as="p" color="colorText">
           {subtitle}

diff --git a/packages/atlas/src/views/viewer/HomeView.tsx b/packages/atlas/src/views/viewer/HomeView.tsx
@@ -4,7 +4,6 @@ import { FC } from 'react'
 import { VideoOrderByInput } from '@/api/queries/__generated__/baseTypes.generated'
 import { GetBasicVideosConnectionDocument } from '@/api/queries/__generated__/videos.generated'
 import { Section } from '@/components/Section/Section'
-import { CreateTokenDrawer } from '@/components/_crt/CreateTokenDrawer/CreateTokenDrawer'
 import { VideoContentTemplate } from '@/components/_templates/VideoContentTemplate'
 import { VideoTileViewer } from '@/components/_video/VideoTileViewer'
 import { publicVideoFilter } from '@/config/contentFilter'
@@ -26,7 +25,6 @@ export const HomeView: FC = () => {
   return (
     <VideoContentTemplate>
       {headTags}
-      <CreateTokenDrawer />
       <StyledSection
         contentProps={{
           type: 'grid',