fix: HubHero prop

Author: nhsz

src/layouts/Roadmap.tsx

@@ -133,66 +133,66 @@ export const RoadmapLayout: React.FC<IProps> = ({
     <Box position="relative">
       {slug === "/roadmap/" ? (
         <HubHero
-          heroImgSrc={RoadmapHubHeroImage}
+          heroImg={RoadmapHubHeroImage}
           header={frontmatter.title}
           title={""}
           description={frontmatter.description}
         />
       ) : (
         <HeroContainer>
-        <Flex
-          w="full"
-          flexDirection={{ base: "column", lg: "row" }}
-          justify="space-between"
-        >
-          <TitleCard>
-            {/* TODO: Double check this slug works */}
-            <Breadcrumbs slug={slug} mb="8" />
-            <Title>{frontmatter.title}</Title>
-            <OldText>{frontmatter.description}</OldText>
-            {frontmatter?.buttons && (
-              // FIXME: remove the `ul` override once removed the corresponding
-              // global styles in `src/@chakra-ui/gatsby-plugin/styles.ts`
-              <Wrap spacing={2} marginBottom={4} sx={{ ul: { m: 0 } }}>
-                {frontmatter.buttons.map((button, idx) => {
-                  if (button?.to) {
+          <Flex
+            w="full"
+            flexDirection={{ base: "column", lg: "row" }}
+            justify="space-between"
+          >
+            <TitleCard>
+              {/* TODO: Double check this slug works */}
+              <Breadcrumbs slug={slug} mb="8" />
+              <Title>{frontmatter.title}</Title>
+              <OldText>{frontmatter.description}</OldText>
+              {frontmatter?.buttons && (
+                // FIXME: remove the `ul` override once removed the corresponding
+                // global styles in `src/@chakra-ui/gatsby-plugin/styles.ts`
+                <Wrap spacing={2} marginBottom={4} sx={{ ul: { m: 0 } }}>
+                  {frontmatter.buttons.map((button, idx) => {
+                    if (button?.to) {
+                      return (
+                        <WrapItem key={idx}>
+                          <ButtonLink variant={button?.variant} to={button?.to}>
+                            {button.label}
+                          </ButtonLink>
+                        </WrapItem>
+                      )
+                    }
                     return (
                       <WrapItem key={idx}>
-                        <ButtonLink variant={button?.variant} to={button?.to}>
-                          {button.label}
-                        </ButtonLink>
+                        <Button variant={button?.variant} toId={button?.toId}>
+                          {button?.label}
+                        </Button>
                       </WrapItem>
                     )
-                  }
-                  return (
-                    <WrapItem key={idx}>
-                      <Button variant={button?.variant} toId={button?.toId}>
-                        {button?.label}
-                      </Button>
-                    </WrapItem>
-                  )
-                })}
-              </Wrap>
-            )}
-            <TableOfContents
-              position="relative"
-              zIndex="2"
-              items={tocItems}
-              isMobile
-            />
-          </TitleCard>
-          <Center>
-            <Image
-              src={frontmatter.image}
-              alt={frontmatter.alt ?? ""}
-              style={{ objectFit: "contain" }}
-              width={700}
-              height={345}
-              priority
-            />
-          </Center>
-        </Flex>
-      </HeroContainer>
+                  })}
+                </Wrap>
+              )}
+              <TableOfContents
+                position="relative"
+                zIndex="2"
+                items={tocItems}
+                isMobile
+              />
+            </TitleCard>
+            <Center>
+              <Image
+                src={frontmatter.image}
+                alt={frontmatter.alt ?? ""}
+                style={{ objectFit: "contain" }}
+                width={700}
+                height={345}
+                priority
+              />
+            </Center>
+          </Flex>
+        </HeroContainer>
       )}
       <Page>
         {/* TODO: Switch to `above="lg"` after completion of Chakra Migration */}