feat(faq): add product team

src/components/faq-card/index.tsx

@@ -3,15 +3,15 @@ import { Box, Text, Link } from '@vtex/brand-ui'
 import type { FaqCardDataElement } from 'utils/typings/types'
 
 import styles from './styles'
-import { useIntl } from 'react-intl'
-
-const FaqCard = ({ title, createdAt, slug }: FaqCardDataElement) => {
-  const intl = useIntl()
+import Tag from 'components/tag'
 
+const FaqCard = ({ title, productTeam, slug }: FaqCardDataElement) => {
   return (
     <Link href={`faq/${slug}`}>
       <Box sx={styles.container}>
-        <Text sx={styles.date}>{intl.formatDate(new Date(createdAt))}</Text>
+        <Tag color={'Gray'} sx={styles.tag}>
+          {productTeam}
+        </Tag>
         <Text sx={styles.title} className="title">
           {title}
         </Text>

src/components/faq-card/styles.ts

@@ -5,7 +5,7 @@ const container: SxStyleProp = {
   py: ['16px', '24px'],
   display: 'flex',
   flexDirection: 'column',
-  gap: '8px',
+  gap: '16px',
   borderRadius: '4px',
   border: '1px solid #E7E9EE',
   width: ['320px', '544px', '720px'],
@@ -31,14 +31,13 @@ const title: SxStyleProp = {
   color: 'muted.0',
 }
 
-const date: SxStyleProp = {
-  fontSize: ['12px', '14px'],
-  lineHeight: ['18px', '22px'],
-  color: 'muted.1',
+const tag: SxStyleProp = {
+  width: 'max-content',
+  px: '8px',
 }
 
 export default {
   container,
   title,
-  date,
+  tag,
 }

src/pages/faq/index.tsx

@@ -196,6 +196,7 @@ export const getStaticProps: GetStaticProps = async ({
               slug: data.slug,
               createdAt: String(frontmatter.createdAt),
               updatedAt: String(frontmatter.updatedAt),
+              productTeam: frontmatter.productTeam,
             })
         } catch (error) {
           logger.error(`${error}`)

src/utils/typings/types.ts

@@ -83,4 +83,5 @@ export type FaqCardDataElement = {
   slug: string
   createdAt: string
   updatedAt: string
+  productTeam: string
 }